@excalidraw/element 0.18.0-c158187 → 0.18.0-c1dbbdf

package/dist/types/common/debug.d.ts

@@ -0,0 +1,21 @@
+export declare class Debug {
+    static DEBUG_LOG_TIMES: boolean;
+    private static TIMES_AGGR;
+    private static TIMES_AVG;
+    private static LAST_DEBUG_LOG_CALL;
+    private static DEBUG_LOG_INTERVAL_ID;
+    private static LAST_FRAME_TIMESTAMP;
+    private static FRAME_COUNT;
+    private static ANIMATION_FRAME_ID;
+    private static scheduleAnimationFrame;
+    private static setupInterval;
+    private static debugLogger;
+    static logTime: (time?: number, name?: string) => void;
+    static logTimeAverage: (time?: number, name?: string) => void;
+    private static logWrapper;
+    static logTimeWrap: <T extends any[], R>(fn: (...args: T) => R, name?: string) => (...args: T) => R;
+    static logTimeAverageWrap: <T extends any[], R>(fn: (...args: T) => R, name?: string) => (...args: T) => R;
+    static perfWrap: <T extends any[], R>(fn: (...args: T) => R, name?: string) => (...args: T) => R;
+    private static CHANGED_CACHE;
+    static logChanged(name: string, obj: Record<string, unknown>): void;
+}

package/dist/types/common/src/colors.d.ts

@@ -1,16 +1,5 @@
-import oc from "open-color";
-import tinycolor from "tinycolor2";
-import type { Merge } from "./utility-types";
-export { tinycolor };
 export declare const applyDarkModeFilter: (color: string) => string;
-export declare const COLOR_OUTLINE_CONTRAST_THRESHOLD = 240;
-export type ColorPickerColor = Exclude<keyof oc, "indigo" | "lime"> | "transparent" | "bronze";
 export type ColorTuple = readonly [string, string, string, string, string];
-export type ColorPalette = Merge<Record<ColorPickerColor, ColorTuple>, {
-    black: "#1e1e1e";
-    white: "#ffffff";
-    transparent: "transparent";
-}>;
 export type ColorPaletteCustom = {
     [key: string]: ColorTuple | string;
 };
@@ -20,46 +9,74 @@ export declare const COLORS_PER_ROW = 5;
 export declare const DEFAULT_CHART_COLOR_INDEX = 4;
 export declare const DEFAULT_ELEMENT_STROKE_COLOR_INDEX = 4;
 export declare const DEFAULT_ELEMENT_BACKGROUND_COLOR_INDEX = 1;
-export declare const ELEMENTS_PALETTE_SHADE_INDEXES: readonly [0, 2, 4, 6, 8];
-export declare const CANVAS_PALETTE_SHADE_INDEXES: readonly [0, 1, 2, 3, 4];
-export declare const getSpecificColorShades: (color: Exclude<ColorPickerColor, "transparent" | "white" | "black" | "bronze">, indexArr: Readonly<ColorShadesIndexes>) => ColorTuple;
-export declare const COLOR_PALETTE: ColorPalette;
+export declare const COLOR_PALETTE: {
+    readonly transparent: "transparent";
+    readonly black: "#1e1e1e";
+    readonly white: "#ffffff";
+    readonly gray: readonly ["#f8f9fa", "#e9ecef", "#ced4da", "#868e96", "#343a40"];
+    readonly red: readonly ["#fff5f5", "#ffc9c9", "#ff8787", "#fa5252", "#e03131"];
+    readonly pink: readonly ["#fff0f6", "#fcc2d7", "#f783ac", "#e64980", "#c2255c"];
+    readonly grape: readonly ["#f8f0fc", "#eebefa", "#da77f2", "#be4bdb", "#9c36b5"];
+    readonly violet: readonly ["#f3f0ff", "#d0bfff", "#9775fa", "#7950f2", "#6741d9"];
+    readonly blue: readonly ["#e7f5ff", "#a5d8ff", "#4dabf7", "#228be6", "#1971c2"];
+    readonly cyan: readonly ["#e3fafc", "#99e9f2", "#3bc9db", "#15aabf", "#0c8599"];
+    readonly teal: readonly ["#e6fcf5", "#96f2d7", "#38d9a9", "#12b886", "#099268"];
+    readonly green: readonly ["#ebfbee", "#b2f2bb", "#69db7c", "#40c057", "#2f9e44"];
+    readonly yellow: readonly ["#fff9db", "#ffec99", "#ffd43b", "#fab005", "#f08c00"];
+    readonly orange: readonly ["#fff4e6", "#ffd8a8", "#ffa94d", "#fd7e14", "#e8590c"];
+    readonly bronze: readonly ["#f8f1ee", "#eaddd7", "#d2bab0", "#a18072", "#846358"];
+};
+export type ColorPalette = typeof COLOR_PALETTE;
+export type ColorPickerColor = keyof typeof COLOR_PALETTE;
 export declare const DEFAULT_ELEMENT_STROKE_PICKS: ColorTuple;
 export declare const DEFAULT_ELEMENT_BACKGROUND_PICKS: ColorTuple;
 export declare const DEFAULT_CANVAS_BACKGROUND_PICKS: ColorTuple;
 export declare const DEFAULT_ELEMENT_STROKE_COLOR_PALETTE: {
-    readonly red: ColorTuple;
-    readonly pink: ColorTuple;
-    readonly grape: ColorTuple;
-    readonly violet: ColorTuple;
-    readonly blue: ColorTuple;
-    readonly cyan: ColorTuple;
-    readonly teal: ColorTuple;
-    readonly green: ColorTuple;
-    readonly yellow: ColorTuple;
-    readonly orange: ColorTuple;
+    readonly cyan: readonly ["#e3fafc", "#99e9f2", "#3bc9db", "#15aabf", "#0c8599"];
+    readonly blue: readonly ["#e7f5ff", "#a5d8ff", "#4dabf7", "#228be6", "#1971c2"];
+    readonly violet: readonly ["#f3f0ff", "#d0bfff", "#9775fa", "#7950f2", "#6741d9"];
+    readonly grape: readonly ["#f8f0fc", "#eebefa", "#da77f2", "#be4bdb", "#9c36b5"];
+    readonly pink: readonly ["#fff0f6", "#fcc2d7", "#f783ac", "#e64980", "#c2255c"];
+    readonly green: readonly ["#ebfbee", "#b2f2bb", "#69db7c", "#40c057", "#2f9e44"];
+    readonly teal: readonly ["#e6fcf5", "#96f2d7", "#38d9a9", "#12b886", "#099268"];
+    readonly yellow: readonly ["#fff9db", "#ffec99", "#ffd43b", "#fab005", "#f08c00"];
+    readonly orange: readonly ["#fff4e6", "#ffd8a8", "#ffa94d", "#fd7e14", "#e8590c"];
+    readonly red: readonly ["#fff5f5", "#ffc9c9", "#ff8787", "#fa5252", "#e03131"];
     readonly transparent: "transparent";
     readonly white: "#ffffff";
-    readonly gray: ColorTuple;
+    readonly gray: readonly ["#f8f9fa", "#e9ecef", "#ced4da", "#868e96", "#343a40"];
     readonly black: "#1e1e1e";
-    readonly bronze: ColorTuple;
+    readonly bronze: readonly ["#f8f1ee", "#eaddd7", "#d2bab0", "#a18072", "#846358"];
 };
 export declare const DEFAULT_ELEMENT_BACKGROUND_COLOR_PALETTE: {
-    readonly red: ColorTuple;
-    readonly pink: ColorTuple;
-    readonly grape: ColorTuple;
-    readonly violet: ColorTuple;
-    readonly blue: ColorTuple;
-    readonly cyan: ColorTuple;
-    readonly teal: ColorTuple;
-    readonly green: ColorTuple;
-    readonly yellow: ColorTuple;
-    readonly orange: ColorTuple;
+    readonly cyan: readonly ["#e3fafc", "#99e9f2", "#3bc9db", "#15aabf", "#0c8599"];
+    readonly blue: readonly ["#e7f5ff", "#a5d8ff", "#4dabf7", "#228be6", "#1971c2"];
+    readonly violet: readonly ["#f3f0ff", "#d0bfff", "#9775fa", "#7950f2", "#6741d9"];
+    readonly grape: readonly ["#f8f0fc", "#eebefa", "#da77f2", "#be4bdb", "#9c36b5"];
+    readonly pink: readonly ["#fff0f6", "#fcc2d7", "#f783ac", "#e64980", "#c2255c"];
+    readonly green: readonly ["#ebfbee", "#b2f2bb", "#69db7c", "#40c057", "#2f9e44"];
+    readonly teal: readonly ["#e6fcf5", "#96f2d7", "#38d9a9", "#12b886", "#099268"];
+    readonly yellow: readonly ["#fff9db", "#ffec99", "#ffd43b", "#fab005", "#f08c00"];
+    readonly orange: readonly ["#fff4e6", "#ffd8a8", "#ffa94d", "#fd7e14", "#e8590c"];
+    readonly red: readonly ["#fff5f5", "#ffc9c9", "#ff8787", "#fa5252", "#e03131"];
     readonly transparent: "transparent";
     readonly white: "#ffffff";
-    readonly gray: ColorTuple;
+    readonly gray: readonly ["#f8f9fa", "#e9ecef", "#ced4da", "#868e96", "#343a40"];
     readonly black: "#1e1e1e";
-    readonly bronze: ColorTuple;
+    readonly bronze: readonly ["#f8f1ee", "#eaddd7", "#d2bab0", "#a18072", "#846358"];
 };
-export declare const getAllColorsSpecificShade: (index: 0 | 1 | 2 | 3 | 4) => readonly [string, string, string, string, string, string, string, string, string, string];
+export declare const getAllColorsSpecificShade: (index: 0 | 1 | 2 | 3 | 4) => ("#fff5f5" | "#ffc9c9" | "#ff8787" | "#fa5252" | "#e03131" | "#fff0f6" | "#fcc2d7" | "#f783ac" | "#e64980" | "#c2255c" | "#f8f0fc" | "#eebefa" | "#da77f2" | "#be4bdb" | "#9c36b5" | "#f3f0ff" | "#d0bfff" | "#9775fa" | "#7950f2" | "#6741d9" | "#e7f5ff" | "#a5d8ff" | "#4dabf7" | "#228be6" | "#1971c2" | "#e3fafc" | "#99e9f2" | "#3bc9db" | "#15aabf" | "#0c8599" | "#e6fcf5" | "#96f2d7" | "#38d9a9" | "#12b886" | "#099268" | "#ebfbee" | "#b2f2bb" | "#69db7c" | "#40c057" | "#2f9e44" | "#fff9db" | "#ffec99" | "#ffd43b" | "#fab005" | "#f08c00" | "#fff4e6" | "#ffd8a8" | "#ffa94d" | "#fd7e14" | "#e8590c")[];
 export declare const rgbToHex: (r: number, g: number, b: number, a?: number) => string;
+/**
+ * @returns #RRGGBB or #RRGGBBAA based on color containing non-opaque alpha,
+ *  null if not valid color
+ */
+export declare const colorToHex: (color: string) => string | null;
+export declare const isTransparent: (color: string) => boolean;
+export declare const COLOR_OUTLINE_CONTRAST_THRESHOLD = 240;
+export declare const isColorDark: (color: string, threshold?: number) => boolean;
+/**
+ * tries to keep the input color as-is if it's valid, making minimal adjustments
+ * (trimming whitespace or adding `#` to hex colors)
+ */
+export declare const normalizeInputColor: (color: string) => string | null;

package/dist/types/common/src/constants.d.ts

@@ -85,6 +85,7 @@ export declare const CLASSES: {
     CONVERT_ELEMENT_TYPE_POPUP: string;
     SHAPE_ACTIONS_THEME_SCOPE: string;
     FRAME_NAME: string;
+    DROPDOWN_MENU_EVENT_WRAPPER: string;
 };
 export declare const FONT_SIZES: {
     readonly sm: 16;
@@ -131,6 +132,7 @@ export declare const THEME: {
     readonly LIGHT: "light";
     readonly DARK: "dark";
 };
+export declare const DARK_THEME_FILTER = "invert(93%) hue-rotate(180deg)";
 export declare const FRAME_STYLE: {
     strokeColor: ExcalidrawElement["strokeColor"];
     strokeWidth: ExcalidrawElement["strokeWidth"];
@@ -178,6 +180,7 @@ export declare const STRING_MIME_TYPES: {
     readonly html: "text/html";
     readonly json: "application/json";
     readonly excalidraw: "application/vnd.excalidraw+json";
+    readonly excalidrawClipboard: "application/vnd.excalidraw.clipboard+json";
     readonly excalidrawlib: "application/vnd.excalidrawlib+json";
     readonly excalidrawlibIds: "application/vnd.excalidrawlib.ids+json";
 };
@@ -198,6 +201,7 @@ export declare const MIME_TYPES: {
     readonly html: "text/html";
     readonly json: "application/json";
     readonly excalidraw: "application/vnd.excalidraw+json";
+    readonly excalidrawClipboard: "application/vnd.excalidraw.clipboard+json";
     readonly excalidrawlib: "application/vnd.excalidrawlib+json";
     readonly excalidrawlibIds: "application/vnd.excalidrawlib.ids+json";
 };

package/dist/types/common/src/editorInterface.d.ts

@@ -14,7 +14,7 @@ export declare const MQ_MAX_MOBILE = 599;
 export declare const MQ_MAX_WIDTH_LANDSCAPE = 1000;
 export declare const MQ_MAX_HEIGHT_LANDSCAPE = 500;
 export declare const MQ_MIN_TABLET: number;
-export declare const MQ_MAX_TABLET = 1400;
+export declare const MQ_MAX_TABLET = 1180;
 export declare const MQ_MIN_WIDTH_DESKTOP = 1440;
 export declare const MQ_RIGHT_SIDEBAR_MIN_WIDTH = 1229;
 export declare const isDarwin: boolean;

package/dist/types/common/src/index.d.ts

@@ -11,5 +11,5 @@ export * from "./random";
 export * from "./url";
 export * from "./utils";
 export * from "./emitter";
-export * from "./visualdebug";
 export * from "./editorInterface";
+export { Debug } from "../debug";

package/dist/types/common/src/utils.d.ts

@@ -1,3 +1,4 @@
+import type { GlobalCoord } from "@excalidraw/math";
 import type { FontFamilyValues, FontString } from "@excalidraw/element/types";
 import type { ActiveTool, AppState, ToolType, UnsubscribeCallback, Zoom } from "@excalidraw/excalidraw/types";
 import type { MaybePromise, ResolutionType } from "./utility-types";
@@ -108,10 +109,7 @@ export declare const viewportCoordsToSceneCoords: ({ clientX, clientY }: {
     offsetTop: number;
     scrollX: number;
     scrollY: number;
-}) => {
-    x: number;
-    y: number;
-};
+}) => GlobalCoord;
 export declare const sceneCoordsToViewportCoords: ({ sceneX, sceneY }: {
     sceneX: number;
     sceneY: number;
@@ -143,7 +141,6 @@ export declare const findIndex: <T>(array: readonly T[], cb: (element: T, index:
 export declare const findLastIndex: <T>(array: readonly T[], cb: (element: T, index: number, array: readonly T[]) => boolean, fromIndex?: number) => number;
 /** returns the first non-null mapped value */
 export declare const mapFind: <T, K>(collection: readonly T[], iteratee: (value: T, index: number) => K | undefined | null) => K | undefined;
-export declare const isTransparent: (color: string) => boolean;
 export type ResolvablePromise<T> = Promise<T> & {
     resolve: [T] extends [undefined] ? (value?: MaybePromise<Awaited<T>>) => void : (value: MaybePromise<Awaited<T>>) => void;
     reject: (error: Error) => void;
@@ -280,4 +277,5 @@ type FEATURE_FLAGS = {
 };
 export declare const getFeatureFlag: <F extends keyof FEATURE_FLAGS>(flag: F) => FEATURE_FLAGS[F];
 export declare const setFeatureFlag: <F extends keyof FEATURE_FLAGS>(flag: F, value: FEATURE_FLAGS[F]) => void;
+export declare const oneOf: <N extends string | number | symbol | null, H extends N>(needle: N, haystack: readonly H[]) => needle is H;
 export {};

package/dist/types/element/src/Scene.d.ts

@@ -75,6 +75,8 @@ export declare class Scene {
     mutateElement<TElement extends Mutable<ExcalidrawElement>>(element: TElement, updates: ElementUpdate<TElement>, options?: {
         informMutation: boolean;
         isDragging: boolean;
+        isBindingEnabled?: boolean;
+        isMidpointSnappingEnabled?: boolean;
     }): TElement;
 }
 export {};

package/dist/types/element/src/arrows/focus.d.ts

@@ -0,0 +1,27 @@
+import { type GlobalPoint } from "@excalidraw/math";
+import type { AppState, NullableGridSize } from "@excalidraw/excalidraw/types";
+import { LinearElementEditor } from "../linearElementEditor";
+import type { ElementsMap, ExcalidrawArrowElement, ExcalidrawBindableElement, NonDeletedSceneElementsMap } from "../types";
+import type { Scene } from "../Scene";
+export declare const isFocusPointVisible: (focusPoint: GlobalPoint, arrow: ExcalidrawArrowElement, bindableElement: ExcalidrawBindableElement, elementsMap: ElementsMap, appState: {
+    isBindingEnabled: AppState["isBindingEnabled"];
+    zoom: AppState["zoom"];
+}, startOrEnd: "start" | "end", ignoreOverlap?: boolean) => boolean;
+export declare const handleFocusPointDrag: (linearElementEditor: LinearElementEditor, elementsMap: NonDeletedSceneElementsMap, pointerCoords: {
+    x: number;
+    y: number;
+}, scene: Scene, appState: AppState, gridSize: NullableGridSize, switchToInsideBinding: boolean) => void;
+export declare const handleFocusPointPointerDown: (arrow: ExcalidrawArrowElement, pointerDownState: {
+    origin: {
+        x: number;
+        y: number;
+    };
+}, elementsMap: NonDeletedSceneElementsMap, appState: AppState) => {
+    hitFocusPoint: "start" | "end" | null;
+    pointerOffset: {
+        x: number;
+        y: number;
+    };
+};
+export declare const handleFocusPointPointerUp: (linearElementEditor: LinearElementEditor, scene: Scene) => void;
+export declare const handleFocusPointHover: (arrow: ExcalidrawArrowElement, scenePointerX: number, scenePointerY: number, scene: Scene, appState: AppState) => "start" | "end" | null;

package/dist/types/element/src/arrows/helpers.d.ts

@@ -0,0 +1,5 @@
+import type { App } from "@excalidraw/excalidraw/types";
+export declare const maybeHandleArrowPointlikeDrag: ({ app, event, }: {
+    app: App;
+    event: KeyboardEvent | React.KeyboardEvent<Element> | PointerEvent;
+}) => boolean;

package/dist/types/element/src/binding.d.ts

@@ -24,12 +24,15 @@ export type BindingStrategy = {
  *
  * IMPORTANT: currently must be > 0 (this also applies to the computed gap)
  */
-export declare const BASE_BINDING_GAP = 10;
+export declare const BASE_BINDING_GAP = 5;
 export declare const BASE_BINDING_GAP_ELBOW = 5;
+export declare const BASE_ARROW_MIN_LENGTH = 10;
+export declare const FOCUS_POINT_SIZE: number;
 export declare const getBindingGap: (bindTarget: ExcalidrawBindableElement, opts: Pick<ExcalidrawArrowElement, "elbowed">) => number;
 export declare const maxBindingDistance_simple: (zoom?: AppState["zoom"]) => number;
-export declare const shouldEnableBindingForPointerEvent: (event: React.PointerEvent<HTMLElement>) => boolean;
-export declare const isBindingEnabled: (appState: AppState) => boolean;
+export declare const isBindingEnabled: (appState: {
+    isBindingEnabled: AppState["isBindingEnabled"];
+}) => boolean;
 export declare const bindOrUnbindBindingElement: (arrow: NonDeleted<ExcalidrawArrowElement>, draggingPoints: PointsPositionUpdates, scenePointerX: number, scenePointerY: number, scene: Scene, appState: AppState, opts?: {
     newArrow?: boolean;
     altKey?: boolean;
@@ -51,7 +54,7 @@ export declare const getBindingStrategyForDraggingBindingElementEndpoints: (arro
     end: BindingStrategy;
 };
 export declare const bindOrUnbindBindingElements: (selectedArrows: NonDeleted<ExcalidrawArrowElement>[], scene: Scene, appState: AppState) => void;
-export declare const bindBindingElement: (arrow: NonDeleted<ExcalidrawArrowElement>, hoveredElement: ExcalidrawBindableElement, mode: BindMode, startOrEnd: "start" | "end", scene: Scene, focusPoint?: GlobalPoint) => void;
+export declare const bindBindingElement: (arrow: NonDeleted<ExcalidrawArrowElement>, hoveredElement: ExcalidrawBindableElement, mode: BindMode, startOrEnd: "start" | "end", scene: Scene, focusPoint?: GlobalPoint, shouldSnapToOutline?: boolean) => void;
 export declare const unbindBindingElement: (arrow: NonDeleted<ExcalidrawArrowElement>, startOrEnd: "start" | "end", scene: Scene) => ExcalidrawBindableElement["id"] | null;
 export declare const updateBoundElements: (changedElement: NonDeletedExcalidrawElement, scene: Scene, options?: {
     simultaneouslyUpdated?: readonly ExcalidrawElement[];
@@ -65,10 +68,11 @@ export declare const updateBindings: (latestElement: ExcalidrawElement, scene: S
     };
 }) => void;
 export declare const getHeadingForElbowArrowSnap: (p: Readonly<GlobalPoint>, otherPoint: Readonly<GlobalPoint>, bindableElement: ExcalidrawBindableElement | undefined | null, aabb: Bounds | undefined | null, origPoint: GlobalPoint, elementsMap: ElementsMap, zoom?: AppState["zoom"]) => Heading;
-export declare const bindPointToSnapToElementOutline: (arrowElement: ExcalidrawArrowElement, bindableElement: ExcalidrawBindableElement, startOrEnd: "start" | "end", elementsMap: ElementsMap, customIntersector?: LineSegment<GlobalPoint>) => GlobalPoint;
+export declare const bindPointToSnapToElementOutline: (arrowElement: ExcalidrawArrowElement, bindableElement: ExcalidrawBindableElement, startOrEnd: "start" | "end", elementsMap: ElementsMap, customIntersector?: LineSegment<GlobalPoint>, isMidpointSnappingEnabled?: boolean) => GlobalPoint;
 export declare const avoidRectangularCorner: (arrowElement: ExcalidrawArrowElement, bindTarget: ExcalidrawBindableElement, elementsMap: ElementsMap, p: GlobalPoint) => GlobalPoint;
-export declare const updateBoundPoint: (arrow: NonDeleted<ExcalidrawArrowElement>, startOrEnd: "startBinding" | "endBinding", binding: FixedPointBinding | null | undefined, bindableElement: ExcalidrawBindableElement, elementsMap: ElementsMap, customIntersector?: LineSegment<GlobalPoint>) => LocalPoint | null;
-export declare const calculateFixedPointForElbowArrowBinding: (linearElement: NonDeleted<ExcalidrawElbowArrowElement>, hoveredElement: ExcalidrawBindableElement, startOrEnd: "start" | "end", elementsMap: ElementsMap) => {
+export declare const snapToMid: (bindTarget: ExcalidrawBindableElement, elementsMap: ElementsMap, p: GlobalPoint, tolerance?: number, arrowElement?: ExcalidrawArrowElement) => GlobalPoint | undefined;
+export declare const updateBoundPoint: (arrow: NonDeleted<ExcalidrawArrowElement>, startOrEnd: "startBinding" | "endBinding", binding: FixedPointBinding | null | undefined, bindableElement: ExcalidrawBindableElement, elementsMap: ElementsMap, dragging?: boolean) => LocalPoint | null;
+export declare const calculateFixedPointForElbowArrowBinding: (linearElement: NonDeleted<ExcalidrawElbowArrowElement>, hoveredElement: ExcalidrawBindableElement, startOrEnd: "start" | "end", elementsMap: ElementsMap, shouldSnapToOutline?: boolean, isMidpointSnappingEnabled?: boolean) => {
     fixedPoint: FixedPoint;
 };
 export declare const calculateFixedPointForNonElbowArrowBinding: (linearElement: NonDeleted<ExcalidrawArrowElement>, hoveredElement: ExcalidrawBindableElement, startOrEnd: "start" | "end", elementsMap: ElementsMap, focusPoint?: GlobalPoint) => {
@@ -120,5 +124,6 @@ export declare class BindableElement {
 export declare const getGlobalFixedPointForBindableElement: (fixedPointRatio: FixedPoint, element: ExcalidrawBindableElement, elementsMap: ElementsMap) => GlobalPoint;
 export declare const getGlobalFixedPoints: (arrow: ExcalidrawArrowElement, elementsMap: ElementsMap) => [GlobalPoint, GlobalPoint];
 export declare const getArrowLocalFixedPoints: (arrow: ExcalidrawElbowArrowElement, elementsMap: ElementsMap) => LocalPoint[];
-export declare const normalizeFixedPoint: <T extends FixedPoint | null>(fixedPoint: T) => T extends null ? null : FixedPoint;
+export declare const isFixedPoint: (fixedPoint: any) => fixedPoint is FixedPointBinding["fixedPoint"];
+export declare const normalizeFixedPoint: <T extends FixedPoint>(fixedPoint: T) => FixedPoint;
 export declare const getBindingSideMidPoint: (binding: FixedPointBinding, elementsMap: ElementsMap) => GlobalPoint | LocalPoint | null;

package/dist/types/element/src/collision.d.ts

@@ -1,6 +1,6 @@
 import type { GlobalPoint, LineSegment } from "@excalidraw/math";
 import type { FrameNameBounds } from "@excalidraw/excalidraw/types";
-import type { ElementsMap, ExcalidrawBindableElement, ExcalidrawElement, NonDeleted, NonDeletedExcalidrawElement, NonDeletedSceneElementsMap, Ordered } from "./types";
+import type { ElementsMap, ExcalidrawArrowElement, ExcalidrawBindableElement, ExcalidrawElement, NonDeleted, NonDeletedExcalidrawElement, NonDeletedSceneElementsMap, Ordered } from "./types";
 export declare const shouldTestInside: (element: ExcalidrawElement) => boolean;
 export type HitTestArgs = {
     point: GlobalPoint;
@@ -14,8 +14,9 @@ export declare const hitElementItself: ({ point, element, threshold, elementsMap
 export declare const hitElementBoundingBox: (point: GlobalPoint, element: ExcalidrawElement, elementsMap: ElementsMap, tolerance?: number) => boolean;
 export declare const hitElementBoundingBoxOnly: (hitArgs: HitTestArgs, elementsMap: ElementsMap) => boolean;
 export declare const hitElementBoundText: (point: GlobalPoint, element: ExcalidrawElement, elementsMap: ElementsMap) => boolean;
-export declare const getAllHoveredElementAtPoint: (point: Readonly<GlobalPoint>, elements: readonly Ordered<NonDeletedExcalidrawElement>[], elementsMap: NonDeletedSceneElementsMap, toleranceFn?: (element: ExcalidrawBindableElement) => number) => NonDeleted<ExcalidrawBindableElement>[];
-export declare const getHoveredElementForBinding: (point: Readonly<GlobalPoint>, elements: readonly Ordered<NonDeletedExcalidrawElement>[], elementsMap: NonDeletedSceneElementsMap, toleranceFn?: (element: ExcalidrawBindableElement) => number) => NonDeleted<ExcalidrawBindableElement> | null;
+export declare const getAllHoveredElementAtPoint: (point: Readonly<GlobalPoint>, elements: readonly Ordered<NonDeletedExcalidrawElement>[], elementsMap: NonDeletedSceneElementsMap, tolerance?: number) => NonDeleted<ExcalidrawBindableElement>[];
+export declare const getHoveredElementForBinding: (point: Readonly<GlobalPoint>, elements: readonly Ordered<NonDeletedExcalidrawElement>[], elementsMap: NonDeletedSceneElementsMap, tolerance?: number) => NonDeleted<ExcalidrawBindableElement> | null;
+export declare const getHoveredElementForFocusPoint: (point: GlobalPoint, arrow: ExcalidrawArrowElement, elements: readonly Ordered<NonDeletedExcalidrawElement>[], elementsMap: NonDeletedSceneElementsMap, tolerance?: number) => ExcalidrawBindableElement | null;
 /**
  * Intersect a line with an element for binding test
  *

package/dist/types/element/src/distribute.d.ts

@@ -1,7 +1,8 @@
 import type { AppState } from "@excalidraw/excalidraw/types";
+import type { Scene } from "./Scene";
 import type { ElementsMap, ExcalidrawElement } from "./types";
 export interface Distribution {
     space: "between";
     axis: "x" | "y";
 }
-export declare const distributeElements: (selectedElements: ExcalidrawElement[], elementsMap: ElementsMap, distribution: Distribution, appState: Readonly<AppState>) => ExcalidrawElement[];
+export declare const distributeElements: (selectedElements: ExcalidrawElement[], elementsMap: ElementsMap, distribution: Distribution, appState: Readonly<AppState>, scene: Scene) => ExcalidrawElement[];

package/dist/types/element/src/elbowArrow.d.ts

@@ -13,5 +13,7 @@ export declare const updateElbowArrowPoints: (arrow: Readonly<ExcalidrawElbowArr
     endBinding?: FixedPointBinding | null;
 }, options?: {
     isDragging?: boolean;
+    isBindingEnabled?: boolean;
+    isMidpointSnappingEnabled?: boolean;
 }) => ElementUpdate<ExcalidrawElbowArrowElement>;
 export declare const validateElbowPoints: <P extends GlobalPoint | LocalPoint>(points: readonly P[], tolerance?: number) => boolean;

package/dist/types/element/src/index.d.ts

@@ -27,6 +27,7 @@ export * from "./elbowArrow";
 export * from "./elementLink";
 export * from "./embeddable";
 export * from "./flowchart";
+export * from "./arrows/focus";
 export * from "./fractionalIndex";
 export * from "./frame";
 export * from "./groups";
@@ -54,3 +55,4 @@ export * from "./transformHandles";
 export * from "./typeChecks";
 export * from "./utils";
 export * from "./zindex";
+export * from "./arrows/helpers";

package/dist/types/element/src/linearElementEditor.d.ts

@@ -33,6 +33,8 @@ export declare class LinearElementEditor {
     }>;
     readonly hoverPointIndex: number;
     readonly segmentMidPointHoveredCoords: GlobalPoint | null;
+    readonly hoveredFocusPointBinding: "start" | "end" | null;
+    readonly draggedFocusPointBinding: "start" | "end" | null;
     readonly elbowed: boolean;
     readonly customLineAngle: number | null;
     readonly isEditing: boolean;
@@ -94,6 +96,9 @@ export declare class LinearElementEditor {
         startBinding?: FixedPointBinding | null;
         endBinding?: FixedPointBinding | null;
         moveMidPointsWithElement?: boolean | null;
+    }, options?: {
+        isBindingEnabled?: boolean;
+        isMidpointSnappingEnabled?: boolean;
     }): void;
     static shouldAddMidpoint(linearElementEditor: LinearElementEditor, pointerCoords: PointerCoords, appState: AppState, elementsMap: ElementsMap): boolean;
     static addMidpoint(linearElementEditor: LinearElementEditor, pointerCoords: PointerCoords, app: AppClassProperties, snapToGrid: boolean, scene: Scene): {

package/dist/types/element/src/mutateElement.d.ts

@@ -11,6 +11,8 @@ export type ElementUpdate<TElement extends ExcalidrawElement> = Omit<Partial<TEl
  */
 export declare const mutateElement: <TElement extends Mutable<ExcalidrawElement>>(element: TElement, elementsMap: ElementsMap, updates: ElementUpdate<TElement>, options?: {
     isDragging?: boolean;
+    isBindingEnabled?: boolean;
+    isMidpointSnappingEnabled?: boolean;
 }) => TElement;
 export declare const newElementWith: <TElement extends ExcalidrawElement>(element: TElement, updates: ElementUpdate<TElement>, 
 /** pass `true` to always regenerate */

package/dist/types/element/src/types.d.ts

@@ -1,7 +1,7 @@
 import type { LocalPoint, Radians } from "@excalidraw/math";
 import type { FONT_FAMILY, ROUNDNESS, TEXT_ALIGN, THEME, VERTICAL_ALIGN } from "@excalidraw/common";
 import type { MakeBrand, MarkNonNullable, Merge, ValueOf } from "@excalidraw/common/utility-types";
-export type ChartType = "bar" | "line";
+export type ChartType = "bar" | "line" | "radar";
 export type FillStyle = "hachure" | "cross-hatch" | "solid" | "zigzag";
 export type FontFamilyKeys = keyof typeof FONT_FAMILY;
 export type FontFamilyValues = typeof FONT_FAMILY[FontFamilyKeys];

package/dist/types/element/src/utils.d.ts

@@ -1,7 +1,7 @@
 import { type GlobalPoint } from "@excalidraw/math";
 import type { Curve, LineSegment } from "@excalidraw/math";
-import type { Zoom } from "@excalidraw/excalidraw/types";
-import type { ElementsMap, ExcalidrawArrowElement, ExcalidrawDiamondElement, ExcalidrawElement, ExcalidrawFreeDrawElement, ExcalidrawLinearElement, ExcalidrawRectanguloidElement } from "./types";
+import type { AppState, Zoom } from "@excalidraw/excalidraw/types";
+import type { ElementsMap, ExcalidrawArrowElement, ExcalidrawBindableElement, ExcalidrawDiamondElement, ExcalidrawElement, ExcalidrawFreeDrawElement, ExcalidrawLinearElement, ExcalidrawRectanguloidElement } from "./types";
 /**
  * Returns the **rotated** components of freedraw, line or arrow elements.
  *
@@ -18,6 +18,7 @@ export declare function deconstructLinearOrFreeDrawElement(element: ExcalidrawLi
  * @returns Tuple of **unrotated** line segments (0) and curves (1)
  */
 export declare function deconstructRectanguloidElement(element: ExcalidrawRectanguloidElement, offset?: number): [LineSegment<GlobalPoint>[], Curve<GlobalPoint>[]];
+export declare function getDiamondBaseCorners(element: ExcalidrawDiamondElement, offset?: number): Curve<GlobalPoint>[];
 /**
  * Get the **unrotated** building components of a diamond element
  * in the form of line segments and curves as a tuple, in this order.
@@ -31,4 +32,5 @@ export declare const isPathALoop: (points: ExcalidrawLinearElement["points"],
 /** supply if you want the loop detection to account for current zoom */
 zoomValue?: Zoom["value"]) => boolean;
 export declare const getCornerRadius: (x: number, element: ExcalidrawElement) => number;
-export declare const projectFixedPointOntoDiagonal: (arrow: ExcalidrawArrowElement, point: GlobalPoint, element: ExcalidrawElement, startOrEnd: "start" | "end", elementsMap: ElementsMap) => GlobalPoint | null;
+export declare const getSnapOutlineMidPoint: (point: GlobalPoint, element: ExcalidrawBindableElement, elementsMap: ElementsMap, zoom: AppState["zoom"]) => GlobalPoint | undefined;
+export declare const projectFixedPointOntoDiagonal: (arrow: ExcalidrawArrowElement, point: GlobalPoint, element: ExcalidrawBindableElement, startOrEnd: "start" | "end", elementsMap: ElementsMap, zoom: AppState["zoom"], isMidpointSnappingEnabled?: boolean) => GlobalPoint | null;

package/dist/types/{common → element}/src/visualdebug.d.ts

@@ -1,7 +1,8 @@
 import { type GlobalPoint, type LocalPoint } from "@excalidraw/math";
+import { type Bounds } from "@excalidraw/common";
+import type { ElementsMap, ExcalidrawElement } from "@excalidraw/element/types";
 import type { Curve } from "@excalidraw/math";
 import type { LineSegment } from "@excalidraw/utils";
-import { type Bounds } from "./bounds";
 declare global {
     interface Window {
         visualDebug?: {
@@ -12,9 +13,20 @@ declare global {
 }
 export type DebugElement = {
     color: string;
-    data: LineSegment<GlobalPoint> | Curve<GlobalPoint>;
+    data: LineSegment<GlobalPoint> | Curve<GlobalPoint> | DebugPolygon;
     permanent: boolean;
 };
+export type DebugPolygon = {
+    type: "polygon";
+    points: GlobalPoint[];
+    fill?: boolean;
+    close?: boolean;
+};
+export declare const debugDrawHitVolume: (element: ExcalidrawElement, elementsMap: ElementsMap, options?: {
+    rays?: number;
+    color?: string;
+    fill?: boolean;
+}) => void;
 export declare const debugDrawCubicBezier: (c: Curve<GlobalPoint>, opts?: {
     color?: string;
     permanent?: boolean;
@@ -23,6 +35,12 @@ export declare const debugDrawLine: (segment: LineSegment<GlobalPoint> | LineSeg
     color?: string;
     permanent?: boolean;
 }) => void;
+export declare const debugDrawPolygon: (points: GlobalPoint[], opts?: {
+    color?: string;
+    permanent?: boolean;
+    fill?: boolean;
+    close?: boolean;
+}) => void;
 export declare const debugDrawPoint: (p: GlobalPoint, opts?: {
     color?: string;
     permanent?: boolean;

package/dist/types/element/src/zindex.d.ts

@@ -6,7 +6,7 @@ import type { ExcalidrawArrowElement, ExcalidrawElement, NonDeletedExcalidrawEle
  * Moves the arrow element above any bindable elements it intersects with or
  * hovers over.
  */
-export declare const moveArrowAboveBindable: (point: GlobalPoint, arrow: ExcalidrawArrowElement, elements: readonly Ordered<NonDeletedExcalidrawElement>[], elementsMap: NonDeletedSceneElementsMap, scene: Scene) => readonly OrderedExcalidrawElement[];
+export declare const moveArrowAboveBindable: (point: GlobalPoint, arrow: ExcalidrawArrowElement, elements: readonly Ordered<NonDeletedExcalidrawElement>[], elementsMap: NonDeletedSceneElementsMap, scene: Scene, hit?: NonDeletedExcalidrawElement) => readonly OrderedExcalidrawElement[];
 export declare const moveOneLeft: (allElements: readonly ExcalidrawElement[], appState: AppState, scene: Scene) => readonly ExcalidrawElement[];
 export declare const moveOneRight: (allElements: readonly ExcalidrawElement[], appState: AppState, scene: Scene) => readonly ExcalidrawElement[];
 export declare const moveAllLeft: (allElements: readonly ExcalidrawElement[], appState: AppState) => readonly ExcalidrawElement[] | ExcalidrawElement[];