@tldraw/editor 3.14.0-canary.d926f92ca8d6 → 3.14.0-canary.db789786fb06

package/dist-cjs/index.d.ts

@@ -105,15 +105,15 @@ export declare function approximately(a: number, b: number, precision?: number):
 
 /** @public */
 export declare class Arc2d extends Geometry2d {
-    _center: Vec;
-    radius: number;
-    start: Vec;
-    end: Vec;
-    largeArcFlag: number;
-    sweepFlag: number;
-    measure: number;
-    angleStart: number;
-    angleEnd: number;
+    private _center;
+    private _radius;
+    private _start;
+    private _end;
+    private _largeArcFlag;
+    private _sweepFlag;
+    private _measure;
+    private _angleStart;
+    private _angleEnd;
     constructor(config: Omit<Geometry2dOptions, 'isClosed' | 'isFilled'> & {
         center: Vec;
         end: Vec;
@@ -206,6 +206,12 @@ export declare interface BindingOnShapeChangeOptions<Binding extends TLUnknownBi
     shapeBefore: TLShape;
     /** The shape record after the change is made. */
     shapeAfter: TLShape;
+    /**
+     * Why did this shape change?
+     * - 'self': the shape itself changed
+     * - 'ancestry': the ancestry of the shape changed, but the shape itself may not have done
+     */
+    reason: 'ancestry' | 'self';
 }
 
 /**
@@ -551,10 +557,10 @@ export declare class Circle2d extends Geometry2d {
         x?: number;
         y?: number;
     };
-    _center: Vec;
-    radius: number;
-    x: number;
-    y: number;
+    private _center;
+    private _radius;
+    private _x;
+    private _y;
     constructor(config: Omit<Geometry2dOptions, 'isClosed'> & {
         isFilled: boolean;
         radius: number;
@@ -716,10 +722,10 @@ export declare function createTLUser(opts?: {
 
 /** @public */
 export declare class CubicBezier2d extends Polyline2d {
-    a: Vec;
-    b: Vec;
-    c: Vec;
-    d: Vec;
+    private _a;
+    private _b;
+    private _c;
+    private _d;
     constructor(config: Omit<Geometry2dOptions, 'isClosed' | 'isFilled'> & {
         cp1: Vec;
         cp2: Vec;
@@ -727,20 +733,19 @@ export declare class CubicBezier2d extends Polyline2d {
         start: Vec;
     });
     getVertices(): Vec[];
-    midPoint(): Vec;
     nearestPoint(A: VecLike): Vec;
     getSvgPathData(first?: boolean): string;
     static GetAtT(segment: CubicBezier2d, t: number): Vec;
-    getLength(filters?: Geometry2dFilters, precision?: number): number;
+    getLength(_filters?: Geometry2dFilters, precision?: number): number;
 }
 
 /** @public */
 export declare class CubicSpline2d extends Geometry2d {
-    points: Vec[];
+    private _points;
     constructor(config: Omit<Geometry2dOptions, 'isClosed' | 'isFilled'> & {
         points: Vec[];
     });
-    _segments?: CubicBezier2d[];
+    private _segments?;
     get segments(): CubicBezier2d[];
     getLength(): number;
     getVertices(): Vec[];
@@ -927,17 +932,16 @@ export declare const EASINGS: {
 
 /** @public */
 export declare class Edge2d extends Geometry2d {
-    start: Vec;
-    end: Vec;
-    d: Vec;
-    u: Vec;
-    ul: number;
+    private _start;
+    private _end;
+    private _d;
+    private _u;
+    private _ul;
     constructor(config: {
         end: Vec;
         start: Vec;
     });
     getLength(): number;
-    midPoint(): Vec;
     getVertices(): Vec[];
     nearestPoint(point: VecLike): Vec;
     getSvgPathData(first?: boolean): string;
@@ -1627,6 +1631,13 @@ export declare class Editor extends EventEmitter<TLEventMap> {
      * @public
      */
     getSelectionPageBounds(): Box | null;
+    /**
+     * The bounds of the selection bounding box in the current page space.
+     *
+     * @readonly
+     * @public
+     */
+    getSelectionScreenBounds(): Box | undefined;
     /* Excluded from this release type: getShapesSharedRotation */
     /**
      * The rotation of the selection bounding box in the current page space.
@@ -2457,23 +2468,6 @@ export declare class Editor extends EventEmitter<TLEventMap> {
      * @public
      */
     getShapeGeometry<T extends Geometry2d>(shape: TLShape | TLShapeId, opts?: TLGeometryOpts): T;
-    private _shapePageGeometryCaches;
-    /**
-     * Get the geometry of a shape in page-space.
-     *
-     * @example
-     * ```ts
-     * editor.getShapePageGeometry(myShape)
-     * editor.getShapePageGeometry(myShapeId)
-     * editor.getShapePageGeometry(myShapeId, { context: "arrow" })
-     * ```
-     *
-     * @param shape - The shape (or shape id) to get the geometry for.
-     * @param opts - Additional options about the request for geometry. Passed to {@link ShapeUtil.getGeometry}.
-     *
-     * @public
-     */
-    getShapePageGeometry<T extends Geometry2d>(shape: TLShape | TLShapeId, opts?: TLGeometryOpts): T;
     /* Excluded from this release type: _getShapeHandlesCache */
     /**
      * Get the handles (if any) for a shape.
@@ -2651,11 +2645,16 @@ export declare class Editor extends EventEmitter<TLEventMap> {
      *
      * @public
      */
-    isShapeOrAncestorLocked(shape?: TLShape): boolean;
-    isShapeOrAncestorLocked(id?: TLShapeId): boolean;
+    isShapeOrAncestorLocked(shape?: TLShape | TLShapeId): boolean;
+    /**
+     * Get shapes that are outside of the viewport.
+     *
+     * @public
+     */
+    getNotVisibleShapes(): Set<TLShapeId>;
     private _notVisibleShapes;
     /**
-     * Get culled shapes.
+     * Get culled shapes (those that should not render), taking into account which shapes are selected or editing.
      *
      * @public
      */
@@ -2697,12 +2696,14 @@ export declare class Editor extends EventEmitter<TLEventMap> {
      * @example
      * ```ts
      * editor.getShapesAtPoint({ x: 100, y: 100 })
-     * editor.getShapesAtPoint({ x: 100, y: 100 }, { hitInside: true, exact: true })
+     * editor.getShapesAtPoint({ x: 100, y: 100 }, { hitInside: true, margin: 8 })
      * ```
      *
      * @param point - The page point to test.
      * @param opts - The options for the hit point testing.
      *
+     * @returns An array of shapes at the given point, sorted in reverse order of their absolute z-index (top-most shape first).
+     *
      * @public
      */
     getShapesAtPoint(point: VecLike, opts?: {
@@ -2910,6 +2911,8 @@ export declare class Editor extends EventEmitter<TLEventMap> {
      * @public
      */
     getShapeAndDescendantIds(ids: TLShapeId[]): Set<TLShapeId>;
+    /** @deprecated Use {@link Editor.getDraggingOverShape} instead */
+    getDroppingOverShape(point: Vec, droppingShapes: TLShape[]): TLShape | undefined;
     /**
      * Get the shape that some shapes should be dropped on at a given point.
      *
@@ -2920,7 +2923,7 @@ export declare class Editor extends EventEmitter<TLEventMap> {
      *
      * @public
      */
-    getDroppingOverShape(point: VecLike, droppingShapes?: TLShape[]): TLUnknownShape | undefined;
+    getDraggingOverShape(point: Vec, droppingShapes: TLShape[]): TLShape | undefined;
     /**
      * Get the shape that should be selected when you click on a given shape, assuming there is
      * nothing already selected. It will not return anything higher than or including the current
@@ -3261,6 +3264,22 @@ export declare class Editor extends EventEmitter<TLEventMap> {
      * @public
      */
     getInitialMetaForShape(_shape: TLShape): JsonObject;
+    /**
+     * Get whether the provided shape can be created.
+     *
+     * @param shape - The shape or shape IDs to check.
+     *
+     * @public
+     */
+    canCreateShape<T extends TLUnknownShape>(shape: OptionalKeys<TLShapePartial<T>, 'id'> | T['id']): boolean;
+    /**
+     * Get whether the provided shapes can be created.
+     *
+     * @param shapes - The shapes or shape IDs to create.
+     *
+     * @public
+     */
+    canCreateShapes<T extends TLUnknownShape>(shapes: (OptionalKeys<TLShapePartial<T>, 'id'> | T['id'])[]): boolean;
     /**
      * Create a single shape.
      *
@@ -3607,6 +3626,12 @@ export declare class Editor extends EventEmitter<TLEventMap> {
      * @param info - Info about the external content.
      */
     putExternalContent<E>(info: TLExternalContent<E>): Promise<void>;
+    /**
+     * Handle replacing external content.
+     *
+     * @param info - Info about the external content.
+     */
+    replaceExternalContent<E>(info: TLExternalContent<E>): Promise<void>;
     /**
      * Get content that can be exported for the given shape ids.
      *
@@ -3996,13 +4021,13 @@ export declare class Ellipse2d extends Geometry2d {
         height: number;
         width: number;
     };
-    w: number;
-    h: number;
+    private _w;
+    private _h;
+    private _edges?;
     constructor(config: Omit<Geometry2dOptions, 'isClosed'> & {
         height: number;
         width: number;
     });
-    _edges?: Edge2d[];
     get edges(): Edge2d[];
     getVertices(): any[];
     nearestPoint(A: VecLike): Vec;
@@ -4073,6 +4098,7 @@ export declare abstract class Geometry2d {
     isFilled: boolean;
     isClosed: boolean;
     isLabel: boolean;
+    isEmptyLabel: boolean;
     isInternal: boolean;
     debugColor?: string;
     ignore?: boolean;
@@ -4164,6 +4190,21 @@ export declare function getCursor(cursor: TLCursorType, rotation?: number, color
 /** @public */
 export declare function getDefaultCdnBaseUrl(): string;
 
+/**
+ * Get the shapes that will be reparented to new parents when the shapes are dropped.
+ *
+ * @param editor - The editor instance.
+ * @param shapes - The shapes to check.
+ * @param cb - A callback to filter out certain shapes.
+ * @returns An object with the shapes that will be reparented to new parents and the shapes that will be reparented to the page or their ancestral group.
+ *
+ * @public
+ */
+export declare function getDroppedShapesToNewParents(editor: Editor, shapes: Set<TLShape> | TLShape[], cb?: (shape: TLShape, parent: TLShape) => boolean): {
+    remainingShapesToReparent: Set<TLShape>;
+    reparenting: Map<TLShapeId, TLShape[]>;
+};
+
 /** @public */
 export declare function getFontsFromRichText(editor: Editor, richText: TLRichText, initialState: RichTextFontVisitorState): TLFontFace[];
 
@@ -4517,6 +4558,20 @@ export declare function intersectPolygonPolygon(polygonA: VecLike[], polygonB: V
  */
 export declare const isSafeFloat: (n: number) => boolean;
 
+/**
+ * Reparents shapes that are no longer contained within their parent shapes.
+ * todo: rename me to something more descriptive, like `reparentOccludedShapes` or `reparentAutoDroppedShapes`
+ *
+ * @param editor - The editor instance.
+ * @param shapeIds - The IDs of the shapes to reparent.
+ * @param opts - Optional options, including a callback to filter out certain parents, such as when removing a frame.
+ *
+ * @public
+ */
+export declare function kickoutOccludedShapes(editor: Editor, shapeIds: TLShapeId[], opts?: {
+    filter?(parent: TLShape): boolean;
+}): void;
+
 /* Excluded from this release type: LicenseFromKeyResult */
 
 /* Excluded from this release type: LicenseInfo */
@@ -4687,7 +4742,7 @@ export declare const PI2: number;
 
 /** @public */
 export declare class Point2d extends Geometry2d {
-    point: Vec;
+    private _point;
     constructor(config: Omit<Geometry2dOptions, 'isClosed' | 'isFilled'> & {
         margin: number;
         point: Vec;
@@ -4731,12 +4786,12 @@ export declare function polygonsIntersect(a: VecLike[], b: VecLike[]): boolean;
 
 /** @public */
 export declare class Polyline2d extends Geometry2d {
-    points: Vec[];
+    private _points;
+    private _segments?;
     constructor(config: Omit<Geometry2dOptions, 'isClosed' | 'isFilled'> & {
         points: Vec[];
     });
-    _segments?: Edge2d[];
-    get segments(): Edge2d[];
+    protected get segments(): Edge2d[];
     getLength(): number;
     getVertices(): Vec[];
     nearestPoint(A: VecLike): Vec;
@@ -4802,10 +4857,10 @@ export declare class ReadonlySharedStyleMap {
 
 /** @public */
 export declare class Rectangle2d extends Polygon2d {
-    x: number;
-    y: number;
-    w: number;
-    h: number;
+    private _x;
+    private _y;
+    private _w;
+    private _h;
     constructor(config: Omit<Geometry2dOptions, 'isClosed'> & {
         height: number;
         width: number;
@@ -4814,6 +4869,7 @@ export declare class Rectangle2d extends Polygon2d {
     });
     getBounds(): Box;
     getSvgPathData(): string;
+    private negativeZeroFix;
 }
 
 /** @public */
@@ -5195,14 +5251,6 @@ export declare abstract class ShapeUtil<Shape extends TLUnknownShape = TLUnknown
      * @public
      */
     canReceiveNewChildrenOfType(_shape: Shape, _type: TLShape['type']): boolean;
-    /**
-     * Get whether the shape can receive children of a given type.
-     *
-     * @param shape - The shape type.
-     * @param shapes - The shapes that are being dropped.
-     * @public
-     */
-    canDropShapes(_shape: Shape, _shapes: TLShape[]): boolean;
     /**
      * Get the shape as an SVG object.
      *
@@ -5290,7 +5338,15 @@ export declare abstract class ShapeUtil<Shape extends TLUnknownShape = TLUnknown
      */
     onCrop?(shape: Shape, info: TLCropInfo<Shape>): Omit<TLShapePartial<Shape>, 'id' | 'type'> | undefined | void;
     /**
-     * A callback called when some other shapes are dragged over this one.
+     * A callback called when some other shapes are dragged into this one. This fires when the shapes are dragged over the shape for the first time.
+     *
+     * @param shape - The shape.
+     * @param shapes - The shapes that are being dragged in.
+     * @public
+     */
+    onDragShapesIn?(shape: Shape, shapes: TLShape[], info: TLDragShapesInInfo): void;
+    /**
+     * A callback called when some other shapes are dragged over this one. This fires when the shapes are dragged over the shape for the first time (after the onDragShapesIn callback), and again on every update while the shapes are being dragged.
      *
      * @example
      *
@@ -5304,7 +5360,7 @@ export declare abstract class ShapeUtil<Shape extends TLUnknownShape = TLUnknown
      * @param shapes - The shapes that are being dragged over this one.
      * @public
      */
-    onDragShapesOver?(shape: Shape, shapes: TLShape[]): void;
+    onDragShapesOver?(shape: Shape, shapes: TLShape[], info: TLDragShapesOverInfo): void;
     /**
      * A callback called when some other shapes are dragged out of this one.
      *
@@ -5312,7 +5368,7 @@ export declare abstract class ShapeUtil<Shape extends TLUnknownShape = TLUnknown
      * @param shapes - The shapes that are being dragged out.
      * @public
      */
-    onDragShapesOut?(shape: Shape, shapes: TLShape[]): void;
+    onDragShapesOut?(shape: Shape, shapes: TLShape[], info: TLDragShapesOutInfo): void;
     /**
      * A callback called when some other shapes are dropped over this one.
      *
@@ -5320,7 +5376,7 @@ export declare abstract class ShapeUtil<Shape extends TLUnknownShape = TLUnknown
      * @param shapes - The shapes that are being dropped over this one.
      * @public
      */
-    onDropShapesOver?(shape: Shape, shapes: TLShape[]): void;
+    onDropShapesOver?(shape: Shape, shapes: TLShape[], info: TLDropShapesOverInfo): void;
     /**
      * A callback called when a shape starts being resized.
      *
@@ -5548,12 +5604,12 @@ export declare class Stadium2d extends Geometry2d {
         height: number;
         width: number;
     };
-    w: number;
-    h: number;
-    a: Arc2d;
-    b: Edge2d;
-    c: Arc2d;
-    d: Edge2d;
+    private _w;
+    private _h;
+    private _a;
+    private _b;
+    private _c;
+    private _d;
     constructor(config: Omit<Geometry2dOptions, 'isClosed'> & {
         height: number;
         width: number;
@@ -5622,7 +5678,7 @@ export declare abstract class StateNode implements Partial<TLEventHandlers> {
     transition(id: string, info?: any): this;
     handleEvent(info: Exclude<TLEventInfo, TLPinchEventInfo>): void;
     enter(info: any, from: string): void;
-    exit(info: any, from: string): void;
+    exit(info: any, to: string): void;
     /**
      * This is a hack / escape hatch that will tell the editor to
      * report a different state as active (in `getCurrentToolId()`) when
@@ -5729,43 +5785,15 @@ export declare const TAB_ID: string;
 /** @public */
 export declare class TextManager {
     editor: Editor;
-    private baseElem;
+    private elm;
+    private defaultStyles;
     constructor(editor: Editor);
-    measureText(textToMeasure: string, opts: {
-        /**
-         * When maxWidth is a number, the text will be wrapped to that maxWidth. When maxWidth
-         * is null, the text will be measured without wrapping, but explicit line breaks and
-         * space are preserved.
-         */
-        maxWidth: null | number;
-        disableOverflowWrapBreaking?: boolean;
-        fontFamily: string;
-        fontSize: number;
-        fontStyle: string;
-        fontWeight: string;
-        lineHeight: number;
-        minWidth?: null | number;
-        padding: string;
-    }): BoxModel & {
+    dispose(): void;
+    private resetElmStyles;
+    measureText(textToMeasure: string, opts: TLMeasureTextOpts): BoxModel & {
         scrollWidth: number;
     };
-    measureHtml(html: string, opts: {
-        /**
-         * When maxWidth is a number, the text will be wrapped to that maxWidth. When maxWidth
-         * is null, the text will be measured without wrapping, but explicit line breaks and
-         * space are preserved.
-         */
-        maxWidth: null | number;
-        disableOverflowWrapBreaking?: boolean;
-        fontFamily: string;
-        fontSize: number;
-        fontStyle: string;
-        fontWeight: string;
-        lineHeight: number;
-        minWidth?: null | number;
-        otherStyles?: Record<string, string>;
-        padding: string;
-    }): BoxModel & {
+    measureHtml(html: string, opts: TLMeasureTextOpts): BoxModel & {
         scrollWidth: number;
     };
     /**
@@ -6022,6 +6050,7 @@ export declare interface TLCropInfo<T extends TLShape> {
         w: number;
     };
     initialShape: T;
+    aspectRatioLocked?: boolean;
 }
 
 /** @public */
@@ -6080,6 +6109,29 @@ export declare interface TLDeepLinkOptions {
     onChange?(url: URL, editor: Editor): void;
 }
 
+/** @public */
+export declare interface TLDragShapesInInfo {
+    initialDraggingOverShapeId: null | TLShapeId;
+    prevDraggingOverShapeId: null | TLShapeId;
+    initialParentIds: Map<TLShapeId, TLParentId>;
+    initialIndices: Map<TLShapeId, IndexKey>;
+}
+
+/** @public */
+export declare interface TLDragShapesOutInfo {
+    nextDraggingOverShapeId: null | TLShapeId;
+    initialDraggingOverShapeId: null | TLShapeId;
+    initialParentIds: Map<TLShapeId, TLParentId>;
+    initialIndices: Map<TLShapeId, IndexKey>;
+}
+
+/** @public */
+export declare interface TLDragShapesOverInfo {
+    initialDraggingOverShapeId: null | TLShapeId;
+    initialParentIds: Map<TLShapeId, TLParentId>;
+    initialIndices: Map<TLShapeId, IndexKey>;
+}
+
 /** @public @react */
 export declare const TldrawEditor: React_2.NamedExoticComponent<TldrawEditorProps>;
 
@@ -6327,6 +6379,13 @@ export declare interface TldrawOptions {
     readonly branding?: string;
 }
 
+/** @public */
+export declare interface TLDropShapesOverInfo {
+    initialDraggingOverShapeId: null | TLShapeId;
+    initialParentIds: Map<TLShapeId, TLParentId>;
+    initialIndices: Map<TLShapeId, IndexKey>;
+}
+
 /** @public */
 export declare interface TLEditorComponents {
     Background?: ComponentType | null;
@@ -6549,6 +6608,10 @@ export declare interface TLEventMap {
         };
         shapeId: TLShapeId;
     }];
+    'created-shapes': [TLRecord[]];
+    'edited-shapes': [TLRecord[]];
+    'deleted-shapes': [TLShapeId[]];
+    edit: [];
 }
 
 /** @public */
@@ -6579,7 +6642,7 @@ export declare type TLExportType = 'jpeg' | 'png' | 'svg' | 'webp';
 export declare type TLExternalAsset = TLFileExternalAsset | TLUrlExternalAsset;
 
 /** @public */
-export declare type TLExternalContent<EmbedDefinition> = TLEmbedExternalContent<EmbedDefinition> | TLExcalidrawExternalContent | TLFilesExternalContent | TLSvgTextExternalContent | TLTextExternalContent | TLTldrawExternalContent | TLUrlExternalContent;
+export declare type TLExternalContent<EmbedDefinition> = TLEmbedExternalContent<EmbedDefinition> | TLExcalidrawExternalContent | TLFileReplaceExternalContent | TLFilesExternalContent | TLSvgTextExternalContent | TLTextExternalContent | TLTldrawExternalContent | TLUrlExternalContent;
 
 /** @public */
 export declare type TLExternalContentSource = TLErrorExternalContentSource | TLExcalidrawExternalContentSource | TLTextExternalContentSource | TLTldrawExternalContentSource;
@@ -6591,11 +6654,19 @@ export declare interface TLFileExternalAsset {
     assetId?: TLAssetId;
 }
 
+/** @public */
+export declare interface TLFileReplaceExternalContent extends TLBaseExternalContent {
+    type: 'file-replace';
+    file: File;
+    shapeId: TLShapeId;
+    isImage: boolean;
+}
+
 /** @public */
 export declare interface TLFilesExternalContent extends TLBaseExternalContent {
     type: 'files';
     files: File[];
-    ignoreParent: boolean;
+    ignoreParent?: boolean;
 }
 
 /**
@@ -6790,6 +6861,27 @@ export declare interface TLLoadSnapshotOptions {
     forceOverwriteSessionState?: boolean;
 }
 
+/** @public */
+export declare interface TLMeasureTextOpts {
+    fontStyle: string;
+    fontWeight: string;
+    fontFamily: string;
+    fontSize: number;
+    /** This must be a number, e.g. 1.35, not a pixel value. */
+    lineHeight: number;
+    /**
+     * When maxWidth is a number, the text will be wrapped to that maxWidth. When maxWidth
+     * is null, the text will be measured without wrapping, but explicit line breaks and
+     * space are preserved.
+     */
+    maxWidth: null | number;
+    minWidth?: null | number;
+    padding: string;
+    otherStyles?: Record<string, string>;
+    disableOverflowWrapBreaking?: boolean;
+    measureScrollWidth?: boolean;
+}
+
 /** @public */
 export declare interface TLMeasureTextSpanOpts {
     overflow: 'truncate-clip' | 'truncate-ellipsis' | 'wrap';
@@ -6803,6 +6895,7 @@ export declare interface TLMeasureTextSpanOpts {
     lineHeight: number;
     textAlign: TLDefaultHorizontalAlignStyle;
     otherStyles?: Record<string, string>;
+    measureScrollWidth?: boolean;
 }
 
 /** @public */
@@ -7464,6 +7557,7 @@ export declare class TransformedGeometry2d extends Geometry2d {
 /** @public */
 export declare interface TransformedGeometry2dOptions {
     isLabel?: boolean;
+    isEmptyLabel?: boolean;
     isInternal?: boolean;
     debugColor?: string;
     ignore?: boolean;
@@ -7686,7 +7780,7 @@ export declare class Vec {
     len(): number;
     pry(V: VecLike): number;
     per(): this;
-    uni(): Vec;
+    uni(): this;
     tan(V: VecLike): Vec;
     dist(V: VecLike): number;
     distanceToLineSegment(A: VecLike, B: VecLike): number;
@@ -7697,8 +7791,9 @@ export declare class Vec {
     lrp(B: VecLike, t: number): Vec;
     equals(B: VecLike): boolean;
     equalsXY(x: number, y: number): boolean;
+    /** @deprecated use `uni` instead */
     norm(): this;
-    toFixed(): Vec;
+    toFixed(): this;
     toString(): string;
     toJson(): VecModel;
     toArray(): number[];