@excalidraw/excalidraw 0.15.2-6977c32 → 0.15.2-6abf194

package/types/element/embeddable.d.ts

@@ -0,0 +1,153 @@
+import { ExcalidrawProps } from "../types";
+import { ExcalidrawElement, ExcalidrawEmbeddableElement, NonDeletedExcalidrawElement, Theme } from "./types";
+type EmbeddedLink = ({
+    aspectRatio: {
+        w: number;
+        h: number;
+    };
+    warning?: string;
+} & ({
+    type: "video" | "generic";
+    link: string;
+} | {
+    type: "document";
+    srcdoc: (theme: Theme) => string;
+})) | null;
+export declare const getEmbedLink: (link: string | null | undefined) => EmbeddedLink;
+export declare const isEmbeddableOrFrameLabel: (element: NonDeletedExcalidrawElement) => Boolean;
+export declare const createPlaceholderEmbeddableLabel: (element: ExcalidrawEmbeddableElement) => ExcalidrawElement;
+export declare const actionSetEmbeddableAsActiveTool: {
+    name: "setEmbeddableAsActiveTool";
+    trackEvent: {
+        category: "toolbar";
+    };
+    perform: (elements: readonly ExcalidrawElement[], appState: Readonly<import("../types").AppState>, _: any, app: import("../types").AppClassProperties) => {
+        elements: readonly ExcalidrawElement[];
+        appState: {
+            activeTool: {
+                lastActiveTool: import("../types").LastActiveTool;
+                locked: boolean;
+            } & ({
+                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand";
+                customType: null;
+            } | {
+                type: "custom";
+                customType: string;
+            });
+            contextMenu: {
+                items: import("../components/ContextMenu").ContextMenuItems;
+                top: number;
+                left: number;
+            } | null;
+            showWelcomeScreen: boolean;
+            isLoading: boolean;
+            errorMessage: import("react").ReactNode;
+            activeEmbeddable: {
+                element: NonDeletedExcalidrawElement;
+                state: "active" | "hover";
+            } | null;
+            draggingElement: NonDeletedExcalidrawElement | null;
+            resizingElement: NonDeletedExcalidrawElement | null;
+            multiElement: import("./types").NonDeleted<import("./types").ExcalidrawLinearElement> | null;
+            selectionElement: NonDeletedExcalidrawElement | null;
+            isBindingEnabled: boolean;
+            startBoundElement: import("./types").NonDeleted<import("./types").ExcalidrawBindableElement> | null;
+            suggestedBindings: import("./binding").SuggestedBinding[];
+            frameToHighlight: import("./types").NonDeleted<import("./types").ExcalidrawFrameElement> | null;
+            frameRendering: {
+                enabled: boolean;
+                name: boolean;
+                outline: boolean;
+                clip: boolean;
+            };
+            editingFrame: string | null;
+            elementsToHighlight: import("./types").NonDeleted<ExcalidrawElement>[] | null;
+            editingElement: NonDeletedExcalidrawElement | null;
+            editingLinearElement: import("./linearElementEditor").LinearElementEditor | null;
+            penMode: boolean;
+            penDetected: boolean;
+            exportBackground: boolean;
+            exportEmbedScene: boolean;
+            exportWithDarkMode: boolean;
+            exportScale: number;
+            currentItemStrokeColor: string;
+            currentItemBackgroundColor: string;
+            currentItemFillStyle: import("./types").FillStyle;
+            currentItemStrokeWidth: number;
+            currentItemStrokeStyle: import("./types").StrokeStyle;
+            currentItemRoughness: number;
+            currentItemOpacity: number;
+            currentItemFontFamily: number;
+            currentItemFontSize: number;
+            currentItemTextAlign: string;
+            currentItemStartArrowhead: import("./types").Arrowhead | null;
+            currentItemEndArrowhead: import("./types").Arrowhead | null;
+            currentItemRoundness: import("./types").StrokeRoundness;
+            viewBackgroundColor: string;
+            scrollX: number;
+            scrollY: number;
+            cursorButton: "up" | "down";
+            scrolledOutside: boolean;
+            name: string;
+            isResizing: boolean;
+            isRotating: boolean;
+            zoom: Readonly<{
+                value: import("../types").NormalizedZoomValue;
+            }>;
+            openMenu: "canvas" | "shape" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
+            openSidebar: {
+                name: string;
+                tab?: string | undefined;
+            } | null;
+            openDialog: "imageExport" | "help" | "jsonExport" | null;
+            defaultSidebarDockedPreference: boolean;
+            lastPointerDownWith: import("./types").PointerType;
+            selectedElementIds: Readonly<{
+                [id: string]: true;
+            }>;
+            previousSelectedElementIds: {
+                [id: string]: true;
+            };
+            selectedElementsAreBeingDragged: boolean;
+            shouldCacheIgnoreZoom: boolean;
+            toast: {
+                message: string;
+                closable?: boolean | undefined;
+                duration?: number | undefined;
+            } | null;
+            zenModeEnabled: boolean;
+            theme: Theme;
+            gridSize: number | null;
+            viewModeEnabled: boolean;
+            selectedGroupIds: {
+                [groupId: string]: boolean;
+            };
+            editingGroupId: string | null;
+            width: number;
+            height: number;
+            offsetTop: number;
+            offsetLeft: number;
+            fileHandle: import("browser-fs-access").FileSystemHandle | null;
+            collaborators: Map<string, import("../types").Collaborator>;
+            showStats: boolean;
+            currentChartType: import("./types").ChartType;
+            pasteDialog: {
+                shown: false;
+                data: null;
+            } | {
+                shown: true;
+                data: import("../charts").Spreadsheet;
+            };
+            pendingImageElementId: string | null;
+            showHyperlinkPopup: false | "editor" | "info";
+            selectedLinearElement: import("./linearElementEditor").LinearElementEditor | null;
+        };
+        commitToHistory: false;
+    };
+} & {
+    keyTest?: undefined;
+};
+export declare const extractSrc: (htmlString: string) => string;
+export declare const embeddableURLValidator: (url: string | null | undefined, validateEmbeddable: ExcalidrawProps["validateEmbeddable"]) => boolean;
+export {};

package/types/element/index.d.ts

@@ -1,4 +1,4 @@
-import { ExcalidrawElement, NonDeletedExcalidrawElement, NonDeleted } from "./types";
+import { ExcalidrawElement, NonDeletedExcalidrawElement, NonDeleted, ExcalidrawFrameElement } from "./types";
 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";
@@ -6,7 +6,7 @@ export { hitTest, isHittingElementBoundingBoxWithoutHittingElement, } from "./co
 export { resizeTest, getCursorForResizingElement, getElementWithTransformHandleType, getTransformHandleTypeFromCoords, } from "./resizeTest";
 export { transformElements, getResizeOffsetXY, getResizeArrowDirection, } from "./resizeElements";
 export { dragSelectedElements, getDragOffsetXY, dragNewElement, } from "./dragElements";
-export { isTextElement, isExcalidrawElement } from "./typeChecks";
+export { isTextElement, isExcalidrawElement, isFrameElement, } from "./typeChecks";
 export { textWysiwyg } from "./textWysiwyg";
 export { redrawTextBoundingBox } from "./textElement";
 export { getPerfectElementSize, getLockedLinearCursorAlignSize, isInvisiblySmallElement, resizePerfectLineForNWHandler, getNormalizedDimensions, } from "./sizeHelpers";
@@ -14,6 +14,7 @@ export { showSelectedShapeActions } from "./showSelectedShapeActions";
 export declare const getSceneVersion: (elements: readonly ExcalidrawElement[]) => number;
 export declare const getVisibleElements: (elements: readonly ExcalidrawElement[]) => readonly NonDeletedExcalidrawElement[];
 export declare const getNonDeletedElements: (elements: readonly ExcalidrawElement[]) => readonly NonDeletedExcalidrawElement[];
+export declare const getNonDeletedFrames: (frames: readonly ExcalidrawFrameElement[]) => readonly NonDeleted<ExcalidrawFrameElement>[];
 export declare const isNonDeletedElement: <T extends ExcalidrawElement>(element: T) => element is NonDeleted<T>;
 export declare const clearElementsForDatabase: (elements: readonly ExcalidrawElement[]) => ExcalidrawElement[];
 export declare const clearElementsForExport: (elements: readonly ExcalidrawElement[]) => ExcalidrawElement[];

package/types/element/linearElementEditor.d.ts

@@ -1,6 +1,5 @@
-/// <reference types="react" />
 import { NonDeleted, ExcalidrawLinearElement, ExcalidrawElement, PointBinding, ExcalidrawBindableElement, ExcalidrawTextElementWithContainer } from "./types";
-import { Point, AppState, PointerCoords } from "../types";
+import { Point, AppState, PointerCoords, InteractiveCanvasAppState } from "../types";
 import History from "../history";
 import Scene from "../scene/Scene";
 declare const editorMidPointsCache: {
@@ -53,8 +52,8 @@ export declare class LinearElementEditor {
         y: number;
     }[]) => void, linearElementEditor: LinearElementEditor): boolean;
     static handlePointerUp(event: PointerEvent, editingLinearElement: LinearElementEditor, appState: AppState): LinearElementEditor;
-    static getEditorMidPoints: (element: NonDeleted<ExcalidrawLinearElement>, appState: AppState) => (typeof editorMidPointsCache)["points"];
-    static updateEditorMidPointsCache: (element: NonDeleted<ExcalidrawLinearElement>, appState: AppState) => void;
+    static getEditorMidPoints: (element: NonDeleted<ExcalidrawLinearElement>, appState: InteractiveCanvasAppState) => (typeof editorMidPointsCache)["points"];
+    static updateEditorMidPointsCache: (element: NonDeleted<ExcalidrawLinearElement>, appState: InteractiveCanvasAppState) => void;
     static getSegmentMidpointHitCoords: (linearElementEditor: LinearElementEditor, scenePointer: {
         x: number;
         y: number;
@@ -62,7 +61,7 @@ export declare class LinearElementEditor {
     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: {
+    static handlePointerDown(event: React.PointerEvent<HTMLElement>, appState: AppState, history: History, scenePointer: {
         x: number;
         y: number;
     }, linearElementEditor: LinearElementEditor): {
@@ -131,6 +130,10 @@ export declare class LinearElementEditor {
             showWelcomeScreen: boolean;
             isLoading: boolean;
             errorMessage: import("react").ReactNode;
+            activeEmbeddable: {
+                element: import("./types").NonDeletedExcalidrawElement;
+                state: "active" | "hover";
+            } | null;
             draggingElement: import("./types").NonDeletedExcalidrawElement | null;
             resizingElement: import("./types").NonDeletedExcalidrawElement | null;
             multiElement: NonDeleted<ExcalidrawLinearElement> | null;
@@ -138,12 +141,21 @@ export declare class LinearElementEditor {
             isBindingEnabled: boolean;
             startBoundElement: NonDeleted<ExcalidrawBindableElement> | null;
             suggestedBindings: import("./binding").SuggestedBinding[];
+            frameToHighlight: NonDeleted<import("./types").ExcalidrawFrameElement> | null;
+            frameRendering: {
+                enabled: boolean;
+                name: boolean;
+                outline: boolean;
+                clip: boolean;
+            };
+            editingFrame: string | null;
+            elementsToHighlight: NonDeleted<ExcalidrawElement>[] | null;
             editingElement: import("./types").NonDeletedExcalidrawElement | null;
             activeTool: {
                 lastActiveTool: import("../types").LastActiveTool;
                 locked: boolean;
             } & ({
-                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | "hand";
+                type: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "eraser" | "hand";
                 customType: null;
             } | {
                 type: "custom";
@@ -180,7 +192,7 @@ export declare class LinearElementEditor {
                 value: import("../types").NormalizedZoomValue;
             }>;
             openMenu: "canvas" | "shape" | null;
-            openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
             openSidebar: {
                 name: string;
                 tab?: string | undefined;
@@ -188,12 +200,13 @@ export declare class LinearElementEditor {
             openDialog: "imageExport" | "help" | "jsonExport" | null;
             defaultSidebarDockedPreference: boolean;
             lastPointerDownWith: import("./types").PointerType;
-            selectedElementIds: {
-                [id: string]: boolean;
-            };
+            selectedElementIds: Readonly<{
+                [id: string]: true;
+            }>;
             previousSelectedElementIds: {
-                [id: string]: boolean;
+                [id: string]: true;
             };
+            selectedElementsAreBeingDragged: boolean;
             shouldCacheIgnoreZoom: boolean;
             toast: {
                 message: string;
@@ -201,7 +214,7 @@ export declare class LinearElementEditor {
                 duration?: number | undefined;
             } | null;
             zenModeEnabled: boolean;
-            theme: string;
+            theme: import("./types").Theme;
             gridSize: number | null;
             viewModeEnabled: boolean;
             selectedGroupIds: {
@@ -224,7 +237,7 @@ export declare class LinearElementEditor {
                 data: import("../charts").Spreadsheet;
             };
             pendingImageElementId: string | null;
-            showHyperlinkPopup: false | "info" | "editor";
+            showHyperlinkPopup: false | "editor" | "info";
             selectedLinearElement: LinearElementEditor | null;
         };
     };

package/types/element/mutateElement.d.ts

@@ -1,6 +1,6 @@
 import { ExcalidrawElement } from "./types";
 import { Mutable } from "../utility-types";
-declare type ElementUpdate<TElement extends ExcalidrawElement> = Omit<Partial<TElement>, "id" | "version" | "versionNonce">;
+type ElementUpdate<TElement extends ExcalidrawElement> = Omit<Partial<TElement>, "id" | "version" | "versionNonce">;
 export declare const mutateElement: <TElement extends Mutable<ExcalidrawElement>>(element: TElement, updates: ElementUpdate<TElement>, informMutation?: boolean) => TElement;
 export declare const newElementWith: <TElement extends ExcalidrawElement>(element: TElement, updates: ElementUpdate<TElement>) => TElement;
 /**

package/types/element/newElement.d.ts

@@ -1,17 +1,22 @@
-import { ExcalidrawElement, ExcalidrawImageElement, ExcalidrawTextElement, ExcalidrawLinearElement, ExcalidrawGenericElement, NonDeleted, TextAlign, GroupId, VerticalAlign, Arrowhead, ExcalidrawFreeDrawElement, FontFamilyValues, ExcalidrawTextContainer } from "../element/types";
+import { ExcalidrawElement, ExcalidrawImageElement, ExcalidrawTextElement, ExcalidrawLinearElement, ExcalidrawGenericElement, NonDeleted, TextAlign, GroupId, VerticalAlign, Arrowhead, ExcalidrawFreeDrawElement, FontFamilyValues, ExcalidrawTextContainer, ExcalidrawFrameElement, ExcalidrawEmbeddableElement } from "../element/types";
 import { AppState } from "../types";
 import { MarkOptional, Mutable } from "../utility-types";
-declare type ElementConstructorOpts = MarkOptional<Omit<ExcalidrawGenericElement, "id" | "type" | "isDeleted" | "updated">, "width" | "height" | "angle" | "groupIds" | "boundElements" | "seed" | "version" | "versionNonce" | "link" | "strokeStyle" | "fillStyle" | "strokeColor" | "backgroundColor" | "roughness" | "strokeWidth" | "roundness" | "locked" | "opacity">;
+export type ElementConstructorOpts = MarkOptional<Omit<ExcalidrawGenericElement, "id" | "type" | "isDeleted" | "updated">, "width" | "height" | "angle" | "groupIds" | "frameId" | "boundElements" | "seed" | "version" | "versionNonce" | "link" | "strokeStyle" | "fillStyle" | "strokeColor" | "backgroundColor" | "roughness" | "strokeWidth" | "roundness" | "locked" | "opacity">;
 export declare const newElement: (opts: {
     type: ExcalidrawGenericElement["type"];
 } & ElementConstructorOpts) => NonDeleted<ExcalidrawGenericElement>;
+export declare const newEmbeddableElement: (opts: {
+    type: "embeddable";
+    validated: ExcalidrawEmbeddableElement["validated"];
+} & ElementConstructorOpts) => NonDeleted<ExcalidrawEmbeddableElement>;
+export declare const newFrameElement: (opts: ElementConstructorOpts) => NonDeleted<ExcalidrawFrameElement>;
 export declare const newTextElement: (opts: {
     text: string;
     fontSize?: number;
     fontFamily?: FontFamilyValues;
     textAlign?: TextAlign;
     verticalAlign?: VerticalAlign;
-    containerId?: ExcalidrawTextContainer["id"];
+    containerId?: ExcalidrawTextContainer["id"] | null;
     lineHeight?: ExcalidrawTextElement["lineHeight"];
     strokeWidth?: ExcalidrawTextElement["strokeWidth"];
 } & ElementConstructorOpts) => NonDeleted<ExcalidrawTextElement>;
@@ -35,8 +40,8 @@ export declare const newFreeDrawElement: (opts: {
 } & ElementConstructorOpts) => NonDeleted<ExcalidrawFreeDrawElement>;
 export declare const newLinearElement: (opts: {
     type: ExcalidrawLinearElement["type"];
-    startArrowhead: Arrowhead | null;
-    endArrowhead: Arrowhead | null;
+    startArrowhead?: Arrowhead | null;
+    endArrowhead?: Arrowhead | null;
     points?: ExcalidrawLinearElement["points"];
 } & ElementConstructorOpts) => NonDeleted<ExcalidrawLinearElement>;
 export declare const newImageElement: (opts: {
@@ -55,6 +60,11 @@ export declare const newImageElement: (opts: {
  * Typed arrays and other non-null objects.
  */
 export declare const deepCopyElement: <T extends ExcalidrawElement>(val: T) => Mutable<T>;
+/**
+ * utility wrapper to generate new id. In test env it reuses the old + postfix
+ * for test assertions.
+ */
+export declare const regenerateId: (previousId: string | null) => string;
 /**
  * Duplicate an element, often used in the alt-drag operation.
  * Note that this method has gotten a bit complicated since the
@@ -84,4 +94,3 @@ export declare const duplicateElements: (elements: readonly ExcalidrawElement[],
     /** NOTE also updates version flags and `updated` */
     randomizeSeed: boolean;
 }) => ExcalidrawElement[];
-export {};

package/types/element/resizeElements.d.ts

@@ -4,5 +4,6 @@ import { PointerDownState } from "../types";
 export declare const normalizeAngle: (angle: number) => number;
 export declare const transformElements: (pointerDownState: PointerDownState, transformHandleType: MaybeTransformHandleType, selectedElements: readonly NonDeletedExcalidrawElement[], resizeArrowDirection: "origin" | "end", shouldRotateWithDiscreteAngle: boolean, shouldResizeFromCenter: boolean, shouldMaintainAspectRatio: boolean, pointerX: number, pointerY: number, centerX: number, centerY: number) => boolean;
 export declare const resizeSingleElement: (originalElements: PointerDownState["originalElements"], shouldMaintainAspectRatio: boolean, element: NonDeletedExcalidrawElement, transformHandleDirection: TransformHandleDirection, shouldResizeFromCenter: boolean, pointerX: number, pointerY: number) => void;
+export declare const resizeMultipleElements: (pointerDownState: PointerDownState, selectedElements: readonly NonDeletedExcalidrawElement[], transformHandleType: "nw" | "ne" | "sw" | "se", shouldResizeFromCenter: boolean, pointerX: number, pointerY: number) => void;
 export declare const getResizeOffsetXY: (transformHandleType: MaybeTransformHandleType, selectedElements: NonDeletedExcalidrawElement[], x: number, y: number) => [number, number];
 export declare const getResizeArrowDirection: (transformHandleType: MaybeTransformHandleType, element: NonDeleted<ExcalidrawLinearElement>) => "origin" | "end";

package/types/element/sizeHelpers.d.ts

@@ -1,6 +1,13 @@
 import { ExcalidrawElement } from "./types";
-import { AppState } from "../types";
+import { AppState, Zoom } from "../types";
 export declare const isInvisiblySmallElement: (element: ExcalidrawElement) => boolean;
+export declare const isElementInViewport: (element: ExcalidrawElement, width: number, height: number, viewTransformations: {
+    zoom: Zoom;
+    offsetLeft: number;
+    offsetTop: number;
+    scrollX: number;
+    scrollY: number;
+}) => boolean;
 /**
  * Makes a perfect shape or diagonal/horizontal/vertical line
  */

package/types/element/textElement.d.ts

@@ -6,7 +6,7 @@ export declare const normalizeText: (text: string) => string;
 export declare const splitIntoLines: (text: string) => string[];
 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: (container: NonDeletedExcalidrawElement, transformHandleType: MaybeTransformHandleType) => void;
+export declare const handleBindTextResize: (container: NonDeletedExcalidrawElement, transformHandleType: MaybeTransformHandleType, shouldMaintainAspectRatio?: boolean) => void;
 export declare const computeBoundTextPosition: (container: ExcalidrawElement, boundTextElement: ExcalidrawTextElementWithContainer) => {
     x: number;
     y: number;
@@ -47,10 +47,6 @@ 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;
-};
 export declare const getContainerCenter: (container: ExcalidrawElement, appState: AppState) => {
     x: number;
     y: number;
@@ -69,9 +65,11 @@ export declare const shouldAllowVerticalAlign: (selectedElements: NonDeletedExca
 export declare const suppportsHorizontalAlign: (selectedElements: NonDeletedExcalidrawElement[]) => boolean;
 export declare const getTextBindableContainerAtPosition: (elements: readonly ExcalidrawElement[], appState: AppState, x: number, y: number) => ExcalidrawTextContainer | null;
 declare const VALID_CONTAINER_TYPES: Set<string>;
-export declare const isValidTextContainer: (element: ExcalidrawElement) => boolean;
+export declare const isValidTextContainer: (element: {
+    type: ExcalidrawElement["type"];
+}) => boolean;
 export declare const computeContainerDimensionForBoundText: (dimension: number, containerType: ExtractSetType<typeof VALID_CONTAINER_TYPES>) => number;
-export declare const getBoundTextMaxWidth: (container: ExcalidrawElement) => number;
+export declare const getBoundTextMaxWidth: (container: ExcalidrawElement, boundTextElement?: ExcalidrawTextElement | null) => number;
 export declare const getBoundTextMaxHeight: (container: ExcalidrawElement, boundTextElement: ExcalidrawTextElementWithContainer) => number;
 export declare const isMeasureTextSupported: () => boolean;
 export declare const getDefaultLineHeight: (fontFamily: FontFamilyValues) => number & {

package/types/element/textWysiwyg.d.ts

@@ -15,7 +15,7 @@ export declare const textWysiwyg: ({ id, onChange, onSubmit, getViewportCoords,
     }) => void;
     getViewportCoords: (x: number, y: number) => [number, number];
     element: ExcalidrawTextElement;
-    canvas: HTMLCanvasElement | null;
+    canvas: HTMLCanvasElement;
     excalidrawContainer: HTMLDivElement | null;
     app: App;
 }) => void;

package/types/element/transformHandles.d.ts

@@ -1,23 +1,30 @@
 import { ExcalidrawElement, NonDeletedExcalidrawElement, PointerType } 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];
-export declare type TransformHandles = Partial<{
+import { InteractiveCanvasAppState, Zoom } from "../types";
+export type TransformHandleDirection = "n" | "s" | "w" | "e" | "nw" | "ne" | "sw" | "se";
+export type TransformHandleType = TransformHandleDirection | "rotation";
+export type TransformHandle = [number, number, number, number];
+export type TransformHandles = Partial<{
     [T in TransformHandleType]: TransformHandle;
 }>;
-export declare type MaybeTransformHandleType = TransformHandleType | false;
+export type MaybeTransformHandleType = TransformHandleType | false;
 export declare const OMIT_SIDES_FOR_MULTIPLE_ELEMENTS: {
     e: boolean;
     s: boolean;
     n: boolean;
     w: boolean;
 };
+export declare const OMIT_SIDES_FOR_FRAME: {
+    e: boolean;
+    s: boolean;
+    n: boolean;
+    w: boolean;
+    rotation: boolean;
+};
 export declare const getTransformHandlesFromCoords: ([x1, y1, x2, y2, cx, cy]: [number, number, number, number, number, number], angle: number, zoom: Zoom, pointerType: PointerType, omitSides?: {
     s?: boolean | undefined;
     e?: boolean | undefined;
-    n?: boolean | undefined;
     w?: boolean | undefined;
+    n?: boolean | undefined;
     nw?: boolean | undefined;
     ne?: boolean | undefined;
     sw?: boolean | undefined;
@@ -25,4 +32,4 @@ export declare const getTransformHandlesFromCoords: ([x1, y1, x2, y2, cx, cy]: [
     rotation?: boolean | undefined;
 }, margin?: number) => TransformHandles;
 export declare const getTransformHandles: (element: ExcalidrawElement, zoom: Zoom, pointerType?: PointerType) => TransformHandles;
-export declare const shouldShowBoundingBox: (elements: NonDeletedExcalidrawElement[], appState: AppState) => boolean;
+export declare const shouldShowBoundingBox: (elements: readonly NonDeletedExcalidrawElement[], appState: InteractiveCanvasAppState) => boolean;

package/types/element/typeChecks.d.ts

@@ -1,10 +1,12 @@
 import { AppState } from "../types";
 import { MarkNonNullable } from "../utility-types";
-import { ExcalidrawElement, ExcalidrawTextElement, ExcalidrawLinearElement, ExcalidrawBindableElement, ExcalidrawGenericElement, ExcalidrawFreeDrawElement, InitializedExcalidrawImageElement, ExcalidrawImageElement, ExcalidrawTextElementWithContainer, ExcalidrawTextContainer, RoundnessType } from "./types";
+import { ExcalidrawElement, ExcalidrawTextElement, ExcalidrawEmbeddableElement, ExcalidrawLinearElement, ExcalidrawBindableElement, ExcalidrawGenericElement, ExcalidrawFreeDrawElement, InitializedExcalidrawImageElement, ExcalidrawImageElement, ExcalidrawTextElementWithContainer, ExcalidrawTextContainer, ExcalidrawFrameElement, RoundnessType } from "./types";
 export declare const isGenericElement: (element: ExcalidrawElement | null) => element is ExcalidrawGenericElement;
 export declare const isInitializedImageElement: (element: ExcalidrawElement | null) => element is InitializedExcalidrawImageElement;
 export declare const isImageElement: (element: ExcalidrawElement | null) => element is ExcalidrawImageElement;
+export declare const isEmbeddableElement: (element: ExcalidrawElement | null | undefined) => element is ExcalidrawEmbeddableElement;
 export declare const isTextElement: (element: ExcalidrawElement | null) => element is ExcalidrawTextElement;
+export declare const isFrameElement: (element: ExcalidrawElement | null) => element is ExcalidrawFrameElement;
 export declare const isFreeDrawElement: (element?: ExcalidrawElement | null) => element is ExcalidrawFreeDrawElement;
 export declare const isFreeDrawElementType: (elementType: ExcalidrawElement["type"]) => boolean;
 export declare const isLinearElement: (element?: ExcalidrawElement | null) => element is ExcalidrawLinearElement;

package/types/element/types.d.ts

@@ -1,23 +1,23 @@
 import { Point } from "../types";
 import { FONT_FAMILY, ROUNDNESS, TEXT_ALIGN, THEME, VERTICAL_ALIGN } from "../constants";
 import { MarkNonNullable, ValueOf } from "../utility-types";
-export declare type ChartType = "bar" | "line";
-export declare type FillStyle = "hachure" | "cross-hatch" | "solid" | "zigzag";
-export declare type FontFamilyKeys = keyof typeof FONT_FAMILY;
-export declare type FontFamilyValues = typeof FONT_FAMILY[FontFamilyKeys];
-export declare type Theme = typeof THEME[keyof typeof THEME];
-export declare type FontString = string & {
+export type ChartType = "bar" | "line";
+export type FillStyle = "hachure" | "cross-hatch" | "solid" | "zigzag";
+export type FontFamilyKeys = keyof typeof FONT_FAMILY;
+export type FontFamilyValues = typeof FONT_FAMILY[FontFamilyKeys];
+export type Theme = typeof THEME[keyof typeof THEME];
+export type FontString = string & {
     _brand: "fontString";
 };
-export declare type GroupId = string;
-export declare type PointerType = "mouse" | "pen" | "touch";
-export declare type StrokeRoundness = "round" | "sharp";
-export declare type RoundnessType = ValueOf<typeof ROUNDNESS>;
-export declare type StrokeStyle = "solid" | "dashed" | "dotted";
-export declare type TextAlign = typeof TEXT_ALIGN[keyof typeof TEXT_ALIGN];
-declare type VerticalAlignKeys = keyof typeof VERTICAL_ALIGN;
-export declare type VerticalAlign = typeof VERTICAL_ALIGN[VerticalAlignKeys];
-declare type _ExcalidrawElementBase = Readonly<{
+export type GroupId = string;
+export type PointerType = "mouse" | "pen" | "touch";
+export type StrokeRoundness = "round" | "sharp";
+export type RoundnessType = ValueOf<typeof ROUNDNESS>;
+export type StrokeStyle = "solid" | "dashed" | "dotted";
+export type TextAlign = typeof TEXT_ALIGN[keyof typeof TEXT_ALIGN];
+type VerticalAlignKeys = keyof typeof VERTICAL_ALIGN;
+export type VerticalAlign = typeof VERTICAL_ALIGN[VerticalAlignKeys];
+type _ExcalidrawElementBase = Readonly<{
     id: string;
     x: number;
     y: number;
@@ -49,6 +49,7 @@ declare type _ExcalidrawElementBase = Readonly<{
     /** List of groups the element belongs to.
         Ordered from deepest to shallowest. */
     groupIds: readonly GroupId[];
+    frameId: string | null;
     /** other elements that are bound to this element */
     boundElements: readonly Readonly<{
         id: ExcalidrawLinearElement["id"];
@@ -60,19 +61,30 @@ declare type _ExcalidrawElementBase = Readonly<{
     locked: boolean;
     customData?: Record<string, any>;
 }>;
-export declare type ExcalidrawSelectionElement = _ExcalidrawElementBase & {
+export type ExcalidrawSelectionElement = _ExcalidrawElementBase & {
     type: "selection";
 };
-export declare type ExcalidrawRectangleElement = _ExcalidrawElementBase & {
+export type ExcalidrawRectangleElement = _ExcalidrawElementBase & {
     type: "rectangle";
 };
-export declare type ExcalidrawDiamondElement = _ExcalidrawElementBase & {
+export type ExcalidrawDiamondElement = _ExcalidrawElementBase & {
     type: "diamond";
 };
-export declare type ExcalidrawEllipseElement = _ExcalidrawElementBase & {
+export type ExcalidrawEllipseElement = _ExcalidrawElementBase & {
     type: "ellipse";
 };
-export declare type ExcalidrawImageElement = _ExcalidrawElementBase & Readonly<{
+export type ExcalidrawEmbeddableElement = _ExcalidrawElementBase & Readonly<{
+    type: "embeddable";
+    /**
+     * indicates whether the embeddable src (url) has been validated for rendering.
+     * null value indicates that the validation is pending. We reset the
+     * value on each restore (or url change) so that we can guarantee
+     * the validation came from a trusted source (the editor). Also because we
+     * may not have access to host-app supplied url validator during restore.
+     */
+    validated: boolean | null;
+}>;
+export type ExcalidrawImageElement = _ExcalidrawElementBase & Readonly<{
     type: "image";
     fileId: FileId | null;
     /** whether respective file is persisted */
@@ -80,22 +92,26 @@ export declare type ExcalidrawImageElement = _ExcalidrawElementBase & Readonly<{
     /** X and Y scale factors <-1, 1>, used for image axis flipping */
     scale: [number, number];
 }>;
-export declare type InitializedExcalidrawImageElement = MarkNonNullable<ExcalidrawImageElement, "fileId">;
+export type InitializedExcalidrawImageElement = MarkNonNullable<ExcalidrawImageElement, "fileId">;
+export type ExcalidrawFrameElement = _ExcalidrawElementBase & {
+    type: "frame";
+    name: string | null;
+};
 /**
  * These are elements that don't have any additional properties.
  */
-export declare type ExcalidrawGenericElement = ExcalidrawSelectionElement | ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement;
+export type ExcalidrawGenericElement = ExcalidrawSelectionElement | ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement;
 /**
  * ExcalidrawElement should be JSON serializable and (eventually) contain
  * no computed data. The list of all ExcalidrawElements should be shareable
  * between peers and contain no state local to the peer.
  */
-export declare type ExcalidrawElement = ExcalidrawGenericElement | ExcalidrawTextElement | ExcalidrawLinearElement | ExcalidrawFreeDrawElement | ExcalidrawImageElement;
-export declare type NonDeleted<TElement extends ExcalidrawElement> = TElement & {
+export type ExcalidrawElement = ExcalidrawGenericElement | ExcalidrawTextElement | ExcalidrawLinearElement | ExcalidrawFreeDrawElement | ExcalidrawImageElement | ExcalidrawFrameElement | ExcalidrawEmbeddableElement;
+export type NonDeleted<TElement extends ExcalidrawElement> = TElement & {
     isDeleted: boolean;
 };
-export declare type NonDeletedExcalidrawElement = NonDeleted<ExcalidrawElement>;
-export declare type ExcalidrawTextElement = _ExcalidrawElementBase & Readonly<{
+export type NonDeletedExcalidrawElement = NonDeleted<ExcalidrawElement>;
+export type ExcalidrawTextElement = _ExcalidrawElementBase & Readonly<{
     type: "text";
     fontSize: number;
     fontFamily: FontFamilyValues;
@@ -113,18 +129,18 @@ export declare type ExcalidrawTextElement = _ExcalidrawElementBase & Readonly<{
         _brand: "unitlessLineHeight";
     };
 }>;
-export declare type ExcalidrawBindableElement = ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement | ExcalidrawTextElement | ExcalidrawImageElement;
-export declare type ExcalidrawTextContainer = ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement | ExcalidrawImageElement | ExcalidrawArrowElement;
-export declare type ExcalidrawTextElementWithContainer = {
+export type ExcalidrawBindableElement = ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement | ExcalidrawTextElement | ExcalidrawImageElement | ExcalidrawEmbeddableElement | ExcalidrawFrameElement;
+export type ExcalidrawTextContainer = ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement | ExcalidrawArrowElement;
+export type ExcalidrawTextElementWithContainer = {
     containerId: ExcalidrawTextContainer["id"];
 } & ExcalidrawTextElement;
-export declare type PointBinding = {
+export type PointBinding = {
     elementId: ExcalidrawBindableElement["id"];
     focus: number;
     gap: number;
 };
-export declare type Arrowhead = "arrow" | "bar" | "dot" | "triangle";
-export declare type ExcalidrawLinearElement = _ExcalidrawElementBase & Readonly<{
+export type Arrowhead = "arrow" | "bar" | "dot" | "triangle";
+export type ExcalidrawLinearElement = _ExcalidrawElementBase & Readonly<{
     type: "line" | "arrow";
     points: readonly Point[];
     lastCommittedPoint: Point | null;
@@ -133,17 +149,17 @@ export declare type ExcalidrawLinearElement = _ExcalidrawElementBase & Readonly<
     startArrowhead: Arrowhead | null;
     endArrowhead: Arrowhead | null;
 }>;
-export declare type ExcalidrawArrowElement = ExcalidrawLinearElement & Readonly<{
+export type ExcalidrawArrowElement = ExcalidrawLinearElement & Readonly<{
     type: "arrow";
 }>;
-export declare type ExcalidrawFreeDrawElement = _ExcalidrawElementBase & Readonly<{
+export type ExcalidrawFreeDrawElement = _ExcalidrawElementBase & Readonly<{
     type: "freedraw";
     points: readonly Point[];
     pressures: readonly number[];
     simulatePressure: boolean;
     lastCommittedPoint: Point | null;
 }>;
-export declare type FileId = string & {
+export type FileId = string & {
     _brand: "FileId";
 };
 export {};