tldraw 4.6.0-next.fe1474dc57d8 → 5.0.0

package/dist-cjs/index.d.ts

@@ -37,6 +37,8 @@ import { MigrationFailureReason } from '@tldraw/editor';
 import { MigrationSequence } from '@tldraw/store';
 import { NamedExoticComponent } from 'react';
 import { Node as Node_2 } from '@tiptap/pm/model';
+import { OverlayOptionsWithDisplayValues } from '@tldraw/editor';
+import { OverlayUtil } from '@tldraw/editor';
 import { PerfectDashTerminal } from '@tldraw/editor';
 import { PointerEvent as PointerEvent_2 } from 'react';
 import { Polygon2d } from '@tldraw/editor';
@@ -54,10 +56,13 @@ import { RefAttributes } from 'react';
 import { RefObject } from 'react';
 import { Result } from '@tldraw/editor';
 import { RichTextFontVisitorState } from '@tldraw/editor';
+import { RotateCorner } from '@tldraw/editor';
 import { SerializedSchema } from '@tldraw/editor';
+import { ShapeIndicatorOverlayUtil } from '@tldraw/editor';
 import { ShapeUtil } from '@tldraw/editor';
 import { ShapeWithCrop } from '@tldraw/editor';
 import { SharedStyle } from '@tldraw/editor';
+import { SnapIndicator } from '@tldraw/editor';
 import { StateNode } from '@tldraw/editor';
 import { StyleProp } from '@tldraw/editor';
 import { SvgExportContext } from '@tldraw/editor';
@@ -80,6 +85,7 @@ import { TLClickEventInfo } from '@tldraw/editor';
 import { TLClipboardWriteInfo } from '@tldraw/editor';
 import { TLContent } from '@tldraw/editor';
 import { TLCropInfo } from '@tldraw/editor';
+import { TLCursorType } from '@tldraw/editor';
 import { TLDefaultColorStyle } from '@tldraw/tlschema';
 import { TLDefaultFontStyle } from '@tldraw/tlschema';
 import { TLDefaultSizeStyle } from '@tldraw/editor';
@@ -107,7 +113,6 @@ import { TLGeoShape } from '@tldraw/editor';
 import { TLGeoShapeProps } from '@tldraw/editor';
 import { TLHandle } from '@tldraw/editor';
 import { TLHandleDragInfo } from '@tldraw/editor';
-import { TLHandlesProps } from '@tldraw/editor';
 import { TLHighlightShape } from '@tldraw/editor';
 import { TLHighlightShapeProps } from '@tldraw/editor';
 import { TLImageAsset } from '@tldraw/editor';
@@ -119,6 +124,7 @@ import { TLLineShape } from '@tldraw/editor';
 import { TLLineShapePoint } from '@tldraw/editor';
 import { TLNoteShape } from '@tldraw/editor';
 import { TLNoteShapeProps } from '@tldraw/editor';
+import { TLOverlay } from '@tldraw/editor';
 import { TLPageId } from '@tldraw/editor';
 import { TLParentId } from '@tldraw/tlschema';
 import { TLPointerEventInfo } from '@tldraw/editor';
@@ -126,8 +132,8 @@ import { TLPropsMigrations } from '@tldraw/tlschema';
 import { TLResizeInfo } from '@tldraw/editor';
 import { TLRichText } from '@tldraw/editor';
 import { TLSchema } from '@tldraw/editor';
-import { TLScribbleProps } from '@tldraw/editor';
-import { TLSelectionForegroundProps } from '@tldraw/editor';
+import { TLScribble } from '@tldraw/editor';
+import { TLSelectionHandle } from '@tldraw/editor';
 import { TLShape } from '@tldraw/editor';
 import { TLShapeCrop } from '@tldraw/editor';
 import { TLShapeId } from '@tldraw/editor';
@@ -183,6 +189,33 @@ export declare const allDefaultFontFaces: TLFontFace_2[];
 /** @public @react */
 export declare function ArrangeMenuSubmenu(): JSX.Element | null;
 
+/**
+ * Overlay util for the dashed binding hint shown on bound arrows. Draws stubs
+ * along the arrow's handle path, from each bound endpoint's snapped body
+ * position to the user's intended (handle) position, with a precision marker
+ * at the handle.
+ *
+ * @public
+ */
+export declare class ArrowBindingHintOverlayUtil extends OverlayUtil<TLArrowBindingHintOverlay> {
+    static type: string;
+    options: {
+        crossSize: number;
+        dashedMinZoom: number;
+        dashLengthRatio: number;
+        dotRadius: number;
+        opacity: number;
+        strokeWidth: number;
+        zIndex: number;
+    };
+    isActive(): boolean;
+    getOverlays(): TLArrowBindingHintOverlay[];
+    render(ctx: CanvasRenderingContext2D, overlays: TLArrowBindingHintOverlay[]): void;
+    private drawEndpoint;
+    /** Tangent direction at the handle, oriented toward the body. */
+    private getMarkerAngle;
+}
+
 /**
  * @public
  */
@@ -201,6 +234,26 @@ export declare class ArrowBindingUtil extends BindingUtil<TLArrowBinding> {
 /** @public @react */
 export declare function ArrowDownToolbarItem(): JSX.Element;
 
+/**
+ * Overlay util for arrow target hints (target shape indicator + edge snap circles).
+ *
+ * @public
+ */
+export declare class ArrowHintOverlayUtil extends OverlayUtil<TLArrowHintOverlay> {
+    static type: string;
+    options: {
+        edgePointRadius: number;
+        edgeRadius: number;
+        handleRadius: number;
+        lineWidth: number;
+        zIndex: number;
+    };
+    isActive(): boolean;
+    getOverlays(): TLArrowHintOverlay[];
+    render(ctx: CanvasRenderingContext2D, overlays: TLArrowHintOverlay[]): void;
+    /* Excluded from this release type: _renderIndicatorPath */
+}
+
 /** @public @react */
 export declare function ArrowLeftToolbarItem(): JSX.Element;
 
@@ -366,8 +419,6 @@ export declare class ArrowShapeUtil extends ShapeUtil<TLArrowShape> {
     };
     onDoubleClickHandle(shape: TLArrowShape, handle: TLHandle): TLShapePartial<TLArrowShape> | void;
     component(shape: TLArrowShape): JSX.Element | null;
-    indicator(shape: TLArrowShape): JSX.Element | null;
-    useLegacyIndicator(): boolean;
     getIndicatorPath(shape: TLArrowShape): {
         additionalPaths: Path2D[];
         clipPath: Path2D;
@@ -487,8 +538,6 @@ export declare class BookmarkShapeUtil extends BaseBoxShapeUtil<TLBookmarkShape>
     getAriaDescriptor(shape: TLBookmarkShape): string | undefined;
     getDefaultProps(): TLBookmarkShape['props'];
     component(shape: TLBookmarkShape): JSX.Element;
-    indicator(shape: TLBookmarkShape): JSX.Element;
-    useLegacyIndicator(): boolean;
     getIndicatorPath(shape: TLBookmarkShape): Path2D;
     onBeforeCreate(next: TLBookmarkShape): {
         id: TLShapeId_2;
@@ -549,6 +598,32 @@ export declare interface BreakPointProviderProps {
     children: ReactNode;
 }
 
+/**
+ * Overlay util for the selection brush rectangle.
+ *
+ * @public
+ */
+export declare class BrushOverlayUtil extends OverlayUtil<TLBrushOverlay> {
+    static type: string;
+    options: BrushOverlayUtilOptions;
+    isActive(): boolean;
+    getOverlays(): TLBrushOverlay[];
+    render(ctx: CanvasRenderingContext2D, overlays: TLBrushOverlay[]): void;
+    renderMinimap(ctx: CanvasRenderingContext2D, overlays: TLBrushOverlay[], zoom: number): void;
+}
+
+/** @public */
+export declare interface BrushOverlayUtilDisplayValues {
+    fillColor: string;
+    strokeColor: string;
+    lineWidth: number;
+}
+
+/** @public */
+export declare interface BrushOverlayUtilOptions extends OverlayOptionsWithDisplayValues<TLBrushOverlay, BrushOverlayUtilDisplayValues> {
+    zIndex: number;
+}
+
 /* Excluded from this release type: buildFromV1Document */
 
 /** @public @react */
@@ -593,6 +668,111 @@ export declare function ClipboardMenuGroup(): JSX.Element;
 /** @public @react */
 export declare function CloudToolbarItem(): JSX.Element;
 
+/**
+ * Overlay util for collaborator selection brushes.
+ *
+ * @public
+ */
+export declare class CollaboratorBrushOverlayUtil extends OverlayUtil<TLCollaboratorBrushOverlay> {
+    static type: string;
+    options: {
+        lineWidth: number;
+        zIndex: number;
+    };
+    isActive(): boolean;
+    getOverlays(): TLCollaboratorBrushOverlay[];
+    render(ctx: CanvasRenderingContext2D, overlays: TLCollaboratorBrushOverlay[]): void;
+    renderMinimap(ctx: CanvasRenderingContext2D, overlays: TLCollaboratorBrushOverlay[]): void;
+}
+
+/**
+ * Overlay util for collaborator cursors (arrow + name tag + chat message).
+ *
+ * @public
+ */
+export declare class CollaboratorCursorOverlayUtil extends OverlayUtil<TLCollaboratorCursorOverlay> {
+    static type: string;
+    options: {
+        chatMaxWidth: number;
+        fontSize: number;
+        nameMaxWidth: number;
+        zIndex: number;
+    };
+    private _truncateCache;
+    isActive(): boolean;
+    getOverlays(): TLCollaboratorCursorOverlay[];
+    render(ctx: CanvasRenderingContext2D, overlays: TLCollaboratorCursorOverlay[]): void;
+    /** Name tag (no chat) - colored background with white text */
+    private _drawNameTag;
+    /** Name title (when chat is present) - text with shadow, no background */
+    private _drawNameTitle;
+    /** Chat bubble - colored background with white text */
+    private _drawChatBubble;
+    renderMinimap(ctx: CanvasRenderingContext2D, overlays: TLCollaboratorCursorOverlay[], zoom: number): void;
+    private _truncateText;
+    private _setTruncatedTextCache;
+}
+
+/**
+ * Overlay util for off-screen collaborator cursor hints.
+ * Shows a small directional arrow at the viewport edge pointing toward the collaborator.
+ *
+ * @public
+ */
+export declare class CollaboratorHintOverlayUtil extends OverlayUtil<TLCollaboratorHintOverlay> {
+    static type: string;
+    options: {
+        lineWidth: number;
+        viewportPadding: number;
+        zIndex: number;
+    };
+    isActive(): boolean;
+    getOverlays(): TLCollaboratorHintOverlay[];
+    render(ctx: CanvasRenderingContext2D, overlays: TLCollaboratorHintOverlay[]): void;
+    /* Excluded from this release type: _isCursorInViewport */
+}
+
+/**
+ * Overlay util for collaborator scribble strokes (eraser, lasso, etc.).
+ *
+ * @public
+ */
+export declare class CollaboratorScribbleOverlayUtil extends OverlayUtil<TLCollaboratorScribbleOverlay> {
+    static type: string;
+    options: {
+        cacheSize: number;
+        streamline: number;
+        zIndex: number;
+    };
+    private _collabScribblePathCache;
+    isActive(): boolean;
+    getOverlays(): TLCollaboratorScribbleOverlay[];
+    render(ctx: CanvasRenderingContext2D, overlays: TLCollaboratorScribbleOverlay[]): void;
+}
+
+/**
+ * Overlay util for remote collaborators' shape selection indicators.
+ *
+ * Renders a per-peer outline around each shape another user has selected,
+ * using the peer's color. Drawn under the local `ShapeIndicatorOverlayUtil`
+ * (lower z-index) so the local user's selection always appears on top.
+ *
+ * Non-interactive: contributes no hit-test geometry.
+ *
+ * @public
+ */
+export declare class CollaboratorShapeIndicatorOverlayUtil extends OverlayUtil<TLCollaboratorShapeIndicatorOverlay> {
+    static type: string;
+    options: {
+        alpha: number;
+        lineWidth: number;
+        zIndex: number;
+    };
+    isActive(): boolean;
+    getOverlays(): TLCollaboratorShapeIndicatorOverlay[];
+    render(ctx: CanvasRenderingContext2D, overlays: TLCollaboratorShapeIndicatorOverlay[]): void;
+}
+
 /** @public @react */
 export declare function ColorSchemeMenu(): JSX.Element;
 
@@ -989,6 +1169,130 @@ export declare function DefaultFollowingIndicator(): JSX.Element | null;
 /** @public */
 export declare const DefaultFontFaces: TLDefaultFonts;
 
+/**
+ * Built-in geo type definitions keyed by their `geo` prop value. Every default
+ * geo type (rectangle, ellipse, cloud, etc.) is registered here. The same
+ * registry powers path generation, handle snapping, the style panel picker,
+ * and creation defaults — so custom types added through
+ * {@link @tldraw/tldraw#GeoShapeUtil.configure | GeoShapeUtil.configure()} get
+ * the same treatment as the built-ins.
+ *
+ * The key order here defines the visual order of items in the geo style panel
+ * picker.
+ *
+ * @public
+ */
+export declare const defaultGeoTypeDefinitions: {
+    readonly 'arrow-down': {
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-arrow-down";
+        readonly snapType: "polygon";
+    };
+    readonly 'arrow-left': {
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-arrow-left";
+        readonly snapType: "polygon";
+    };
+    readonly 'arrow-right': {
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-arrow-right";
+        readonly snapType: "polygon";
+    };
+    readonly 'arrow-up': {
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-arrow-up";
+        readonly snapType: "polygon";
+    };
+    readonly 'check-box': {
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-check-box";
+        readonly snapType: "polygon";
+    };
+    readonly 'rhombus-2': {
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-rhombus-2";
+        readonly snapType: "polygon";
+    };
+    readonly 'x-box': {
+        readonly getPath: (w: number, h: number, shape: TLGeoShape, strokeWidth: number) => PathBuilder;
+        readonly icon: "geo-x-box";
+        readonly snapType: "polygon";
+    };
+    readonly cloud: {
+        readonly defaultSize: {
+            readonly h: 180;
+            readonly w: 300;
+        };
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-cloud";
+        readonly snapType: "blobby";
+    };
+    readonly diamond: {
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-diamond";
+        readonly snapType: "polygon";
+    };
+    readonly ellipse: {
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-ellipse";
+        readonly snapType: "blobby";
+    };
+    readonly heart: {
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-heart";
+        readonly snapType: "blobby";
+    };
+    readonly hexagon: {
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-hexagon";
+        readonly snapType: "polygon";
+    };
+    readonly octagon: {
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-octagon";
+        readonly snapType: "polygon";
+    };
+    readonly oval: {
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-oval";
+        readonly snapType: "blobby";
+    };
+    readonly pentagon: {
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-pentagon";
+        readonly snapType: "polygon";
+    };
+    readonly rectangle: {
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-rectangle";
+        readonly snapType: "polygon";
+    };
+    readonly rhombus: {
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-rhombus";
+        readonly snapType: "polygon";
+    };
+    readonly star: {
+        readonly defaultSize: {
+            readonly h: 190;
+            readonly w: 200;
+        };
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-star";
+        readonly snapType: "polygon";
+    };
+    readonly trapezoid: {
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-trapezoid";
+        readonly snapType: "polygon";
+    };
+    readonly triangle: {
+        readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
+        readonly icon: "geo-triangle";
+        readonly snapType: "polygon";
+    };
+};
+
 /** @public */
 export declare function defaultHandleExternalEmbedContent<T>(editor: Editor, { point, url, embed }: {
     embed: T;
@@ -1090,6 +1394,9 @@ export declare function DefaultMinimap(): JSX.Element;
 /** @public @react */
 export declare const DefaultNavigationPanel: NamedExoticComponent<object>;
 
+/** @public */
+export declare const defaultOverlayUtils: readonly [typeof CollaboratorShapeIndicatorOverlayUtil, typeof ShapeIndicatorOverlayUtil, typeof SelectionForegroundOverlayUtil, typeof ShapeHandleOverlayUtil, typeof BrushOverlayUtil, typeof ZoomBrushOverlayUtil, typeof SnapIndicatorOverlayUtil, typeof ScribbleOverlayUtil, typeof CollaboratorBrushOverlayUtil, typeof CollaboratorScribbleOverlayUtil, typeof CollaboratorHintOverlayUtil, typeof ArrowHintOverlayUtil, typeof ArrowBindingHintOverlayUtil, typeof CollaboratorCursorOverlayUtil];
+
 /** @public @react */
 export declare const DefaultPageMenu: NamedExoticComponent<object>;
 
@@ -1292,8 +1599,6 @@ export declare class DrawShapeUtil extends ShapeUtil<TLDrawShape> {
     getDefaultProps(): TLDrawShape['props'];
     getGeometry(shape: TLDrawShape): Circle2d | Polyline2d;
     component(shape: TLDrawShape): JSX.Element;
-    indicator(shape: TLDrawShape): JSX.Element;
-    useLegacyIndicator(): boolean;
     getIndicatorPath(shape: TLDrawShape): Path2D;
     toSvg(shape: TLDrawShape, ctx: SvgExportContext): JSX.Element;
     getCanvasSvgDefs(): TLShapeUtilCanvasSvgDef[];
@@ -1630,8 +1935,6 @@ export declare class EmbedShapeUtil extends BaseBoxShapeUtil<TLEmbedShape> {
     isAspectRatioLocked(shape: TLEmbedShape): boolean;
     onResize(shape: TLEmbedShape, info: TLResizeInfo<TLEmbedShape>): TLEmbedShape;
     component(shape: TLEmbedShape): JSX.Element | null;
-    indicator(shape: TLEmbedShape): JSX.Element;
-    useLegacyIndicator(): boolean;
     getIndicatorPath(shape: TLEmbedShape): Path2D;
     getInterpolatedProps(startShape: TLEmbedShape, endShape: TLEmbedShape, t: number): TLEmbedShapeProps;
 }
@@ -1647,7 +1950,14 @@ export declare class EraserTool extends StateNode {
     static initial: string;
     static isLockable: boolean;
     static children(): TLStateNodeConstructor[];
-    onEnter(): void;
+    info: {
+        onInteractionEnd?: string | undefined;
+    };
+    onEnter(info?: {
+        onInteractionEnd?: string;
+    }): void;
+    onExit(): void;
+    maybeReturnToOriginatingTool(): void;
 }
 
 /** @public @react */
@@ -1762,8 +2072,6 @@ export declare class FrameShapeUtil extends BaseFrameLikeShapeUtil<TLFrameShape>
     getText(shape: TLFrameShape): string | undefined;
     component(shape: TLFrameShape): JSX.Element;
     toSvg(shape: TLFrameShape, ctx: SvgExportContext): JSX.Element;
-    indicator(shape: TLFrameShape): JSX.Element;
-    useLegacyIndicator(): boolean;
     getIndicatorPath(shape: TLFrameShape): Path2D;
     getInterpolatedProps(startShape: TLFrameShape, endShape: TLFrameShape, t: number): TLFrameShapeProps;
     onDoubleClickEdge(shape: TLFrameShape, info: TLClickEventInfo): {
@@ -1801,15 +2109,15 @@ export declare function FrameToolbarItem(): JSX.Element;
 export declare interface GeoShapeOptions extends ShapeOptionsWithDisplayValues<TLGeoShape, GeoShapeUtilDisplayValues> {
     showTextOutline: boolean;
     /**
-     * A map of custom geo style definitions. Each key becomes a new value for
+     * A map of custom geo type definitions. Each key becomes a new value for
      * {@link @tldraw/editor#GeoShapeGeoStyle} that can be used in the style panel
-     * and on shapes. Custom styles inherit all standard geo shape behavior
+     * and on shapes. Custom geo types inherit all standard geo shape behavior
      * (labels, resizing, styling, etc.).
      *
      * @example
      * ```ts
      * const MyGeoShapeUtil = GeoShapeUtil.configure({
-     *   customGeoStyles: {
+     *   customGeoTypes: {
      *     'my-shape': {
      *       getPath: (w, h) => new PathBuilder().moveTo(0, 0).lineTo(w, 0).lineTo(w, h).lineTo(0, h).close(),
      *       snapType: 'polygon',
@@ -1819,7 +2127,7 @@ export declare interface GeoShapeOptions extends ShapeOptionsWithDisplayValues<T
      * })
      * ```
      */
-    customGeoStyles?: Record<string, GeoTypeDefinition>;
+    customGeoTypes?: Record<string, GeoTypeDefinition>;
 }
 
 /** @public */
@@ -1846,8 +2154,6 @@ export declare class GeoShapeUtil extends BaseBoxShapeUtil<TLGeoShape> {
     getText(shape: TLGeoShape): string;
     getFontFaces(shape: TLGeoShape): TLFontFace[];
     component(shape: TLGeoShape): JSX.Element;
-    indicator(shape: TLGeoShape): JSX.Element | null;
-    useLegacyIndicator(): boolean;
     getIndicatorPath(shape: TLGeoShape): Path2D | undefined;
     toSvg(shape: TLGeoShape, ctx: SvgExportContext): JSX.Element;
     getCanvasSvgDefs(): TLShapeUtilCanvasSvgDef[];
@@ -2042,8 +2348,10 @@ export declare interface GeoShapeUtilDisplayValues {
 }
 
 /**
- * Defines the behavior for a custom geo shape type. Register custom geo types
- * via {@link @tldraw/tldraw#GeoShapeUtil.configure | GeoShapeUtil.configure()}.
+ * Defines the behavior for a geo shape type. Every built-in geo type is
+ * registered through this same interface (see {@link defaultGeoTypeDefinitions}),
+ * and consumers can register additional types via
+ * {@link @tldraw/tldraw#GeoShapeUtil.configure | GeoShapeUtil.configure()}.
  *
  * @public
  */
@@ -2155,6 +2463,14 @@ export declare function getFontFamily(theme: TLTheme, font: string): string;
  */
 export declare function getFontStyleItems(theme: TLTheme): StyleValuesForUi<string>;
 
+/**
+ * Look up a geo type definition by name, checking custom types first then
+ * falling back to the built-in registry.
+ *
+ * @public
+ */
+export declare function getGeoTypeDefinition(name: string, customGeoTypes?: Record<string, GeoTypeDefinition>): GeoTypeDefinition | undefined;
+
 /** @public */
 export declare function getHitShapeOnCanvasPointerDown(editor: Editor, hitLabels?: boolean): TLShape | undefined;
 
@@ -2292,8 +2608,6 @@ export declare class HighlightShapeUtil extends ShapeUtil<TLHighlightShape> {
     getGeometry(shape: TLHighlightShape): Circle2d | Polygon2d;
     component(shape: TLHighlightShape): JSX.Element;
     backgroundComponent(shape: TLHighlightShape): JSX.Element;
-    indicator(shape: TLHighlightShape): JSX.Element;
-    useLegacyIndicator(): boolean;
     getIndicatorPath(shape: TLHighlightShape): Path2D;
     toSvg(shape: TLHighlightShape, ctx: SvgExportContext): JSX.Element;
     toBackgroundSvg(shape: TLHighlightShape, ctx: SvgExportContext): JSX.Element;
@@ -2363,8 +2677,6 @@ export declare class ImageShapeUtil extends BaseBoxShapeUtil<TLImageShape> {
     getAriaDescriptor(shape: TLImageShape): string;
     onResize(shape: TLImageShape, info: TLResizeInfo<TLImageShape>): TLImageShape;
     component(shape: TLImageShape): JSX.Element;
-    indicator(shape: TLImageShape): JSX.Element | null;
-    useLegacyIndicator(): boolean;
     getIndicatorPath(shape: TLImageShape): Path2D | undefined;
     toSvg(shape: TLImageShape, ctx: SvgExportContext): Promise<JSX.Element | null>;
     onDoubleClickEdge(shape: TLImageShape): void;
@@ -2375,6 +2687,9 @@ export declare class ImageShapeUtil extends BaseBoxShapeUtil<TLImageShape> {
 export declare interface ImageShapeUtilDisplayValues {
 }
 
+/** @public @react */
+export declare function InputModeMenu(): JSX.Element;
+
 /** @public */
 export declare const KeyboardShiftEnterTweakExtension: Extension<any, any>;
 
@@ -2499,8 +2814,6 @@ export declare class LineShapeUtil extends ShapeUtil<TLLineShape> {
         y: number;
     } | undefined;
     component(shape: TLLineShape): JSX.Element;
-    indicator(shape: TLLineShape): JSX.Element | null;
-    useLegacyIndicator(): boolean;
     getIndicatorPath(shape: TLLineShape): Path2D;
     toSvg(shape: TLLineShape, ctx: SvgExportContext): JSX.Element;
     getHandleSnapGeometry(shape: TLLineShape): HandleSnapGeometry;
@@ -2578,8 +2891,6 @@ export declare class NoteShapeUtil extends ShapeUtil<TLNoteShape> {
     getReferencedUserIds(shape: TLNoteShape): string[];
     getFontFaces(shape: TLNoteShape): TLFontFace[];
     component(shape: TLNoteShape): JSX.Element;
-    indicator(shape: TLNoteShape): JSX.Element;
-    useLegacyIndicator(): boolean;
     getIndicatorPath(shape: TLNoteShape): Path2D;
     toSvg(shape: TLNoteShape, ctx: SvgExportContext): JSX.Element;
     onBeforeCreate(next: TLNoteShape): {
@@ -3071,9 +3382,71 @@ export declare const RTL_LANGUAGES: Set<string>;
  */
 export declare function sanitizeSvg(svgText: string): string;
 
+/**
+ * Overlay util for scribble strokes (eraser, lasso selection, etc.).
+ *
+ * @public
+ */
+export declare class ScribbleOverlayUtil extends OverlayUtil<TLScribbleOverlay> {
+    static type: string;
+    options: {
+        cacheSize: number;
+        streamline: number;
+        zIndex: number;
+    };
+    private _scribblePathCache;
+    isActive(): boolean;
+    getOverlays(): TLScribbleOverlay[];
+    render(ctx: CanvasRenderingContext2D, overlays: TLScribbleOverlay[]): void;
+}
+
 /** @public @react */
 export declare function SelectAllMenuItem(): JSX.Element;
 
+/**
+ * Overlay util for selection foreground handles (resize corners/edges, rotate corners, mobile rotate).
+ * Each interactive element of the selection foreground becomes its own overlay instance.
+ *
+ * @public
+ */
+export declare class SelectionForegroundOverlayUtil extends OverlayUtil<TLSelectionForegroundOverlay> {
+    static type: string;
+    options: {
+        lineWidth: number;
+        zIndex: number;
+    };
+    isActive(): boolean;
+    getOverlays(): TLSelectionForegroundOverlay[];
+    getGeometry(overlay: TLSelectionForegroundOverlay): Geometry2d | null;
+    render(ctx: CanvasRenderingContext2D, _overlays: TLSelectionForegroundOverlay[]): void;
+    getCursor(overlay: TLSelectionForegroundOverlay): TLCursorType | undefined;
+    private _collectResizeCornerOverlays;
+    private _collectResizeEdgeOverlays;
+    private _collectRotateOverlays;
+    private _getResizeHandleGeometry;
+    private _getRotateHandleGeometry;
+    private _getMobileRotateGeometry;
+    private _renderSelectionBox;
+    private _renderResizeCorners;
+    private _renderCropHandles;
+    private _renderMobileRotateHandle;
+    private _renderTextResizeHandles;
+    /**
+     * Single source of truth for the derived state the selection foreground needs.
+     * Called from `getOverlays()`, `getGeometry()`, and `render()` so their visibility
+     * predicates can't drift. Returns `null` when no selection UI should appear at all
+     * (nothing selected, or the only selected shape is hidden).
+     */
+    private _computeSelectionState;
+    private _getMobileRotateCenter;
+    private _getThemeColors;
+    private _makeOverlay;
+    private _getEdgeLocalPoints;
+    private _getRotateHandleLocalCenter;
+    private _getCornerLocalPoint;
+    private _localRectToPoints;
+}
+
 /** @public */
 export declare class SelectTool extends StateNode {
     static id: string;
@@ -3102,12 +3475,48 @@ export declare function serializeTldrawJsonBlob(editor: Editor): Promise<Blob>;
 /** @public */
 export declare function setStrokePointRadii(strokePoints: StrokePoint[], options: StrokeOptions): StrokePoint[];
 
+/**
+ * Overlay util for shape handles (arrow endpoints, line vertices, etc.).
+ *
+ * @public
+ */
+export declare class ShapeHandleOverlayUtil extends OverlayUtil<TLShapeHandleOverlay> {
+    static type: string;
+    options: {
+        lineWidth: number;
+        zIndex: number;
+    };
+    isActive(): boolean;
+    getOverlays(): TLShapeHandleOverlay[];
+    getGeometry(overlay: TLShapeHandleOverlay): Geometry2d | null;
+    getCursor(_overlay: TLShapeHandleOverlay): TLCursorType | undefined;
+    render(ctx: CanvasRenderingContext2D, overlays: TLShapeHandleOverlay[]): void;
+}
+
 /** @public */
 export declare interface ShapeOptionsWithDisplayValues<Shape extends TLShape, DisplayValues extends object> {
     getDefaultDisplayValues(editor: Editor, shape: Shape, theme: TLTheme, colorMode: 'dark' | 'light'): DisplayValues;
     getCustomDisplayValues(editor: Editor, shape: Shape, theme: TLTheme, colorMode: 'dark' | 'light'): Partial<DisplayValues>;
 }
 
+/**
+ * Overlay util for snap alignment indicators (point snap lines and gap indicators).
+ *
+ * @public
+ */
+export declare class SnapIndicatorOverlayUtil extends OverlayUtil<TLSnapIndicatorOverlay> {
+    static type: string;
+    options: {
+        lineWidth: number;
+        zIndex: number;
+    };
+    isActive(): boolean;
+    getOverlays(): TLSnapIndicatorOverlay[];
+    render(ctx: CanvasRenderingContext2D, overlays: TLSnapIndicatorOverlay[]): void;
+    private _renderPoints;
+    private _renderGaps;
+}
+
 /** @public */
 export declare interface SolidPathBuilderOpts extends BasePathBuilderOpts {
     style: 'solid';
@@ -3372,8 +3781,6 @@ export declare class TextShapeUtil extends ShapeUtil<TLTextShape> {
     canEdit(shape: TLTextShape): boolean;
     isAspectRatioLocked(shape: TLTextShape): boolean;
     component(shape: TLTextShape): JSX.Element;
-    indicator(shape: TLTextShape): JSX.Element | null;
-    useLegacyIndicator(): boolean;
     getIndicatorPath(shape: TLTextShape): Path2D | undefined;
     toSvg(shape: TLTextShape, ctx: SvgExportContext): JSX.Element;
     onResize(shape: TLTextShape, info: TLResizeInfo<TLTextShape>): {
@@ -3467,12 +3874,55 @@ export declare interface TLArcInfo {
     sweepFlag: number;
 }
 
+/** @public */
+export declare interface TLArrowBindingHintOverlay extends TLOverlay {
+    props: {
+        arrowId: TLShapeId;
+    };
+}
+
 /** @public */
 export declare interface TLArrowBindings {
     start: TLArrowBinding | undefined;
     end: TLArrowBinding | undefined;
 }
 
+/** @public */
+export declare interface TLArrowHintOverlay extends TLOverlay {
+    props: {
+        anchorX: number;
+        anchorY: number;
+        arrowKind: string;
+        handles: {
+            bottom: {
+                isEnabled: boolean;
+                x: number;
+                y: number;
+            };
+            left: {
+                isEnabled: boolean;
+                x: number;
+                y: number;
+            };
+            right: {
+                isEnabled: boolean;
+                x: number;
+                y: number;
+            };
+            top: {
+                isEnabled: boolean;
+                x: number;
+                y: number;
+            };
+        };
+        isExact: boolean;
+        isPrecise: boolean;
+        showEdgeHints: boolean;
+        snap: string;
+        targetId: TLShapeId;
+    };
+}
+
 /** @public */
 export declare type TLArrowInfo = TLArcArrowInfo | TLElbowArrowInfo | TLStraightArrowInfo;
 
@@ -3483,6 +3933,68 @@ export declare interface TLArrowPoint {
     arrowhead: TLArrowShapeArrowheadStyle;
 }
 
+/** @public */
+export declare interface TLBrushOverlay extends TLOverlay {
+    props: {
+        h: number;
+        w: number;
+        x: number;
+        y: number;
+    };
+}
+
+/** @public */
+export declare interface TLCollaboratorBrushOverlay extends TLOverlay {
+    props: {
+        color: string;
+        h: number;
+        w: number;
+        x: number;
+        y: number;
+    };
+}
+
+/** @public */
+export declare interface TLCollaboratorCursorOverlay extends TLOverlay {
+    props: {
+        chatMessage: string;
+        color: string;
+        name: null | string;
+        x: number;
+        y: number;
+    };
+}
+
+/** @public */
+export declare interface TLCollaboratorHintOverlay extends TLOverlay {
+    props: {
+        /** Clamped point on viewport edge, in page coordinates */
+        x: number;
+        /** Rotation angle pointing toward the collaborator's actual cursor */
+        rotation: number;
+        color: string;
+        y: number;
+    };
+}
+
+/** @public */
+export declare interface TLCollaboratorScribbleOverlay extends TLOverlay {
+    props: {
+        color: string;
+        scribble: TLScribble;
+    };
+}
+
+/** @public */
+export declare interface TLCollaboratorShapeIndicatorOverlay extends TLOverlay {
+    props: {
+        indicators: Array<{
+            color: string;
+            shapeIds: TLShapeId[];
+        }>;
+    };
+}
+
 /**
  * Override the default react components used by the editor and UI. Set components to null to
  * disable them entirely.
@@ -3541,9 +4053,6 @@ export declare function Tldraw(props: TldrawProps): JSX.Element;
 /** @public */
 export declare const TLDRAW_FILE_EXTENSION: ".tldr";
 
-/** @public @react */
-export declare function TldrawArrowHints(): JSX.Element | null;
-
 /** @public */
 export declare interface TldrawBaseProps extends TldrawUiProps, TldrawEditorBaseProps, TLExternalContentProps {
     /** Urls for custom assets.
@@ -3569,17 +4078,19 @@ export declare interface TldrawBaseProps extends TldrawUiProps, TldrawEditorBase
      * @deprecated Use `options.text` instead. This prop will be removed in a future release.
      */
     textOptions?: TLTextOptions;
-}
-
-/** @public @react */
-export declare function TldrawCropHandles({ size, width, height, hideAlternateHandles }: TldrawCropHandlesProps): JSX.Element;
-
-/** @public */
-export declare interface TldrawCropHandlesProps {
-    size: number;
-    width: number;
-    height: number;
-    hideAlternateHandles: boolean;
+    /**
+     * The locale to use for the editor's UI. When set, this takes priority over
+     * both the browser's language preferences (`navigator.languages`) and the
+     * user's locale preference (e.g. via
+     * `editor.user.updateUserPreferences({ locale: '...' })`), giving the
+     * application explicit control over the displayed language.
+     *
+     * @example
+     * ```tsx
+     * <Tldraw locale="fr" />
+     * ```
+     */
+    locale?: string;
 }
 
 /** @public */
@@ -3607,9 +4118,6 @@ export declare type TldrawFileParseError = {
     version: number;
 };
 
-/** @public @react */
-export declare function TldrawHandles({ children }: TLHandlesProps): JSX.Element | null;
-
 /**
  * A rendered SVG image of a Tldraw snapshot.
  *
@@ -3672,21 +4180,9 @@ export declare interface TldrawImageProps extends TLImageExportOptions {
     textOptions?: TLTextOptions;
 }
 
-/** @public @react */
-export declare function TldrawOverlays(): JSX.Element | null;
-
 /** @public */
 export declare type TldrawProps = TldrawBaseProps & TldrawEditorStoreProps;
 
-/** @public @react */
-export declare function TldrawScribble({ scribble, zoom, color, opacity, className }: TLScribbleProps): JSX.Element | null;
-
-/** @public */
-export declare const TldrawSelectionForeground: NamedExoticComponent<TLSelectionForegroundProps>;
-
-/** @public @react */
-export declare function TldrawShapeIndicators(): JSX.Element;
-
 /**
  * @public
  * @react
@@ -4034,21 +4530,55 @@ export declare interface TLExternalContentProps {
      */
     maxAssetSize?: number;
     /**
-     * The mime types of images that are allowed to be handled. When using the
-     * `Tldraw` component, defaults to `DEFAULT_SUPPORTED_IMAGE_TYPES`. If neither
-     * this nor `acceptedVideoMimeTypes` is provided, the registered asset utils
-     * determine which MIME types are allowed.
+     * The mime types of images that are allowed to be handled. When passed to
+     * the `Tldraw` component, this also reconfigures the default `ImageAssetUtil`
+     * to only accept files matching these types. If you only want to accept a
+     * subset of image types and want to additionally block videos, pass
+     * `acceptedVideoMimeTypes={[]}`. A file is accepted if its MIME type is in
+     * this list, in `acceptedVideoMimeTypes`, or if any registered asset util
+     * accepts it.
      */
     acceptedImageMimeTypes?: readonly string[];
     /**
-     * The mime types of videos that are allowed to be handled. When using the
-     * `Tldraw` component, defaults to `DEFAULT_SUPPORT_VIDEO_TYPES`. If neither
-     * this nor `acceptedImageMimeTypes` is provided, the registered asset utils
-     * determine which MIME types are allowed.
+     * The mime types of videos that are allowed to be handled. When passed to
+     * the `Tldraw` component, this also reconfigures the default `VideoAssetUtil`
+     * to only accept files matching these types. A file is accepted if its MIME
+     * type is in this list, in `acceptedImageMimeTypes`, or if any registered
+     * asset util accepts it.
      */
     acceptedVideoMimeTypes?: readonly string[];
 }
 
+/** @public */
+export declare interface TLScribbleOverlay extends TLOverlay {
+    props: {
+        scribble: TLScribble;
+    };
+}
+
+/** @public */
+export declare interface TLSelectionForegroundOverlay extends TLOverlay {
+    props: {
+        handle: RotateCorner | TLSelectionHandle;
+        overlayType: 'mobile_rotate' | 'resize_handle' | 'rotate_handle';
+    };
+}
+
+/** @public */
+export declare interface TLShapeHandleOverlay extends TLOverlay {
+    props: {
+        handle: TLHandle;
+        shapeId: TLShapeId;
+    };
+}
+
+/** @public */
+export declare interface TLSnapIndicatorOverlay extends TLOverlay {
+    props: {
+        line: SnapIndicator;
+    };
+}
+
 /** @public */
 export declare interface TLStraightArrowInfo {
     bindings: TLArrowBindings;
@@ -4983,7 +5513,7 @@ export declare interface TLUiTranslation {
 export declare type TLUiTranslationContextType = TLUiTranslation;
 
 /** @public */
-export declare type TLUiTranslationKey = 'a11y.adjust-shape-styles' | 'a11y.enlarge-shape' | 'a11y.enter-leave-container' | 'a11y.move-shape-faster' | 'a11y.move-shape' | 'a11y.multiple-shapes' | 'a11y.open-context-menu' | 'a11y.open-keyboard-shortcuts' | 'a11y.pan-camera' | 'a11y.repeat-shape' | 'a11y.rotate-shape-ccw-fine' | 'a11y.rotate-shape-ccw' | 'a11y.rotate-shape-cw-fine' | 'a11y.rotate-shape-cw' | 'a11y.select-shape-direction' | 'a11y.select-shape' | 'a11y.shape-image' | 'a11y.shape-index' | 'a11y.shape-video' | 'a11y.shrink-shape' | 'a11y.skip-to-main-content' | 'a11y.status' | 'action.align-bottom' | 'action.align-center-horizontal.short' | 'action.align-center-horizontal' | 'action.align-center-vertical.short' | 'action.align-center-vertical' | 'action.align-left' | 'action.align-right' | 'action.align-top' | 'action.back-to-content' | 'action.bring-forward' | 'action.bring-to-front' | 'action.convert-to-bookmark' | 'action.convert-to-embed' | 'action.copy-as-json.short' | 'action.copy-as-json' | 'action.copy-as-png.short' | 'action.copy-as-png' | 'action.copy-as-svg.short' | 'action.copy-as-svg' | 'action.copy' | 'action.cut' | 'action.delete' | 'action.distribute-horizontal.short' | 'action.distribute-horizontal' | 'action.distribute-vertical.short' | 'action.distribute-vertical' | 'action.download-original' | 'action.duplicate' | 'action.edit-link' | 'action.enhanced-a11y-mode.menu' | 'action.enhanced-a11y-mode' | 'action.exit-pen-mode' | 'action.export-all-as-png.short' | 'action.export-all-as-png' | 'action.export-all-as-svg.short' | 'action.export-all-as-svg' | 'action.export-as-png.short' | 'action.export-as-png' | 'action.export-as-svg.short' | 'action.export-as-svg' | 'action.fit-frame-to-content' | 'action.flatten-to-image' | 'action.flip-horizontal.short' | 'action.flip-horizontal' | 'action.flip-vertical.short' | 'action.flip-vertical' | 'action.fork-project-on-tldraw' | 'action.fork-project' | 'action.group' | 'action.insert-embed' | 'action.insert-media' | 'action.leave-shared-project' | 'action.new-project' | 'action.new-shared-project' | 'action.open-cursor-chat' | 'action.open-embed-link' | 'action.open-file' | 'action.open-kbd-shortcuts' | 'action.pack' | 'action.paste-error-description' | 'action.paste-error-title' | 'action.paste' | 'action.print' | 'action.redo' | 'action.remove-frame' | 'action.rename' | 'action.rotate-ccw' | 'action.rotate-cw' | 'action.save-copy' | 'action.select-all' | 'action.select-none' | 'action.select-zoom-tool' | 'action.send-backward' | 'action.send-to-back' | 'action.share-project' | 'action.stack-horizontal.short' | 'action.stack-horizontal' | 'action.stack-vertical.short' | 'action.stack-vertical' | 'action.stop-following' | 'action.stretch-horizontal.short' | 'action.stretch-horizontal' | 'action.stretch-vertical.short' | 'action.stretch-vertical' | 'action.toggle-auto-none' | 'action.toggle-auto-pan' | 'action.toggle-auto-size' | 'action.toggle-auto-zoom' | 'action.toggle-dark-mode.menu' | 'action.toggle-dark-mode' | 'action.toggle-debug-mode.menu' | 'action.toggle-debug-mode' | 'action.toggle-dynamic-size-mode.menu' | 'action.toggle-dynamic-size-mode' | 'action.toggle-edge-scrolling.menu' | 'action.toggle-edge-scrolling' | 'action.toggle-focus-mode.menu' | 'action.toggle-focus-mode' | 'action.toggle-grid.menu' | 'action.toggle-grid' | 'action.toggle-invert-zoom.menu' | 'action.toggle-invert-zoom' | 'action.toggle-keyboard-shortcuts.menu' | 'action.toggle-keyboard-shortcuts' | 'action.toggle-lock' | 'action.toggle-mouse' | 'action.toggle-paste-at-cursor.menu' | 'action.toggle-paste-at-cursor' | 'action.toggle-reduce-motion.menu' | 'action.toggle-reduce-motion' | 'action.toggle-snap-mode.menu' | 'action.toggle-snap-mode' | 'action.toggle-tool-lock.menu' | 'action.toggle-tool-lock' | 'action.toggle-trackpad' | 'action.toggle-transparent.context-menu' | 'action.toggle-transparent.menu' | 'action.toggle-transparent' | 'action.toggle-wrap-mode.menu' | 'action.toggle-wrap-mode' | 'action.undo' | 'action.ungroup' | 'action.unlock-all' | 'action.zoom-in' | 'action.zoom-out' | 'action.zoom-quick' | 'action.zoom-to-100' | 'action.zoom-to-fit' | 'action.zoom-to-selection' | 'actions-menu.title' | 'align-style.end' | 'align-style.justify' | 'align-style.middle' | 'align-style.start' | 'app.loading' | 'arrow-kind-style.arc' | 'arrow-kind-style.elbow' | 'arrowheadEnd-style.arrow' | 'arrowheadEnd-style.bar' | 'arrowheadEnd-style.diamond' | 'arrowheadEnd-style.dot' | 'arrowheadEnd-style.inverted' | 'arrowheadEnd-style.none' | 'arrowheadEnd-style.pipe' | 'arrowheadEnd-style.square' | 'arrowheadEnd-style.triangle' | 'arrowheadStart-style.arrow' | 'arrowheadStart-style.bar' | 'arrowheadStart-style.diamond' | 'arrowheadStart-style.dot' | 'arrowheadStart-style.inverted' | 'arrowheadStart-style.none' | 'arrowheadStart-style.pipe' | 'arrowheadStart-style.square' | 'arrowheadStart-style.triangle' | 'assets.files.amount-too-many' | 'assets.files.maximum-size' | 'assets.files.size-too-big' | 'assets.files.type-not-allowed' | 'assets.files.upload-failed' | 'assets.url.failed' | 'color-style.black' | 'color-style.blue' | 'color-style.green' | 'color-style.grey' | 'color-style.light-blue' | 'color-style.light-green' | 'color-style.light-red' | 'color-style.light-violet' | 'color-style.orange' | 'color-style.red' | 'color-style.violet' | 'color-style.white' | 'color-style.yellow' | 'context-menu.arrange' | 'context-menu.copy-as' | 'context-menu.edit' | 'context-menu.export-all-as' | 'context-menu.export-as' | 'context-menu.move-to-page' | 'context-menu.reorder' | 'context-menu.title' | 'context.pages.new-page' | 'cursor-chat.type-to-chat' | 'dash-style.dashed' | 'dash-style.dotted' | 'dash-style.draw' | 'dash-style.solid' | 'document-name-menu.copy-link' | 'document.default-name' | 'edit-link-dialog.cancel' | 'edit-link-dialog.clear' | 'edit-link-dialog.detail' | 'edit-link-dialog.external-link' | 'edit-link-dialog.invalid-url' | 'edit-link-dialog.save' | 'edit-link-dialog.title' | 'edit-link-dialog.url' | 'embed-dialog.back' | 'embed-dialog.cancel' | 'embed-dialog.create' | 'embed-dialog.instruction' | 'embed-dialog.invalid-url' | 'embed-dialog.title' | 'embed-dialog.url' | 'file-system.confirm-clear.cancel' | 'file-system.confirm-clear.continue' | 'file-system.confirm-clear.description' | 'file-system.confirm-clear.dont-show-again' | 'file-system.confirm-clear.title' | 'file-system.confirm-open.cancel' | 'file-system.confirm-open.description' | 'file-system.confirm-open.dont-show-again' | 'file-system.confirm-open.open' | 'file-system.confirm-open.title' | 'file-system.file-open-error.file-format-version-too-new' | 'file-system.file-open-error.generic-corrupted-file' | 'file-system.file-open-error.not-a-tldraw-file' | 'file-system.file-open-error.title' | 'file-system.shared-document-file-open-error.description' | 'file-system.shared-document-file-open-error.title' | 'fill-style.fill' | 'fill-style.lined-fill' | 'fill-style.none' | 'fill-style.pattern' | 'fill-style.semi' | 'fill-style.solid' | 'focus-mode.toggle-focus-mode' | 'font-style.draw' | 'font-style.mono' | 'font-style.sans' | 'font-style.serif' | 'geo-style.arrow-down' | 'geo-style.arrow-left' | 'geo-style.arrow-right' | 'geo-style.arrow-up' | 'geo-style.check-box' | 'geo-style.cloud' | 'geo-style.diamond' | 'geo-style.ellipse' | 'geo-style.heart' | 'geo-style.hexagon' | 'geo-style.octagon' | 'geo-style.oval' | 'geo-style.pentagon' | 'geo-style.rectangle' | 'geo-style.rhombus-2' | 'geo-style.rhombus' | 'geo-style.star' | 'geo-style.trapezoid' | 'geo-style.triangle' | 'geo-style.x-box' | 'handle.crop.bottom-left' | 'handle.crop.bottom-right' | 'handle.crop.bottom' | 'handle.crop.left' | 'handle.crop.right' | 'handle.crop.top-left' | 'handle.crop.top-right' | 'handle.crop.top' | 'handle.resize-bottom-left' | 'handle.resize-bottom-right' | 'handle.resize-bottom' | 'handle.resize-left' | 'handle.resize-right' | 'handle.resize-top-left' | 'handle.resize-top-right' | 'handle.resize-top' | 'handle.rotate.bottom_left_rotate' | 'handle.rotate.bottom_right_rotate' | 'handle.rotate.mobile_rotate' | 'handle.rotate.top_left_rotate' | 'handle.rotate.top_right_rotate' | 'help-menu.about' | 'help-menu.discord' | 'help-menu.github' | 'help-menu.import-tldr-file' | 'help-menu.keyboard-shortcuts' | 'help-menu.privacy' | 'help-menu.terms' | 'help-menu.title' | 'help-menu.twitter' | 'menu.accessibility' | 'menu.copy-as' | 'menu.edit' | 'menu.export-as' | 'menu.file' | 'menu.input-device' | 'menu.language' | 'menu.preferences' | 'menu.theme' | 'menu.title' | 'menu.view' | 'navigation-zone.minimap' | 'navigation-zone.title' | 'navigation-zone.toggle-minimap' | 'navigation-zone.zoom' | 'opacity-style.0.1' | 'opacity-style.0.25' | 'opacity-style.0.5' | 'opacity-style.0.75' | 'opacity-style.1' | 'page-menu.create-new-page' | 'page-menu.edit-done' | 'page-menu.edit-start' | 'page-menu.go-to-page' | 'page-menu.max-page-count-reached' | 'page-menu.new-page-initial-name' | 'page-menu.submenu.delete' | 'page-menu.submenu.duplicate-page' | 'page-menu.submenu.move-down' | 'page-menu.submenu.move-up' | 'page-menu.submenu.rename' | 'page-menu.submenu.title' | 'page-menu.title' | 'people-menu.anonymous-user' | 'people-menu.avatar-color' | 'people-menu.change-color' | 'people-menu.change-name' | 'people-menu.follow' | 'people-menu.following' | 'people-menu.invite' | 'people-menu.leading' | 'people-menu.title' | 'people-menu.user' | 'share-menu.copied' | 'share-menu.copy-link-note' | 'share-menu.copy-link' | 'share-menu.copy-readonly-link-note' | 'share-menu.copy-readonly-link' | 'share-menu.create-snapshot-link' | 'share-menu.creating-project' | 'share-menu.fork-note' | 'share-menu.offline-note' | 'share-menu.project-too-large' | 'share-menu.save-note' | 'share-menu.share-project' | 'share-menu.snapshot-link-note' | 'share-menu.title' | 'share-menu.upload-failed' | 'sharing.confirm-leave.cancel' | 'sharing.confirm-leave.description' | 'sharing.confirm-leave.dont-show-again' | 'sharing.confirm-leave.leave' | 'sharing.confirm-leave.title' | 'shortcuts-dialog.a11y' | 'shortcuts-dialog.collaboration' | 'shortcuts-dialog.edit' | 'shortcuts-dialog.file' | 'shortcuts-dialog.preferences' | 'shortcuts-dialog.text-formatting' | 'shortcuts-dialog.title' | 'shortcuts-dialog.tools' | 'shortcuts-dialog.transform' | 'shortcuts-dialog.view' | 'size-style.l' | 'size-style.m' | 'size-style.s' | 'size-style.xl' | 'spline-style.cubic' | 'spline-style.line' | 'status.offline' | 'style-panel.align' | 'style-panel.arrow-kind' | 'style-panel.arrowhead-end' | 'style-panel.arrowhead-start' | 'style-panel.arrowheads' | 'style-panel.color' | 'style-panel.dash' | 'style-panel.fill' | 'style-panel.font' | 'style-panel.geo' | 'style-panel.label-align' | 'style-panel.mixed' | 'style-panel.opacity' | 'style-panel.position' | 'style-panel.selected' | 'style-panel.size' | 'style-panel.spline' | 'style-panel.title' | 'style-panel.vertical-align' | 'theme.dark' | 'theme.light' | 'theme.system' | 'toast.close' | 'toast.error.copy-fail.desc' | 'toast.error.copy-fail.title' | 'toast.error.export-fail.desc' | 'toast.error.export-fail.title' | 'toast.error' | 'toast.info' | 'toast.success' | 'toast.warning' | 'tool-panel.more' | 'tool-panel.title' | 'tool.arrow-down' | 'tool.arrow-left' | 'tool.arrow-right' | 'tool.arrow-up' | 'tool.arrow' | 'tool.aspect-ratio.circle' | 'tool.aspect-ratio.landscape' | 'tool.aspect-ratio.original' | 'tool.aspect-ratio.portrait' | 'tool.aspect-ratio.square' | 'tool.aspect-ratio.wide' | 'tool.aspect-ratio' | 'tool.bookmark' | 'tool.check-box' | 'tool.cloud' | 'tool.diamond' | 'tool.draw' | 'tool.ellipse' | 'tool.embed' | 'tool.eraser' | 'tool.flip-horz' | 'tool.flip-vert' | 'tool.frame' | 'tool.hand' | 'tool.heart' | 'tool.hexagon' | 'tool.highlight' | 'tool.image-crop-confirm' | 'tool.image-crop' | 'tool.image-toolbar-title' | 'tool.image-zoom' | 'tool.laser' | 'tool.line' | 'tool.media-alt-text-confirm' | 'tool.media-alt-text-desc' | 'tool.media-alt-text' | 'tool.media' | 'tool.note' | 'tool.octagon' | 'tool.oval' | 'tool.pentagon' | 'tool.pointer-down' | 'tool.rectangle' | 'tool.replace-media' | 'tool.rhombus' | 'tool.rich-text-bold' | 'tool.rich-text-bulletList' | 'tool.rich-text-code' | 'tool.rich-text-header' | 'tool.rich-text-highlight' | 'tool.rich-text-italic' | 'tool.rich-text-link-remove' | 'tool.rich-text-link-visit' | 'tool.rich-text-link' | 'tool.rich-text-orderedList' | 'tool.rich-text-strikethrough' | 'tool.rich-text-toolbar-title' | 'tool.rotate-cw' | 'tool.select' | 'tool.star' | 'tool.text' | 'tool.trapezoid' | 'tool.triangle' | 'tool.x-box' | 'ui.checked' | 'ui.close' | 'ui.unchecked' | 'verticalAlign-style.end' | 'verticalAlign-style.middle' | 'verticalAlign-style.start' | 'vscode.file-open.backup-failed' | 'vscode.file-open.backup-saved' | 'vscode.file-open.backup' | 'vscode.file-open.desc' | 'vscode.file-open.dont-show-again' | 'vscode.file-open.open';
+export declare type TLUiTranslationKey = 'a11y.adjust-shape-styles' | 'a11y.enlarge-shape' | 'a11y.enter-leave-container' | 'a11y.move-shape-faster' | 'a11y.move-shape' | 'a11y.multiple-shapes' | 'a11y.open-context-menu' | 'a11y.open-keyboard-shortcuts' | 'a11y.pan-camera' | 'a11y.repeat-shape' | 'a11y.rotate-shape-ccw-fine' | 'a11y.rotate-shape-ccw' | 'a11y.rotate-shape-cw-fine' | 'a11y.rotate-shape-cw' | 'a11y.select-shape-direction' | 'a11y.select-shape' | 'a11y.shape-image' | 'a11y.shape-index' | 'a11y.shape-video' | 'a11y.shrink-shape' | 'a11y.skip-to-main-content' | 'a11y.status' | 'action.align-bottom' | 'action.align-center-horizontal.short' | 'action.align-center-horizontal' | 'action.align-center-vertical.short' | 'action.align-center-vertical' | 'action.align-left' | 'action.align-right' | 'action.align-top' | 'action.back-to-content' | 'action.bring-forward' | 'action.bring-to-front' | 'action.convert-to-bookmark' | 'action.convert-to-embed' | 'action.copy-as-json.short' | 'action.copy-as-json' | 'action.copy-as-png.short' | 'action.copy-as-png' | 'action.copy-as-svg.short' | 'action.copy-as-svg' | 'action.copy' | 'action.cut' | 'action.delete' | 'action.distribute-horizontal.short' | 'action.distribute-horizontal' | 'action.distribute-vertical.short' | 'action.distribute-vertical' | 'action.download-original' | 'action.duplicate' | 'action.edit-link' | 'action.enhanced-a11y-mode.menu' | 'action.enhanced-a11y-mode' | 'action.exit-pen-mode' | 'action.export-all-as-png.short' | 'action.export-all-as-png' | 'action.export-all-as-svg.short' | 'action.export-all-as-svg' | 'action.export-as-png.short' | 'action.export-as-png' | 'action.export-as-svg.short' | 'action.export-as-svg' | 'action.fit-frame-to-content' | 'action.flatten-to-image' | 'action.flip-horizontal.short' | 'action.flip-horizontal' | 'action.flip-vertical.short' | 'action.flip-vertical' | 'action.fork-project-on-tldraw' | 'action.fork-project' | 'action.group' | 'action.insert-embed' | 'action.insert-media' | 'action.leave-shared-project' | 'action.new-project' | 'action.new-shared-project' | 'action.open-cursor-chat' | 'action.open-embed-link' | 'action.open-file' | 'action.open-kbd-shortcuts' | 'action.pack' | 'action.paste-error-description' | 'action.paste-error-title' | 'action.paste' | 'action.print' | 'action.redo' | 'action.remove-frame' | 'action.rename' | 'action.rotate-ccw' | 'action.rotate-cw' | 'action.save-copy' | 'action.select-all' | 'action.select-none' | 'action.select-zoom-tool' | 'action.send-backward' | 'action.send-to-back' | 'action.share-project' | 'action.stack-horizontal.short' | 'action.stack-horizontal' | 'action.stack-vertical.short' | 'action.stack-vertical' | 'action.stop-following' | 'action.stretch-horizontal.short' | 'action.stretch-horizontal' | 'action.stretch-vertical.short' | 'action.stretch-vertical' | 'action.toggle-auto-none' | 'action.toggle-auto-pan' | 'action.toggle-auto-size' | 'action.toggle-auto-zoom' | 'action.toggle-dark-mode.menu' | 'action.toggle-dark-mode' | 'action.toggle-debug-mode.menu' | 'action.toggle-debug-mode' | 'action.toggle-dynamic-size-mode.menu' | 'action.toggle-dynamic-size-mode' | 'action.toggle-edge-scrolling.menu' | 'action.toggle-edge-scrolling' | 'action.toggle-focus-mode.menu' | 'action.toggle-focus-mode' | 'action.toggle-grid.menu' | 'action.toggle-grid' | 'action.toggle-invert-zoom.menu' | 'action.toggle-invert-zoom' | 'action.toggle-keyboard-shortcuts.menu' | 'action.toggle-keyboard-shortcuts' | 'action.toggle-lock' | 'action.toggle-mouse' | 'action.toggle-paste-at-cursor.menu' | 'action.toggle-paste-at-cursor' | 'action.toggle-reduce-motion.menu' | 'action.toggle-reduce-motion' | 'action.toggle-snap-mode.menu' | 'action.toggle-snap-mode' | 'action.toggle-tool-lock.menu' | 'action.toggle-tool-lock' | 'action.toggle-trackpad' | 'action.toggle-transparent.context-menu' | 'action.toggle-transparent.menu' | 'action.toggle-transparent' | 'action.toggle-wrap-mode.menu' | 'action.toggle-wrap-mode' | 'action.undo' | 'action.ungroup' | 'action.unlock-all' | 'action.zoom-in' | 'action.zoom-out' | 'action.zoom-quick' | 'action.zoom-to-100' | 'action.zoom-to-fit' | 'action.zoom-to-selection' | 'actions-menu.title' | 'align-style.end' | 'align-style.justify' | 'align-style.middle' | 'align-style.start' | 'app.loading' | 'arrow-kind-style.arc' | 'arrow-kind-style.elbow' | 'arrowheadEnd-style.arrow' | 'arrowheadEnd-style.bar' | 'arrowheadEnd-style.diamond' | 'arrowheadEnd-style.dot' | 'arrowheadEnd-style.inverted' | 'arrowheadEnd-style.none' | 'arrowheadEnd-style.pipe' | 'arrowheadEnd-style.square' | 'arrowheadEnd-style.triangle' | 'arrowheadStart-style.arrow' | 'arrowheadStart-style.bar' | 'arrowheadStart-style.diamond' | 'arrowheadStart-style.dot' | 'arrowheadStart-style.inverted' | 'arrowheadStart-style.none' | 'arrowheadStart-style.pipe' | 'arrowheadStart-style.square' | 'arrowheadStart-style.triangle' | 'assets.files.amount-too-many' | 'assets.files.maximum-size' | 'assets.files.size-too-big' | 'assets.files.type-not-allowed' | 'assets.files.upload-failed' | 'assets.url.failed' | 'color-style.black' | 'color-style.blue' | 'color-style.green' | 'color-style.grey' | 'color-style.light-blue' | 'color-style.light-green' | 'color-style.light-red' | 'color-style.light-violet' | 'color-style.orange' | 'color-style.red' | 'color-style.violet' | 'color-style.white' | 'color-style.yellow' | 'context-menu.arrange' | 'context-menu.copy-as' | 'context-menu.edit' | 'context-menu.export-all-as' | 'context-menu.export-as' | 'context-menu.move-to-page' | 'context-menu.reorder' | 'context-menu.title' | 'context.pages.new-page' | 'cursor-chat.type-to-chat' | 'dash-style.dashed' | 'dash-style.dotted' | 'dash-style.draw' | 'dash-style.solid' | 'document-name-menu.copy-link' | 'document.default-name' | 'edit-link-dialog.cancel' | 'edit-link-dialog.clear' | 'edit-link-dialog.detail' | 'edit-link-dialog.external-link' | 'edit-link-dialog.invalid-url' | 'edit-link-dialog.save' | 'edit-link-dialog.title' | 'edit-link-dialog.url' | 'embed-dialog.back' | 'embed-dialog.cancel' | 'embed-dialog.create' | 'embed-dialog.instruction' | 'embed-dialog.invalid-url' | 'embed-dialog.title' | 'embed-dialog.url' | 'file-system.confirm-clear.cancel' | 'file-system.confirm-clear.continue' | 'file-system.confirm-clear.description' | 'file-system.confirm-clear.dont-show-again' | 'file-system.confirm-clear.title' | 'file-system.confirm-open.cancel' | 'file-system.confirm-open.description' | 'file-system.confirm-open.dont-show-again' | 'file-system.confirm-open.open' | 'file-system.confirm-open.title' | 'file-system.file-open-error.file-format-version-too-new' | 'file-system.file-open-error.generic-corrupted-file' | 'file-system.file-open-error.not-a-tldraw-file' | 'file-system.file-open-error.title' | 'file-system.shared-document-file-open-error.description' | 'file-system.shared-document-file-open-error.title' | 'fill-style.fill' | 'fill-style.lined-fill' | 'fill-style.none' | 'fill-style.pattern' | 'fill-style.semi' | 'fill-style.solid' | 'focus-mode.toggle-focus-mode' | 'font-style.draw' | 'font-style.mono' | 'font-style.sans' | 'font-style.serif' | 'geo-style.arrow-down' | 'geo-style.arrow-left' | 'geo-style.arrow-right' | 'geo-style.arrow-up' | 'geo-style.check-box' | 'geo-style.cloud' | 'geo-style.diamond' | 'geo-style.ellipse' | 'geo-style.heart' | 'geo-style.hexagon' | 'geo-style.octagon' | 'geo-style.oval' | 'geo-style.pentagon' | 'geo-style.rectangle' | 'geo-style.rhombus-2' | 'geo-style.rhombus' | 'geo-style.star' | 'geo-style.trapezoid' | 'geo-style.triangle' | 'geo-style.x-box' | 'handle.crop.bottom-left' | 'handle.crop.bottom-right' | 'handle.crop.bottom' | 'handle.crop.left' | 'handle.crop.right' | 'handle.crop.top-left' | 'handle.crop.top-right' | 'handle.crop.top' | 'handle.resize-bottom-left' | 'handle.resize-bottom-right' | 'handle.resize-bottom' | 'handle.resize-left' | 'handle.resize-right' | 'handle.resize-top-left' | 'handle.resize-top-right' | 'handle.resize-top' | 'handle.rotate.bottom_left_rotate' | 'handle.rotate.bottom_right_rotate' | 'handle.rotate.mobile_rotate' | 'handle.rotate.top_left_rotate' | 'handle.rotate.top_right_rotate' | 'help-menu.about' | 'help-menu.discord' | 'help-menu.github' | 'help-menu.import-tldr-file' | 'help-menu.keyboard-shortcuts' | 'help-menu.privacy' | 'help-menu.terms' | 'help-menu.title' | 'help-menu.twitter' | 'menu.accessibility' | 'menu.color-theme' | 'menu.copy-as' | 'menu.edit' | 'menu.export-as' | 'menu.file' | 'menu.input-device' | 'menu.language' | 'menu.preferences' | 'menu.theme' | 'menu.title' | 'menu.view' | 'navigation-zone.minimap' | 'navigation-zone.title' | 'navigation-zone.toggle-minimap' | 'navigation-zone.zoom' | 'opacity-style.0.1' | 'opacity-style.0.25' | 'opacity-style.0.5' | 'opacity-style.0.75' | 'opacity-style.1' | 'page-menu.create-new-page' | 'page-menu.edit-done' | 'page-menu.edit-start' | 'page-menu.go-to-page' | 'page-menu.max-page-count-reached' | 'page-menu.new-page-initial-name' | 'page-menu.submenu.delete' | 'page-menu.submenu.duplicate-page' | 'page-menu.submenu.move-down' | 'page-menu.submenu.move-up' | 'page-menu.submenu.rename' | 'page-menu.submenu.title' | 'page-menu.title' | 'people-menu.anonymous-user' | 'people-menu.avatar-color' | 'people-menu.change-color' | 'people-menu.change-name' | 'people-menu.follow' | 'people-menu.following' | 'people-menu.invite' | 'people-menu.leading' | 'people-menu.title' | 'people-menu.user' | 'share-menu.copied' | 'share-menu.copy-link-note' | 'share-menu.copy-link' | 'share-menu.copy-readonly-link-note' | 'share-menu.copy-readonly-link' | 'share-menu.create-snapshot-link' | 'share-menu.creating-project' | 'share-menu.fork-note' | 'share-menu.offline-note' | 'share-menu.project-too-large' | 'share-menu.save-note' | 'share-menu.share-project' | 'share-menu.snapshot-link-note' | 'share-menu.title' | 'share-menu.upload-failed' | 'sharing.confirm-leave.cancel' | 'sharing.confirm-leave.description' | 'sharing.confirm-leave.dont-show-again' | 'sharing.confirm-leave.leave' | 'sharing.confirm-leave.title' | 'shortcuts-dialog.a11y' | 'shortcuts-dialog.collaboration' | 'shortcuts-dialog.edit' | 'shortcuts-dialog.file' | 'shortcuts-dialog.preferences' | 'shortcuts-dialog.text-formatting' | 'shortcuts-dialog.title' | 'shortcuts-dialog.tools' | 'shortcuts-dialog.transform' | 'shortcuts-dialog.view' | 'size-style.l' | 'size-style.m' | 'size-style.s' | 'size-style.xl' | 'spline-style.cubic' | 'spline-style.line' | 'status.offline' | 'style-panel.align' | 'style-panel.arrow-kind' | 'style-panel.arrowhead-end' | 'style-panel.arrowhead-start' | 'style-panel.arrowheads' | 'style-panel.color' | 'style-panel.dash' | 'style-panel.fill' | 'style-panel.font' | 'style-panel.geo' | 'style-panel.label-align' | 'style-panel.mixed' | 'style-panel.opacity' | 'style-panel.position' | 'style-panel.selected' | 'style-panel.size' | 'style-panel.spline' | 'style-panel.title' | 'style-panel.vertical-align' | 'theme.dark' | 'theme.light' | 'theme.system' | 'toast.close' | 'toast.error.copy-fail.desc' | 'toast.error.copy-fail.title' | 'toast.error.export-fail.desc' | 'toast.error.export-fail.title' | 'toast.error' | 'toast.info' | 'toast.success' | 'toast.warning' | 'tool-panel.more' | 'tool-panel.title' | 'tool.arrow-down' | 'tool.arrow-left' | 'tool.arrow-right' | 'tool.arrow-up' | 'tool.arrow' | 'tool.aspect-ratio.circle' | 'tool.aspect-ratio.landscape' | 'tool.aspect-ratio.original' | 'tool.aspect-ratio.portrait' | 'tool.aspect-ratio.square' | 'tool.aspect-ratio.wide' | 'tool.aspect-ratio' | 'tool.bookmark' | 'tool.check-box' | 'tool.cloud' | 'tool.diamond' | 'tool.draw' | 'tool.ellipse' | 'tool.embed' | 'tool.eraser' | 'tool.flip-horz' | 'tool.flip-vert' | 'tool.frame' | 'tool.hand' | 'tool.heart' | 'tool.hexagon' | 'tool.highlight' | 'tool.image-crop-confirm' | 'tool.image-crop' | 'tool.image-toolbar-title' | 'tool.image-zoom' | 'tool.laser' | 'tool.line' | 'tool.media-alt-text-confirm' | 'tool.media-alt-text-desc' | 'tool.media-alt-text' | 'tool.media' | 'tool.note' | 'tool.octagon' | 'tool.oval' | 'tool.pentagon' | 'tool.pointer-down' | 'tool.rectangle' | 'tool.replace-media' | 'tool.rhombus' | 'tool.rich-text-bold' | 'tool.rich-text-bulletList' | 'tool.rich-text-code' | 'tool.rich-text-header' | 'tool.rich-text-highlight' | 'tool.rich-text-italic' | 'tool.rich-text-link-remove' | 'tool.rich-text-link-visit' | 'tool.rich-text-link' | 'tool.rich-text-orderedList' | 'tool.rich-text-strikethrough' | 'tool.rich-text-toolbar-title' | 'tool.rotate-cw' | 'tool.select' | 'tool.star' | 'tool.text' | 'tool.trapezoid' | 'tool.triangle' | 'tool.x-box' | 'ui.checked' | 'ui.close' | 'ui.unchecked' | 'verticalAlign-style.end' | 'verticalAlign-style.middle' | 'verticalAlign-style.start' | 'vscode.file-open.backup-failed' | 'vscode.file-open.backup-saved' | 'vscode.file-open.backup' | 'vscode.file-open.desc' | 'vscode.file-open.dont-show-again' | 'vscode.file-open.open';
 
 /** @public */
 export declare interface TLUiTranslationProviderProps {
@@ -5077,6 +5607,16 @@ export declare interface TLUiZoomMenuProps {
 
 /* Excluded from this release type: TLV1VideoShape */
 
+/** @public */
+export declare interface TLZoomBrushOverlay extends TLOverlay {
+    props: {
+        h: number;
+        w: number;
+        x: number;
+        y: number;
+    };
+}
+
 /** @public @react */
 export declare function ToggleAutoSizeMenuItem(): JSX.Element | null;
 
@@ -5474,8 +6014,6 @@ export declare class VideoShapeUtil extends BaseBoxShapeUtil<TLVideoShape> {
     createShapeForAsset(asset: TLAsset, position: VecModel): null | TLShapePartial;
     getAriaDescriptor(shape: TLVideoShape): string;
     component(shape: TLVideoShape): JSX.Element;
-    indicator(shape: TLVideoShape): JSX.Element;
-    useLegacyIndicator(): boolean;
     getIndicatorPath(shape: TLVideoShape): Path2D;
     toSvg(shape: TLVideoShape, ctx: SvgExportContext): Promise<JSX.Element | null>;
 }
@@ -5490,6 +6028,23 @@ export declare function ViewSubmenu(): JSX.Element;
 /** @public @react */
 export declare function XBoxToolbarItem(): JSX.Element;
 
+/**
+ * Overlay util for the zoom brush rectangle.
+ *
+ * @public
+ */
+export declare class ZoomBrushOverlayUtil extends OverlayUtil<TLZoomBrushOverlay> {
+    static type: string;
+    options: {
+        lineWidth: number;
+        zIndex: number;
+    };
+    isActive(): boolean;
+    getOverlays(): TLZoomBrushOverlay[];
+    render(ctx: CanvasRenderingContext2D, overlays: TLZoomBrushOverlay[]): void;
+    renderMinimap(ctx: CanvasRenderingContext2D, overlays: TLZoomBrushOverlay[], zoom: number): void;
+}
+
 /** @public @react */
 export declare function ZoomOrRotateMenuItem(): JSX.Element;