@excalidraw/excalidraw 0.15.2-a065ec6 → 0.15.2-a7c590d

package/types/components/Card.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import OpenColor from "open-color";
 import "./Card.scss";
 export declare const Card: React.FC<{

package/types/components/ColorPicker/keyboardNavHandlers.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ColorPaletteCustom } from "../../colors";
 import { ActiveColorPickerSectionAtomType } from "./colorPickerUtils";
 interface ColorPickerKeyNavHandlerProps {

package/types/components/DefaultSidebar.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { MarkOptional } from "../utility-types";
 import { SidebarProps, SidebarTriggerProps } from "./Sidebar/common";
 export declare const DefaultSidebar: import("react").FC<Omit<MarkOptional<Omit<{

package/types/components/Dialog.d.ts

@@ -1,9 +1,10 @@
 import React from "react";
 import "./Dialog.scss";
+export type DialogSize = number | "small" | "regular" | "wide" | undefined;
 export interface DialogProps {
     children: React.ReactNode;
     className?: string;
-    size?: "small" | "regular" | "wide";
+    size?: DialogSize;
     onCloseRequest(): void;
     title: React.ReactNode | false;
     autofocus?: boolean;

package/types/components/EyeDropper.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import "./EyeDropper.scss";
 type EyeDropperProperties = {
     keepOpenOnAlt: boolean;

package/types/components/FilledButton.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 import "./FilledButton.scss";
 export type ButtonVariant = "filled" | "outlined" | "icon";
-export type ButtonColor = "primary" | "danger";
+export type ButtonColor = "primary" | "danger" | "warning" | "muted";
 export type ButtonSize = "medium" | "large";
 export type FilledButtonProps = {
     label: string;
@@ -11,6 +11,7 @@ export type FilledButtonProps = {
     color?: ButtonColor;
     size?: ButtonSize;
     className?: string;
+    fullWidth?: boolean;
     startIcon?: React.ReactNode;
 };
 export declare const FilledButton: React.ForwardRefExoticComponent<FilledButtonProps & React.RefAttributes<HTMLButtonElement>>;

package/types/components/HintViewer.d.ts

@@ -1,11 +1,10 @@
-import { NonDeletedExcalidrawElement } from "../element/types";
-import { Device, UIAppState } from "../types";
+import { AppClassProperties, Device, UIAppState } from "../types";
 import "./HintViewer.scss";
 interface HintViewerProps {
     appState: UIAppState;
-    elements: readonly NonDeletedExcalidrawElement[];
     isMobile: boolean;
     device: Device;
+    app: AppClassProperties;
 }
-export declare const HintViewer: ({ appState, elements, isMobile, device, }: HintViewerProps) => JSX.Element | null;
+export declare const HintViewer: ({ appState, isMobile, device, app, }: HintViewerProps) => JSX.Element | null;
 export {};

package/types/components/LayerUI.d.ts

@@ -26,6 +26,7 @@ interface LayerUIProps {
     onExportImage: AppClassProperties["onExportImage"];
     renderWelcomeScreen: boolean;
     children?: React.ReactNode;
+    app: AppClassProperties;
 }
-declare const _default: React.MemoExoticComponent<({ actionManager, appState, files, setAppState, elements, canvas, onLockToggle, onHandToolToggle, onPenModeToggle, showExitZenModeBtn, renderTopRightUI, renderCustomStats, UIOptions, onImageAction, onExportImage, renderWelcomeScreen, children, }: LayerUIProps) => JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ actionManager, appState, files, setAppState, elements, canvas, onLockToggle, onHandToolToggle, onPenModeToggle, showExitZenModeBtn, renderTopRightUI, renderCustomStats, UIOptions, onImageAction, onExportImage, renderWelcomeScreen, children, app, }: LayerUIProps) => JSX.Element>;
 export default _default;

package/types/components/LibraryMenuHeaderContent.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { LibraryItem, UIAppState } from "../types";
 import Library from "../data/library";
 export declare const LibraryDropdownMenuButton: React.FC<{

package/types/components/LibraryUnit.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { LibraryItem } from "../types";
 import "./LibraryUnit.scss";
 import { SvgCache } from "../hooks/useLibraryItemSvg";

package/types/components/LoadingMessage.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Theme } from "../element/types";
 export declare const LoadingMessage: React.FC<{
     delay?: number;

package/types/components/MobileMenu.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { AppState, Device, ExcalidrawProps, UIAppState } from "../types";
+import { AppClassProperties, AppState, Device, ExcalidrawProps, UIAppState } from "../types";
 import { ActionManager } from "../actions/manager";
 import { NonDeletedExcalidrawElement } from "../element/types";
 type MobileMenuProps = {
@@ -21,6 +21,7 @@ type MobileMenuProps = {
     renderSidebars: () => JSX.Element | null;
     device: Device;
     renderWelcomeScreen: boolean;
+    app: AppClassProperties;
 };
-export declare const MobileMenu: ({ appState, elements, actionManager, setAppState, onLockToggle, onHandToolToggle, onPenModeToggle, canvas, onImageAction, renderTopRightUI, renderCustomStats, renderSidebars, device, renderWelcomeScreen, }: MobileMenuProps) => JSX.Element;
+export declare const MobileMenu: ({ appState, elements, actionManager, setAppState, onLockToggle, onHandToolToggle, onPenModeToggle, canvas, onImageAction, renderTopRightUI, renderCustomStats, renderSidebars, device, renderWelcomeScreen, app, }: MobileMenuProps) => JSX.Element;
 export {};

package/types/components/OverwriteConfirm/OverwriteConfirm.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+import "./OverwriteConfirm.scss";
+export type OverwriteConfirmDialogProps = {
+    children: React.ReactNode;
+};
+declare const OverwriteConfirmDialog: React.FC<OverwriteConfirmDialogProps & {
+    __fallback?: boolean | undefined;
+}> & {
+    Actions: (({ children }: {
+        children: React.ReactNode;
+    }) => JSX.Element) & {
+        ExportToImage: () => JSX.Element;
+        SaveToDisk: () => JSX.Element;
+    };
+    Action: ({ title, children, actionLabel, onClick, }: import("./OverwriteConfirmActions").ActionProps) => JSX.Element;
+};
+export { OverwriteConfirmDialog };

package/types/components/OverwriteConfirm/OverwriteConfirmActions.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+export type ActionProps = {
+    title: string;
+    children: React.ReactNode;
+    actionLabel: string;
+    onClick: () => void;
+};
+export declare const Action: ({ title, children, actionLabel, onClick, }: ActionProps) => JSX.Element;
+export declare const ExportToImage: () => JSX.Element;
+export declare const SaveToDisk: () => JSX.Element;
+declare const Actions: (({ children }: {
+    children: React.ReactNode;
+}) => JSX.Element) & {
+    ExportToImage: () => JSX.Element;
+    SaveToDisk: () => JSX.Element;
+};
+export { Actions };

package/types/components/OverwriteConfirm/OverwriteConfirmState.d.ts

@@ -0,0 +1,22 @@
+import React from "react";
+export type OverwriteConfirmState = {
+    active: true;
+    title: string;
+    description: React.ReactNode;
+    actionLabel: string;
+    color: "danger" | "warning";
+    onClose: () => void;
+    onConfirm: () => void;
+    onReject: () => void;
+} | {
+    active: false;
+};
+export declare const overwriteConfirmStateAtom: import("jotai").PrimitiveAtom<OverwriteConfirmState> & {
+    init: OverwriteConfirmState;
+};
+export declare function openConfirmModal({ title, description, actionLabel, color, }: {
+    title: string;
+    description: React.ReactNode;
+    actionLabel: string;
+    color: "danger" | "warning";
+}): Promise<boolean>;

package/types/components/Section.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 export declare const Section: React.FC<{
-    heading: string;
+    heading: "canvasActions" | "selectedShapeActions" | "shapes";
     children?: React.ReactNode | ((heading: React.ReactNode) => React.ReactNode);
     className?: string;
 }>;

package/types/components/Sidebar/SidebarTab.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { SidebarTabName } from "../../types";
 export declare const SidebarTab: {
     ({ tab, children, ...rest }: {

package/types/components/Sidebar/SidebarTabTrigger.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { SidebarTabName } from "../../types";
 export declare const SidebarTabTrigger: {
     ({ children, tab, onSelect, ...rest }: {

package/types/components/Sidebar/SidebarTabTriggers.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare const SidebarTabTriggers: {
     ({ children, ...rest }: {
         children: React.ReactNode;

package/types/components/Sidebar/SidebarTabs.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare const SidebarTabs: {
     ({ children, ...rest }: {
         children: React.ReactNode;

package/types/components/Stack.d.ts

@@ -10,7 +10,7 @@ type StackProps = {
     ref: React.RefObject<HTMLDivElement>;
 };
 declare const _default: {
-    Row: React.ForwardRefExoticComponent<Pick<StackProps, "style" | "className" | "children" | "gap" | "justifyContent" | "align"> & React.RefAttributes<HTMLDivElement>>;
-    Col: React.ForwardRefExoticComponent<Pick<StackProps, "style" | "className" | "children" | "gap" | "justifyContent" | "align"> & React.RefAttributes<HTMLDivElement>>;
+    Row: React.ForwardRefExoticComponent<Pick<StackProps, "style" | "className" | "children" | "align" | "gap" | "justifyContent"> & React.RefAttributes<HTMLDivElement>>;
+    Col: React.ForwardRefExoticComponent<Pick<StackProps, "style" | "className" | "children" | "align" | "gap" | "justifyContent"> & React.RefAttributes<HTMLDivElement>>;
 };
 export default _default;

package/types/components/ToolButton.d.ts

@@ -1,5 +1,5 @@
 import "./ToolIcon.scss";
-import React from "react";
+import React, { CSSProperties } from "react";
 import { PointerType } from "../element/types";
 export type ToolButtonSize = "small" | "medium";
 type ToolButtonBaseProps = {
@@ -18,6 +18,7 @@ type ToolButtonBaseProps = {
     visible?: boolean;
     selected?: boolean;
     className?: string;
+    style?: CSSProperties;
     isLoading?: boolean;
 };
 type ToolButtonProps = (ToolButtonBaseProps & {

package/types/components/Trans.d.ts

@@ -1,7 +1,8 @@
 import React from "react";
+import { TranslationKeys } from "../i18n";
 declare const Trans: ({ i18nKey, children, ...props }: {
     [key: string]: React.ReactNode | ((el: React.ReactNode) => React.ReactNode);
-    i18nKey: string;
+    i18nKey: TranslationKeys;
 }) => React.FunctionComponentElement<{
     children?: React.ReactNode;
 }>;

package/types/components/dropdownMenu/DropdownMenu.d.ts

@@ -6,11 +6,12 @@ declare const DropdownMenu: {
         open: boolean;
     }): JSX.Element;
     Trigger: {
-        ({ className, children, onToggle, }: {
+        ({ className, children, onToggle, title, ...rest }: {
             className?: string | undefined;
             children: React.ReactNode;
             onToggle: () => void;
-        }): JSX.Element;
+            title?: string | undefined;
+        } & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onSelect">): JSX.Element;
         displayName: string;
     };
     Content: {

package/types/components/dropdownMenu/DropdownMenuTrigger.d.ts

@@ -1,9 +1,10 @@
 declare const MenuTrigger: {
-    ({ className, children, onToggle, }: {
+    ({ className, children, onToggle, title, ...rest }: {
         className?: string | undefined;
         children: React.ReactNode;
         onToggle: () => void;
-    }): JSX.Element;
+        title?: string | undefined;
+    } & Omit<import("react").ButtonHTMLAttributes<HTMLButtonElement>, "onSelect">): JSX.Element;
     displayName: string;
 };
 export default MenuTrigger;

package/types/components/icons.d.ts

@@ -31,6 +31,7 @@ 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 EmbedIcon: JSX.Element;
 export declare const DuplicateIcon: JSX.Element;
 export declare const MoonIcon: JSX.Element;
 export declare const SunIcon: JSX.Element;
@@ -144,5 +145,8 @@ export declare const helpIcon: JSX.Element;
 export declare const playerPlayIcon: JSX.Element;
 export declare const playerStopFilledIcon: JSX.Element;
 export declare const tablerCheckIcon: JSX.Element;
+export declare const alertTriangleIcon: JSX.Element;
 export declare const eyeDropperIcon: JSX.Element;
+export declare const extraToolsIcon: JSX.Element;
+export declare const frameToolIcon: JSX.Element;
 export {};

package/types/components/live-collaboration/LiveCollaborationTrigger.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import "./LiveCollaborationTrigger.scss";
 declare const LiveCollaborationTrigger: {
     ({ isCollaborating, onSelect, ...rest }: {

package/types/components/main-menu/MainMenu.d.ts

@@ -10,11 +10,12 @@ declare const MainMenu: React.FC<{
     __fallback?: boolean | undefined;
 }> & {
     Trigger: {
-        ({ className, children, onToggle, }: {
+        ({ className, children, onToggle, title, ...rest }: {
             className?: string | undefined;
             children: React.ReactNode;
             onToggle: () => void;
-        }): JSX.Element;
+            title?: string | undefined;
+        } & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onSelect">): JSX.Element;
         displayName: string;
     };
     Item: {

package/types/components/welcome-screen/WelcomeScreen.Center.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 declare const Center: {
     ({ children }: {
         children?: React.ReactNode;

package/types/components/welcome-screen/WelcomeScreen.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import "./WelcomeScreen.scss";
 declare const WelcomeScreen: {
     (props: {

package/types/constants.d.ts

@@ -57,8 +57,17 @@ export declare enum EVENT {
     VISIBILITY_CHANGE = "visibilitychange",
     SCROLL = "scroll",
     EXCALIDRAW_LINK = "excalidraw-link",
-    MENU_ITEM_SELECT = "menu.itemSelect"
+    MENU_ITEM_SELECT = "menu.itemSelect",
+    MESSAGE = "message"
 }
+export declare const YOUTUBE_STATES: {
+    readonly UNSTARTED: -1;
+    readonly ENDED: 0;
+    readonly PLAYING: 1;
+    readonly PAUSED: 2;
+    readonly BUFFERING: 3;
+    readonly CUED: 5;
+};
 export declare const ENV: {
     TEST: string;
     DEVELOPMENT: string;
@@ -72,8 +81,21 @@ export declare const FONT_FAMILY: {
     Cascadia: number;
 };
 export declare const THEME: {
-    LIGHT: string;
-    DARK: string;
+    readonly LIGHT: "light";
+    readonly DARK: "dark";
+};
+export declare const FRAME_STYLE: {
+    strokeColor: string;
+    strokeWidth: number;
+    strokeStyle: import("./element/types").StrokeStyle;
+    fillStyle: import("./element/types").FillStyle;
+    roughness: number;
+    roundness: {
+        type: import("./element/types").RoundnessType;
+        value?: number | undefined;
+    } | null;
+    backgroundColor: string;
+    radius: number;
 };
 export declare const WINDOWS_EMOJI_FALLBACK_FONT = "Segoe UI Emoji";
 export declare const DEFAULT_FONT_SIZE = 20;
@@ -195,3 +217,4 @@ export declare const DEFAULT_SIDEBAR: {
     readonly name: "default";
     readonly defaultTab: "library";
 };
+export declare const LIBRARY_DISABLED_TYPES: Set<"embeddable" | "image">;

package/types/context/tunnels.d.ts

@@ -10,6 +10,7 @@ type TunnelsContextValue = {
     FooterCenterTunnel: Tunnel;
     DefaultSidebarTriggerTunnel: Tunnel;
     DefaultSidebarTabTriggersTunnel: Tunnel;
+    OverwriteConfirmDialogTunnel: Tunnel;
     jotaiScope: symbol;
 };
 export declare const TunnelsContext: React.Context<TunnelsContextValue>;

package/types/data/url.d.ts

@@ -0,0 +1,7 @@
+export declare const normalizeLink: (link: string) => string;
+export declare const isLocalLink: (link: string | null) => boolean;
+/**
+ * Returns URL sanitized and safe for usage in places such as
+ * iframe's src attribute or <a> href attributes.
+ */
+export declare const toValidURL: (link: string) => string;

package/types/element/Hyperlink.d.ts

@@ -1,16 +1,18 @@
-/// <reference types="react" />
 import { AppState, ExcalidrawProps, UIAppState } from "../types";
 import { NonDeletedExcalidrawElement } from "./types";
 import { Bounds } from "./bounds";
 import "./Hyperlink.scss";
 export declare const EXTERNAL_LINK_IMG: HTMLImageElement;
-export declare const Hyperlink: ({ element, setAppState, onLinkOpen, }: {
+export declare const Hyperlink: ({ element, setAppState, onLinkOpen, setToast, }: {
     element: NonDeletedExcalidrawElement;
     setAppState: React.Component<any, AppState>["setState"];
     onLinkOpen: ExcalidrawProps["onLinkOpen"];
+    setToast: (toast: {
+        message: string;
+        closable?: boolean;
+        duration?: number;
+    } | null) => void;
 }) => JSX.Element | null;
-export declare const normalizeLink: (link: string) => string;
-export declare const isLocalLink: (link: string | null) => boolean;
 export declare const actionLink: {
     name: "hyperlink";
     perform: (elements: readonly import("./types").ExcalidrawElement[], appState: Readonly<AppState>) => false | {
@@ -26,6 +28,10 @@ export declare const actionLink: {
             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;
@@ -33,13 +39,22 @@ export declare const actionLink: {
             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<import("./types").ExcalidrawElement>[] | null;
             editingElement: NonDeletedExcalidrawElement | null;
             editingLinearElement: import("./linearElementEditor").LinearElementEditor | 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";
@@ -83,12 +98,13 @@ export declare const actionLink: {
             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;
@@ -96,7 +112,7 @@ export declare const actionLink: {
                 duration?: number | undefined;
             } | null;
             zenModeEnabled: boolean;
-            theme: string;
+            theme: import("./types").Theme;
             gridSize: number | null;
             viewModeEnabled: boolean;
             selectedGroupIds: {
@@ -128,15 +144,16 @@ export declare const actionLink: {
         action: string;
     };
     keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
-    contextItemLabel: (elements: readonly import("./types").ExcalidrawElement[], appState: Readonly<AppState>) => "labels.link.edit" | "labels.link.create";
+    contextItemLabel: (elements: readonly import("./types").ExcalidrawElement[], appState: Readonly<AppState>) => "labels.link.editEmbed" | "labels.link.edit" | "labels.link.createEmbed" | "labels.link.create";
     predicate: (elements: readonly import("./types").ExcalidrawElement[], appState: AppState) => boolean;
     PanelComponent: ({ elements, appState, updateData }: import("../actions/types").PanelComponentProps) => JSX.Element;
 } & {
     keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
 };
-export declare const getContextMenuLabel: (elements: readonly NonDeletedExcalidrawElement[], appState: AppState) => "labels.link.edit" | "labels.link.create";
+export declare const getContextMenuLabel: (elements: readonly NonDeletedExcalidrawElement[], appState: AppState) => "labels.link.editEmbed" | "labels.link.edit" | "labels.link.createEmbed" | "labels.link.create";
 export declare const getLinkHandleFromCoords: ([x1, y1, x2, y2]: Bounds, angle: number, appState: UIAppState) => [x: number, y: number, width: number, height: number];
-export declare const isPointHittingLinkIcon: (element: NonDeletedExcalidrawElement, appState: AppState, [x, y]: readonly [number, number], isMobile: boolean) => boolean;
+export declare const isPointHittingLinkIcon: (element: NonDeletedExcalidrawElement, appState: AppState, [x, y]: readonly [number, number]) => boolean;
+export declare const isPointHittingLink: (element: NonDeletedExcalidrawElement, appState: AppState, [x, y]: readonly [number, number], isMobile: boolean) => boolean;
 export declare const showHyperlinkTooltip: (element: NonDeletedExcalidrawElement, appState: AppState) => void;
 export declare const hideHyperlinkToolip: () => void;
 export declare const shouldHideLinkPopup: (element: NonDeletedExcalidrawElement, appState: AppState, [clientX, clientY]: readonly [number, number]) => Boolean;

package/types/element/binding.d.ts

@@ -7,7 +7,7 @@ export type SuggestedPointBinding = [
     "start" | "end" | "both",
     NonDeleted<ExcalidrawBindableElement>
 ];
-export declare const shouldEnableBindingForPointerEvent: (event: React.PointerEvent<HTMLCanvasElement>) => boolean;
+export declare const shouldEnableBindingForPointerEvent: (event: React.PointerEvent<HTMLElement>) => boolean;
 export declare const isBindingEnabled: (appState: AppState) => boolean;
 export declare const bindOrUnbindLinearElement: (linearElement: NonDeleted<ExcalidrawLinearElement>, startBindingElement: ExcalidrawBindableElement | null | "keep", endBindingElement: ExcalidrawBindableElement | null | "keep") => void;
 export declare const bindOrUnbindSelectedElements: (elements: NonDeleted<ExcalidrawElement>[]) => void;

package/types/element/bounds.d.ts

@@ -1,21 +1,46 @@
 import { ExcalidrawElement, ExcalidrawLinearElement, Arrowhead, NonDeleted } from "./types";
 import { Drawable, Op } from "roughjs/bin/core";
-export type Bounds = readonly [number, number, number, number];
+import { Point } from "../types";
+export type RectangleBox = {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    angle: number;
+};
+export type Bounds = readonly [x1: number, y1: number, x2: number, y2: number];
+export declare class ElementBounds {
+    private static boundsCache;
+    static getBounds(element: ExcalidrawElement): Bounds;
+    private static calculateBounds;
+}
 export declare const getElementAbsoluteCoords: (element: ExcalidrawElement, includeBoundText?: boolean) => [number, number, number, number, number, number];
+/**
+ * for a given element, `getElementLineSegments` returns line segments
+ * that can be used for visual collision detection (useful for frames)
+ * as opposed to bounding box collision detection
+ */
+export declare const getElementLineSegments: (element: ExcalidrawElement) => [Point, Point][];
+/**
+ * Scene -> Scene coords, but in x1,x2,y1,y2 format.
+ *
+ * Rectangle here means any rectangular frame, not an excalidraw element.
+ */
+export declare const getRectangleBoxAbsoluteCoords: (boxSceneCoords: RectangleBox) => number[];
 export declare const pointRelativeTo: (element: ExcalidrawElement, absoluteCoords: readonly [number, number]) => readonly [number, number];
 export declare const getDiamondPoints: (element: ExcalidrawElement) => number[];
 export declare const getCurvePathOps: (shape: Drawable) => Op[];
 export declare const getMinMaxXYFromCurvePathOps: (ops: Op[], transformXY?: ((x: number, y: number) => [number, number]) | undefined) => [number, number, number, number];
 export declare const getArrowheadPoints: (element: ExcalidrawLinearElement, shape: Drawable[], position: "start" | "end", arrowhead: Arrowhead) => number[] | null;
-export declare const getElementBounds: (element: ExcalidrawElement) => [number, number, number, number];
-export declare const getCommonBounds: (elements: readonly ExcalidrawElement[]) => [number, number, number, number];
+export declare const getElementBounds: (element: ExcalidrawElement) => Bounds;
+export declare const getCommonBounds: (elements: readonly ExcalidrawElement[]) => Bounds;
 export declare const getResizedElementAbsoluteCoords: (element: ExcalidrawElement, nextWidth: number, nextHeight: number, normalizePoints: boolean) => [number, number, number, number];
 export declare const getElementPointsCoords: (element: ExcalidrawLinearElement, points: readonly (readonly [number, number])[]) => [number, number, number, number];
 export declare const getClosestElementBounds: (elements: readonly ExcalidrawElement[], from: {
     x: number;
     y: number;
-}) => [number, number, number, number];
-export interface Box {
+}) => Bounds;
+export interface BoundingBox {
     minX: number;
     minY: number;
     maxX: number;
@@ -25,4 +50,4 @@ export interface Box {
     width: number;
     height: number;
 }
-export declare const getCommonBoundingBox: (elements: ExcalidrawElement[] | readonly NonDeleted<ExcalidrawElement>[]) => Box;
+export declare const getCommonBoundingBox: (elements: ExcalidrawElement[] | readonly NonDeleted<ExcalidrawElement>[]) => BoundingBox;

package/types/element/collision.d.ts

@@ -1,11 +1,11 @@
 import * as GA from "../ga";
-import { NonDeletedExcalidrawElement, ExcalidrawBindableElement, ExcalidrawElement, ExcalidrawRectangleElement, ExcalidrawDiamondElement, ExcalidrawTextElement, ExcalidrawEllipseElement, NonDeleted, ExcalidrawImageElement } from "./types";
-import { Point } from "../types";
+import { NonDeletedExcalidrawElement, ExcalidrawBindableElement, ExcalidrawElement, ExcalidrawRectangleElement, ExcalidrawEmbeddableElement, ExcalidrawDiamondElement, ExcalidrawTextElement, ExcalidrawEllipseElement, NonDeleted, ExcalidrawImageElement, ExcalidrawFrameElement } from "./types";
+import { FrameNameBoundsCache, Point } from "../types";
 import { AppState } from "../types";
-export declare const hitTest: (element: NonDeletedExcalidrawElement, appState: AppState, x: number, y: number) => boolean;
-export declare const isHittingElementBoundingBoxWithoutHittingElement: (element: NonDeletedExcalidrawElement, appState: AppState, x: number, y: number) => boolean;
-export declare const isHittingElementNotConsideringBoundingBox: (element: NonDeletedExcalidrawElement, appState: AppState, point: readonly [number, number]) => boolean;
-export declare const isPointHittingElementBoundingBox: (element: NonDeleted<ExcalidrawElement>, [x, y]: readonly [number, number], threshold: number) => boolean;
+export declare const hitTest: (element: NonDeletedExcalidrawElement, appState: AppState, frameNameBoundsCache: FrameNameBoundsCache, x: number, y: number) => boolean;
+export declare const isHittingElementBoundingBoxWithoutHittingElement: (element: NonDeletedExcalidrawElement, appState: AppState, frameNameBoundsCache: FrameNameBoundsCache, x: number, y: number) => boolean;
+export declare const isHittingElementNotConsideringBoundingBox: (element: NonDeletedExcalidrawElement, appState: AppState, frameNameBoundsCache: FrameNameBoundsCache | null, point: readonly [number, number]) => boolean;
+export declare const isPointHittingElementBoundingBox: (element: NonDeleted<ExcalidrawElement>, [x, y]: readonly [number, number], threshold: number, frameNameBoundsCache: FrameNameBoundsCache | null) => boolean;
 export declare const bindingBorderTest: (element: NonDeleted<ExcalidrawBindableElement>, { x, y }: {
     x: number;
     y: number;
@@ -18,4 +18,4 @@ export declare const determineFocusPoint: (element: ExcalidrawBindableElement, f
 export declare const intersectElementWithLine: (element: ExcalidrawBindableElement, a: readonly [number, number], b: readonly [number, number], gap?: number) => Point[];
 export declare const getCircleIntersections: (center: readonly [number, number, number, number, number, number, number, number], radius: number, line: readonly [number, number, number, number, number, number, number, number]) => GA.Point[];
 export declare const findFocusPointForEllipse: (ellipse: ExcalidrawEllipseElement, relativeDistance: number, point: readonly [number, number, number, number, number, number, number, number]) => readonly [number, number, number, number, number, number, number, number];
-export declare const findFocusPointForRectangulars: (element: ExcalidrawRectangleElement | ExcalidrawImageElement | ExcalidrawDiamondElement | ExcalidrawTextElement, relativeDistance: number, point: readonly [number, number, number, number, number, number, number, number]) => readonly [number, number, number, number, number, number, number, number];
+export declare const findFocusPointForRectangulars: (element: ExcalidrawRectangleElement | ExcalidrawImageElement | ExcalidrawDiamondElement | ExcalidrawTextElement | ExcalidrawEmbeddableElement | ExcalidrawFrameElement, relativeDistance: number, point: readonly [number, number, number, number, number, number, number, number]) => readonly [number, number, number, number, number, number, number, number];

package/types/element/dragElements.d.ts

@@ -1,5 +1,6 @@
 import { NonDeletedExcalidrawElement } from "./types";
 import { AppState, PointerDownState } from "../types";
-export declare const dragSelectedElements: (pointerDownState: PointerDownState, selectedElements: NonDeletedExcalidrawElement[], pointerX: number, pointerY: number, lockDirection: boolean | undefined, distanceX: number | undefined, distanceY: number | undefined, appState: AppState) => void;
+import Scene from "../scene/Scene";
+export declare const dragSelectedElements: (pointerDownState: PointerDownState, selectedElements: NonDeletedExcalidrawElement[], pointerX: number, pointerY: number, lockDirection: boolean | undefined, distanceX: number | undefined, distanceY: number | undefined, appState: AppState, scene: Scene) => void;
 export declare const getDragOffsetXY: (selectedElements: NonDeletedExcalidrawElement[], x: number, y: number) => [number, number];
 export declare const dragNewElement: (draggingElement: NonDeletedExcalidrawElement, elementType: AppState["activeTool"]["type"], originX: number, originY: number, x: number, y: number, width: number, height: number, shouldMaintainAspectRatio: boolean, shouldResizeFromCenter: boolean, widthAspectRatio?: number | null) => void;