@dwelle/excalidraw 0.4.0-d411eb2 → 0.4.0-e7ba198

package/types/components/icons.d.ts

@@ -6,68 +6,77 @@ declare type Opts = {
     mirror?: true;
 } & React.SVGProps<SVGSVGElement>;
 export declare const createIcon: (d: string | React.ReactNode, opts?: number | Opts) => JSX.Element;
+export declare const HomeIcon: JSX.Element;
+export declare const LibraryIcon: JSX.Element;
+export declare const PlusIcon: JSX.Element;
+export declare const DotsIcon: JSX.Element;
+export declare const PinIcon: JSX.Element;
+export declare const UnlockedIcon: JSX.Element;
+export declare const LockedIcon: JSX.Element;
+export declare const WelcomeScreenMenuArrow: JSX.Element;
+export declare const WelcomeScreenHelpArrow: JSX.Element;
+export declare const WelcomeScreenTopToolbarArrow: JSX.Element;
+export declare const ExcalLogo: JSX.Element;
+export declare const SelectionIcon: JSX.Element;
+export declare const RectangleIcon: JSX.Element;
+export declare const DiamondIcon: JSX.Element;
+export declare const EllipseIcon: JSX.Element;
+export declare const ArrowIcon: JSX.Element;
+export declare const LineIcon: JSX.Element;
+export declare const PenModeIcon: JSX.Element;
+export declare const FreedrawIcon: JSX.Element;
+export declare const TextIcon: JSX.Element;
+export declare const ImageIcon: JSX.Element;
+export declare const EraserIcon: JSX.Element;
+export declare const ZoomInIcon: JSX.Element;
+export declare const ZoomOutIcon: JSX.Element;
+export declare const TrashIcon: JSX.Element;
+export declare const DuplicateIcon: JSX.Element;
+export declare const MoonIcon: JSX.Element;
+export declare const SunIcon: JSX.Element;
+export declare const HamburgerMenuIcon: JSX.Element;
+export declare const ExportIcon: JSX.Element;
+export declare const HelpIcon: JSX.Element;
+export declare const ExternalLinkIcon: JSX.Element;
+export declare const GithubIcon: JSX.Element;
+export declare const DiscordIcon: JSX.Element;
+export declare const TwitterIcon: JSX.Element;
 export declare const checkIcon: JSX.Element;
-export declare const link: JSX.Element;
+export declare const LinkIcon: JSX.Element;
 export declare const save: JSX.Element;
 export declare const saveAs: JSX.Element;
-export declare const load: JSX.Element;
+export declare const LoadIcon: JSX.Element;
 export declare const clipboard: JSX.Element;
-export declare const trash: JSX.Element;
 export declare const palette: JSX.Element;
-export declare const exportFile: JSX.Element;
-export declare const exportImage: JSX.Element;
+export declare const ExportImageIcon: JSX.Element;
 export declare const exportToFileIcon: JSX.Element;
 export declare const zoomIn: JSX.Element;
 export declare const zoomOut: JSX.Element;
 export declare const done: JSX.Element;
 export declare const menu: JSX.Element;
-export declare const undo: JSX.Element;
-export declare const redo: JSX.Element;
+export declare const UndoIcon: JSX.Element;
+export declare const RedoIcon: JSX.Element;
 export declare const questionCircle: JSX.Element;
 export declare const share: JSX.Element;
 export declare const shareIOS: JSX.Element;
 export declare const shareWindows: JSX.Element;
 export declare const resetZoom: JSX.Element;
-export declare const BringForwardIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const SendBackwardIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const BringToFrontIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const SendToBackIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const AlignTopIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const AlignBottomIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const AlignLeftIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const AlignRightIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const DistributeHorizontallyIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const DistributeVerticallyIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const CenterVerticallyIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const CenterHorizontallyIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const users: JSX.Element;
+export declare const BringForwardIcon: JSX.Element;
+export declare const SendBackwardIcon: JSX.Element;
+export declare const BringToFrontIcon: JSX.Element;
+export declare const SendToBackIcon: JSX.Element;
+export declare const AlignTopIcon: JSX.Element;
+export declare const AlignBottomIcon: JSX.Element;
+export declare const AlignLeftIcon: JSX.Element;
+export declare const AlignRightIcon: JSX.Element;
+export declare const DistributeHorizontallyIcon: JSX.Element;
+export declare const DistributeVerticallyIcon: JSX.Element;
+export declare const CenterVerticallyIcon: JSX.Element;
+export declare const CenterHorizontallyIcon: JSX.Element;
+export declare const UsersIcon: JSX.Element;
 export declare const start: JSX.Element;
 export declare const stop: JSX.Element;
-export declare const close: JSX.Element;
+export declare const CloseIcon: JSX.Element;
 export declare const back: JSX.Element;
 export declare const clone: JSX.Element;
 export declare const shield: JSX.Element;
@@ -78,92 +87,44 @@ export declare const GroupIcon: React.MemoExoticComponent<({ theme }: {
 export declare const UngroupIcon: React.MemoExoticComponent<({ theme }: {
     theme: Theme;
 }) => JSX.Element>;
-export declare const FillHachureIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const FillCrossHatchIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const FillSolidIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const StrokeWidthIcon: React.MemoExoticComponent<({ theme, strokeWidth }: {
-    theme: Theme;
-    strokeWidth: number;
-}) => JSX.Element>;
+export declare const FillHachureIcon: JSX.Element;
+export declare const FillCrossHatchIcon: JSX.Element;
+export declare const FillSolidIcon: JSX.Element;
+export declare const StrokeWidthBaseIcon: JSX.Element;
+export declare const StrokeWidthBoldIcon: JSX.Element;
+export declare const StrokeWidthExtraBoldIcon: JSX.Element;
 export declare const StrokeStyleSolidIcon: React.MemoExoticComponent<({ theme }: {
     theme: Theme;
 }) => JSX.Element>;
-export declare const StrokeStyleDashedIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const StrokeStyleDottedIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const SloppinessArchitectIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const SloppinessArtistIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const SloppinessCartoonistIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const EdgeSharpIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const EdgeRoundIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const ArrowheadNoneIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const ArrowheadArrowIcon: React.MemoExoticComponent<({ theme, flip }: {
-    theme: Theme;
+export declare const StrokeStyleDashedIcon: JSX.Element;
+export declare const StrokeStyleDottedIcon: JSX.Element;
+export declare const SloppinessArchitectIcon: JSX.Element;
+export declare const SloppinessArtistIcon: JSX.Element;
+export declare const SloppinessCartoonistIcon: JSX.Element;
+export declare const EdgeSharpIcon: JSX.Element;
+export declare const EdgeRoundIcon: JSX.Element;
+export declare const ArrowheadNoneIcon: JSX.Element;
+export declare const ArrowheadArrowIcon: React.MemoExoticComponent<({ flip }: {
     flip?: boolean | undefined;
 }) => JSX.Element>;
-export declare const ArrowheadDotIcon: React.MemoExoticComponent<({ theme, flip }: {
-    theme: Theme;
+export declare const ArrowheadDotIcon: React.MemoExoticComponent<({ flip }: {
     flip?: boolean | undefined;
 }) => JSX.Element>;
-export declare const ArrowheadBarIcon: React.MemoExoticComponent<({ theme, flip }: {
-    theme: Theme;
+export declare const ArrowheadBarIcon: React.MemoExoticComponent<({ flip }: {
     flip?: boolean | undefined;
 }) => JSX.Element>;
-export declare const ArrowheadTriangleIcon: React.MemoExoticComponent<({ theme, flip }: {
-    theme: Theme;
+export declare const ArrowheadTriangleIcon: React.MemoExoticComponent<({ flip }: {
     flip?: boolean | undefined;
 }) => JSX.Element>;
-export declare const FontSizeSmallIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const FontSizeMediumIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const FontSizeLargeIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const FontSizeExtraLargeIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const FontFamilyHandDrawnIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const FontFamilyNormalIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const FontFamilyCodeIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const TextAlignLeftIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const TextAlignCenterIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
-export declare const TextAlignRightIcon: React.MemoExoticComponent<({ theme }: {
-    theme: Theme;
-}) => JSX.Element>;
+export declare const FontSizeSmallIcon: JSX.Element;
+export declare const FontSizeMediumIcon: JSX.Element;
+export declare const FontSizeLargeIcon: JSX.Element;
+export declare const FontSizeExtraLargeIcon: JSX.Element;
+export declare const FontFamilyNormalIcon: JSX.Element;
+export declare const FontFamilyCodeIcon: JSX.Element;
+export declare const TextAlignLeftIcon: JSX.Element;
+export declare const TextAlignCenterIcon: JSX.Element;
+export declare const TextAlignRightIcon: JSX.Element;
 export declare const TextAlignTopIcon: React.MemoExoticComponent<({ theme }: {
     theme: Theme;
 }) => JSX.Element>;
@@ -174,7 +135,5 @@ export declare const TextAlignMiddleIcon: React.MemoExoticComponent<({ theme }:
     theme: Theme;
 }) => JSX.Element>;
 export declare const publishIcon: JSX.Element;
-export declare const editIcon: JSX.Element;
 export declare const eraser: JSX.Element;
-export declare const home: JSX.Element;
 export {};

package/types/constants.d.ts

@@ -1,4 +1,4 @@
-import { AppProps, CanvasActions, ExportOpts } from "./types";
+import { AppProps } from "./types";
 import { FontFamilyValues } from "./element/types";
 export declare const APP_NAME = "Excalidraw";
 export declare const DRAGGING_THRESHOLD = 10;
@@ -84,6 +84,9 @@ export declare const MIME_TYPES: {
     readonly "excalidraw.png": "image/png";
     readonly jpg: "image/jpeg";
     readonly gif: "image/gif";
+    readonly webp: "image/webp";
+    readonly bmp: "image/bmp";
+    readonly ico: "image/x-icon";
     readonly binary: "application/octet-stream";
 };
 export declare const EXPORT_DATA_TYPES: {
@@ -99,6 +102,7 @@ export declare const TITLE_TIMEOUT = 10000;
 export declare const VERSION_TIMEOUT = 30000;
 export declare const SCROLL_TIMEOUT = 100;
 export declare const ZOOM_STEP = 0.1;
+export declare const MIN_ZOOM = 0.1;
 export declare const HYPERLINK_TOOLTIP_DELAY = 300;
 export declare const IDLE_THRESHOLD = 60000;
 export declare const ACTIVE_THRESHOLD = 3000;
@@ -114,11 +118,7 @@ export declare const URL_QUERY_KEYS: {
 export declare const URL_HASH_KEYS: {
     readonly addLibrary: "addLibrary";
 };
-export declare const DEFAULT_UI_OPTIONS: Merge<AppProps["UIOptions"], {
-    canvasActions: Merge<Required<CanvasActions>, {
-        export: ExportOpts;
-    }>;
-}>;
+export declare const DEFAULT_UI_OPTIONS: AppProps["UIOptions"];
 export declare const MQ_SM_MAX_WIDTH = 640;
 export declare const MQ_MAX_WIDTH_PORTRAIT = 800;
 export declare const MQ_MAX_WIDTH_LANDSCAPE = 1000;
@@ -129,7 +129,7 @@ export declare const MAX_DECIMALS_FOR_SVG_EXPORT = 2;
 export declare const EXPORT_SCALES: number[];
 export declare const DEFAULT_EXPORT_PADDING = 10;
 export declare const DEFAULT_MAX_IMAGE_WIDTH_OR_HEIGHT = 1440;
-export declare const ALLOWED_IMAGE_MIME_TYPES: readonly ["image/png", "image/jpeg", "image/svg+xml", "image/gif"];
+export declare const ALLOWED_IMAGE_MIME_TYPES: readonly ["image/png", "image/jpeg", "image/svg+xml", "image/gif", "image/webp", "image/bmp", "image/x-icon"];
 export declare const MAX_ALLOWED_FILE_BYTES: number;
 export declare const SVG_NS = "http://www.w3.org/2000/svg";
 export declare const ENCRYPTION_KEY_BITS = 128;
@@ -143,7 +143,15 @@ export declare const VERTICAL_ALIGN: {
     MIDDLE: string;
     BOTTOM: string;
 };
+export declare const TEXT_ALIGN: {
+    LEFT: string;
+    CENTER: string;
+    RIGHT: string;
+};
 export declare const ELEMENT_READY_TO_ERASE_OPACITY = 20;
 export declare const COOKIES: {
     readonly AUTH_STATE_COOKIE: "excplus-auth";
 };
+/** key containt id of precedeing elemnt id we use in reconciliation during
+ * collaboration */
+export declare const PRECEDING_ELEMENT_KEY = "__precedingElement__";

package/types/data/blob.d.ts

@@ -40,7 +40,7 @@ export declare const getFileFromEvent: (event: React.DragEvent<HTMLDivElement>)
 }>;
 export declare const getFileHandle: (event: React.DragEvent<HTMLDivElement>) => Promise<FileSystemHandle | null>;
 export declare const createFile: (blob: File | Blob | ArrayBuffer, mimeType: ValueOf<typeof MIME_TYPES>, name: string | undefined) => File;
-/** attemps to detect correct mimeType if none is set, or if an image
+/** attempts to detect correct mimeType if none is set, or if an image
  * has an incorrect extension.
  * Note: doesn't handle missing .excalidraw/.excalidrawlib extension  */
 export declare const normalizeFile: (file: File) => Promise<File>;

package/types/data/restore.d.ts

@@ -8,7 +8,7 @@ export declare type RestoredDataState = {
     appState: RestoredAppState;
     files: BinaryFiles;
 };
-export declare const restoreElements: (elements: ImportedDataState["elements"], localElements: readonly ExcalidrawElement[] | null | undefined) => ExcalidrawElement[];
+export declare const restoreElements: (elements: ImportedDataState["elements"], localElements: readonly ExcalidrawElement[] | null | undefined, refreshDimensions?: boolean) => ExcalidrawElement[];
 export declare const restoreAppState: (appState: ImportedDataState["appState"], localAppState: Partial<AppState> | null | undefined) => RestoredAppState;
 export declare const restore: (data: Pick<ImportedDataState, "appState" | "elements" | "files"> | null, localAppState: Partial<AppState> | null | undefined, localElements: readonly ExcalidrawElement[] | null | undefined) => RestoredDataState;
 export declare const restoreLibraryItems: (libraryItems: ImportedDataState["libraryItems"], defaultStatus: LibraryItem["status"]) => LibraryItem[];

package/types/data/types.d.ts

@@ -10,12 +10,27 @@ export interface ExportedDataState {
     appState: ReturnType<typeof cleanAppStateForExport>;
     files: BinaryFiles | undefined;
 }
+/**
+ * Map of legacy AppState keys, with values of:
+ *  [<legacy type>, <new AppState proeprty>]
+ *
+ * This is a helper type used in downstream abstractions.
+ * Don't consume on its own.
+ */
+export declare type LegacyAppState = {
+    /** @deprecated #5663 TODO remove 22-12-15 */
+    isLibraryOpen: [boolean, "openSidebar"];
+    /** @deprecated #5663 TODO remove 22-12-15 */
+    isLibraryMenuDocked: [boolean, "isSidebarDocked"];
+};
 export interface ImportedDataState {
     type?: string;
     version?: number;
     source?: string;
     elements?: readonly ExcalidrawElement[] | null;
-    appState?: Readonly<Partial<AppState>> | null;
+    appState?: Readonly<Partial<AppState & {
+        [T in keyof LegacyAppState]: LegacyAppState[T][0];
+    }>> | null;
     scrollToContent?: boolean;
     libraryItems?: LibraryItems_anyVersion;
     files?: BinaryFiles;

package/types/element/Hyperlink.d.ts

@@ -4,9 +4,8 @@ import { NonDeletedExcalidrawElement } from "./types";
 import { Bounds } from "./bounds";
 import "./Hyperlink.scss";
 export declare const EXTERNAL_LINK_IMG: HTMLImageElement;
-export declare const Hyperlink: ({ element, appState, setAppState, onLinkOpen, }: {
+export declare const Hyperlink: ({ element, setAppState, onLinkOpen, }: {
     element: NonDeletedExcalidrawElement;
-    appState: AppState;
     setAppState: React.Component<any, AppState>["setState"];
     onLinkOpen: ExcalidrawProps["onLinkOpen"];
 }) => JSX.Element | null;
@@ -19,6 +18,7 @@ export declare const actionLink: {
         appState: {
             showHyperlinkPopup: "editor";
             openMenu: null;
+            showWelcomeScreen: boolean;
             isLoading: boolean;
             errorMessage: string | null;
             draggingElement: NonDeletedExcalidrawElement | null;
@@ -56,7 +56,7 @@ export declare const actionLink: {
             currentItemOpacity: number;
             currentItemFontFamily: number;
             currentItemFontSize: number;
-            currentItemTextAlign: import("./types").TextAlign;
+            currentItemTextAlign: string;
             currentItemStrokeSharpness: import("./types").StrokeSharpness;
             currentItemStartArrowhead: import("./types").Arrowhead | null;
             currentItemEndArrowhead: import("./types").Arrowhead | null;
@@ -73,6 +73,9 @@ export declare const actionLink: {
                 value: import("../types").NormalizedZoomValue;
             }>;
             openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
+            openSidebar: "library" | "customSidebar" | null;
+            openDialog: "imageExport" | "help" | null;
+            isSidebarDocked: boolean;
             lastPointerDownWith: import("./types").PointerType;
             selectedElementIds: {
                 [id: string]: boolean;
@@ -81,7 +84,6 @@ export declare const actionLink: {
                 [id: string]: boolean;
             };
             shouldCacheIgnoreZoom: boolean;
-            showHelpDialog: boolean;
             toast: {
                 message: string;
                 closable?: boolean | undefined;
@@ -99,8 +101,6 @@ export declare const actionLink: {
             height: number;
             offsetTop: number;
             offsetLeft: number;
-            isLibraryOpen: boolean;
-            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../types").Collaborator>;
             showStats: boolean;
@@ -124,7 +124,9 @@ export declare const actionLink: {
     keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
     contextItemLabel: (elements: readonly import("./types").ExcalidrawElement[], appState: Readonly<AppState>) => "labels.link.edit" | "labels.link.create";
     contextItemPredicate: (elements: readonly import("./types").ExcalidrawElement[], appState: AppState) => boolean;
-    PanelComponent: ({ elements, appState, updateData }: import("../actions/types").PanelComponentProps) => JSX.Element;
+    PanelComponent: ({ elements, appState, updateData }: import("../actions/types").PanelComponentProps & {
+        isInHamburgerMenu: boolean;
+    }) => JSX.Element;
 } & {
     keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
 };

package/types/element/image.d.ts

@@ -10,7 +10,7 @@ export declare const updateImageCache: ({ fileIds, files, imageCache, }: {
 }) => Promise<{
     imageCache: Map<FileId, {
         image: HTMLImageElement | Promise<HTMLImageElement>;
-        mimeType: "image/svg+xml" | "image/png" | "image/jpeg" | "image/gif";
+        mimeType: "image/svg+xml" | "image/png" | "image/jpeg" | "image/gif" | "image/webp" | "image/bmp" | "image/x-icon";
     }>;
     /** includes errored files because they cache was updated nonetheless */
     updatedFiles: Map<FileId, true>;

package/types/element/index.d.ts

@@ -1,5 +1,5 @@
 import { ExcalidrawElement, NonDeletedExcalidrawElement, NonDeleted } from "./types";
-export { newElement, newTextElement, updateTextElement, newLinearElement, newImageElement, duplicateElement, } from "./newElement";
+export { newElement, newTextElement, updateTextElement, refreshTextDimensions, newLinearElement, newImageElement, duplicateElement, } from "./newElement";
 export { getElementAbsoluteCoords, getElementBounds, getCommonBounds, getDiamondPoints, getArrowheadPoints, getClosestElementBounds, } from "./bounds";
 export { OMIT_SIDES_FOR_MULTIPLE_ELEMENTS, getTransformHandlesFromCoords, getTransformHandles, } from "./transformHandles";
 export { hitTest, isHittingElementBoundingBoxWithoutHittingElement, } from "./collision";

package/types/element/linearElementEditor.d.ts

@@ -3,6 +3,11 @@ import { NonDeleted, ExcalidrawLinearElement, ExcalidrawElement, PointBinding, E
 import { Point, AppState } from "../types";
 import History from "../history";
 import Scene from "../scene/Scene";
+declare const editorMidPointsCache: {
+    version: number | null;
+    points: (Point | null)[];
+    zoom: number | null;
+};
 export declare class LinearElementEditor {
     readonly elementId: ExcalidrawElement["id"] & {
         _brand: "excalidrawLinearElementId";
@@ -24,7 +29,7 @@ export declare class LinearElementEditor {
     readonly startBindingElement: ExcalidrawBindableElement | null | "keep";
     readonly endBindingElement: ExcalidrawBindableElement | null | "keep";
     readonly hoverPointIndex: number;
-    readonly midPointHovered: boolean;
+    readonly segmentMidPointHoveredCoords: Point | null;
     constructor(element: NonDeleted<ExcalidrawLinearElement>, scene: Scene);
     static POINT_HANDLE_SIZE: number;
     /**
@@ -39,11 +44,15 @@ export declare class LinearElementEditor {
         y: number;
     }[]) => void, linearElementEditor: LinearElementEditor): boolean;
     static handlePointerUp(event: PointerEvent, editingLinearElement: LinearElementEditor, appState: AppState): LinearElementEditor;
-    static isHittingMidPoint: (linearElementEditor: LinearElementEditor, scenePointer: {
+    static getEditorMidPoints: (element: NonDeleted<ExcalidrawLinearElement>, appState: AppState) => (typeof editorMidPointsCache)["points"];
+    static updateEditorMidPointsCache: (element: NonDeleted<ExcalidrawLinearElement>, appState: AppState) => void;
+    static getSegmentMidpointHitCoords: (linearElementEditor: LinearElementEditor, scenePointer: {
         x: number;
         y: number;
-    }, appState: AppState) => boolean;
-    static getMidPoint(linearElementEditor: LinearElementEditor): readonly [number, number] | null;
+    }, appState: AppState) => readonly [number, number] | null;
+    static isSegmentTooShort(element: NonDeleted<ExcalidrawLinearElement>, startPoint: Point, endPoint: Point, zoom: AppState["zoom"]): boolean;
+    static getSegmentMidPoint(element: NonDeleted<ExcalidrawLinearElement>, startPoint: Point, endPoint: Point, endPointIndex: number): readonly [number, number];
+    static getSegmentMidPointIndex(linearElementEditor: LinearElementEditor, appState: AppState, midPoint: Point): number;
     static handlePointerDown(event: React.PointerEvent<HTMLCanvasElement>, appState: AppState, history: History, scenePointer: {
         x: number;
         y: number;
@@ -53,7 +62,8 @@ export declare class LinearElementEditor {
         linearElementEditor: LinearElementEditor | null;
         isMidPoint: boolean;
     };
-    static handlePointerMove(event: React.PointerEvent<HTMLCanvasElement>, scenePointerX: number, scenePointerY: number, linearElementEditor: LinearElementEditor, gridSize: number | null): LinearElementEditor;
+    static arePointsEqual(point1: Point | null, point2: Point | null): boolean;
+    static handlePointerMove(event: React.PointerEvent<HTMLCanvasElement>, scenePointerX: number, scenePointerY: number, appState: AppState): LinearElementEditor | null;
     /** scene coords */
     static getPointGlobalCoordinates(element: NonDeleted<ExcalidrawLinearElement>, point: Point): readonly [number, number];
     /** scene coords */
@@ -94,8 +104,9 @@ export declare class LinearElementEditor {
                 startBindingElement: ExcalidrawBindableElement | "keep" | null;
                 endBindingElement: ExcalidrawBindableElement | "keep" | null;
                 hoverPointIndex: number;
-                midPointHovered: boolean;
+                segmentMidPointHoveredCoords: readonly [number, number] | null;
             };
+            showWelcomeScreen: boolean;
             isLoading: boolean;
             errorMessage: string | null;
             draggingElement: import("./types").NonDeletedExcalidrawElement | null;
@@ -132,7 +143,7 @@ export declare class LinearElementEditor {
             currentItemOpacity: number;
             currentItemFontFamily: number;
             currentItemFontSize: number;
-            currentItemTextAlign: import("./types").TextAlign;
+            currentItemTextAlign: string;
             currentItemStrokeSharpness: import("./types").StrokeSharpness;
             currentItemStartArrowhead: import("./types").Arrowhead | null;
             currentItemEndArrowhead: import("./types").Arrowhead | null;
@@ -149,7 +160,11 @@ export declare class LinearElementEditor {
                 value: import("../types").NormalizedZoomValue;
             }>;
             openMenu: "canvas" | "shape" | null;
+            /** @returns whether point was dragged */
             openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
+            openSidebar: "library" | "customSidebar" | null;
+            openDialog: "imageExport" | "help" | null;
+            isSidebarDocked: boolean;
             lastPointerDownWith: import("./types").PointerType;
             selectedElementIds: {
                 [id: string]: boolean;
@@ -158,7 +173,6 @@ export declare class LinearElementEditor {
                 [id: string]: boolean;
             };
             shouldCacheIgnoreZoom: boolean;
-            showHelpDialog: boolean;
             toast: {
                 message: string;
                 closable?: boolean | undefined;
@@ -176,8 +190,6 @@ export declare class LinearElementEditor {
             height: number;
             offsetTop: number;
             offsetLeft: number;
-            isLibraryOpen: boolean;
-            isLibraryMenuDocked: boolean;
             fileHandle: import("browser-fs-access").FileSystemHandle | null;
             collaborators: Map<string, import("../types").Collaborator>;
             showStats: boolean;
@@ -195,7 +207,7 @@ export declare class LinearElementEditor {
         };
     };
     static deletePoints(element: NonDeleted<ExcalidrawLinearElement>, pointIndices: readonly number[]): void;
-    static addPoints(element: NonDeleted<ExcalidrawLinearElement>, targetPoints: {
+    static addPoints(element: NonDeleted<ExcalidrawLinearElement>, appState: AppState, targetPoints: {
         point: Point;
     }[]): void;
     static movePoints(element: NonDeleted<ExcalidrawLinearElement>, targetPoints: {
@@ -209,3 +221,4 @@ export declare class LinearElementEditor {
     private static _updatePoints;
     private static _getShiftLockedDelta;
 }
+export {};

package/types/element/newElement.d.ts

@@ -12,7 +12,17 @@ export declare const newTextElement: (opts: {
     verticalAlign: VerticalAlign;
     containerId?: ExcalidrawRectangleElement["id"];
 } & ElementConstructorOpts) => NonDeleted<ExcalidrawTextElement>;
-export declare const updateTextElement: (element: ExcalidrawTextElement, { text, isDeleted, originalText, }: {
+export declare const refreshTextDimensions: (textElement: ExcalidrawTextElement, text?: string) => {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    baseline: number;
+    text: string;
+};
+export declare const getMaxContainerWidth: (container: ExcalidrawElement) => number;
+export declare const getMaxContainerHeight: (container: ExcalidrawElement) => number;
+export declare const updateTextElement: (textElement: ExcalidrawTextElement, { text, isDeleted, originalText, }: {
     text: string;
     isDeleted?: boolean | undefined;
     originalText: string;
@@ -30,6 +40,9 @@ export declare const newLinearElement: (opts: {
 } & ElementConstructorOpts) => NonDeleted<ExcalidrawLinearElement>;
 export declare const newImageElement: (opts: {
     type: ExcalidrawImageElement["type"];
+    status?: ExcalidrawImageElement["status"];
+    fileId?: ExcalidrawImageElement["fileId"];
+    scale?: ExcalidrawImageElement["scale"];
 } & ElementConstructorOpts) => NonDeleted<ExcalidrawImageElement>;
 export declare const deepCopyElement: (val: any, depth?: number) => any;
 /**

package/types/element/textElement.d.ts

@@ -1,6 +1,6 @@
 import { ExcalidrawElement, ExcalidrawTextElement, ExcalidrawTextElementWithContainer, FontString, NonDeletedExcalidrawElement } from "./types";
 import { MaybeTransformHandleType } from "./transformHandles";
-export declare const redrawTextBoundingBox: (element: ExcalidrawTextElement, container: ExcalidrawElement | null) => void;
+export declare const redrawTextBoundingBox: (textElement: ExcalidrawTextElement, container: ExcalidrawElement | null) => void;
 export declare const bindTextToShapeAfterDuplication: (sceneElements: ExcalidrawElement[], oldElements: ExcalidrawElement[], oldIdToDuplicatedId: Map<ExcalidrawElement["id"], ExcalidrawElement["id"]>) => void;
 export declare const handleBindTextResize: (element: NonDeletedExcalidrawElement, transformHandleType: MaybeTransformHandleType) => void;
 export declare const measureText: (text: string, font: FontString, maxWidth?: number | null) => {
@@ -9,7 +9,7 @@ export declare const measureText: (text: string, font: FontString, maxWidth?: nu
     baseline: number;
 };
 export declare const getApproxLineHeight: (font: FontString) => number;
-export declare const wrapText: (text: string, font: FontString, containerWidth: number) => string;
+export declare const wrapText: (text: string, font: FontString, maxWidth: number) => string;
 export declare const charWidth: {
     calculate: (char: string, font: FontString) => number;
     getCache: (font: FontString) => number[];
@@ -24,3 +24,7 @@ export declare const getBoundTextElement: (element: ExcalidrawElement | null) =>
 export declare const getContainerElement: (element: (ExcalidrawElement & {
     containerId: ExcalidrawElement["id"] | null;
 }) | null) => ExcalidrawElement | null;
+export declare const getContainerDims: (element: ExcalidrawElement) => {
+    width: number;
+    height: number;
+};

package/types/element/transformHandles.d.ts

@@ -1,6 +1,6 @@
 import { ExcalidrawElement, NonDeletedExcalidrawElement, PointerType } from "./types";
 import { Bounds } from "./bounds";
-import { Zoom } from "../types";
+import { AppState, Zoom } from "../types";
 export declare type TransformHandleDirection = "n" | "s" | "w" | "e" | "nw" | "ne" | "sw" | "se";
 export declare type TransformHandleType = TransformHandleDirection | "rotation";
 export declare type TransformHandle = [number, number, number, number];
@@ -15,8 +15,8 @@ export declare const OMIT_SIDES_FOR_MULTIPLE_ELEMENTS: {
     w: boolean;
 };
 export declare const getTransformHandlesFromCoords: ([x1, y1, x2, y2]: Bounds, angle: number, zoom: Zoom, pointerType: PointerType, omitSides?: {
-    e?: boolean | undefined;
     s?: boolean | undefined;
+    e?: boolean | undefined;
     w?: boolean | undefined;
     n?: boolean | undefined;
     nw?: boolean | undefined;
@@ -26,4 +26,4 @@ export declare const getTransformHandlesFromCoords: ([x1, y1, x2, y2]: Bounds, a
     rotation?: boolean | undefined;
 }, margin?: number) => TransformHandles;
 export declare const getTransformHandles: (element: ExcalidrawElement, zoom: Zoom, pointerType?: PointerType) => TransformHandles;
-export declare const shouldShowBoundingBox: (elements: NonDeletedExcalidrawElement[]) => boolean;
+export declare const shouldShowBoundingBox: (elements: NonDeletedExcalidrawElement[], appState: AppState) => boolean;