@excalidraw/excalidraw 0.13.0-f5379d1 → 0.14.0-6121-fc3ad52

package/types/math.d.ts

@@ -1,5 +1,5 @@
 import { Point, Zoom } from "./types";
-import { ExcalidrawLinearElement, NonDeleted } from "./element/types";
+import { ExcalidrawElement, ExcalidrawLinearElement, NonDeleted } from "./element/types";
 export declare const rotate: (x1: number, y1: number, x2: number, y2: number, angle: number) => [number, number];
 export declare const rotatePoint: (point: readonly [number, number], center: readonly [number, number], angle: number) => [number, number];
 export declare const adjustXYWithRotation: (sides: {
@@ -18,6 +18,7 @@ export declare const centerPoint: (a: readonly [number, number], b: readonly [nu
 export declare const isPathALoop: (points: ExcalidrawLinearElement["points"], zoomValue?: Zoom["value"]) => boolean;
 export declare const isPointInPolygon: (points: Point[], x: number, y: number) => boolean;
 export declare const getGridPoint: (x: number, y: number, gridSize: number | null) => [number, number];
+export declare const getCornerRadius: (x: number, element: ExcalidrawElement) => number;
 export declare const getControlPointsForBezierCurve: (element: NonDeleted<ExcalidrawLinearElement>, endPoint: readonly [number, number]) => [number, number][] | null;
 export declare const getBezierXY: (p0: readonly [number, number], p1: readonly [number, number], p2: readonly [number, number], p3: readonly [number, number], t: number) => number[];
 export declare const getPointsInBezierCurve: (element: NonDeleted<ExcalidrawLinearElement>, endPoint: readonly [number, number]) => [number, number][];

package/types/packages/excalidraw/dist/excalidraw.development.d.ts

@@ -1,2 +1,2 @@
-export = __WEBPACK_EXTERNAL_MODULE_react_dom__;
-export = __WEBPACK_EXTERNAL_MODULE_react_dom__;
+export = __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__;
+export = __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__;

package/types/packages/excalidraw/example/CustomFooter.d.ts

@@ -0,0 +1,5 @@
+import { ExcalidrawImperativeAPI } from "../../../types";
+declare const CustomFooter: ({ excalidrawAPI, }: {
+    excalidrawAPI: ExcalidrawImperativeAPI;
+}) => JSX.Element;
+export default CustomFooter;

package/types/packages/excalidraw/example/MobileFooter.d.ts

@@ -0,0 +1,5 @@
+import { ExcalidrawImperativeAPI } from "../../../types";
+declare const MobileFooter: ({ excalidrawAPI, }: {
+    excalidrawAPI: ExcalidrawImperativeAPI;
+}) => JSX.Element | null;
+export default MobileFooter;

package/types/packages/excalidraw/index.d.ts

@@ -2,6 +2,10 @@ import React from "react";
 import "../../css/app.scss";
 import "../../css/styles.scss";
 import { ExcalidrawAPIRefValue, ExcalidrawProps } from "../../types";
+import Footer from "../../components/footer/FooterCenter";
+import MainMenu from "../../components/main-menu/MainMenu";
+import WelcomeScreen from "../../components/welcome-screen/WelcomeScreen";
+import LiveCollaborationTrigger from "../../components/live-collaboration/LiveCollaborationTrigger";
 declare type PublicExcalidrawProps = Omit<ExcalidrawProps, "forwardedRef">;
 export declare const Excalidraw: React.MemoExoticComponent<React.ForwardRefExoticComponent<PublicExcalidrawProps & React.RefAttributes<ExcalidrawAPIRefValue>>>;
 export { getSceneVersion, isInvisiblySmallElement, getNonDeletedElements, } from "../../element";
@@ -14,3 +18,9 @@ export { mutateElement, newElementWith, bumpVersion, } from "../../element/mutat
 export { parseLibraryTokensFromUrl, useHandleLibrary, } from "../../data/library";
 export { sceneCoordsToViewportCoords, viewportCoordsToSceneCoords, } from "../../utils";
 export { Sidebar } from "../../components/Sidebar/Sidebar";
+export { Button } from "../../components/Button";
+export { Footer };
+export { MainMenu };
+export { useDevice } from "../../components/App";
+export { WelcomeScreen };
+export { LiveCollaborationTrigger };

package/types/packages/excalidraw/webpack.dev.config.d.ts

@@ -76,4 +76,16 @@ export const externals: {
         commonjs: string;
         amd: string;
     };
+    "react-dom/client": {
+        root: string;
+        commonjs2: string;
+        commonjs: string;
+        amd: string;
+    };
+    "react/jsx-runtime": {
+        root: string;
+        commonjs2: string;
+        commonjs: string;
+        amd: string;
+    };
 };

package/types/packages/excalidraw/webpack.prod.config.d.ts

@@ -89,4 +89,16 @@ export const externals: {
         commonjs: string;
         amd: string;
     };
+    "react-dom/client": {
+        root: string;
+        commonjs2: string;
+        commonjs: string;
+        amd: string;
+    };
+    "react/jsx-runtime": {
+        root: string;
+        commonjs2: string;
+        commonjs: string;
+        amd: string;
+    };
 };

package/types/renderer/renderElement.d.ts

@@ -3,7 +3,7 @@ import { RoughCanvas } from "roughjs/bin/canvas";
 import { Drawable, Options } from "roughjs/bin/core";
 import { RoughSVG } from "roughjs/bin/svg";
 import { RenderConfig } from "../scene/types";
-import { BinaryFiles, Zoom } from "../types";
+import { AppState, BinaryFiles, Zoom } from "../types";
 export interface ExcalidrawElementWithCanvas {
     element: ExcalidrawElement | ExcalidrawTextElement;
     canvas: HTMLCanvasElement;
@@ -11,6 +11,7 @@ export interface ExcalidrawElementWithCanvas {
     canvasZoom: Zoom["value"];
     canvasOffsetX: number;
     canvasOffsetY: number;
+    boundTextElementVersion: number | null;
 }
 export declare const DEFAULT_LINK_SIZE = 14;
 declare type ElementShape = Drawable | Drawable[] | null;
@@ -25,8 +26,8 @@ export declare const getShapeForElement: <T extends ExcalidrawElement>(element:
 export declare const setShapeForElement: <T extends ExcalidrawElement>(element: T, shape: T["type"] extends keyof ElementShapes ? ElementShapes[T["type"]] : Drawable) => WeakMap<ExcalidrawElement, ElementShape>;
 export declare const invalidateShapeForElement: (element: ExcalidrawElement) => boolean;
 export declare const generateRoughOptions: (element: ExcalidrawElement, continuousPath?: boolean) => Options;
-export declare const renderElement: (element: NonDeletedExcalidrawElement, rc: RoughCanvas, context: CanvasRenderingContext2D, renderConfig: RenderConfig) => void;
-export declare const renderElementToSvg: (element: NonDeletedExcalidrawElement, rsvg: RoughSVG, svgRoot: SVGElement, files: BinaryFiles, offsetX?: number, offsetY?: number, exportWithDarkMode?: boolean) => void;
+export declare const renderElement: (element: NonDeletedExcalidrawElement, rc: RoughCanvas, context: CanvasRenderingContext2D, renderConfig: RenderConfig, appState: AppState) => void;
+export declare const renderElementToSvg: (element: NonDeletedExcalidrawElement, rsvg: RoughSVG, svgRoot: SVGElement, files: BinaryFiles, offsetX: number, offsetY: number, exportWithDarkMode?: boolean) => void;
 export declare const pathsCache: WeakMap<ExcalidrawFreeDrawElement, Path2D>;
 export declare function generateFreeDrawShape(element: ExcalidrawFreeDrawElement): Path2D;
 export declare function getFreeDrawPath2D(element: ExcalidrawFreeDrawElement): Path2D | undefined;

package/types/renderer/renderScene.d.ts

@@ -3,7 +3,7 @@ import { RoughSVG } from "roughjs/bin/svg";
 import { AppState, BinaryFiles } from "../types";
 import { NonDeletedExcalidrawElement } from "../element/types";
 import { RenderConfig } from "../scene/types";
-export declare const DEFAULT_SPACING = 4;
+export declare const DEFAULT_SPACING = 2;
 export declare const _renderScene: ({ elements, appState, scale, rc, canvas, renderConfig, }: {
     elements: readonly NonDeletedExcalidrawElement[];
     appState: AppState;

package/types/scene/Fonts.d.ts

@@ -0,0 +1,21 @@
+import { ExcalidrawElement } from "../element/types";
+import type Scene from "./Scene";
+export declare class Fonts {
+    private scene;
+    private onSceneUpdated;
+    constructor({ scene, onSceneUpdated, }: {
+        scene: Scene;
+        onSceneUpdated: () => void;
+    });
+    private static loadedFontFaces;
+    /**
+     * if we load a (new) font, it's likely that text elements using it have
+     * already been rendered using a fallback font. Thus, we want invalidate
+     * their shapes and rerender. See #637.
+     *
+     * Invalidates text elements and rerenders scene, provided that at least one
+     * of the supplied fontFaces has not already been processed.
+     */
+    onFontsLoaded: (fontFaces: readonly FontFace[]) => false | undefined;
+    loadFontsForElements: (elements: readonly ExcalidrawElement[]) => Promise<void>;
+}

package/types/scene/Scene.d.ts

@@ -17,9 +17,24 @@ declare class Scene {
     getNonDeletedElements(): readonly NonDeletedExcalidrawElement[];
     getElement<T extends ExcalidrawElement>(id: T["id"]): T | null;
     getNonDeletedElement(id: ExcalidrawElement["id"]): NonDeleted<ExcalidrawElement> | null;
+    /**
+     * A utility method to help with updating all scene elements, with the added
+     * performance optimization of not renewing the array if no change is made.
+     *
+     * Maps all current excalidraw elements, invoking the callback for each
+     * element. The callback should either return a new mapped element, or the
+     * original element if no changes are made. If no changes are made to any
+     * element, this results in a no-op. Otherwise, the newly mapped elements
+     * are set as the next scene's elements.
+     *
+     * @returns whether a change was made
+     */
+    mapElements(iteratee: (element: ExcalidrawElement) => ExcalidrawElement): boolean;
     replaceAllElements(nextElements: readonly ExcalidrawElement[]): void;
     informMutation(): void;
     addCallback(cb: SceneStateCallback): SceneStateCallbackRemover;
     destroy(): void;
+    insertElementAtIndex(element: ExcalidrawElement, index: number): void;
+    getElementIndex(elementId: string): number;
 }
 export default Scene;

package/types/scene/comparisons.d.ts

@@ -1,11 +1,10 @@
-import { ExcalidrawElement, ExcalidrawTextContainer, NonDeletedExcalidrawElement } from "../element/types";
+import { NonDeletedExcalidrawElement } from "../element/types";
 export declare const hasBackground: (type: string) => boolean;
 export declare const hasStrokeColor: (type: string) => boolean;
 export declare const hasStrokeWidth: (type: string) => boolean;
 export declare const hasStrokeStyle: (type: string) => boolean;
-export declare const canChangeSharpness: (type: string) => boolean;
+export declare const canChangeRoundness: (type: string) => boolean;
 export declare const hasText: (type: string) => boolean;
 export declare const canHaveArrowheads: (type: string) => boolean;
 export declare const getElementAtPosition: (elements: readonly NonDeletedExcalidrawElement[], isAtPositionFn: (element: NonDeletedExcalidrawElement) => boolean) => NonDeletedExcalidrawElement | null;
 export declare const getElementsAtPosition: (elements: readonly NonDeletedExcalidrawElement[], isAtPositionFn: (element: NonDeletedExcalidrawElement) => boolean) => NonDeletedExcalidrawElement[];
-export declare const getTextBindableContainerAtPosition: (elements: readonly ExcalidrawElement[], x: number, y: number) => ExcalidrawTextContainer | null;

package/types/scene/index.d.ts

@@ -1,5 +1,5 @@
 export { isOverScrollBars } from "./scrollbars";
 export { isSomeElementSelected, getElementsWithinSelection, getCommonAttributeOfSelectedElements, getSelectedElements, getTargetElements, } from "./selection";
 export { calculateScrollCenter } from "./scroll";
-export { hasBackground, hasStrokeWidth, hasStrokeStyle, canHaveArrowheads, canChangeSharpness, getElementAtPosition, getTextBindableContainerAtPosition, hasText, getElementsAtPosition, } from "./comparisons";
+export { hasBackground, hasStrokeWidth, hasStrokeStyle, canHaveArrowheads, canChangeRoundness, getElementAtPosition, hasText, getElementsAtPosition, } from "./comparisons";
 export { getNormalizedZoom } from "./zoom";

package/types/scene/types.d.ts

@@ -33,6 +33,7 @@ export declare type RenderConfig = {
     /** when exporting the behavior is slightly different (e.g. we can't use
       CSS filters), and we disable render optimizations for best output */
     isExporting: boolean;
+    selectionColor?: string;
 };
 export declare type SceneScroll = {
     scrollX: number;

package/types/shapes.d.ts

@@ -2,37 +2,61 @@ export declare const SHAPES: readonly [{
     readonly icon: JSX.Element;
     readonly value: "selection";
     readonly key: "v";
+    readonly numericKey: "1";
+    readonly fillable: true;
 }, {
     readonly icon: JSX.Element;
     readonly value: "rectangle";
     readonly key: "r";
+    readonly numericKey: "2";
+    readonly fillable: true;
 }, {
     readonly icon: JSX.Element;
     readonly value: "diamond";
     readonly key: "d";
+    readonly numericKey: "3";
+    readonly fillable: true;
 }, {
     readonly icon: JSX.Element;
     readonly value: "ellipse";
     readonly key: "o";
+    readonly numericKey: "4";
+    readonly fillable: true;
 }, {
     readonly icon: JSX.Element;
     readonly value: "arrow";
     readonly key: "a";
+    readonly numericKey: "5";
+    readonly fillable: true;
 }, {
     readonly icon: JSX.Element;
     readonly value: "line";
-    readonly key: readonly ["p", "l"];
+    readonly key: "l";
+    readonly numericKey: "6";
+    readonly fillable: true;
 }, {
     readonly icon: JSX.Element;
     readonly value: "freedraw";
-    readonly key: readonly ["x", string];
+    readonly key: readonly ["p", "x"];
+    readonly numericKey: "7";
+    readonly fillable: false;
 }, {
     readonly icon: JSX.Element;
     readonly value: "text";
     readonly key: "t";
+    readonly numericKey: "8";
+    readonly fillable: false;
 }, {
     readonly icon: JSX.Element;
     readonly value: "image";
     readonly key: null;
+    readonly numericKey: "9";
+    readonly fillable: false;
+}, {
+    readonly icon: JSX.Element;
+    readonly value: "eraser";
+    readonly key: "e";
+    readonly numericKey: "0";
+    readonly fillable: false;
 }];
-export declare const findShapeByKey: (key: string) => "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | null;
+export declare const findShapeByKey: (key: string) => "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | null;