@zsviczian/excalidraw 0.9.0-obsidian-9 → 0.9.0-obsidian-image-support-2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +3 -2
- package/dist/excalidraw-assets-dev/{image-cacb3d0c02eb2e346ecc.js → image-2767e46ad3f3f29617ea.js} +0 -10
- package/dist/excalidraw-assets-dev/vendor-b648d92c35e91de1648e.js +323 -0
- package/dist/excalidraw.development.js +327 -42
- package/dist/excalidraw.production.min.js +1 -1
- package/dist/excalidraw.production.min.js.LICENSE.txt +115 -0
- package/package.json +1 -1
- package/types/actions/actionCanvas.d.ts +3 -1
- package/types/actions/manager.d.ts +3 -11
- package/types/actions/types.d.ts +2 -8
- package/types/appState.d.ts +59 -4
- package/types/components/Actions.d.ts +5 -2
- package/types/components/App.d.ts +20 -5
- package/types/components/LayerUI.d.ts +4 -1
- package/types/components/LibraryUnit.d.ts +3 -2
- package/types/components/MobileMenu.d.ts +4 -1
- package/types/components/Spinner.d.ts +7 -0
- package/types/components/ToolButton.d.ts +5 -2
- package/types/constants.d.ts +1 -0
- package/types/createInverseContext.d.ts +1 -0
- package/types/data/blob.d.ts +3 -1
- package/types/data/encode.d.ts +2 -1
- package/types/data/json.d.ts +1 -1
- package/types/element/collision.d.ts +2 -2
- package/types/element/dragElements.d.ts +1 -1
- package/types/element/image.d.ts +13 -0
- package/types/element/index.d.ts +2 -1
- package/types/element/mutateElement.d.ts +1 -1
- package/types/element/newElement.d.ts +6 -2
- package/types/element/resizeElements.d.ts +3 -3
- package/types/element/typeChecks.d.ts +2 -1
- package/types/element/types.d.ts +14 -2
- package/types/errors.d.ts +3 -0
- package/types/excalidraw-app/app_constants.d.ts +19 -0
- package/types/excalidraw-app/collab/CollabWrapper.d.ts +92 -0
- package/types/excalidraw-app/collab/Portal.d.ts +28 -0
- package/types/excalidraw-app/collab/RoomDialog.d.ts +14 -0
- package/types/excalidraw-app/data/FileSync.d.ts +39 -0
- package/types/excalidraw-app/data/firebase.d.ts +22 -0
- package/types/excalidraw-app/data/index.d.ts +161 -0
- package/types/excalidraw-app/data/localStorage.d.ts +98 -0
- package/types/keys.d.ts +4 -3
- package/types/packages/excalidraw/dist/excalidraw-assets-dev/image-2767e46ad3f3f29617ea.d.ts +0 -0
- package/types/packages/excalidraw/dist/excalidraw-assets-dev/vendor-b648d92c35e91de1648e.d.ts +0 -0
- package/types/packages/utils.d.ts +1 -1
- package/types/renderer/renderElement.d.ts +3 -2
- package/types/renderer/renderScene.d.ts +3 -2
- package/types/scene/export.d.ts +2 -1
- package/types/scene/types.d.ts +4 -3
- package/types/shapes.d.ts +5 -1
- package/types/types.d.ts +23 -1
- package/types/zindex.d.ts +2 -2
- package/dist/excalidraw-assets-dev/vendor-7ad6c104c3421ae6511d.js +0 -356
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { ExcalidrawElement, ExcalidrawTextElement, ExcalidrawLinearElement, ExcalidrawBindableElement, ExcalidrawGenericElement, ExcalidrawFreeDrawElement } from "./types";
|
|
1
|
+
import { ExcalidrawElement, ExcalidrawTextElement, ExcalidrawLinearElement, ExcalidrawBindableElement, ExcalidrawGenericElement, ExcalidrawFreeDrawElement, InitializedExcalidrawImageElement } from "./types";
|
|
2
2
|
export declare const isGenericElement: (element: ExcalidrawElement | null) => element is ExcalidrawGenericElement;
|
|
3
|
+
export declare const isInitializedImageElement: (element: ExcalidrawElement | null) => element is InitializedExcalidrawImageElement;
|
|
3
4
|
export declare const isTextElement: (element: ExcalidrawElement | null) => element is ExcalidrawTextElement;
|
|
4
5
|
export declare const isFreeDrawElement: (element?: ExcalidrawElement | null | undefined) => element is ExcalidrawFreeDrawElement;
|
|
5
6
|
export declare const isFreeDrawElementType: (elementType: ExcalidrawElement["type"]) => boolean;
|
package/types/element/types.d.ts
CHANGED
|
@@ -57,6 +57,15 @@ export declare type ExcalidrawDiamondElement = _ExcalidrawElementBase & {
|
|
|
57
57
|
export declare type ExcalidrawEllipseElement = _ExcalidrawElementBase & {
|
|
58
58
|
type: "ellipse";
|
|
59
59
|
};
|
|
60
|
+
export declare type ExcalidrawImageElement = _ExcalidrawElementBase & Readonly<{
|
|
61
|
+
type: "image";
|
|
62
|
+
imageId: ImageId | null;
|
|
63
|
+
/** whether respective file is persisted */
|
|
64
|
+
status: "pending" | "saved";
|
|
65
|
+
/** X and Y scale factors <-1, 1>, used for image axis flipping */
|
|
66
|
+
scale: [number, number];
|
|
67
|
+
}>;
|
|
68
|
+
export declare type InitializedExcalidrawImageElement = MarkNonNullable<ExcalidrawImageElement, "imageId">;
|
|
60
69
|
/**
|
|
61
70
|
* These are elements that don't have any additional properties.
|
|
62
71
|
*/
|
|
@@ -66,7 +75,7 @@ export declare type ExcalidrawGenericElement = ExcalidrawSelectionElement | Exca
|
|
|
66
75
|
* no computed data. The list of all ExcalidrawElements should be shareable
|
|
67
76
|
* between peers and contain no state local to the peer.
|
|
68
77
|
*/
|
|
69
|
-
export declare type ExcalidrawElement = ExcalidrawGenericElement | ExcalidrawTextElement | ExcalidrawLinearElement | ExcalidrawFreeDrawElement;
|
|
78
|
+
export declare type ExcalidrawElement = ExcalidrawGenericElement | ExcalidrawTextElement | ExcalidrawLinearElement | ExcalidrawFreeDrawElement | ExcalidrawImageElement;
|
|
70
79
|
export declare type NonDeleted<TElement extends ExcalidrawElement> = TElement & {
|
|
71
80
|
isDeleted: false;
|
|
72
81
|
};
|
|
@@ -81,7 +90,7 @@ export declare type ExcalidrawTextElement = _ExcalidrawElementBase & Readonly<{
|
|
|
81
90
|
textAlign: TextAlign;
|
|
82
91
|
verticalAlign: VerticalAlign;
|
|
83
92
|
}>;
|
|
84
|
-
export declare type ExcalidrawBindableElement = ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement | ExcalidrawTextElement;
|
|
93
|
+
export declare type ExcalidrawBindableElement = ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement | ExcalidrawTextElement | ExcalidrawImageElement;
|
|
85
94
|
export declare type PointBinding = {
|
|
86
95
|
elementId: ExcalidrawBindableElement["id"];
|
|
87
96
|
focus: number;
|
|
@@ -104,4 +113,7 @@ export declare type ExcalidrawFreeDrawElement = _ExcalidrawElementBase & Readonl
|
|
|
104
113
|
simulatePressure: boolean;
|
|
105
114
|
lastCommittedPoint: Point | null;
|
|
106
115
|
}>;
|
|
116
|
+
export declare type ImageId = string & {
|
|
117
|
+
_brand: "ImageId";
|
|
118
|
+
};
|
|
107
119
|
export {};
|
package/types/errors.d.ts
CHANGED
|
@@ -2,4 +2,7 @@ declare type CANVAS_ERROR_NAMES = "CANVAS_ERROR" | "CANVAS_POSSIBLY_TOO_BIG";
|
|
|
2
2
|
export declare class CanvasError extends Error {
|
|
3
3
|
constructor(message?: string, name?: CANVAS_ERROR_NAMES);
|
|
4
4
|
}
|
|
5
|
+
export declare class AbortError extends DOMException {
|
|
6
|
+
constructor(message?: string);
|
|
7
|
+
}
|
|
5
8
|
export {};
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
export declare const SAVE_TO_LOCAL_STORAGE_TIMEOUT = 300;
|
|
2
|
+
export declare const INITIAL_SCENE_UPDATE_TIMEOUT = 5000;
|
|
3
|
+
export declare const FILE_UPLOAD_TIMEOUT = 300;
|
|
4
|
+
export declare const LOAD_IMAGES_TIMEOUT = 500;
|
|
5
|
+
export declare const SYNC_FULL_SCENE_INTERVAL_MS = 20000;
|
|
6
|
+
export declare const FILE_UPLOAD_MAX_BYTES: number;
|
|
7
|
+
export declare const FILE_CACHE_MAX_AGE_SEC = 2592000;
|
|
8
|
+
export declare const BROADCAST: {
|
|
9
|
+
SERVER_VOLATILE: string;
|
|
10
|
+
SERVER: string;
|
|
11
|
+
};
|
|
12
|
+
export declare enum SCENE {
|
|
13
|
+
INIT = "SCENE_INIT",
|
|
14
|
+
UPDATE = "SCENE_UPDATE"
|
|
15
|
+
}
|
|
16
|
+
export declare const FIREBASE_STORAGE_PREFIXES: {
|
|
17
|
+
shareLinkFiles: string;
|
|
18
|
+
collabFiles: string;
|
|
19
|
+
};
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
/// <reference types="lodash" />
|
|
2
|
+
import { PureComponent } from "react";
|
|
3
|
+
import { ExcalidrawImperativeAPI } from "../../types";
|
|
4
|
+
import { ImportedDataState } from "../../data/types";
|
|
5
|
+
import { ExcalidrawElement } from "../../element/types";
|
|
6
|
+
import { Gesture } from "../../types";
|
|
7
|
+
import { SocketUpdateDataSource } from "../data";
|
|
8
|
+
import Portal from "./Portal";
|
|
9
|
+
import { UserIdleState } from "../../types";
|
|
10
|
+
import { FileSync } from "../data/FileSync";
|
|
11
|
+
interface CollabState {
|
|
12
|
+
modalIsShown: boolean;
|
|
13
|
+
errorMessage: string;
|
|
14
|
+
username: string;
|
|
15
|
+
userState: UserIdleState;
|
|
16
|
+
activeRoomLink: string;
|
|
17
|
+
}
|
|
18
|
+
declare type CollabInstance = InstanceType<typeof CollabWrapper>;
|
|
19
|
+
export interface CollabAPI {
|
|
20
|
+
/** function so that we can access the latest value from stale callbacks */
|
|
21
|
+
isCollaborating: () => boolean;
|
|
22
|
+
username: CollabState["username"];
|
|
23
|
+
userState: CollabState["userState"];
|
|
24
|
+
onPointerUpdate: CollabInstance["onPointerUpdate"];
|
|
25
|
+
initializeSocketClient: CollabInstance["initializeSocketClient"];
|
|
26
|
+
onCollabButtonClick: CollabInstance["onCollabButtonClick"];
|
|
27
|
+
broadcastElements: CollabInstance["broadcastElements"];
|
|
28
|
+
fetchImageFilesFromFirebase: CollabInstance["fetchImageFilesFromFirebase"];
|
|
29
|
+
}
|
|
30
|
+
interface Props {
|
|
31
|
+
excalidrawAPI: ExcalidrawImperativeAPI;
|
|
32
|
+
}
|
|
33
|
+
declare const CollabContext: any, CollabContextConsumer: any;
|
|
34
|
+
export { CollabContext, CollabContextConsumer };
|
|
35
|
+
declare class CollabWrapper extends PureComponent<Props, CollabState> {
|
|
36
|
+
portal: Portal;
|
|
37
|
+
fileSync: FileSync;
|
|
38
|
+
excalidrawAPI: Props["excalidrawAPI"];
|
|
39
|
+
isCollaborating: boolean;
|
|
40
|
+
activeIntervalId: number | null;
|
|
41
|
+
idleTimeoutId: number | null;
|
|
42
|
+
private socketInitializationTimer?;
|
|
43
|
+
private lastBroadcastedOrReceivedSceneVersion;
|
|
44
|
+
private collaborators;
|
|
45
|
+
constructor(props: Props);
|
|
46
|
+
componentDidMount(): void;
|
|
47
|
+
componentWillUnmount(): void;
|
|
48
|
+
private onUnload;
|
|
49
|
+
private beforeUnload;
|
|
50
|
+
saveCollabRoomToFirebase: (syncableElements?: ExcalidrawElement[]) => Promise<void>;
|
|
51
|
+
openPortal: () => Promise<ImportedDataState | null>;
|
|
52
|
+
closePortal: () => void;
|
|
53
|
+
private destroySocketClient;
|
|
54
|
+
private fetchImageFilesFromFirebase;
|
|
55
|
+
private initializeSocketClient;
|
|
56
|
+
private initializeSocket;
|
|
57
|
+
private reconcileElements;
|
|
58
|
+
private loadImageFiles;
|
|
59
|
+
private handleRemoteSceneUpdate;
|
|
60
|
+
private onPointerMove;
|
|
61
|
+
private onVisibilityChange;
|
|
62
|
+
private reportIdle;
|
|
63
|
+
private reportActive;
|
|
64
|
+
private initializeIdleDetector;
|
|
65
|
+
setCollaborators(sockets: string[]): void;
|
|
66
|
+
setLastBroadcastedOrReceivedSceneVersion: (version: number) => void;
|
|
67
|
+
getLastBroadcastedOrReceivedSceneVersion: () => number;
|
|
68
|
+
getSceneElementsIncludingDeleted: () => readonly ExcalidrawElement[];
|
|
69
|
+
onPointerUpdate: (payload: {
|
|
70
|
+
pointer: SocketUpdateDataSource["MOUSE_LOCATION"]["payload"]["pointer"];
|
|
71
|
+
button: SocketUpdateDataSource["MOUSE_LOCATION"]["payload"]["button"];
|
|
72
|
+
pointersMap: Gesture["pointers"];
|
|
73
|
+
}) => void;
|
|
74
|
+
onIdleStateChange: (userState: UserIdleState) => void;
|
|
75
|
+
broadcastElements: (elements: readonly ExcalidrawElement[]) => void;
|
|
76
|
+
queueBroadcastAllElements: import("lodash").DebouncedFunc<() => void>;
|
|
77
|
+
handleClose: () => void;
|
|
78
|
+
onUsernameChange: (username: string) => void;
|
|
79
|
+
onCollabButtonClick: () => void;
|
|
80
|
+
getSyncableElements: (elements: readonly ExcalidrawElement[]) => ExcalidrawElement[];
|
|
81
|
+
/** PRIVATE. Use `this.getContextValue()` instead. */
|
|
82
|
+
private contextValue;
|
|
83
|
+
/** Getter of context value. Returned object is stable. */
|
|
84
|
+
getContextValue: () => CollabAPI;
|
|
85
|
+
render(): JSX.Element;
|
|
86
|
+
}
|
|
87
|
+
declare global {
|
|
88
|
+
interface Window {
|
|
89
|
+
collab: InstanceType<typeof CollabWrapper>;
|
|
90
|
+
}
|
|
91
|
+
}
|
|
92
|
+
export default CollabWrapper;
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
/// <reference types="socket.io-client" />
|
|
2
|
+
/// <reference types="lodash" />
|
|
3
|
+
import { SocketUpdateData, SocketUpdateDataSource } from "../data";
|
|
4
|
+
import CollabWrapper from "./CollabWrapper";
|
|
5
|
+
import { ExcalidrawElement } from "../../element/types";
|
|
6
|
+
import { SCENE } from "../app_constants";
|
|
7
|
+
import { UserIdleState } from "../../types";
|
|
8
|
+
declare class Portal {
|
|
9
|
+
collab: CollabWrapper;
|
|
10
|
+
socket: SocketIOClient.Socket | null;
|
|
11
|
+
socketInitialized: boolean;
|
|
12
|
+
roomId: string | null;
|
|
13
|
+
roomKey: string | null;
|
|
14
|
+
broadcastedElementVersions: Map<string, number>;
|
|
15
|
+
constructor(collab: CollabWrapper);
|
|
16
|
+
open(socket: SocketIOClient.Socket, id: string, key: string): void;
|
|
17
|
+
close(): void;
|
|
18
|
+
isOpen(): boolean;
|
|
19
|
+
_broadcastSocketData(data: SocketUpdateData, volatile?: boolean): Promise<void>;
|
|
20
|
+
queueFileUpload: import("lodash").DebouncedFunc<() => Promise<void>>;
|
|
21
|
+
broadcastScene: (sceneType: SCENE.INIT | SCENE.UPDATE, syncableElements: ExcalidrawElement[], syncAll: boolean) => Promise<void>;
|
|
22
|
+
broadcastIdleChange: (userState: UserIdleState) => Promise<void> | undefined;
|
|
23
|
+
broadcastMouseLocation: (payload: {
|
|
24
|
+
pointer: SocketUpdateDataSource["MOUSE_LOCATION"]["payload"]["pointer"];
|
|
25
|
+
button: SocketUpdateDataSource["MOUSE_LOCATION"]["payload"]["button"];
|
|
26
|
+
}) => Promise<void> | undefined;
|
|
27
|
+
}
|
|
28
|
+
export default Portal;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import "./RoomDialog.scss";
|
|
3
|
+
import { AppState } from "../../types";
|
|
4
|
+
declare const RoomDialog: ({ handleClose, activeRoomLink, username, onUsernameChange, onRoomCreate, onRoomDestroy, setErrorMessage, theme, }: {
|
|
5
|
+
handleClose: () => void;
|
|
6
|
+
activeRoomLink: string;
|
|
7
|
+
username: string;
|
|
8
|
+
onUsernameChange: (username: string) => void;
|
|
9
|
+
onRoomCreate: () => void;
|
|
10
|
+
onRoomDestroy: () => void;
|
|
11
|
+
setErrorMessage: (message: string) => void;
|
|
12
|
+
theme: AppState["theme"];
|
|
13
|
+
}) => JSX.Element;
|
|
14
|
+
export default RoomDialog;
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { ExcalidrawElement, ImageId } from "../../element/types";
|
|
2
|
+
import { AppState, BinaryFileData, DataURL } from "../../types";
|
|
3
|
+
export declare class FileSync {
|
|
4
|
+
/** files marked for uploading or fetching, and thus neither operation should
|
|
5
|
+
* be performed on them until finished */
|
|
6
|
+
pendingFiles: Map<ImageId | null, true>;
|
|
7
|
+
savedFiles: Map<ImageId | null, true>;
|
|
8
|
+
private _getFiles;
|
|
9
|
+
private _saveFiles;
|
|
10
|
+
constructor({ getFiles, saveFiles, }: {
|
|
11
|
+
getFiles: (imageIds: ImageId[]) => Promise<{
|
|
12
|
+
loadedFiles: BinaryFileData[];
|
|
13
|
+
erroredFiles: ImageId[];
|
|
14
|
+
}>;
|
|
15
|
+
saveFiles: (data: {
|
|
16
|
+
addedFiles: Map<ImageId, DataURL>;
|
|
17
|
+
removedFiles: Map<ImageId, true>;
|
|
18
|
+
}) => Promise<{
|
|
19
|
+
savedFiles: Map<ImageId, true>;
|
|
20
|
+
erroredFiles: Map<ImageId, true>;
|
|
21
|
+
}>;
|
|
22
|
+
});
|
|
23
|
+
saveFiles: ({ elements, appState, }: {
|
|
24
|
+
elements: readonly ExcalidrawElement[];
|
|
25
|
+
appState: Pick<AppState, "files">;
|
|
26
|
+
}) => Promise<{
|
|
27
|
+
savedFiles: Map<ImageId, true>;
|
|
28
|
+
erroredFiles: Map<ImageId, true>;
|
|
29
|
+
}>;
|
|
30
|
+
/**
|
|
31
|
+
* returns whether file is already saved or being processed
|
|
32
|
+
*/
|
|
33
|
+
isFileHandled: (id: ImageId) => boolean;
|
|
34
|
+
getFiles: (ids: ImageId[]) => Promise<{
|
|
35
|
+
loadedFiles: BinaryFileData[];
|
|
36
|
+
erroredFiles: ImageId[];
|
|
37
|
+
}>;
|
|
38
|
+
destroy(): void;
|
|
39
|
+
}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
/// <reference types="socket.io-client" />
|
|
2
|
+
import { ExcalidrawElement, ImageId } from "../../element/types";
|
|
3
|
+
import Portal from "../collab/Portal";
|
|
4
|
+
import { BinaryFileData, DataURL } from "../../types";
|
|
5
|
+
export declare const loadFirebaseStorage: () => Promise<typeof import("firebase/app").default>;
|
|
6
|
+
export declare const isSavedToFirebase: (portal: Portal, elements: readonly ExcalidrawElement[]) => boolean;
|
|
7
|
+
export declare const saveFilesToFirebase: ({ prefix, decryptionKey, files, allowedTypes, maxBytes, }: {
|
|
8
|
+
prefix: string;
|
|
9
|
+
decryptionKey: string;
|
|
10
|
+
files: Map<ImageId, DataURL>;
|
|
11
|
+
allowedTypes: string[];
|
|
12
|
+
maxBytes: number;
|
|
13
|
+
}) => Promise<{
|
|
14
|
+
savedFiles: Map<ImageId, true>;
|
|
15
|
+
erroredFiles: Map<ImageId, true>;
|
|
16
|
+
}>;
|
|
17
|
+
export declare const saveToFirebase: (portal: Portal, elements: readonly ExcalidrawElement[]) => Promise<boolean>;
|
|
18
|
+
export declare const loadFromFirebase: (roomId: string, roomKey: string, socket: SocketIOClient.Socket | null) => Promise<readonly ExcalidrawElement[] | null>;
|
|
19
|
+
export declare const loadFilesFromFirebase: (prefix: string, decryptionKey: string, filesIds: readonly ImageId[]) => Promise<{
|
|
20
|
+
loadedFiles: BinaryFileData[];
|
|
21
|
+
erroredFiles: ImageId[];
|
|
22
|
+
}>;
|
|
@@ -0,0 +1,161 @@
|
|
|
1
|
+
import { ImportedDataState } from "../../data/types";
|
|
2
|
+
import { ExcalidrawElement } from "../../element/types";
|
|
3
|
+
import { AppState, DataURL, UserIdleState } from "../../types";
|
|
4
|
+
export declare const generateEncryptionKey: () => Promise<string | undefined>;
|
|
5
|
+
export declare const SOCKET_SERVER: string;
|
|
6
|
+
export declare type EncryptedData = {
|
|
7
|
+
data: ArrayBuffer;
|
|
8
|
+
iv: Uint8Array;
|
|
9
|
+
};
|
|
10
|
+
export declare type SocketUpdateDataSource = {
|
|
11
|
+
SCENE_INIT: {
|
|
12
|
+
type: "SCENE_INIT";
|
|
13
|
+
payload: {
|
|
14
|
+
elements: readonly ExcalidrawElement[];
|
|
15
|
+
};
|
|
16
|
+
};
|
|
17
|
+
SCENE_UPDATE: {
|
|
18
|
+
type: "SCENE_UPDATE";
|
|
19
|
+
payload: {
|
|
20
|
+
elements: readonly ExcalidrawElement[];
|
|
21
|
+
};
|
|
22
|
+
};
|
|
23
|
+
MOUSE_LOCATION: {
|
|
24
|
+
type: "MOUSE_LOCATION";
|
|
25
|
+
payload: {
|
|
26
|
+
socketId: string;
|
|
27
|
+
pointer: {
|
|
28
|
+
x: number;
|
|
29
|
+
y: number;
|
|
30
|
+
};
|
|
31
|
+
button: "down" | "up";
|
|
32
|
+
selectedElementIds: AppState["selectedElementIds"];
|
|
33
|
+
username: string;
|
|
34
|
+
};
|
|
35
|
+
};
|
|
36
|
+
IDLE_STATUS: {
|
|
37
|
+
type: "IDLE_STATUS";
|
|
38
|
+
payload: {
|
|
39
|
+
socketId: string;
|
|
40
|
+
userState: UserIdleState;
|
|
41
|
+
username: string;
|
|
42
|
+
};
|
|
43
|
+
};
|
|
44
|
+
};
|
|
45
|
+
export declare type SocketUpdateDataIncoming = SocketUpdateDataSource[keyof SocketUpdateDataSource] | {
|
|
46
|
+
type: "INVALID_RESPONSE";
|
|
47
|
+
};
|
|
48
|
+
export declare type SocketUpdateData = SocketUpdateDataSource[keyof SocketUpdateDataSource] & {
|
|
49
|
+
_brand: "socketUpdateData";
|
|
50
|
+
};
|
|
51
|
+
export declare const createIV: () => Uint8Array;
|
|
52
|
+
export declare const encryptAESGEM: (data: Uint8Array, key: string) => Promise<EncryptedData>;
|
|
53
|
+
export declare const decryptAESGEM: (data: ArrayBuffer, key: string, iv: Uint8Array) => Promise<SocketUpdateDataIncoming>;
|
|
54
|
+
export declare const getCollaborationLinkData: (link: string) => {
|
|
55
|
+
roomId: string;
|
|
56
|
+
roomKey: string;
|
|
57
|
+
} | null;
|
|
58
|
+
export declare const generateCollaborationLinkData: () => Promise<{
|
|
59
|
+
roomId: string;
|
|
60
|
+
roomKey: string;
|
|
61
|
+
}>;
|
|
62
|
+
export declare const getCollaborationLink: (data: {
|
|
63
|
+
roomId: string;
|
|
64
|
+
roomKey: string;
|
|
65
|
+
}) => string;
|
|
66
|
+
export declare const getImportedKey: (key: string, usage: KeyUsage) => Promise<CryptoKey>;
|
|
67
|
+
export declare const decryptImported: (iv: ArrayBuffer, encrypted: ArrayBuffer, privateKey: string) => Promise<ArrayBuffer>;
|
|
68
|
+
export declare const loadScene: (id: string | null, privateKey: string | null, localDataState: ImportedDataState | undefined | null) => Promise<{
|
|
69
|
+
elements: ExcalidrawElement[];
|
|
70
|
+
appState: {
|
|
71
|
+
theme: "light" | "dark";
|
|
72
|
+
zoom: Readonly<{
|
|
73
|
+
value: import("../../types").NormalizedZoomValue;
|
|
74
|
+
translation: Readonly<{
|
|
75
|
+
x: number;
|
|
76
|
+
y: number;
|
|
77
|
+
}>;
|
|
78
|
+
}>;
|
|
79
|
+
scrollX: number;
|
|
80
|
+
scrollY: number;
|
|
81
|
+
files: Record<string, import("../../types").BinaryFileData>;
|
|
82
|
+
isLoading: boolean;
|
|
83
|
+
errorMessage: string | null;
|
|
84
|
+
draggingElement: import("../../element/types").NonDeletedExcalidrawElement | null;
|
|
85
|
+
resizingElement: import("../../element/types").NonDeletedExcalidrawElement | null;
|
|
86
|
+
multiElement: import("../../element/types").NonDeleted<import("../../element/types").ExcalidrawLinearElement> | null;
|
|
87
|
+
selectionElement: import("../../element/types").NonDeletedExcalidrawElement | null;
|
|
88
|
+
isBindingEnabled: boolean;
|
|
89
|
+
startBoundElement: import("../../element/types").NonDeleted<import("../../element/types").ExcalidrawBindableElement> | null;
|
|
90
|
+
suggestedBindings: import("../../element/binding").SuggestedBinding[];
|
|
91
|
+
editingElement: import("../../element/types").NonDeletedExcalidrawElement | null;
|
|
92
|
+
editingLinearElement: import("../../element/linearElementEditor").LinearElementEditor | null;
|
|
93
|
+
elementType: "line" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "text" | "arrow" | "freedraw";
|
|
94
|
+
elementLocked: boolean;
|
|
95
|
+
exportBackground: boolean;
|
|
96
|
+
exportEmbedScene: boolean;
|
|
97
|
+
exportWithDarkMode: boolean;
|
|
98
|
+
exportScale: number;
|
|
99
|
+
currentItemStrokeColor: string;
|
|
100
|
+
currentItemBackgroundColor: string;
|
|
101
|
+
currentItemFillStyle: import("../../element/types").FillStyle;
|
|
102
|
+
currentItemStrokeWidth: number;
|
|
103
|
+
currentItemStrokeStyle: import("../../element/types").StrokeStyle;
|
|
104
|
+
currentItemRoughness: number;
|
|
105
|
+
currentItemOpacity: number;
|
|
106
|
+
currentItemFontFamily: number;
|
|
107
|
+
currentItemFontSize: number;
|
|
108
|
+
currentItemTextAlign: import("../../element/types").TextAlign;
|
|
109
|
+
currentItemStrokeSharpness: import("../../element/types").StrokeSharpness;
|
|
110
|
+
currentItemStartArrowhead: import("../../element/types").Arrowhead | null;
|
|
111
|
+
currentItemEndArrowhead: import("../../element/types").Arrowhead | null;
|
|
112
|
+
currentItemLinearStrokeSharpness: import("../../element/types").StrokeSharpness;
|
|
113
|
+
viewBackgroundColor: string;
|
|
114
|
+
cursorButton: "up" | "down";
|
|
115
|
+
scrolledOutside: boolean;
|
|
116
|
+
name: string;
|
|
117
|
+
isResizing: boolean;
|
|
118
|
+
isRotating: boolean;
|
|
119
|
+
openMenu: "canvas" | "shape" | null;
|
|
120
|
+
openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
|
|
121
|
+
lastPointerDownWith: import("../../element/types").PointerType;
|
|
122
|
+
selectedElementIds: {
|
|
123
|
+
[id: string]: boolean;
|
|
124
|
+
};
|
|
125
|
+
previousSelectedElementIds: {
|
|
126
|
+
[id: string]: boolean;
|
|
127
|
+
};
|
|
128
|
+
shouldCacheIgnoreZoom: boolean;
|
|
129
|
+
showHelpDialog: boolean;
|
|
130
|
+
toastMessage: string | null;
|
|
131
|
+
zenModeEnabled: boolean;
|
|
132
|
+
gridSize: number | null;
|
|
133
|
+
viewModeEnabled: boolean;
|
|
134
|
+
selectedGroupIds: {
|
|
135
|
+
[groupId: string]: boolean;
|
|
136
|
+
};
|
|
137
|
+
editingGroupId: string | null;
|
|
138
|
+
isLibraryOpen: boolean;
|
|
139
|
+
fileHandle: import("browser-fs-access").FileSystemHandle | null;
|
|
140
|
+
collaborators: Map<string, import("../../types").Collaborator>;
|
|
141
|
+
showStats: boolean;
|
|
142
|
+
currentChartType: import("../../element/types").ChartType;
|
|
143
|
+
pasteDialog: {
|
|
144
|
+
shown: false;
|
|
145
|
+
data: null;
|
|
146
|
+
} | {
|
|
147
|
+
shown: true;
|
|
148
|
+
data: import("../../charts").Spreadsheet;
|
|
149
|
+
};
|
|
150
|
+
pendingImageElement: import("../../element/types").NonDeleted<import("../../element/types").ExcalidrawImageElement> | null;
|
|
151
|
+
};
|
|
152
|
+
commitToHistory: boolean;
|
|
153
|
+
}>;
|
|
154
|
+
export declare const exportToBackend: (elements: readonly ExcalidrawElement[], appState: AppState) => Promise<void>;
|
|
155
|
+
export declare const dataURLToBlob: (dataURL: DataURL) => Blob;
|
|
156
|
+
export declare const arrayBufferToDataURL: (buffer: ArrayBuffer, mimeType: string) => Promise<DataURL>;
|
|
157
|
+
export declare const encryptData: (key: string, data: Blob | string) => Promise<{
|
|
158
|
+
blob: Blob;
|
|
159
|
+
iv: Uint8Array;
|
|
160
|
+
}>;
|
|
161
|
+
export declare const getDataURL: (file: File) => Promise<DataURL>;
|
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
import { ExcalidrawElement } from "../../element/types";
|
|
2
|
+
import { AppState } from "../../types";
|
|
3
|
+
export declare const STORAGE_KEYS: {
|
|
4
|
+
LOCAL_STORAGE_ELEMENTS: string;
|
|
5
|
+
LOCAL_STORAGE_APP_STATE: string;
|
|
6
|
+
LOCAL_STORAGE_COLLAB: string;
|
|
7
|
+
LOCAL_STORAGE_KEY_COLLAB_FORCE_FLAG: string;
|
|
8
|
+
};
|
|
9
|
+
export declare const saveUsernameToLocalStorage: (username: string) => void;
|
|
10
|
+
export declare const importUsernameFromLocalStorage: () => string | null;
|
|
11
|
+
export declare const saveToLocalStorage: (elements: readonly ExcalidrawElement[], appState: AppState) => void;
|
|
12
|
+
export declare const importFromLocalStorage: () => {
|
|
13
|
+
elements: ExcalidrawElement[];
|
|
14
|
+
appState: {
|
|
15
|
+
theme: "light" | "dark";
|
|
16
|
+
zoom: Readonly<{
|
|
17
|
+
value: import("../../types").NormalizedZoomValue;
|
|
18
|
+
translation: Readonly<{
|
|
19
|
+
x: number;
|
|
20
|
+
y: number;
|
|
21
|
+
}>;
|
|
22
|
+
}>;
|
|
23
|
+
scrollX: number;
|
|
24
|
+
scrollY: number;
|
|
25
|
+
elementType: "line" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "text" | "arrow" | "freedraw";
|
|
26
|
+
elementLocked: boolean;
|
|
27
|
+
exportBackground: boolean;
|
|
28
|
+
exportEmbedScene: boolean;
|
|
29
|
+
exportWithDarkMode: boolean;
|
|
30
|
+
exportScale: number;
|
|
31
|
+
currentItemStrokeColor: string;
|
|
32
|
+
currentItemBackgroundColor: string;
|
|
33
|
+
currentItemFillStyle: import("../../element/types").FillStyle;
|
|
34
|
+
currentItemStrokeWidth: number;
|
|
35
|
+
currentItemStrokeStyle: import("../../element/types").StrokeStyle;
|
|
36
|
+
currentItemRoughness: number;
|
|
37
|
+
currentItemOpacity: number;
|
|
38
|
+
currentItemFontFamily: number;
|
|
39
|
+
currentItemFontSize: number;
|
|
40
|
+
currentItemTextAlign: import("../../element/types").TextAlign;
|
|
41
|
+
currentItemStrokeSharpness: import("../../element/types").StrokeSharpness;
|
|
42
|
+
currentItemStartArrowhead: import("../../element/types").Arrowhead | null;
|
|
43
|
+
currentItemEndArrowhead: import("../../element/types").Arrowhead | null;
|
|
44
|
+
currentItemLinearStrokeSharpness: import("../../element/types").StrokeSharpness;
|
|
45
|
+
viewBackgroundColor: string;
|
|
46
|
+
cursorButton: "up" | "down";
|
|
47
|
+
scrolledOutside: boolean;
|
|
48
|
+
name: string;
|
|
49
|
+
openMenu: "canvas" | "shape" | null;
|
|
50
|
+
lastPointerDownWith: import("../../element/types").PointerType;
|
|
51
|
+
selectedElementIds: {
|
|
52
|
+
[id: string]: boolean;
|
|
53
|
+
};
|
|
54
|
+
previousSelectedElementIds: {
|
|
55
|
+
[id: string]: boolean;
|
|
56
|
+
};
|
|
57
|
+
shouldCacheIgnoreZoom: boolean;
|
|
58
|
+
zenModeEnabled: boolean;
|
|
59
|
+
gridSize: number | null;
|
|
60
|
+
selectedGroupIds: {
|
|
61
|
+
[groupId: string]: boolean;
|
|
62
|
+
};
|
|
63
|
+
editingGroupId: string | null;
|
|
64
|
+
showStats: boolean;
|
|
65
|
+
currentChartType: import("../../element/types").ChartType;
|
|
66
|
+
files: Record<string, import("../../types").BinaryFileData>;
|
|
67
|
+
isLoading: boolean;
|
|
68
|
+
errorMessage: string | null;
|
|
69
|
+
draggingElement: import("../../element/types").NonDeletedExcalidrawElement | null;
|
|
70
|
+
resizingElement: import("../../element/types").NonDeletedExcalidrawElement | null;
|
|
71
|
+
multiElement: import("../../element/types").NonDeleted<import("../../element/types").ExcalidrawLinearElement> | null;
|
|
72
|
+
selectionElement: import("../../element/types").NonDeletedExcalidrawElement | null;
|
|
73
|
+
isBindingEnabled: boolean;
|
|
74
|
+
startBoundElement: import("../../element/types").NonDeleted<import("../../element/types").ExcalidrawBindableElement> | null;
|
|
75
|
+
suggestedBindings: import("../../element/binding").SuggestedBinding[];
|
|
76
|
+
editingElement: import("../../element/types").NonDeletedExcalidrawElement | null;
|
|
77
|
+
editingLinearElement: import("../../element/linearElementEditor").LinearElementEditor | null;
|
|
78
|
+
isResizing: boolean;
|
|
79
|
+
isRotating: boolean;
|
|
80
|
+
openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
|
|
81
|
+
showHelpDialog: boolean;
|
|
82
|
+
toastMessage: string | null;
|
|
83
|
+
viewModeEnabled: boolean;
|
|
84
|
+
isLibraryOpen: boolean;
|
|
85
|
+
fileHandle: import("browser-fs-access").FileSystemHandle | null;
|
|
86
|
+
collaborators: Map<string, import("../../types").Collaborator>;
|
|
87
|
+
pasteDialog: {
|
|
88
|
+
shown: false;
|
|
89
|
+
data: null;
|
|
90
|
+
} | {
|
|
91
|
+
shown: true;
|
|
92
|
+
data: import("../../charts").Spreadsheet;
|
|
93
|
+
};
|
|
94
|
+
pendingImageElement: import("../../element/types").NonDeleted<import("../../element/types").ExcalidrawImageElement> | null;
|
|
95
|
+
} | null;
|
|
96
|
+
};
|
|
97
|
+
export declare const getElementsStorageSize: () => number;
|
|
98
|
+
export declare const getTotalStorageSize: () => number;
|
package/types/keys.d.ts
CHANGED
|
@@ -42,6 +42,7 @@ export declare const KEYS: {
|
|
|
42
42
|
readonly D: "d";
|
|
43
43
|
readonly E: "e";
|
|
44
44
|
readonly G: "g";
|
|
45
|
+
readonly I: "i";
|
|
45
46
|
readonly L: "l";
|
|
46
47
|
readonly O: "o";
|
|
47
48
|
readonly P: "p";
|
|
@@ -56,6 +57,6 @@ export declare const KEYS: {
|
|
|
56
57
|
};
|
|
57
58
|
export declare type Key = keyof typeof KEYS;
|
|
58
59
|
export declare const isArrowKey: (key: string) => boolean;
|
|
59
|
-
export declare const
|
|
60
|
-
export declare const
|
|
61
|
-
export declare const
|
|
60
|
+
export declare const shouldResizeFromCenter: (event: MouseEvent | KeyboardEvent) => boolean;
|
|
61
|
+
export declare const shouldMaintainAspectRatio: (event: MouseEvent | KeyboardEvent) => boolean;
|
|
62
|
+
export declare const shouldRotateWithDiscreteAngle: (event: MouseEvent | KeyboardEvent) => boolean;
|
|
File without changes
|
|
File without changes
|
|
@@ -9,7 +9,7 @@ declare type ExportOpts = {
|
|
|
9
9
|
scale: number;
|
|
10
10
|
};
|
|
11
11
|
};
|
|
12
|
-
export declare const exportToCanvas: ({ elements, appState, getDimensions, }: ExportOpts) => HTMLCanvasElement
|
|
12
|
+
export declare const exportToCanvas: ({ elements, appState, getDimensions, }: ExportOpts) => Promise<HTMLCanvasElement>;
|
|
13
13
|
export declare const exportToBlob: (opts: ExportOpts & {
|
|
14
14
|
mimeType?: string;
|
|
15
15
|
quality?: number;
|
|
@@ -3,10 +3,11 @@ import { RoughCanvas } from "roughjs/bin/canvas";
|
|
|
3
3
|
import { Drawable, Options } from "roughjs/bin/core";
|
|
4
4
|
import { RoughSVG } from "roughjs/bin/svg";
|
|
5
5
|
import { SceneState } from "../scene/types";
|
|
6
|
-
import { Zoom } from "../types";
|
|
6
|
+
import { AppState, Zoom } from "../types";
|
|
7
7
|
export interface ExcalidrawElementWithCanvas {
|
|
8
8
|
element: ExcalidrawElement | ExcalidrawTextElement;
|
|
9
9
|
canvas: HTMLCanvasElement;
|
|
10
|
+
theme: SceneState["theme"];
|
|
10
11
|
canvasZoom: Zoom["value"];
|
|
11
12
|
canvasOffsetX: number;
|
|
12
13
|
canvasOffsetY: number;
|
|
@@ -15,7 +16,7 @@ export declare const getShapeForElement: (element: ExcalidrawElement) => Drawabl
|
|
|
15
16
|
export declare const invalidateShapeForElement: (element: ExcalidrawElement) => boolean;
|
|
16
17
|
export declare const generateRoughOptions: (element: ExcalidrawElement, continuousPath?: boolean) => Options;
|
|
17
18
|
export declare const renderElement: (element: NonDeletedExcalidrawElement, rc: RoughCanvas, context: CanvasRenderingContext2D, renderOptimizations: boolean, sceneState: SceneState) => void;
|
|
18
|
-
export declare const renderElementToSvg: (element: NonDeletedExcalidrawElement, rsvg: RoughSVG, svgRoot: SVGElement, offsetX?: number | undefined, offsetY?: number | undefined) => void;
|
|
19
|
+
export declare const renderElementToSvg: (element: NonDeletedExcalidrawElement, rsvg: RoughSVG, svgRoot: SVGElement, files: AppState["files"], offsetX?: number | undefined, offsetY?: number | undefined) => void;
|
|
19
20
|
export declare const pathsCache: WeakMap<ExcalidrawFreeDrawElement, Path2D>;
|
|
20
21
|
export declare function generateFreeDrawShape(element: ExcalidrawFreeDrawElement): Path2D;
|
|
21
22
|
export declare function getFreeDrawPath2D(element: ExcalidrawFreeDrawElement): Path2D | undefined;
|
|
@@ -3,11 +3,12 @@ import { RoughSVG } from "roughjs/bin/svg";
|
|
|
3
3
|
import { AppState } from "../types";
|
|
4
4
|
import { NonDeletedExcalidrawElement } from "../element/types";
|
|
5
5
|
import { SceneState } from "../scene/types";
|
|
6
|
-
export declare const renderScene: (elements: readonly NonDeletedExcalidrawElement[], appState: AppState, selectionElement: NonDeletedExcalidrawElement | null, scale: number, rc: RoughCanvas, canvas: HTMLCanvasElement, sceneState: SceneState, { renderScrollbars, renderSelection, renderOptimizations, renderGrid, }?: {
|
|
6
|
+
export declare const renderScene: (elements: readonly NonDeletedExcalidrawElement[], appState: AppState, selectionElement: NonDeletedExcalidrawElement | null, scale: number, rc: RoughCanvas, canvas: HTMLCanvasElement, sceneState: SceneState, { renderScrollbars, renderSelection, renderOptimizations, renderGrid, isExport, }?: {
|
|
7
7
|
renderScrollbars?: boolean | undefined;
|
|
8
8
|
renderSelection?: boolean | undefined;
|
|
9
9
|
renderOptimizations?: boolean | undefined;
|
|
10
10
|
renderGrid?: boolean | undefined;
|
|
11
|
+
isExport?: boolean | undefined;
|
|
11
12
|
}) => {
|
|
12
13
|
atLeastOneVisibleElement: boolean;
|
|
13
14
|
scrollBars?: undefined;
|
|
@@ -15,7 +16,7 @@ export declare const renderScene: (elements: readonly NonDeletedExcalidrawElemen
|
|
|
15
16
|
atLeastOneVisibleElement: boolean;
|
|
16
17
|
scrollBars: import("../scene/types").ScrollBars | undefined;
|
|
17
18
|
};
|
|
18
|
-
export declare const renderSceneToSvg: (elements: readonly NonDeletedExcalidrawElement[], rsvg: RoughSVG, svgRoot: SVGElement, { offsetX, offsetY, }?: {
|
|
19
|
+
export declare const renderSceneToSvg: (elements: readonly NonDeletedExcalidrawElement[], rsvg: RoughSVG, svgRoot: SVGElement, files: AppState["files"], { offsetX, offsetY, }?: {
|
|
19
20
|
offsetX?: number | undefined;
|
|
20
21
|
offsetY?: number | undefined;
|
|
21
22
|
}) => void;
|
package/types/scene/export.d.ts
CHANGED
|
@@ -8,7 +8,7 @@ export declare const exportToCanvas: (elements: readonly NonDeletedExcalidrawEle
|
|
|
8
8
|
}, createCanvas?: (width: number, height: number) => {
|
|
9
9
|
canvas: HTMLCanvasElement;
|
|
10
10
|
scale: number;
|
|
11
|
-
}) => HTMLCanvasElement
|
|
11
|
+
}) => Promise<HTMLCanvasElement>;
|
|
12
12
|
export declare const exportToSvg: (elements: readonly NonDeletedExcalidrawElement[], appState: {
|
|
13
13
|
exportBackground: boolean;
|
|
14
14
|
exportPadding?: number;
|
|
@@ -16,5 +16,6 @@ export declare const exportToSvg: (elements: readonly NonDeletedExcalidrawElemen
|
|
|
16
16
|
viewBackgroundColor: string;
|
|
17
17
|
exportWithDarkMode?: boolean;
|
|
18
18
|
exportEmbedScene?: boolean;
|
|
19
|
+
files: AppState["files"];
|
|
19
20
|
}) => Promise<SVGSVGElement>;
|
|
20
21
|
export declare const getExportSize: (elements: readonly NonDeletedExcalidrawElement[], exportPadding: number, scale: number) => [number, number];
|