@excalidraw/math 0.18.0-3085f4a → 0.18.0-39103bd

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

@@ -1,13 +1,5 @@
-import oc from "open-color";
-import type { Merge } from "./utility-types";
-export declare const COLOR_OUTLINE_CONTRAST_THRESHOLD = 240;
-export type ColorPickerColor = Exclude<keyof oc, "indigo" | "lime"> | "transparent" | "bronze";
+export declare const applyDarkModeFilter: (color: string, enable?: boolean) => string;
 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;
 };
@@ -17,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 [number, number, number, number, number]) => 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 rgbToHex: (r: number, g: number, b: number) => 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

@@ -1,14 +1,5 @@
 import type { ExcalidrawElement, FontFamilyValues } from "@excalidraw/element/types";
 import type { AppProps, AppState } from "@excalidraw/excalidraw/types";
-export declare const isDarwin: boolean;
-export declare const isWindows: boolean;
-export declare const isAndroid: boolean;
-export declare const isFirefox: boolean;
-export declare const isChrome: boolean;
-export declare const isSafari: boolean;
-export declare const isIOS: boolean;
-export declare const isBrave: () => boolean;
-export declare const isMobile: boolean;
 export declare const supportsResizeObserver: boolean;
 export declare const APP_NAME = "Excalidraw";
 export declare const TEXT_AUTOWRAP_THRESHOLD = 36;
@@ -87,10 +78,20 @@ export declare const ENV: {
     PRODUCTION: string;
 };
 export declare const CLASSES: {
+    SIDEBAR: string;
     SHAPE_ACTIONS_MENU: string;
     ZOOM_ACTIONS: string;
     SEARCH_MENU_INPUT_WRAPPER: string;
     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;
+    readonly md: 20;
+    readonly lg: 28;
+    readonly xl: 36;
 };
 export declare const CJK_HAND_DRAWN_FALLBACK_FONT = "Xiaolai";
 export declare const WINDOWS_EMOJI_FALLBACK_FONT = "Segoe UI Emoji";
@@ -131,17 +132,15 @@ 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: string;
-    strokeWidth: number;
-    strokeStyle: import("@excalidraw/element/types").StrokeStyle;
-    fillStyle: import("@excalidraw/element/types").FillStyle;
-    roughness: number;
-    roundness: {
-        type: import("@excalidraw/element/types").RoundnessType;
-        value?: number | undefined;
-    } | null;
-    backgroundColor: string;
+    strokeColor: ExcalidrawElement["strokeColor"];
+    strokeWidth: ExcalidrawElement["strokeWidth"];
+    strokeStyle: ExcalidrawElement["strokeStyle"];
+    fillStyle: ExcalidrawElement["fillStyle"];
+    roughness: ExcalidrawElement["roughness"];
+    roundness: ExcalidrawElement["roundness"];
+    backgroundColor: ExcalidrawElement["backgroundColor"];
     radius: number;
     nameOffsetY: number;
     nameColorLightTheme: string;
@@ -176,6 +175,15 @@ export declare const IMAGE_MIME_TYPES: {
     readonly avif: "image/avif";
     readonly jfif: "image/jfif";
 };
+export declare const STRING_MIME_TYPES: {
+    readonly text: "text/plain";
+    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";
+};
 export declare const MIME_TYPES: {
     readonly svg: "image/svg+xml";
     readonly png: "image/png";
@@ -186,14 +194,16 @@ export declare const MIME_TYPES: {
     readonly ico: "image/x-icon";
     readonly avif: "image/avif";
     readonly jfif: "image/jfif";
+    readonly "excalidraw.svg": "image/svg+xml";
+    readonly "excalidraw.png": "image/png";
+    readonly binary: "application/octet-stream";
     readonly text: "text/plain";
     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 "excalidraw.svg": "image/svg+xml";
-    readonly "excalidraw.png": "image/png";
-    readonly binary: "application/octet-stream";
+    readonly excalidrawlibIds: "application/vnd.excalidrawlib.ids+json";
 };
 export declare const ALLOWED_PASTE_MIME_TYPES: readonly ["text/plain", "text/html", ...("image/svg+xml" | "image/png" | "image/jpeg" | "image/gif" | "image/webp" | "image/bmp" | "image/x-icon" | "image/avif" | "image/jfif")[]];
 export declare const EXPORT_IMAGE_TYPES: {
@@ -220,7 +230,6 @@ export declare const MAX_ZOOM = 30;
 export declare const HYPERLINK_TOOLTIP_DELAY = 300;
 export declare const IDLE_THRESHOLD = 60000;
 export declare const ACTIVE_THRESHOLD = 3000;
-export declare const THEME_FILTER = "invert(93%) hue-rotate(180deg)";
 export declare const URL_QUERY_KEYS: {
     readonly addLibrary: "addLibrary";
 };
@@ -228,15 +237,10 @@ export declare const URL_HASH_KEYS: {
     readonly addLibrary: "addLibrary";
 };
 export declare const DEFAULT_UI_OPTIONS: AppProps["UIOptions"];
-export declare const MQ_MAX_WIDTH_PORTRAIT = 730;
-export declare const MQ_MAX_WIDTH_LANDSCAPE = 1000;
-export declare const MQ_MAX_HEIGHT_LANDSCAPE = 500;
-export declare const MQ_RIGHT_SIDEBAR_MIN_WIDTH = 1229;
 export declare const MAX_DECIMALS_FOR_SVG_EXPORT = 2;
 export declare const EXPORT_SCALES: number[];
 export declare const DEFAULT_EXPORT_PADDING = 10;
-export declare const DEFAULT_MAX_IMAGE_WIDTH_OR_HEIGHT = 1440;
-export declare const MAX_ALLOWED_FILE_BYTES: number;
+export declare const DEFAULT_IMAGE_OPTIONS: AppProps["imageOptions"];
 export declare const SVG_NS = "http://www.w3.org/2000/svg";
 export declare const SVG_DOCUMENT_PREAMBLE = "<?xml version=\"1.0\" standalone=\"no\"?>\n<!DOCTYPE svg PUBLIC \"-//W3C//DTD SVG 1.1//EN\" \"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd\">\n";
 export declare const ENCRYPTION_KEY_BITS = 128;
@@ -258,6 +262,7 @@ export declare const TEXT_ALIGN: {
     RIGHT: string;
 };
 export declare const ELEMENT_READY_TO_ERASE_OPACITY = 20;
+export declare const ELEMENT_PENDING_DRAW_SHAPE_OPACITY = 70;
 export declare const DEFAULT_PROPORTIONAL_RADIUS = 0.25;
 export declare const DEFAULT_ADAPTIVE_RADIUS = 32;
 export declare const ROUNDNESS: {
@@ -270,11 +275,12 @@ export declare const ROUGHNESS: {
     readonly artist: 1;
     readonly cartoonist: 2;
 };
-export declare const STROKE_WIDTH: {
-    readonly thin: 1;
-    readonly bold: 2;
-    readonly extraBold: 4;
-};
+export type StrokeWidthKey = "thin" | "medium" | "bold";
+export declare const STROKE_WIDTH_KEYS: readonly StrokeWidthKey[];
+export declare const STROKE_WIDTH: Readonly<Record<StrokeWidthKey | "extraBold", ExcalidrawElement["strokeWidth"]>>;
+export declare const FREEDRAW_STROKE_WIDTH: Readonly<Record<StrokeWidthKey | "extraBold", ExcalidrawElement["strokeWidth"]>>;
+export declare const getStrokeWidthByKey: (elementType: ExcalidrawElement["type"], strokeWidthKey: StrokeWidthKey) => ExcalidrawElement["strokeWidth"];
+export declare const DEFAULT_ELEMENT_STROKE_WIDTH_KEY: StrokeWidthKey;
 export declare const DEFAULT_ELEMENT_PROPS: {
     strokeColor: ExcalidrawElement["strokeColor"];
     backgroundColor: ExcalidrawElement["backgroundColor"];
@@ -309,6 +315,7 @@ export declare const TOOL_TYPE: {
     readonly magicframe: "magicframe";
     readonly embeddable: "embeddable";
     readonly laser: "laser";
+    readonly autoshape: "autoshape";
 };
 export declare const EDITOR_LS_KEYS: {
     readonly OAI_API_KEY: "excalidraw-oai-api-key";
@@ -344,3 +351,9 @@ export declare enum UserIdleState {
  */
 export declare const LINE_POLYGON_POINT_MERGE_DISTANCE = 20;
 export declare const DOUBLE_TAP_POSITION_THRESHOLD = 35;
+export declare const BIND_MODE_TIMEOUT = 700;
+export declare const MOBILE_ACTION_BUTTON_BG: {
+    readonly background: "var(--mobile-action-button-bg)";
+};
+export declare const DEFAULT_STROKE_STREAMLINE = 0.5;
+export declare const DEFAULT_STROKE_STREAMLINE_PRECISE = 0.2;

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

@@ -0,0 +1,34 @@
+export type StylesPanelMode = "compact" | "full" | "mobile";
+export type EditorInterface = Readonly<{
+    formFactor: "phone" | "tablet" | "desktop";
+    desktopUIMode: "compact" | "full";
+    userAgent: Readonly<{
+        isMobileDevice: boolean;
+        platform: "ios" | "android" | "other" | "unknown";
+    }>;
+    isTouchScreen: boolean;
+    canFitSidebar: boolean;
+    isLandscape: boolean;
+}>;
+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 = 1180;
+export declare const MQ_MIN_WIDTH_DESKTOP = 1440;
+export declare const MQ_RIGHT_SIDEBAR_MIN_WIDTH = 1229;
+export declare const isDarwin: boolean;
+export declare const isWindows: boolean;
+export declare const isAndroid: boolean;
+export declare const isFirefox: boolean;
+export declare const isChrome: boolean;
+export declare const isSafari: boolean;
+export declare const isIOS: boolean;
+export declare const isBrave: () => boolean;
+export declare const isMobileBreakpoint: (width: number, height: number) => boolean;
+export declare const isTabletBreakpoint: (editorWidth: number, editorHeight: number) => boolean;
+export declare const getFormFactor: (editorWidth: number, editorHeight: number) => EditorInterface["formFactor"];
+export declare const deriveStylesPanelMode: (editorInterface: EditorInterface) => StylesPanelMode;
+export declare const createUserAgentDescriptor: (userAgentString: string) => EditorInterface["userAgent"];
+export declare const loadDesktopUIModePreference: () => "compact" | "full" | null;
+export declare const setDesktopUIMode: (mode: EditorInterface["desktopUIMode"]) => "compact" | "full" | undefined;

package/dist/types/common/src/font-metadata.d.ts

@@ -43,6 +43,4 @@ export declare const getVerticalOffset: (fontFamily: ExcalidrawTextElement["font
 /**
  * Gets line height for a selected family.
  */
-export declare const getLineHeight: (fontFamily: FontFamilyValues) => number & {
-    _brand: "unitlessLineHeight";
-};
+export declare const getLineHeight: (fontFamily: FontFamilyValues) => ExcalidrawTextElement["lineHeight"];

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

@@ -1,4 +1,5 @@
 export * from "./binary-heap";
+export * from "./bounds";
 export * from "./colors";
 export * from "./constants";
 export * from "./font-metadata";
@@ -10,3 +11,7 @@ export * from "./random";
 export * from "./url";
 export * from "./utils";
 export * from "./emitter";
+export * from "./appEventBus";
+export * from "./editorInterface";
+export * from "./versionedSnapshotStore";
+export { Debug } from "../debug";

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

@@ -183,7 +183,7 @@ export declare const isLatinChar: (key: string) => boolean;
  * More details in https://github.com/excalidraw/excalidraw/pull/5944
  */
 export declare const matchKey: (event: KeyboardEvent | React.KeyboardEvent<Element>, key: ValueOf<typeof KEYS>) => boolean;
-export declare const isArrowKey: (key: string) => boolean;
+export declare const isArrowKey: (key: string) => key is "ArrowDown" | "ArrowLeft" | "ArrowRight" | "ArrowUp";
 export declare const shouldResizeFromCenter: (event: MouseEvent | KeyboardEvent) => boolean;
 export declare const shouldMaintainAspectRatio: (event: MouseEvent | KeyboardEvent) => boolean;
 export declare const shouldRotateWithDiscreteAngle: (event: MouseEvent | KeyboardEvent | React.PointerEvent<HTMLCanvasElement>) => boolean;

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

@@ -6,4 +6,4 @@ export declare const getSizeFromPoints: (points: readonly (GlobalPoint | LocalPo
 };
 /** @arg dimension, 0 for rescaling only x, 1 for y */
 export declare const rescalePoints: <Point extends GlobalPoint | LocalPoint>(dimension: 0 | 1, newSize: number, points: readonly Point[], normalize: boolean) => Point[];
-export declare const getGridPoint: (x: number, y: number, gridSize: NullableGridSize) => [number, number];
+export declare const getGridPoint: (x: number, y: number, gridSize: NullableGridSize) => GlobalPoint;

package/dist/types/common/src/utility-types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export type Mutable<T> = {
     -readonly [P in keyof T]: T[P];
 };

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

@@ -1,14 +1,15 @@
-import type { ExcalidrawBindableElement, FontFamilyValues, FontString } from "@excalidraw/element/types";
+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 } from "./utility-types";
+import type { MaybePromise, ResolutionType } from "./utility-types";
 import type { EVENT } from "./constants";
 export declare const setDateTimeForTests: (dateTime: string) => void;
 export declare const getDateTime: () => string;
 export declare const capitalizeString: (str: string) => string;
 export declare const isToolIcon: (target: Element | EventTarget | null) => target is HTMLElement;
-export declare const isInputLike: (target: Element | EventTarget | null) => target is HTMLBRElement | HTMLDivElement | HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;
+export declare const isInputLike: (target: Element | EventTarget | null) => target is HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement | HTMLBRElement | HTMLDivElement;
 export declare const isInteractive: (target: Element | EventTarget | null) => boolean;
-export declare const isWritableElement: (target: Element | EventTarget | null) => target is HTMLBRElement | HTMLDivElement | HTMLInputElement | HTMLTextAreaElement;
+export declare const isWritableElement: (target: Element | EventTarget | null) => target is HTMLInputElement | HTMLTextAreaElement | HTMLBRElement | HTMLDivElement;
 export declare const getFontFamilyString: ({ fontFamily, }: {
     fontFamily: FontFamilyValues;
 }) => string;
@@ -17,14 +18,14 @@ export declare const getFontString: ({ fontSize, fontFamily, }: {
     fontSize: number;
     fontFamily: FontFamilyValues;
 }) => FontString;
+/** executes callback in the frame that's after the current one */
+export declare const nextAnimationFrame: (cb: () => any) => Promise<void>;
 export declare const debounce: <T extends any[]>(fn: (...args: T) => void, timeout: number) => {
     (...args: T): void;
     flush(): void;
     cancel(): void;
 };
-export declare const throttleRAF: <T extends any[]>(fn: (...args: T) => void, opts?: {
-    trailing?: boolean;
-}) => {
+export declare const throttleRAF: <T extends any[]>(fn: (...args: T) => void) => {
     (...args: T): void;
     flush(): void;
     cancel(): void;
@@ -36,50 +37,11 @@ export declare const throttleRAF: <T extends any[]>(fn: (...args: T) => void, op
  * @returns {number} The tweened value.
  */
 export declare const easeOut: (k: number) => number;
-/**
- * Animates values from `fromValues` to `toValues` using the requestAnimationFrame API.
- * Executes the `onStep` callback on each step with the interpolated values.
- * Returns a function that can be called to cancel the animation.
- *
- * @example
- * // Example usage:
- * const fromValues = { x: 0, y: 0 };
- * const toValues = { x: 100, y: 200 };
- * const onStep = ({x, y}) => {
- *   setState(x, y)
- * };
- * const onCancel = () => {
- *   console.log("Animation canceled");
- * };
- *
- * const cancelAnimation = easeToValuesRAF({
- *   fromValues,
- *   toValues,
- *   onStep,
- *   onCancel,
- * });
- *
- * // To cancel the animation:
- * cancelAnimation();
- */
-export declare const easeToValuesRAF: <T extends Record<keyof T, number>, K extends keyof T>({ fromValues, toValues, onStep, duration, interpolateValue, onStart, onEnd, onCancel, }: {
-    fromValues: T;
-    toValues: T;
-    /**
-     * Interpolate a single value.
-     * Return undefined to be handled by the default interpolator.
-     */
-    interpolateValue?: ((fromValue: number, toValue: number, progress: number, key: K) => number | undefined) | undefined;
-    onStep: (values: T) => void;
-    duration?: number | undefined;
-    onStart?: (() => void) | undefined;
-    onEnd?: (() => void) | undefined;
-    onCancel?: (() => void) | undefined;
-}) => () => void;
-export declare const chunk: <T extends unknown>(array: readonly T[], size: number) => T[][];
+export declare const chunk: <T extends any>(array: readonly T[], size: number) => T[][];
 export declare const selectNode: (node: Element) => void;
 export declare const removeSelection: () => void;
 export declare const distance: (x: number, y: number) => number;
+export declare const isSelectionLikeTool: (type: ToolType | "custom") => type is "selection" | "lasso";
 export declare const updateActiveTool: (appState: Pick<AppState, "activeTool">, data: (({
     type: ToolType;
 } | {
@@ -89,12 +51,11 @@ export declare const updateActiveTool: (appState: Pick<AppState, "activeTool">,
     locked?: boolean;
     fromSelection?: boolean;
 }) & {
-    lastActiveToolBeforeEraser?: ActiveTool | null;
+    lastActiveTool?: ActiveTool | null;
 }) => AppState["activeTool"];
 export declare const isFullScreen: () => boolean;
 export declare const allowFullScreen: () => Promise<void>;
 export declare const exitFullScreen: () => Promise<void>;
-export declare const getShortcutKey: (shortcut: string) => string;
 export declare const viewportCoordsToSceneCoords: ({ clientX, clientY }: {
     clientX: number;
     clientY: number;
@@ -104,10 +65,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;
@@ -138,9 +96,7 @@ export declare const muteFSAbortError: (error?: Error) => void;
 export declare const findIndex: <T>(array: readonly T[], cb: (element: T, index: number, array: readonly T[]) => boolean, fromIndex?: number) => number;
 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 | null | undefined) => K | undefined;
-export declare const isTransparent: (color: string) => boolean;
-export declare const isBindingFallthroughEnabled: (el: ExcalidrawBindableElement) => boolean;
+export declare const mapFind: <T, K>(collection: readonly T[], iteratee: (value: T, index: number) => K | undefined | null) => K | undefined;
 export type ResolvablePromise<T> = Promise<T> & {
     resolve: [T] extends [undefined] ? (value?: MaybePromise<Awaited<T>>) => void : (value: MaybePromise<Awaited<T>>) => void;
     reject: (error: Error) => void;
@@ -158,16 +114,16 @@ export declare const getUpdatedTimestamp: () => number;
  * Transforms array of objects containing `id` attribute,
  * or array of ids (strings), into a Map, keyd by `id`.
  */
-export declare const arrayToMap: <T extends string | {
+export declare const arrayToMap: <T extends {
     id: string;
-}>(items: Map<string, T> | readonly T[]) => Map<string, T>;
+} | string>(items: readonly T[] | Map<string, T>) => Map<string, T>;
 export declare const arrayToMapWithIndex: <T extends {
     id: string;
 }>(elements: readonly T[]) => Map<string, [element: T, index: number]>;
 /**
  * Transform array into an object, use only when array order is irrelevant.
  */
-export declare const arrayToObject: <T>(array: readonly T[], groupBy?: ((value: T) => string | number) | undefined) => {
+export declare const arrayToObject: <T>(array: readonly T[], groupBy?: (value: T) => string | number) => {
     [key: string]: T;
 };
 /** Doubly linked node */
@@ -183,11 +139,11 @@ export declare const arrayToList: <T>(array: readonly T[]) => Node<T>[];
  * Converts a readonly array or map into an iterable.
  * Useful for avoiding entry allocations when iterating object / map on each iteration.
  */
-export declare const toIterable: <T>(values: ReadonlyMap<string, T> | readonly T[]) => Iterable<T>;
+export declare const toIterable: <T>(values: readonly T[] | ReadonlyMap<string, T>) => Iterable<T>;
 /**
  * Converts a readonly array or map into an array.
  */
-export declare const toArray: <T>(values: ReadonlyMap<string, T> | readonly T[]) => T[];
+export declare const toArray: <T>(values: readonly T[] | ReadonlyMap<string, T>) => T[];
 export declare const isTestEnv: () => boolean;
 export declare const isDevEnv: () => boolean;
 export declare const isProdEnv: () => boolean;
@@ -199,18 +155,18 @@ export declare const updateObject: <T extends Record<string, any>>(obj: T, updat
 export declare const isPrimitive: (val: any) => boolean;
 export declare const getFrame: () => "top" | "iframe";
 export declare const isRunningInIframe: () => boolean;
-export declare const isPromiseLike: (value: any) => value is Promise<any>;
+export declare const isPromiseLike: (value: any) => value is Promise<ResolutionType<typeof value>>;
 export declare const queryFocusableElements: (container: HTMLElement | null) => HTMLElement[];
 /**
  * Returns whether object/array is shallow equal.
  * Considers empty object/arrays as equal (whether top-level or second-level).
  */
-export declare const isShallowEqual: <T extends Record<string, any>, K extends readonly unknown[]>(objA: T, objB: T, comparators?: { [key in keyof T]?: ((a: T[key], b: T[key]) => boolean) | undefined; } | (keyof T extends K[number] ? K extends readonly (keyof T)[] ? K : {
+export declare const isShallowEqual: <T extends Record<string, any>, K extends readonly unknown[]>(objA: T, objB: T, comparators?: { [key in keyof T]?: (a: T[key], b: T[key]) => boolean; } | (keyof T extends K[number] ? K extends readonly (keyof T)[] ? K : {
     _error: "keys are either missing or include keys not in compared obj";
 } : {
     _error: "keys are either missing or include keys not in compared obj";
-}) | undefined, debug?: boolean) => boolean;
-export declare const composeEventHandlers: <E>(originalEventHandler?: ((event: E) => void) | undefined, ourEventHandler?: ((event: E) => void) | undefined, { checkForDefaultPrevented }?: {
+}), debug?: boolean) => boolean;
+export declare const composeEventHandlers: <E>(originalEventHandler?: (event: E) => void, ourEventHandler?: (event: E) => void, { checkForDefaultPrevented }?: {
     checkForDefaultPrevented?: boolean | undefined;
 }) => (event: E) => void;
 /**
@@ -222,11 +178,15 @@ export declare function invariant(condition: any, message: string): asserts cond
 /**
  * Memoizes on values of `opts` object (strict equality).
  */
-export declare const memoize: <T extends Record<string, any>, R extends unknown>(func: (opts: T) => R) => ((opts: T) => R) & {
+export declare const memoize: <T extends Record<string, any>, R extends any>(func: (opts: T) => R) => typeof func & {
     clear: () => void;
 };
 /** 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 isMemberOf: <T extends string>(
+/** Set/Map/Array/Object */
+collection: Set<T> | readonly T[] | Record<T, any> | Map<T, any>, 
+/** value to look for */
+value: string) => value is T;
 export declare const cloneJSON: <T>(obj: T) => T;
 export declare const updateStable: <T extends any[] | Record<string, any>>(prevValue: T, nextValue: T) => T;
 export declare function addEventListener<K extends keyof WindowEventMap>(target: Window & typeof globalThis, type: K, listener: (this: Window, ev: WindowEventMap[K]) => any, options?: boolean | AddEventListenerOptions): UnsubscribeCallback;
@@ -237,21 +197,25 @@ export declare function addEventListener<K extends keyof FontFaceSetEventMap>(ta
 export declare function addEventListener<K extends keyof HTMLElementEventMap>(target: Document | (Window & typeof globalThis) | HTMLElement | undefined | null | false, type: K, listener: (this: HTMLDivElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): UnsubscribeCallback;
 export declare function getSvgPathFromStroke(points: number[][], closed?: boolean): string;
 export declare const normalizeEOL: (str: string) => string;
-type HasBrand<T> = {
-    [K in keyof T]: K extends `~brand${infer _}` ? true : never;
+export type HasBrand<T> = {
+    [K in keyof T]: K extends `~brand${infer _}` | "_brand" ? true : never;
 }[keyof T];
 type RemoveAllBrands<T> = HasBrand<T> extends true ? {
-    [K in keyof T as K extends `~brand~${infer _}` ? never : K]: T[K];
-} : never;
-type Unbrand<T> = T extends Map<infer E, infer F> ? Map<E, F> : T extends Set<infer E> ? Set<E> : T extends Array<infer E> ? Array<E> : RemoveAllBrands<T>;
+    [K in keyof T as K extends `~brand~${infer _}` | "_brand" ? never : K]: T[K];
+} : T;
+type UnbrandForValue<T> = T extends Map<infer E, infer F> ? Map<UnbrandForValue<E>, UnbrandForValue<F>> : T extends Set<infer E> ? Set<UnbrandForValue<E>> : T extends readonly any[] ? T extends any[] ? unknown[] : readonly unknown[] : RemoveAllBrands<T>;
+export type Unbrand<T> = T extends Map<infer E, infer F> ? Map<Unbrand<E>, Unbrand<F>> : T extends Set<infer E> ? Set<Unbrand<E>> : T extends readonly (infer E)[] ? Array<Unbrand<E>> : RemoveAllBrands<T>;
+export type CombineBrands<BrandedType, CurrentType> = BrandedType extends readonly (infer BE)[] ? CurrentType extends readonly (infer CE)[] ? Array<CE & BE> : CurrentType & BrandedType : CurrentType & BrandedType;
+export type CombineBrandsIfNeeded<T, Required> = [T] extends [Required] ? T[] : HasBrand<T> extends true ? CombineBrands<T, Required>[] : Required[];
 /**
  * Makes type into a branded type, ensuring that value is assignable to
- * the base ubranded type. Optionally you can explicitly supply current value
+ * the base unbranded type. Optionally you can explicitly supply current value
  * type to combine both (useful for composite branded types. Make sure you
  * compose branded types which are not composite themselves.)
  */
-export declare const toBrandedType: <BrandedType, CurrentType = BrandedType>(value: Unbrand<BrandedType>) => CurrentType & BrandedType;
-export declare const promiseTry: <TValue, TArgs extends unknown[]>(fn: (...args: TArgs) => TValue | PromiseLike<TValue>, ...args: TArgs) => Promise<TValue>;
+export declare function toBrandedType<BrandedType>(value: UnbrandForValue<BrandedType>): BrandedType;
+export declare function toBrandedType<BrandedType, CurrentType>(value: CurrentType): CombineBrands<BrandedType, CurrentType>;
+export declare const promiseTry: <TValue, TArgs extends unknown[]>(fn: (...args: TArgs) => PromiseLike<TValue> | TValue, ...args: TArgs) => Promise<TValue>;
 export declare const isAnyTrue: (...args: boolean[]) => boolean;
 export declare const safelyParseJSON: (json: string) => Record<string, any> | null;
 /**
@@ -263,5 +227,11 @@ export declare const castArray: <T>(value: T | T[]) => T[];
 /** hack for Array.isArray type guard not working with readonly value[] */
 export declare const isReadonlyArray: (value?: any) => value is readonly any[];
 export declare const sizeOf: (value: readonly unknown[] | Readonly<Map<string, unknown>> | Readonly<Record<string, unknown>> | ReadonlySet<unknown>) => number;
-export declare const reduceToCommonValue: <T, R = T>(collection: ReadonlySet<T> | readonly T[], getValue?: ((item: T) => R) | undefined) => R | null;
+export declare const reduceToCommonValue: <T, R = T>(collection: readonly T[] | ReadonlySet<T>, getValue?: (item: T) => R) => R | null;
+type FEATURE_FLAGS = {
+    COMPLEX_BINDINGS: boolean;
+};
+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/common/src/versionedSnapshotStore.d.ts

@@ -0,0 +1,17 @@
+export type VersionedSnapshot<T> = Readonly<{
+    version: number;
+    value: T;
+}>;
+export declare class VersionedSnapshotStore<T> {
+    private readonly isEqual;
+    private version;
+    private value;
+    private readonly waiters;
+    private readonly subscribers;
+    constructor(initialValue: T, isEqual?: (prev: T, next: T) => boolean);
+    getSnapshot(): VersionedSnapshot<T>;
+    set(nextValue: T): boolean;
+    update(updater: (prev: T) => T): boolean;
+    subscribe(subscriber: (snapshot: VersionedSnapshot<T>) => void): () => void;
+    pull(sinceVersion?: number): Promise<VersionedSnapshot<T>>;
+}