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

feat: support custom elements in @excalidraw/excalidraw (#5164)

Browse source 
* feat: support custom elements in @excalidraw/excalidraw

* revert

* fix css

* fix offsets

* fix overflow of custom elements in example

* fix overflow in comments input

* make sure comment input never overflows the viewport

* remove offsetschange

* expose setActiveTool

* rename to onPointerDown

* update docs

* fix
This commit is contained in:
Aakansha Doshi 2022-05-11 13:30:15 +05:30 • committed by GitHub
parent a078508c05
commit 68f23d652f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 338 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

16
src/components/App.tsx
View file

@ -384,6 +384,7 @@ class App extends React.Component<AppProps, AppState> {
importLibrary: this.importLibraryFromUrl,
setToastMessage: this.setToastMessage,
id: this.id,
setActiveTool: this.setActiveTool,
} as const;
if (typeof excalidrawRef === "function") {
excalidrawRef(api);
@ -1058,6 +1059,13 @@ class App extends React.Component<AppProps, AppState> {
}
componentDidUpdate(prevProps: AppProps, prevState: AppState) {
if (
prevState.scrollX !== this.state.scrollX ||
prevState.scrollY !== this.state.scrollY
) {
this.props?.onScrollChange?.(this.state.scrollX, this.state.scrollY);
}
if (
Object.keys(this.state.selectedElementIds).length &&
isEraserActive(this.state)
@ -1966,11 +1974,11 @@ class App extends React.Component<AppProps, AppState> {
}
});
private setActiveTool(
private setActiveTool = (
tool:
| { type: typeof SHAPES[number]["value"] | "eraser" }
| { type: "custom"; customType: string },
) {
) => {
const nextActiveTool = updateActiveTool(this.state, tool);
if (!isHoldingSpace) {
setCursorForShape(this.canvas, this.state);
@ -1994,7 +2002,7 @@ class App extends React.Component<AppProps, AppState> {
} else {
this.setState({ activeTool: nextActiveTool });
}
}
};
private onGestureStart = withBatchedUpdates((event: GestureEvent) => {
event.preventDefault();
@ -3068,6 +3076,8 @@ class App extends React.Component<AppProps, AppState> {
);
}
this.props?.onPointerDown?.(this.state.activeTool, pointerDownState);
const onPointerMove =
this.onPointerMoveFromPointerDownHandler(pointerDownState);