@excalidraw/excalidraw 0.17.0-a528769 → 0.17.0-dd220bc

package/types/element/types.d.ts

@@ -1,6 +1,7 @@
 import { Point } from "../types";
 import { FONT_FAMILY, ROUNDNESS, TEXT_ALIGN, THEME, VERTICAL_ALIGN } from "../constants";
 import { MarkNonNullable, ValueOf } from "../utility-types";
+import { MagicCacheData } from "../data/magic";
 export type ChartType = "bar" | "line";
 export type FillStyle = "hachure" | "cross-hatch" | "solid" | "zigzag";
 export type FontFamilyKeys = keyof typeof FONT_FAMILY;
@@ -84,6 +85,26 @@ export type ExcalidrawEmbeddableElement = _ExcalidrawElementBase & Readonly<{
      */
     validated: boolean | null;
 }>;
+export type ExcalidrawIframeElement = _ExcalidrawElementBase & Readonly<{
+    type: "iframe";
+    customData?: {
+        generationData?: MagicCacheData;
+    };
+}>;
+export type ExcalidrawIframeLikeElement = ExcalidrawIframeElement | ExcalidrawEmbeddableElement;
+export type IframeData = ({
+    intrinsicSize: {
+        w: number;
+        h: number;
+    };
+    warning?: string;
+} & ({
+    type: "video" | "generic";
+    link: string;
+} | {
+    type: "document";
+    srcdoc: (theme: Theme) => string;
+}));
 export type ExcalidrawImageElement = _ExcalidrawElementBase & Readonly<{
     type: "image";
     fileId: FileId | null;
@@ -97,6 +118,11 @@ export type ExcalidrawFrameElement = _ExcalidrawElementBase & {
     type: "frame";
     name: string | null;
 };
+export type ExcalidrawMagicFrameElement = _ExcalidrawElementBase & {
+    type: "magicframe";
+    name: string | null;
+};
+export type ExcalidrawFrameLikeElement = ExcalidrawFrameElement | ExcalidrawMagicFrameElement;
 /**
  * These are elements that don't have any additional properties.
  */
@@ -106,7 +132,7 @@ export type ExcalidrawGenericElement = ExcalidrawSelectionElement | ExcalidrawRe
  * no computed data. The list of all ExcalidrawElements should be shareable
  * between peers and contain no state local to the peer.
  */
-export type ExcalidrawElement = ExcalidrawGenericElement | ExcalidrawTextElement | ExcalidrawLinearElement | ExcalidrawFreeDrawElement | ExcalidrawImageElement | ExcalidrawFrameElement | ExcalidrawEmbeddableElement;
+export type ExcalidrawElement = ExcalidrawGenericElement | ExcalidrawTextElement | ExcalidrawLinearElement | ExcalidrawFreeDrawElement | ExcalidrawImageElement | ExcalidrawFrameElement | ExcalidrawMagicFrameElement | ExcalidrawIframeElement | ExcalidrawEmbeddableElement;
 export type NonDeleted<TElement extends ExcalidrawElement> = TElement & {
     isDeleted: boolean;
 };
@@ -129,7 +155,7 @@ export type ExcalidrawTextElement = _ExcalidrawElementBase & Readonly<{
         _brand: "unitlessLineHeight";
     };
 }>;
-export type ExcalidrawBindableElement = ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement | ExcalidrawTextElement | ExcalidrawImageElement | ExcalidrawEmbeddableElement | ExcalidrawFrameElement;
+export type ExcalidrawBindableElement = ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement | ExcalidrawTextElement | ExcalidrawImageElement | ExcalidrawIframeElement | ExcalidrawEmbeddableElement | ExcalidrawFrameElement | ExcalidrawMagicFrameElement;
 export type ExcalidrawTextContainer = ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement | ExcalidrawArrowElement;
 export type ExcalidrawTextElementWithContainer = {
     containerId: ExcalidrawTextContainer["id"];
@@ -162,4 +188,5 @@ export type ExcalidrawFreeDrawElement = _ExcalidrawElementBase & Readonly<{
 export type FileId = string & {
     _brand: "FileId";
 };
+export type ExcalidrawElementType = ExcalidrawElement["type"];
 export {};

package/types/frame.d.ts

@@ -1,25 +1,25 @@
-import { ExcalidrawElement, ExcalidrawFrameElement, NonDeleted, NonDeletedExcalidrawElement } from "./element/types";
+import { ExcalidrawElement, ExcalidrawFrameLikeElement, NonDeleted, NonDeletedExcalidrawElement } from "./element/types";
 import { AppClassProperties, AppState, StaticCanvasAppState } from "./types";
 import { ExcalidrawElementsIncludingDeleted } from "./scene/Scene";
 export declare const bindElementsToFramesAfterDuplication: (nextElements: ExcalidrawElement[], oldElements: readonly ExcalidrawElement[], oldIdToDuplicatedId: Map<ExcalidrawElement["id"], ExcalidrawElement["id"]>) => void;
-export declare function isElementIntersectingFrame(element: ExcalidrawElement, frame: ExcalidrawFrameElement): boolean;
-export declare const getElementsCompletelyInFrame: (elements: readonly ExcalidrawElement[], frame: ExcalidrawFrameElement) => ExcalidrawElement[];
-export declare const isElementContainingFrame: (elements: readonly ExcalidrawElement[], element: ExcalidrawElement, frame: ExcalidrawFrameElement) => boolean;
-export declare const getElementsIntersectingFrame: (elements: readonly ExcalidrawElement[], frame: ExcalidrawFrameElement) => ExcalidrawElement[];
-export declare const elementsAreInFrameBounds: (elements: readonly ExcalidrawElement[], frame: ExcalidrawFrameElement) => boolean;
-export declare const elementOverlapsWithFrame: (element: ExcalidrawElement, frame: ExcalidrawFrameElement) => boolean;
+export declare function isElementIntersectingFrame(element: ExcalidrawElement, frame: ExcalidrawFrameLikeElement): boolean;
+export declare const getElementsCompletelyInFrame: (elements: readonly ExcalidrawElement[], frame: ExcalidrawFrameLikeElement) => ExcalidrawElement[];
+export declare const isElementContainingFrame: (elements: readonly ExcalidrawElement[], element: ExcalidrawElement, frame: ExcalidrawFrameLikeElement) => boolean;
+export declare const getElementsIntersectingFrame: (elements: readonly ExcalidrawElement[], frame: ExcalidrawFrameLikeElement) => ExcalidrawElement[];
+export declare const elementsAreInFrameBounds: (elements: readonly ExcalidrawElement[], frame: ExcalidrawFrameLikeElement) => boolean;
+export declare const elementOverlapsWithFrame: (element: ExcalidrawElement, frame: ExcalidrawFrameLikeElement) => boolean;
 export declare const isCursorInFrame: (cursorCoords: {
     x: number;
     y: number;
-}, frame: NonDeleted<ExcalidrawFrameElement>) => boolean;
-export declare const groupsAreAtLeastIntersectingTheFrame: (elements: readonly NonDeletedExcalidrawElement[], groupIds: readonly string[], frame: ExcalidrawFrameElement) => boolean;
-export declare const groupsAreCompletelyOutOfFrame: (elements: readonly NonDeletedExcalidrawElement[], groupIds: readonly string[], frame: ExcalidrawFrameElement) => boolean;
+}, frame: NonDeleted<ExcalidrawFrameLikeElement>) => boolean;
+export declare const groupsAreAtLeastIntersectingTheFrame: (elements: readonly NonDeletedExcalidrawElement[], groupIds: readonly string[], frame: ExcalidrawFrameLikeElement) => boolean;
+export declare const groupsAreCompletelyOutOfFrame: (elements: readonly NonDeletedExcalidrawElement[], groupIds: readonly string[], frame: ExcalidrawFrameLikeElement) => boolean;
 /**
  * Returns a map of frameId to frame elements. Includes empty frames.
  */
-export declare const groupByFrames: (elements: readonly ExcalidrawElement[]) => Map<string, ExcalidrawElement[]>;
+export declare const groupByFrameLikes: (elements: readonly ExcalidrawElement[]) => Map<string, ExcalidrawElement[]>;
 export declare const getFrameChildren: (allElements: ExcalidrawElementsIncludingDeleted, frameId: string) => ExcalidrawElement[];
-export declare const getFrameElements: (allElements: ExcalidrawElementsIncludingDeleted) => ExcalidrawFrameElement[];
+export declare const getFrameLikeElements: (allElements: ExcalidrawElementsIncludingDeleted) => ExcalidrawFrameLikeElement[];
 /**
  * Returns ExcalidrawFrameElements and non-frame-children elements.
  *
@@ -29,28 +29,29 @@ export declare const getFrameElements: (allElements: ExcalidrawElementsIncluding
  * Considers non-frame bound elements (container or arrow labels) as root.
  */
 export declare const getRootElements: (allElements: ExcalidrawElementsIncludingDeleted) => ExcalidrawElement[];
-export declare const getElementsInResizingFrame: (allElements: ExcalidrawElementsIncludingDeleted, frame: ExcalidrawFrameElement, appState: AppState) => ExcalidrawElement[];
-export declare const getElementsInNewFrame: (allElements: ExcalidrawElementsIncludingDeleted, frame: ExcalidrawFrameElement) => ExcalidrawElement[];
-export declare const getContainingFrame: (element: ExcalidrawElement, elementsMap?: Map<string, ExcalidrawElement>) => ExcalidrawFrameElement | null;
+export declare const getElementsInResizingFrame: (allElements: ExcalidrawElementsIncludingDeleted, frame: ExcalidrawFrameLikeElement, appState: AppState) => ExcalidrawElement[];
+export declare const getElementsInNewFrame: (allElements: ExcalidrawElementsIncludingDeleted, frame: ExcalidrawFrameLikeElement) => ExcalidrawElement[];
+export declare const getContainingFrame: (element: ExcalidrawElement, elementsMap?: Map<string, ExcalidrawElement>) => ExcalidrawFrameLikeElement | null;
 /**
  * Retains (or repairs for target frame) the ordering invriant where children
  * elements come right before the parent frame:
  * [el, el, child, child, frame, el]
  */
-export declare const addElementsToFrame: (allElements: ExcalidrawElementsIncludingDeleted, elementsToAdd: NonDeletedExcalidrawElement[], frame: ExcalidrawFrameElement) => ExcalidrawElement[];
+export declare const addElementsToFrame: (allElements: ExcalidrawElementsIncludingDeleted, elementsToAdd: NonDeletedExcalidrawElement[], frame: ExcalidrawFrameLikeElement) => ExcalidrawElement[];
 export declare const removeElementsFromFrame: (allElements: ExcalidrawElementsIncludingDeleted, elementsToRemove: NonDeletedExcalidrawElement[], appState: AppState) => ExcalidrawElement[];
-export declare const removeAllElementsFromFrame: (allElements: ExcalidrawElementsIncludingDeleted, frame: ExcalidrawFrameElement, appState: AppState) => ExcalidrawElement[];
-export declare const replaceAllElementsInFrame: (allElements: ExcalidrawElementsIncludingDeleted, nextElementsInFrame: ExcalidrawElement[], frame: ExcalidrawFrameElement, appState: AppState) => ExcalidrawElement[];
+export declare const removeAllElementsFromFrame: (allElements: ExcalidrawElementsIncludingDeleted, frame: ExcalidrawFrameLikeElement, appState: AppState) => ExcalidrawElement[];
+export declare const replaceAllElementsInFrame: (allElements: ExcalidrawElementsIncludingDeleted, nextElementsInFrame: ExcalidrawElement[], frame: ExcalidrawFrameLikeElement, appState: AppState) => ExcalidrawElement[];
 /** does not mutate elements, but returns new ones */
 export declare const updateFrameMembershipOfSelectedElements: (allElements: ExcalidrawElementsIncludingDeleted, appState: AppState, app: AppClassProperties) => ExcalidrawElementsIncludingDeleted;
 /**
  * filters out elements that are inside groups that contain a frame element
  * anywhere in the group tree
  */
-export declare const omitGroupsContainingFrames: (allElements: ExcalidrawElementsIncludingDeleted, selectedElements?: readonly ExcalidrawElement[]) => ExcalidrawElement[];
+export declare const omitGroupsContainingFrameLikes: (allElements: ExcalidrawElementsIncludingDeleted, selectedElements?: readonly ExcalidrawElement[]) => ExcalidrawElement[];
 /**
  * depending on the appState, return target frame, which is the frame the given element
  * is going to be added to or remove from
  */
-export declare const getTargetFrame: (element: ExcalidrawElement, appState: StaticCanvasAppState) => ExcalidrawFrameElement | null;
+export declare const getTargetFrame: (element: ExcalidrawElement, appState: StaticCanvasAppState) => import("./element/types").ExcalidrawFrameElement | import("./element/types").ExcalidrawMagicFrameElement | null;
 export declare const isElementInFrame: (element: ExcalidrawElement, allElements: ExcalidrawElementsIncludingDeleted, appState: StaticCanvasAppState) => boolean;
+export declare const getFrameLikeTitle: (element: ExcalidrawFrameLikeElement, frameIdx: number) => string;

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

@@ -24,6 +24,8 @@ export { useDevice } from "../../components/App";
 export { WelcomeScreen };
 export { LiveCollaborationTrigger };
 export { DefaultSidebar } from "../../components/DefaultSidebar";
+export { TTDDialog } from "../../components/TTDDialog/TTDDialog";
+export { TTDDialogTrigger } from "../../components/TTDDialog/TTDDialogTrigger";
 export { normalizeLink } from "../../data/url";
 export { convertToExcalidrawElements } from "../../data/transform";
 export { getCommonBounds } from "../../element/bounds";

package/types/packages/utils.d.ts

@@ -1,5 +1,5 @@
 import { AppState, BinaryFiles } from "../types";
-import { ExcalidrawElement, ExcalidrawFrameElement, NonDeleted } from "../element/types";
+import { ExcalidrawElement, ExcalidrawFrameLikeElement, NonDeleted } from "../element/types";
 import { MIME_TYPES } from "../constants";
 export { MIME_TYPES };
 type ExportOpts = {
@@ -7,7 +7,7 @@ type ExportOpts = {
     appState?: Partial<Omit<AppState, "offsetTop" | "offsetLeft">>;
     files: BinaryFiles | null;
     maxWidthOrHeight?: number;
-    exportingFrame?: ExcalidrawFrameElement | null;
+    exportingFrame?: ExcalidrawFrameLikeElement | null;
     getDimensions?: (width: number, height: number) => {
         width: number;
         height: number;

package/types/scene/Scene.d.ts

@@ -1,4 +1,4 @@
-import { ExcalidrawElement, NonDeletedExcalidrawElement, NonDeleted, ExcalidrawFrameElement } from "../element/types";
+import { ExcalidrawElement, NonDeletedExcalidrawElement, NonDeleted, ExcalidrawFrameLikeElement } from "../element/types";
 import { LinearElementEditor } from "../element/linearElementEditor";
 import { AppState } from "../types";
 type ElementIdKey = InstanceType<typeof LinearElementEditor>["elementId"];
@@ -19,14 +19,14 @@ declare class Scene {
     private callbacks;
     private nonDeletedElements;
     private elements;
-    private nonDeletedFrames;
+    private nonDeletedFramesLikes;
     private frames;
     private elementsMap;
     private selectedElementsCache;
     private versionNonce;
     getElementsIncludingDeleted(): readonly ExcalidrawElement[];
     getNonDeletedElements(): readonly NonDeletedExcalidrawElement[];
-    getFramesIncludingDeleted(): readonly ExcalidrawFrameElement[];
+    getFramesIncludingDeleted(): readonly ExcalidrawFrameLikeElement[];
     getSelectedElements(opts: {
         selectedElementIds: AppState["selectedElementIds"];
         /**
@@ -38,7 +38,7 @@ declare class Scene {
         includeBoundTextElement?: boolean;
         includeElementsInFrames?: boolean;
     }): NonDeleted<ExcalidrawElement>[];
-    getNonDeletedFrames(): readonly NonDeleted<ExcalidrawFrameElement>[];
+    getNonDeletedFramesLikes(): readonly NonDeleted<ExcalidrawFrameLikeElement>[];
     getElement<T extends ExcalidrawElement>(id: T["id"]): T | null;
     getVersionNonce(): number | undefined;
     getNonDeletedElement(id: ExcalidrawElement["id"]): NonDeleted<ExcalidrawElement> | null;

package/types/scene/ShapeCache.d.ts

@@ -16,5 +16,5 @@ export declare class ShapeCache {
      * Generates & caches shape for element if not already cached, otherwise
      * returns cached shape.
      */
-    static generateElementShape: <T extends import("../element/types").ExcalidrawLinearElement | import("../element/types").ExcalidrawRectangleElement | import("../element/types").ExcalidrawDiamondElement | import("../element/types").ExcalidrawEllipseElement | import("../element/types").ExcalidrawEmbeddableElement | import("../element/types").ExcalidrawImageElement | import("../element/types").ExcalidrawFrameElement | import("../element/types").ExcalidrawTextElement | import("../element/types").ExcalidrawFreeDrawElement>(element: T, isExporting?: boolean) => ((T["type"] extends keyof ElementShapes ? ElementShapes[T["type"]] | undefined : ElementShape | undefined) & ({} | null)) | (T["type"] extends keyof ElementShapes ? ElementShapes[T["type"]] : Drawable | null);
+    static generateElementShape: <T extends import("../element/types").ExcalidrawLinearElement | import("../element/types").ExcalidrawRectangleElement | import("../element/types").ExcalidrawDiamondElement | import("../element/types").ExcalidrawEllipseElement | import("../element/types").ExcalidrawEmbeddableElement | import("../element/types").ExcalidrawIframeElement | import("../element/types").ExcalidrawImageElement | import("../element/types").ExcalidrawFrameElement | import("../element/types").ExcalidrawMagicFrameElement | import("../element/types").ExcalidrawTextElement | import("../element/types").ExcalidrawFreeDrawElement>(element: T, isExporting?: boolean) => ((T["type"] extends keyof ElementShapes ? ElementShapes[T["type"]] | undefined : ElementShape | undefined) & ({} | null)) | (T["type"] extends keyof ElementShapes ? ElementShapes[T["type"]] : Drawable | null);
 }

package/types/scene/comparisons.d.ts

@@ -1,9 +1,10 @@
 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 canChangeRoundness: (type: string) => boolean;
-export declare const canHaveArrowheads: (type: string) => boolean;
+import { ElementOrToolType } from "../types";
+export declare const hasBackground: (type: ElementOrToolType) => boolean;
+export declare const hasStrokeColor: (type: ElementOrToolType) => boolean;
+export declare const hasStrokeWidth: (type: ElementOrToolType) => boolean;
+export declare const hasStrokeStyle: (type: ElementOrToolType) => boolean;
+export declare const canChangeRoundness: (type: ElementOrToolType) => boolean;
+export declare const canHaveArrowheads: (type: ElementOrToolType) => 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[];

package/types/scene/export.d.ts

@@ -1,10 +1,10 @@
-import { ExcalidrawFrameElement, NonDeletedExcalidrawElement } from "../element/types";
+import { ExcalidrawFrameLikeElement, NonDeletedExcalidrawElement } from "../element/types";
 import { AppState, BinaryFiles } from "../types";
 export declare const exportToCanvas: (elements: readonly NonDeletedExcalidrawElement[], appState: AppState, files: BinaryFiles, { exportBackground, exportPadding, viewBackgroundColor, exportingFrame, }: {
     exportBackground: boolean;
     exportPadding?: number | undefined;
     viewBackgroundColor: string;
-    exportingFrame?: ExcalidrawFrameElement | null | undefined;
+    exportingFrame?: ExcalidrawFrameLikeElement | null | undefined;
 }, createCanvas?: (width: number, height: number) => {
     canvas: HTMLCanvasElement;
     scale: number;
@@ -19,6 +19,6 @@ export declare const exportToSvg: (elements: readonly NonDeletedExcalidrawElemen
     frameRendering?: AppState["frameRendering"];
 }, files: BinaryFiles | null, opts?: {
     renderEmbeddables?: boolean;
-    exportingFrame?: ExcalidrawFrameElement | null;
+    exportingFrame?: ExcalidrawFrameLikeElement | null;
 }) => Promise<SVGSVGElement>;
 export declare const getExportSize: (elements: readonly NonDeletedExcalidrawElement[], exportPadding: number, scale: number) => [number, number];

package/types/scene/types.d.ts

@@ -82,6 +82,7 @@ export type ElementShapes = {
     rectangle: Drawable;
     ellipse: Drawable;
     diamond: Drawable;
+    iframe: Drawable;
     embeddable: Drawable;
     freedraw: Drawable | null;
     arrow: Drawable[];
@@ -89,4 +90,5 @@ export type ElementShapes = {
     text: null;
     image: null;
     frame: null;
+    magicframe: null;
 };

package/types/shapes.d.ts

@@ -59,4 +59,4 @@ export declare const SHAPES: readonly [{
     readonly numericKey: "0";
     readonly fillable: false;
 }];
-export declare const findShapeByKey: (key: string) => "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw" | "eraser" | null;
+export declare const findShapeByKey: (key: string) => "text" | "image" | "line" | "arrow" | "selection" | "rectangle" | "diamond" | "ellipse" | "freedraw" | "eraser" | null;

package/types/types.d.ts

@@ -1,5 +1,6 @@
 import React from "react";
-import { PointerType, ExcalidrawLinearElement, NonDeletedExcalidrawElement, NonDeleted, TextAlign, ExcalidrawElement, GroupId, ExcalidrawBindableElement, Arrowhead, ChartType, FontFamilyValues, FileId, ExcalidrawImageElement, Theme, StrokeRoundness, ExcalidrawFrameElement, ExcalidrawEmbeddableElement } from "./element/types";
+import { PointerType, ExcalidrawLinearElement, NonDeletedExcalidrawElement, NonDeleted, TextAlign, ExcalidrawElement, GroupId, ExcalidrawBindableElement, Arrowhead, ChartType, FontFamilyValues, FileId, ExcalidrawImageElement, Theme, StrokeRoundness, ExcalidrawEmbeddableElement, ExcalidrawMagicFrameElement, ExcalidrawFrameLikeElement, ExcalidrawElementType } from "./element/types";
+import { Action } from "./actions/types";
 import { Point as RoughPoint } from "roughjs/bin/geometry";
 import { LinearElementEditor } from "./element/linearElementEditor";
 import { SuggestedBinding } from "./element/binding";
@@ -58,7 +59,8 @@ export type BinaryFileData = {
 };
 export type BinaryFileMetadata = Omit<BinaryFileData, "dataURL">;
 export type BinaryFiles = Record<ExcalidrawElement["id"], BinaryFileData>;
-export type ToolType = "selection" | "rectangle" | "diamond" | "ellipse" | "arrow" | "line" | "freedraw" | "text" | "image" | "eraser" | "hand" | "frame" | "embeddable" | "laser";
+export type ToolType = "selection" | "rectangle" | "diamond" | "ellipse" | "arrow" | "line" | "freedraw" | "text" | "image" | "eraser" | "hand" | "frame" | "magicframe" | "embeddable" | "laser";
+export type ElementOrToolType = ExcalidrawElementType | ToolType | "custom";
 export type ActiveTool = {
     type: ToolType;
     customType: null;
@@ -103,13 +105,11 @@ export type InteractiveCanvasAppState = Readonly<_CommonCanvasAppState & {
     suggestedBindings: AppState["suggestedBindings"];
     isRotating: AppState["isRotating"];
     elementsToHighlight: AppState["elementsToHighlight"];
-    openSidebar: AppState["openSidebar"];
-    showHyperlinkPopup: AppState["showHyperlinkPopup"];
     collaborators: AppState["collaborators"];
     snapLines: AppState["snapLines"];
     zenModeEnabled: AppState["zenModeEnabled"];
 }>;
-export type AppState = {
+export interface AppState {
     contextMenu: {
         items: ContextMenuItems;
         top: number;
@@ -129,7 +129,7 @@ export type AppState = {
     isBindingEnabled: boolean;
     startBoundElement: NonDeleted<ExcalidrawBindableElement> | null;
     suggestedBindings: SuggestedBinding[];
-    frameToHighlight: NonDeleted<ExcalidrawFrameElement> | null;
+    frameToHighlight: NonDeleted<ExcalidrawFrameLikeElement> | null;
     frameRendering: {
         enabled: boolean;
         name: boolean;
@@ -182,7 +182,16 @@ export type AppState = {
         name: SidebarName;
         tab?: SidebarTabName;
     } | null;
-    openDialog: "imageExport" | "help" | "jsonExport" | "mermaid" | null;
+    openDialog: null | {
+        name: "imageExport" | "help" | "jsonExport";
+    } | {
+        name: "settings";
+        source: "tool" | "generation" | "settings";
+        tab: "text-to-diagram" | "diagram-to-code";
+    } | {
+        name: "ttd";
+        tab: "text-to-diagram" | "mermaid";
+    };
     /**
      * Reflects user preference for whether the default sidebar should be docked.
      *
@@ -241,7 +250,7 @@ export type AppState = {
         y: number;
     } | null;
     objectsSnapModeEnabled: boolean;
-};
+}
 export type UIAppState = Omit<AppState, "suggestedBindings" | "startBoundElement" | "cursorButton" | "scrollX" | "scrollY">;
 export type NormalizedZoomValue = number & {
     _brand: "normalizedZoom";
@@ -325,6 +334,7 @@ export interface ExcalidrawProps {
     children?: React.ReactNode;
     validateEmbeddable?: boolean | string[] | RegExp | RegExp[] | ((link: string) => boolean | undefined);
     renderEmbeddable?: (element: NonDeleted<ExcalidrawEmbeddableElement>, appState: AppState) => JSX.Element | null;
+    aiEnabled?: boolean;
 }
 export type SceneData = {
     elements?: ImportedDataState["elements"];
@@ -370,6 +380,7 @@ export type AppProps = Merge<ExcalidrawProps, {
     handleKeyboardGlobally: boolean;
     isCollaborating: boolean;
     children?: React.ReactNode;
+    aiEnabled: boolean;
 }>;
 /** A subset of App class properties that we need to use elsewhere
  * in the app, eg Manager. Factored out into a separate type to keep DRY. */
@@ -398,6 +409,8 @@ export type AppClassProperties = {
     togglePenMode: App["togglePenMode"];
     setActiveTool: App["setActiveTool"];
     setOpenDialog: App["setOpenDialog"];
+    insertEmbeddableElement: App["insertEmbeddableElement"];
+    onMagicframeToolSelect: App["onMagicframeToolSelect"];
 };
 export type PointerDownState = Readonly<{
     origin: Readonly<{
@@ -471,6 +484,7 @@ export type ExcalidrawImperativeAPI = {
     getSceneElements: InstanceType<typeof App>["getSceneElements"];
     getAppState: () => InstanceType<typeof App>["state"];
     getFiles: () => InstanceType<typeof App>["files"];
+    registerAction: (action: Action) => void;
     refresh: InstanceType<typeof App>["refresh"];
     setToast: InstanceType<typeof App>["setToast"];
     addFiles: (data: BinaryFileData[]) => void;
@@ -508,10 +522,10 @@ type FrameNameBounds = {
     angle: number;
 };
 export type FrameNameBoundsCache = {
-    get: (frameElement: ExcalidrawFrameElement) => FrameNameBounds | null;
+    get: (frameElement: ExcalidrawFrameLikeElement | ExcalidrawMagicFrameElement) => FrameNameBounds | null;
     _cache: Map<string, FrameNameBounds & {
         zoom: AppState["zoom"]["value"];
-        versionNonce: ExcalidrawFrameElement["versionNonce"];
+        versionNonce: ExcalidrawFrameLikeElement["versionNonce"];
     }>;
 };
 export type KeyboardModifiersObject = {
@@ -521,4 +535,5 @@ export type KeyboardModifiersObject = {
     metaKey: boolean;
 };
 export type Primitive = number | string | boolean | bigint | symbol | null | undefined;
+export type JSONValue = string | number | boolean | null | object;
 export {};

package/types/utils.d.ts

@@ -1,5 +1,5 @@
 import { EVENT } from "./constants";
-import { FontFamilyValues, FontString, NonDeletedExcalidrawElement } from "./element/types";
+import { FontFamilyValues, FontString } from "./element/types";
 import { ActiveTool, AppState, ToolType, Zoom } from "./types";
 export declare const setDateTimeForTests: (dateTime: string) => void;
 export declare const getDateTime: () => string;
@@ -186,7 +186,6 @@ export declare const isShallowEqual: <T extends Record<string, any>, I extends k
 export declare const composeEventHandlers: <E>(originalEventHandler?: ((event: E) => void) | undefined, ourEventHandler?: ((event: E) => void) | undefined, { checkForDefaultPrevented }?: {
     checkForDefaultPrevented?: boolean | undefined;
 }) => (event: E) => void;
-export declare const isOnlyExportingSingleFrame: (elements: readonly NonDeletedExcalidrawElement[]) => boolean;
 /**
  * supply `null` as message if non-never value is valid, you just need to
  * typecheck against it
@@ -202,3 +201,4 @@ export declare const isRenderThrottlingEnabled: () => boolean;
 /** Checks if value is inside given collection. Useful for type-safety. */
 export declare const isMemberOf: <T extends string>(collection: Set<T> | Record<T, any> | Map<T, any> | readonly T[], value: string) => value is T;
 export declare const cloneJSON: <T>(obj: T) => T;
+export declare const isFiniteNumber: (value: any) => value is number;

package/types/components/MermaidToExcalidraw.d.ts

@@ -1,3 +0,0 @@
-import "./MermaidToExcalidraw.scss";
-declare const MermaidToExcalidraw: () => JSX.Element;
-export default MermaidToExcalidraw;