9e4dbd1901
This PR fixes the text label placement for geo shapes. (It also fixes the way an ellipse renders when set to dash or dotted). There's still the slightest offset of the text label's outline when you begin editing. Maybe we should keep the indicator instead? ### Change Type - [x] `patch` — Bug fix ### Test Plan Create a hexagon shape hit enter to type indicator is offset, text label is no longer offset --------- Co-authored-by: David Sheldrick <d.j.sheldrick@gmail.com>
2907 lines
88 KiB
Markdown
2907 lines
88 KiB
Markdown
## API Report File for "@tldraw/editor"
|
|
|
|
> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
|
|
|
|
```ts
|
|
|
|
/// <reference types="react" />
|
|
|
|
import { Atom } from '@tldraw/state';
|
|
import { atom } from '@tldraw/state';
|
|
import { Box2dModel } from '@tldraw/tlschema';
|
|
import { ComponentType } from 'react';
|
|
import { Computed } from '@tldraw/state';
|
|
import { computed } from '@tldraw/state';
|
|
import { ComputedCache } from '@tldraw/store';
|
|
import { EmbedDefinition } from '@tldraw/tlschema';
|
|
import { EMPTY_ARRAY } from '@tldraw/state';
|
|
import { EventEmitter } from 'eventemitter3';
|
|
import { HistoryEntry } from '@tldraw/store';
|
|
import { HTMLProps } from 'react';
|
|
import { JsonObject } from '@tldraw/utils';
|
|
import { MemoExoticComponent } from 'react';
|
|
import { Migrations } from '@tldraw/store';
|
|
import { NamedExoticComponent } from 'react';
|
|
import { PointerEventHandler } from 'react';
|
|
import { react } from '@tldraw/state';
|
|
import { default as React_2 } from 'react';
|
|
import * as React_3 from 'react';
|
|
import { SerializedSchema } from '@tldraw/store';
|
|
import { SerializedStore } from '@tldraw/store';
|
|
import { ShapeProps } from '@tldraw/tlschema';
|
|
import { Signal } from '@tldraw/state';
|
|
import { StoreSchema } from '@tldraw/store';
|
|
import { StoreSnapshot } from '@tldraw/store';
|
|
import { StyleProp } from '@tldraw/tlschema';
|
|
import { TLArrowShape } from '@tldraw/tlschema';
|
|
import { TLArrowShapeArrowheadStyle } from '@tldraw/tlschema';
|
|
import { TLAsset } from '@tldraw/tlschema';
|
|
import { TLAssetId } from '@tldraw/tlschema';
|
|
import { TLAssetPartial } from '@tldraw/tlschema';
|
|
import { TLBaseShape } from '@tldraw/tlschema';
|
|
import { TLBookmarkAsset } from '@tldraw/tlschema';
|
|
import { TLCamera } from '@tldraw/tlschema';
|
|
import { TLCursor } from '@tldraw/tlschema';
|
|
import { TLCursorType } from '@tldraw/tlschema';
|
|
import { TLDefaultHorizontalAlignStyle } from '@tldraw/tlschema';
|
|
import { TLDocument } from '@tldraw/tlschema';
|
|
import { TLGroupShape } from '@tldraw/tlschema';
|
|
import { TLHandle } from '@tldraw/tlschema';
|
|
import { TLImageAsset } from '@tldraw/tlschema';
|
|
import { TLInstance } from '@tldraw/tlschema';
|
|
import { TLInstancePageState } from '@tldraw/tlschema';
|
|
import { TLInstancePresence } from '@tldraw/tlschema';
|
|
import { TLPage } from '@tldraw/tlschema';
|
|
import { TLPageId } from '@tldraw/tlschema';
|
|
import { TLParentId } from '@tldraw/tlschema';
|
|
import { TLRecord } from '@tldraw/tlschema';
|
|
import { TLScribble } from '@tldraw/tlschema';
|
|
import { TLShape } from '@tldraw/tlschema';
|
|
import { TLShapeId } from '@tldraw/tlschema';
|
|
import { TLShapePartial } from '@tldraw/tlschema';
|
|
import { TLStore } from '@tldraw/tlschema';
|
|
import { TLStoreProps } from '@tldraw/tlschema';
|
|
import { TLUnknownShape } from '@tldraw/tlschema';
|
|
import { TLVideoAsset } from '@tldraw/tlschema';
|
|
import { track } from '@tldraw/state';
|
|
import { transact } from '@tldraw/state';
|
|
import { transaction } from '@tldraw/state';
|
|
import { UnknownRecord } from '@tldraw/store';
|
|
import { useComputed } from '@tldraw/state';
|
|
import { useQuickReactor } from '@tldraw/state';
|
|
import { useReactor } from '@tldraw/state';
|
|
import { useValue } from '@tldraw/state';
|
|
import { Vec2dModel } from '@tldraw/tlschema';
|
|
import { whyAmIRunning } from '@tldraw/state';
|
|
|
|
// @public
|
|
export function angleDelta(a0: number, a1: number): number;
|
|
|
|
// @internal (undocumented)
|
|
export const ANIMATION_MEDIUM_MS = 320;
|
|
|
|
// @internal (undocumented)
|
|
export const ANIMATION_SHORT_MS = 80;
|
|
|
|
// @internal (undocumented)
|
|
export function applyRotationToSnapshotShapes({ delta, editor, snapshot, stage, }: {
|
|
delta: number;
|
|
snapshot: TLRotationSnapshot;
|
|
editor: Editor;
|
|
stage: 'end' | 'one-off' | 'start' | 'update';
|
|
}): void;
|
|
|
|
// @public
|
|
export function approximately(a: number, b: number, precision?: number): boolean;
|
|
|
|
// @public (undocumented)
|
|
export class Arc2d extends Geometry2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed' | 'isFilled'> & {
|
|
center: Vec2d;
|
|
radius: number;
|
|
start: Vec2d;
|
|
end: Vec2d;
|
|
sweepFlag: number;
|
|
largeArcFlag: number;
|
|
});
|
|
// (undocumented)
|
|
angleEnd: number;
|
|
// (undocumented)
|
|
angleStart: number;
|
|
// (undocumented)
|
|
_center: Vec2d;
|
|
// (undocumented)
|
|
end: Vec2d;
|
|
// (undocumented)
|
|
getVertices(): Vec2d[];
|
|
// (undocumented)
|
|
hitTestLineSegment(A: Vec2d, B: Vec2d, _zoom: number): boolean;
|
|
// (undocumented)
|
|
length: number;
|
|
// (undocumented)
|
|
measure: number;
|
|
// (undocumented)
|
|
nearestPoint(point: Vec2d): Vec2d;
|
|
// (undocumented)
|
|
radius: number;
|
|
// (undocumented)
|
|
start: Vec2d;
|
|
}
|
|
|
|
// @public
|
|
export function areAnglesCompatible(a: number, b: number): boolean;
|
|
|
|
export { Atom }
|
|
|
|
export { atom }
|
|
|
|
// @public (undocumented)
|
|
export function average(A: VecLike, B: VecLike): string;
|
|
|
|
// @public (undocumented)
|
|
export abstract class BaseBoxShapeTool extends StateNode {
|
|
// (undocumented)
|
|
static children: () => (typeof Idle | typeof Pointing)[];
|
|
// (undocumented)
|
|
static id: string;
|
|
// (undocumented)
|
|
static initial: string;
|
|
// (undocumented)
|
|
abstract shapeType: string;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export abstract class BaseBoxShapeUtil<Shape extends TLBaseBoxShape> extends ShapeUtil<Shape> {
|
|
// (undocumented)
|
|
getGeometry(shape: Shape): Geometry2d;
|
|
// (undocumented)
|
|
onResize: TLOnResizeHandler<any>;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export class Box2d {
|
|
constructor(x?: number, y?: number, w?: number, h?: number);
|
|
// (undocumented)
|
|
get aspectRatio(): number;
|
|
// (undocumented)
|
|
get center(): Vec2d;
|
|
set center(v: Vec2d);
|
|
// (undocumented)
|
|
clone(): Box2d;
|
|
// (undocumented)
|
|
static Collides: (A: Box2d, B: Box2d) => boolean;
|
|
// (undocumented)
|
|
collides(B: Box2d): boolean;
|
|
// (undocumented)
|
|
static Common: (boxes: Box2d[]) => Box2d;
|
|
// (undocumented)
|
|
static Contains: (A: Box2d, B: Box2d) => boolean;
|
|
// (undocumented)
|
|
contains(B: Box2d): boolean;
|
|
// (undocumented)
|
|
static ContainsPoint: (A: Box2d, B: VecLike, margin?: number) => boolean;
|
|
// (undocumented)
|
|
containsPoint(V: VecLike, margin?: number): boolean;
|
|
// (undocumented)
|
|
get corners(): Vec2d[];
|
|
// (undocumented)
|
|
static Equals(a: Box2d | Box2dModel, b: Box2d | Box2dModel): boolean;
|
|
// (undocumented)
|
|
equals(other: Box2d | Box2dModel): boolean;
|
|
// (undocumented)
|
|
static Expand(A: Box2d, B: Box2d): Box2d;
|
|
// (undocumented)
|
|
expand(A: Box2d): this;
|
|
// (undocumented)
|
|
static ExpandBy(A: Box2d, n: number): Box2d;
|
|
// (undocumented)
|
|
expandBy(n: number): this;
|
|
// (undocumented)
|
|
static From(box: Box2dModel): Box2d;
|
|
// (undocumented)
|
|
static FromPoints(points: VecLike[]): Box2d;
|
|
// (undocumented)
|
|
getHandlePoint(handle: SelectionCorner | SelectionEdge): Vec2d;
|
|
// (undocumented)
|
|
h: number;
|
|
// (undocumented)
|
|
get height(): number;
|
|
set height(n: number);
|
|
// (undocumented)
|
|
static Includes: (A: Box2d, B: Box2d) => boolean;
|
|
// (undocumented)
|
|
includes(B: Box2d): boolean;
|
|
// (undocumented)
|
|
get maxX(): number;
|
|
// (undocumented)
|
|
get maxY(): number;
|
|
// (undocumented)
|
|
get midX(): number;
|
|
// (undocumented)
|
|
get midY(): number;
|
|
// (undocumented)
|
|
get minX(): number;
|
|
set minX(n: number);
|
|
// (undocumented)
|
|
get minY(): number;
|
|
set minY(n: number);
|
|
// (undocumented)
|
|
get point(): Vec2d;
|
|
set point(val: Vec2d);
|
|
// (undocumented)
|
|
static Resize(box: Box2d, handle: SelectionCorner | SelectionEdge | string, dx: number, dy: number, isAspectRatioLocked?: boolean): {
|
|
box: Box2d;
|
|
scaleX: number;
|
|
scaleY: number;
|
|
};
|
|
// (undocumented)
|
|
resize(handle: SelectionCorner | SelectionEdge | string, dx: number, dy: number): void;
|
|
// (undocumented)
|
|
scale(n: number): this;
|
|
// (undocumented)
|
|
set(x?: number, y?: number, w?: number, h?: number): this;
|
|
// (undocumented)
|
|
setTo(B: Box2d): this;
|
|
// (undocumented)
|
|
static Sides: (A: Box2d, inset?: number) => Vec2d[][];
|
|
// (undocumented)
|
|
get sides(): Array<[Vec2d, Vec2d]>;
|
|
// (undocumented)
|
|
get size(): Vec2d;
|
|
// (undocumented)
|
|
get snapPoints(): Vec2d[];
|
|
// (undocumented)
|
|
snapToGrid(size: number): void;
|
|
// (undocumented)
|
|
toFixed(): this;
|
|
// (undocumented)
|
|
toJson(): Box2dModel;
|
|
// (undocumented)
|
|
translate(delta: VecLike): this;
|
|
// (undocumented)
|
|
union(box: Box2dModel): this;
|
|
// (undocumented)
|
|
w: number;
|
|
// (undocumented)
|
|
get width(): number;
|
|
set width(n: number);
|
|
// (undocumented)
|
|
x: number;
|
|
// (undocumented)
|
|
y: number;
|
|
// (undocumented)
|
|
static ZeroFix(other: Box2d | Box2dModel): Box2d;
|
|
// (undocumented)
|
|
zeroFix(): this;
|
|
}
|
|
|
|
// @internal (undocumented)
|
|
export const CAMERA_SLIDE_FRICTION = 0.09;
|
|
|
|
// @public (undocumented)
|
|
export function canonicalizeRotation(a: number): number;
|
|
|
|
// @public (undocumented)
|
|
export const Canvas: React_2.MemoExoticComponent<({ className }: {
|
|
className?: string | undefined;
|
|
}) => JSX.Element>;
|
|
|
|
// @public (undocumented)
|
|
export class Circle2d extends Geometry2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed'> & {
|
|
x?: number;
|
|
y?: number;
|
|
radius: number;
|
|
isFilled: boolean;
|
|
});
|
|
// (undocumented)
|
|
_center: Vec2d;
|
|
// (undocumented)
|
|
config: Omit<Geometry2dOptions, 'isClosed'> & {
|
|
x?: number;
|
|
y?: number;
|
|
radius: number;
|
|
isFilled: boolean;
|
|
};
|
|
// (undocumented)
|
|
getBounds(): Box2d;
|
|
// (undocumented)
|
|
getVertices(): Vec2d[];
|
|
// (undocumented)
|
|
hitTestLineSegment(A: Vec2d, B: Vec2d, _zoom: number): boolean;
|
|
// (undocumented)
|
|
nearestPoint(point: Vec2d): Vec2d;
|
|
// (undocumented)
|
|
radius: number;
|
|
// (undocumented)
|
|
x: number;
|
|
// (undocumented)
|
|
y: number;
|
|
}
|
|
|
|
// @public
|
|
export function clamp(n: number, min: number): number;
|
|
|
|
// @public
|
|
export function clamp(n: number, min: number, max: number): number;
|
|
|
|
// @public
|
|
export function clampRadians(r: number): number;
|
|
|
|
// @public
|
|
export function clockwiseAngleDist(a0: number, a1: number): number;
|
|
|
|
export { computed }
|
|
|
|
// @public (undocumented)
|
|
export const coreShapes: readonly [typeof GroupShapeUtil];
|
|
|
|
// @public
|
|
export function createSessionStateSnapshotSignal(store: TLStore): Signal<null | TLSessionStateSnapshot>;
|
|
|
|
// @public
|
|
export function createTLStore({ initialData, defaultName, ...rest }: TLStoreOptions): TLStore;
|
|
|
|
// @public (undocumented)
|
|
export function createTLUser(opts?: {
|
|
derivePresenceState?: ((store: TLStore) => Signal<null | TLInstancePresence>) | undefined;
|
|
userPreferences?: Signal<TLUserPreferences, unknown> | undefined;
|
|
setUserPreferences?: ((userPreferences: TLUserPreferences) => void) | undefined;
|
|
}): TLUser;
|
|
|
|
// @public (undocumented)
|
|
export class CubicBezier2d extends Polyline2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed' | 'isFilled'> & {
|
|
start: Vec2d;
|
|
cp1: Vec2d;
|
|
cp2: Vec2d;
|
|
end: Vec2d;
|
|
});
|
|
// (undocumented)
|
|
a: Vec2d;
|
|
// (undocumented)
|
|
b: Vec2d;
|
|
// (undocumented)
|
|
c: Vec2d;
|
|
// (undocumented)
|
|
d: Vec2d;
|
|
// (undocumented)
|
|
getVertices(): Vec2d[];
|
|
// (undocumented)
|
|
midPoint(): Vec2d;
|
|
// (undocumented)
|
|
nearestPoint(A: Vec2d): Vec2d;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export class CubicSpline2d extends Geometry2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed' | 'isFilled'> & {
|
|
points: Vec2d[];
|
|
});
|
|
// (undocumented)
|
|
getVertices(): Vec2d[];
|
|
// (undocumented)
|
|
hitTestLineSegment(A: Vec2d, B: Vec2d, zoom: number): boolean;
|
|
// (undocumented)
|
|
get length(): number;
|
|
// (undocumented)
|
|
_length?: number;
|
|
// (undocumented)
|
|
nearestPoint(A: Vec2d): Vec2d;
|
|
// (undocumented)
|
|
points: Vec2d[];
|
|
// (undocumented)
|
|
get segments(): CubicBezier2d[];
|
|
// (undocumented)
|
|
_segments?: CubicBezier2d[];
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export function dataUrlToFile(url: string, filename: string, mimeType: string): Promise<File>;
|
|
|
|
// @internal (undocumented)
|
|
export type DebugFlag<T> = DebugFlagDef<T> & Atom<T>;
|
|
|
|
// @internal (undocumented)
|
|
export const debugFlags: {
|
|
preventDefaultLogging: DebugFlag<boolean>;
|
|
pointerCaptureLogging: DebugFlag<boolean>;
|
|
pointerCaptureTracking: DebugFlag<boolean>;
|
|
pointerCaptureTrackingObject: DebugFlag<Map<Element, number>>;
|
|
elementRemovalLogging: DebugFlag<boolean>;
|
|
debugSvg: DebugFlag<boolean>;
|
|
throwToBlob: DebugFlag<boolean>;
|
|
logMessages: DebugFlag<never[]>;
|
|
resetConnectionEveryPing: DebugFlag<boolean>;
|
|
debugCursors: DebugFlag<boolean>;
|
|
forceSrgb: DebugFlag<boolean>;
|
|
debugGeometry: DebugFlag<boolean>;
|
|
};
|
|
|
|
// @internal (undocumented)
|
|
export const DEFAULT_ANIMATION_OPTIONS: {
|
|
duration: number;
|
|
easing: (t: number) => number;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export function DefaultBackground(): JSX.Element;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultBrush: TLBrushComponent;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultCollaboratorHint: TLCollaboratorHintComponent;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultCursor: NamedExoticComponent< {
|
|
className?: string | undefined;
|
|
point: null | Vec2dModel;
|
|
zoom: number;
|
|
color?: string | undefined;
|
|
name: null | string;
|
|
chatMessage: string;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultErrorFallback: TLErrorFallbackComponent;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultGrid: TLGridComponent;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultHandle: TLHandleComponent;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultHandles: TLHandlesComponent;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultHoveredShapeIndicator: TLHoveredShapeIndicatorComponent;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultScribble: TLScribbleComponent;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultSelectionBackground: TLSelectionBackgroundComponent;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultSelectionForeground: TLSelectionForegroundComponent;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultSnapLine: TLSnapLineComponent;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultSpinner: TLSpinnerComponent;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultSvgDefs: () => null;
|
|
|
|
// @public
|
|
export function degreesToRadians(d: number): number;
|
|
|
|
// @internal (undocumented)
|
|
export const DOUBLE_CLICK_DURATION = 450;
|
|
|
|
// @internal (undocumented)
|
|
export const DRAG_DISTANCE = 4;
|
|
|
|
// @public (undocumented)
|
|
export const EASINGS: {
|
|
readonly linear: (t: number) => number;
|
|
readonly easeInQuad: (t: number) => number;
|
|
readonly easeOutQuad: (t: number) => number;
|
|
readonly easeInOutQuad: (t: number) => number;
|
|
readonly easeInCubic: (t: number) => number;
|
|
readonly easeOutCubic: (t: number) => number;
|
|
readonly easeInOutCubic: (t: number) => number;
|
|
readonly easeInQuart: (t: number) => number;
|
|
readonly easeOutQuart: (t: number) => number;
|
|
readonly easeInOutQuart: (t: number) => number;
|
|
readonly easeInQuint: (t: number) => number;
|
|
readonly easeOutQuint: (t: number) => number;
|
|
readonly easeInOutQuint: (t: number) => number;
|
|
readonly easeInSine: (t: number) => number;
|
|
readonly easeOutSine: (t: number) => number;
|
|
readonly easeInOutSine: (t: number) => number;
|
|
readonly easeInExpo: (t: number) => number;
|
|
readonly easeOutExpo: (t: number) => number;
|
|
readonly easeInOutExpo: (t: number) => number;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export class Edge2d extends Geometry2d {
|
|
constructor(config: {
|
|
start: Vec2d;
|
|
end: Vec2d;
|
|
isSnappable?: boolean;
|
|
});
|
|
// (undocumented)
|
|
d: Vec2d;
|
|
// (undocumented)
|
|
end: Vec2d;
|
|
// (undocumented)
|
|
getVertices(): Vec2d[];
|
|
// (undocumented)
|
|
hitTestLineSegment(A: Vec2d, B: Vec2d, _zoom: number): boolean;
|
|
// (undocumented)
|
|
length: number;
|
|
// (undocumented)
|
|
midPoint(): Vec2d;
|
|
// (undocumented)
|
|
nearestPoint(point: Vec2d): Vec2d;
|
|
// (undocumented)
|
|
start: Vec2d;
|
|
// (undocumented)
|
|
u: Vec2d;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export class Editor extends EventEmitter<TLEventMap> {
|
|
constructor({ store, user, shapeUtils, tools, getContainer, initialState }: TLEditorOptions);
|
|
addOpenMenu(id: string): this;
|
|
alignShapes(shapes: TLShape[] | TLShapeId[], operation: 'bottom' | 'center-horizontal' | 'center-vertical' | 'left' | 'right' | 'top'): this;
|
|
animateShape(partial: null | TLShapePartial | undefined, animationOptions?: TLAnimationOptions): this;
|
|
animateShapes(partials: (null | TLShapePartial | undefined)[], animationOptions?: Partial<{
|
|
duration: number;
|
|
easing: (t: number) => number;
|
|
}>): this;
|
|
animateToShape(shapeId: TLShapeId, opts?: TLAnimationOptions): this;
|
|
animateToUser(userId: string): this;
|
|
// @internal (undocumented)
|
|
annotateError(error: unknown, { origin, willCrashApp, tags, extras, }: {
|
|
origin: string;
|
|
willCrashApp: boolean;
|
|
tags?: Record<string, boolean | number | string>;
|
|
extras?: Record<string, unknown>;
|
|
}): this;
|
|
get assets(): (TLBookmarkAsset | TLImageAsset | TLVideoAsset)[];
|
|
bail(): this;
|
|
bailToMark(id: string): this;
|
|
batch(fn: () => void): this;
|
|
bringForward(shapes: TLShape[] | TLShapeId[]): this;
|
|
bringToFront(shapes: TLShape[] | TLShapeId[]): this;
|
|
get camera(): TLCamera;
|
|
get cameraState(): "idle" | "moving";
|
|
cancel(): this;
|
|
cancelDoubleClick(): void;
|
|
get canRedo(): boolean;
|
|
get canUndo(): boolean;
|
|
// @internal (undocumented)
|
|
capturedPointerId: null | number;
|
|
centerOnPoint(point: VecLike, animation?: TLAnimationOptions): this;
|
|
// @internal
|
|
protected _clickManager: ClickManager;
|
|
complete(): this;
|
|
// @internal (undocumented)
|
|
crash(error: unknown): this;
|
|
// @internal
|
|
get crashingError(): unknown;
|
|
createAssets(assets: TLAsset[]): this;
|
|
// @internal (undocumented)
|
|
createErrorAnnotations(origin: string, willCrashApp: 'unknown' | boolean): {
|
|
tags: {
|
|
origin: string;
|
|
willCrashApp: 'unknown' | boolean;
|
|
};
|
|
extras: {
|
|
activeStateNode?: string;
|
|
selectedShapes?: TLUnknownShape[];
|
|
editingShape?: TLUnknownShape;
|
|
inputs?: Record<string, unknown>;
|
|
};
|
|
};
|
|
createPage(page: Partial<TLPage>): this;
|
|
createShape<T extends TLUnknownShape>(shape: OptionalKeys<TLShapePartial<T>, 'id'>): this;
|
|
createShapes<T extends TLUnknownShape>(shapes: OptionalKeys<TLShapePartial<T>, 'id'>[]): this;
|
|
get croppingShapeId(): null | TLShapeId;
|
|
get currentPage(): TLPage;
|
|
get currentPageBounds(): Box2d | undefined;
|
|
get currentPageId(): TLPageId;
|
|
get currentPageShapeIds(): Set<TLShapeId>;
|
|
get currentPageShapes(): TLShape[];
|
|
get currentPageShapesSorted(): TLShape[];
|
|
get currentPageState(): TLInstancePageState;
|
|
get currentTool(): StateNode | undefined;
|
|
get currentToolId(): string;
|
|
deleteAssets(assets: TLAsset[] | TLAssetId[]): this;
|
|
deleteOpenMenu(id: string): this;
|
|
deletePage(page: TLPage | TLPageId): this;
|
|
deleteShape(id: TLShapeId): this;
|
|
// (undocumented)
|
|
deleteShape(shape: TLShape): this;
|
|
deleteShapes(ids: TLShapeId[]): this;
|
|
// (undocumented)
|
|
deleteShapes(shapes: TLShape[]): this;
|
|
deselect(...shapes: TLShape[] | TLShapeId[]): this;
|
|
dispatch: (info: TLEventInfo) => this;
|
|
readonly disposables: Set<() => void>;
|
|
dispose(): void;
|
|
distributeShapes(shapes: TLShape[] | TLShapeId[], operation: 'horizontal' | 'vertical'): this;
|
|
get documentSettings(): TLDocument;
|
|
duplicatePage(page: TLPage | TLPageId, createId?: TLPageId): this;
|
|
duplicateShapes(shapes: TLShape[] | TLShapeId[], offset?: VecLike): this;
|
|
get editingShape(): TLShape | undefined;
|
|
get editingShapeId(): null | TLShapeId;
|
|
readonly environment: EnvironmentManager;
|
|
get erasingShapeIds(): TLShapeId[];
|
|
get erasingShapes(): NonNullable<TLShape | undefined>[];
|
|
// @internal (undocumented)
|
|
externalAssetContentHandlers: {
|
|
[K in TLExternalAssetContent['type']]: {
|
|
[Key in K]: ((info: TLExternalAssetContent & {
|
|
type: Key;
|
|
}) => Promise<TLAsset | undefined>) | null;
|
|
}[K];
|
|
};
|
|
// @internal (undocumented)
|
|
externalContentHandlers: {
|
|
[K in TLExternalContent['type']]: {
|
|
[Key in K]: ((info: TLExternalContent & {
|
|
type: Key;
|
|
}) => void) | null;
|
|
}[K];
|
|
};
|
|
findCommonAncestor(shapes: TLShape[] | TLShapeId[], predicate?: (shape: TLShape) => boolean): TLShapeId | undefined;
|
|
findShapeAncestor(shape: TLShape | TLShapeId, predicate: (parent: TLShape) => boolean): TLShape | undefined;
|
|
flipShapes(shapes: TLShape[] | TLShapeId[], operation: 'horizontal' | 'vertical'): this;
|
|
get focusedGroup(): TLShape | undefined;
|
|
get focusedGroupId(): TLPageId | TLShapeId;
|
|
getAncestorPageId(shape?: TLShape | TLShapeId): TLPageId | undefined;
|
|
getArrowInfo(shape: TLArrowShape | TLShapeId): TLArrowInfo | undefined;
|
|
getArrowsBoundTo(shapeId: TLShapeId): {
|
|
arrowId: TLShapeId;
|
|
handleId: "end" | "start";
|
|
}[];
|
|
getAsset(asset: TLAsset | TLAssetId): TLAsset | undefined;
|
|
getAssetForExternalContent(info: TLExternalAssetContent): Promise<TLAsset | undefined>;
|
|
getContainer: () => HTMLElement;
|
|
getContentFromCurrentPage(shapes: TLShape[] | TLShapeId[]): TLContent | undefined;
|
|
getDroppingOverShape(point: VecLike, droppingShapes?: TLShape[]): TLShape | undefined;
|
|
getHighestIndexForParent(parent: TLPage | TLParentId | TLShape): string;
|
|
getInitialMetaForShape(_shape: TLShape): JsonObject;
|
|
getOutermostSelectableShape(shape: TLShape | TLShapeId, filter?: (shape: TLShape) => boolean): TLShape;
|
|
getPage(page: TLPage | TLPageId): TLPage | undefined;
|
|
getPageShapeIds(page: TLPage | TLPageId): Set<TLShapeId>;
|
|
getPointInParentSpace(shape: TLShape | TLShapeId, point: VecLike): Vec2d;
|
|
getPointInShapeSpace(shape: TLShape | TLShapeId, point: VecLike): Vec2d;
|
|
getSelectedShapeAtPoint(point: VecLike): TLShape | undefined;
|
|
getShape<T extends TLShape = TLShape>(shape: TLParentId | TLShape): T | undefined;
|
|
getShapeAncestors(shape: TLShape | TLShapeId, acc?: TLShape[]): TLShape[];
|
|
getShapeAndDescendantIds(ids: TLShapeId[]): Set<TLShapeId>;
|
|
getShapeAtPoint(point: VecLike, opts?: {
|
|
margin?: number | undefined;
|
|
hitInside?: boolean | undefined;
|
|
hitLabels?: boolean | undefined;
|
|
hitFrameInside?: boolean | undefined;
|
|
filter?: ((shape: TLShape) => boolean) | undefined;
|
|
}): TLShape | undefined;
|
|
getShapeClipPath(shape: TLShape | TLShapeId): string | undefined;
|
|
getShapeGeometry<T extends Geometry2d>(shape: TLShape | TLShapeId): T;
|
|
getShapeHandles<T extends TLShape>(shape: T | T['id']): TLHandle[] | undefined;
|
|
getShapeLocalTransform(shape: TLShape | TLShapeId): Matrix2d;
|
|
getShapeMask(shape: TLShape | TLShapeId): undefined | VecLike[];
|
|
getShapeMaskedPageBounds(shape: TLShape | TLShapeId): Box2d | undefined;
|
|
getShapeOutlineSegments<T extends TLShape>(shape: T | T['id']): Vec2d[][];
|
|
getShapePageBounds(shape: TLShape | TLShapeId): Box2d | undefined;
|
|
getShapePageTransform(shape: TLShape | TLShapeId): Matrix2d;
|
|
getShapeParent(shape?: TLShape | TLShapeId): TLShape | undefined;
|
|
getShapeParentTransform(shape: TLShape | TLShapeId): Matrix2d;
|
|
getShapesAtPoint(point: VecLike, opts?: {
|
|
margin?: number | undefined;
|
|
hitInside?: boolean | undefined;
|
|
}): TLShape[];
|
|
// (undocumented)
|
|
getShapeStyleIfExists<T>(shape: TLShape, style: StyleProp<T>): T | undefined;
|
|
getShapeUtil<S extends TLUnknownShape>(shape: S | TLShapePartial<S>): ShapeUtil<S>;
|
|
// (undocumented)
|
|
getShapeUtil<S extends TLUnknownShape>(type: S['type']): ShapeUtil<S>;
|
|
// (undocumented)
|
|
getShapeUtil<T extends ShapeUtil>(type: T extends ShapeUtil<infer R> ? R['type'] : string): T;
|
|
getSortedChildIdsForParent(parent: TLPage | TLParentId | TLShape): TLShapeId[];
|
|
getStateDescendant(path: string): StateNode | undefined;
|
|
// @internal (undocumented)
|
|
getStyleForNextShape<T>(style: StyleProp<T>): T;
|
|
getSvg(shapes: TLShape[] | TLShapeId[], opts?: Partial<{
|
|
scale: number;
|
|
background: boolean;
|
|
padding: number;
|
|
darkMode?: boolean | undefined;
|
|
preserveAspectRatio: React.SVGAttributes<SVGSVGElement>['preserveAspectRatio'];
|
|
}>): Promise<SVGSVGElement | undefined>;
|
|
groupShapes(shapes: TLShape[] | TLShapeId[], groupId?: TLShapeId): this;
|
|
hasAncestor(shape: TLShape | TLShapeId | undefined, ancestorId: TLShapeId): boolean;
|
|
get hintingShapeIds(): TLShapeId[];
|
|
get hintingShapes(): NonNullable<TLShape | undefined>[];
|
|
readonly history: HistoryManager<this>;
|
|
get hoveredShape(): TLShape | undefined;
|
|
get hoveredShapeId(): null | TLShapeId;
|
|
inputs: {
|
|
originPagePoint: Vec2d;
|
|
originScreenPoint: Vec2d;
|
|
previousPagePoint: Vec2d;
|
|
previousScreenPoint: Vec2d;
|
|
currentPagePoint: Vec2d;
|
|
currentScreenPoint: Vec2d;
|
|
keys: Set<string>;
|
|
buttons: Set<number>;
|
|
isPen: boolean;
|
|
shiftKey: boolean;
|
|
ctrlKey: boolean;
|
|
altKey: boolean;
|
|
isDragging: boolean;
|
|
isPointing: boolean;
|
|
isPinching: boolean;
|
|
isEditing: boolean;
|
|
isPanning: boolean;
|
|
pointerVelocity: Vec2d;
|
|
};
|
|
get instanceState(): TLInstance;
|
|
interrupt(): this;
|
|
isAncestorSelected(shape: TLShape | TLShapeId): boolean;
|
|
isIn(path: string): boolean;
|
|
isInAny(...paths: string[]): boolean;
|
|
get isMenuOpen(): boolean;
|
|
isPointInShape(shape: TLShape | TLShapeId, point: VecLike, opts?: {
|
|
margin?: number | undefined;
|
|
hitInside?: boolean | undefined;
|
|
}): boolean;
|
|
isShapeInPage(shape: TLShape | TLShapeId, pageId?: TLPageId): boolean;
|
|
isShapeOfType<T extends TLUnknownShape>(shape: TLUnknownShape, type: T['type']): shape is T;
|
|
// (undocumented)
|
|
isShapeOfType<T extends TLUnknownShape>(shapeId: TLUnknownShape['id'], type: T['type']): shapeId is T['id'];
|
|
isShapeOrAncestorLocked(shape?: TLShape): boolean;
|
|
// (undocumented)
|
|
isShapeOrAncestorLocked(id?: TLShapeId): boolean;
|
|
mark(markId?: string, onUndo?: boolean, onRedo?: boolean): this;
|
|
moveShapesToPage(shapes: TLShape[] | TLShapeId[], pageId: TLPageId): this;
|
|
nudgeShapes(shapes: TLShape[] | TLShapeId[], offset: VecLike, historyOptions?: TLCommandHistoryOptions): this;
|
|
get onlySelectedShape(): null | TLShape;
|
|
get openMenus(): string[];
|
|
packShapes(shapes: TLShape[] | TLShapeId[], gap: number): this;
|
|
get pages(): TLPage[];
|
|
get pageStates(): TLInstancePageState[];
|
|
pageToScreen(point: VecLike): {
|
|
x: number;
|
|
y: number;
|
|
z: number;
|
|
};
|
|
pan(offset: VecLike, animation?: TLAnimationOptions): this;
|
|
panZoomIntoView(ids: TLShapeId[], animation?: TLAnimationOptions): this;
|
|
popFocusedGroupId(): this;
|
|
putContentOntoCurrentPage(content: TLContent, options?: {
|
|
point?: VecLike;
|
|
select?: boolean;
|
|
preservePosition?: boolean;
|
|
preserveIds?: boolean;
|
|
}): this;
|
|
putExternalContent(info: TLExternalContent): Promise<void>;
|
|
redo(): this;
|
|
registerExternalAssetHandler<T extends TLExternalAssetContent['type']>(type: T, handler: ((info: TLExternalAssetContent & {
|
|
type: T;
|
|
}) => Promise<TLAsset>) | null): this;
|
|
registerExternalContentHandler<T extends TLExternalContent['type']>(type: T, handler: ((info: T extends TLExternalContent['type'] ? TLExternalContent & {
|
|
type: T;
|
|
} : TLExternalContent) => void) | null): this;
|
|
renamePage(page: TLPage | TLPageId, name: string, historyOptions?: TLCommandHistoryOptions): this;
|
|
get renderingBounds(): Box2d;
|
|
get renderingBoundsExpanded(): Box2d;
|
|
renderingBoundsMargin: number;
|
|
get renderingShapes(): {
|
|
id: TLShapeId;
|
|
shape: TLShape;
|
|
util: ShapeUtil<TLUnknownShape>;
|
|
index: number;
|
|
backgroundIndex: number;
|
|
opacity: number;
|
|
isCulled: boolean;
|
|
maskedPageBounds: Box2d | undefined;
|
|
}[];
|
|
reparentShapes(shapes: TLShape[] | TLShapeId[], parentId: TLParentId, insertIndex?: string): this;
|
|
resetZoom(point?: Vec2d, animation?: TLAnimationOptions): this;
|
|
resizeShape(shape: TLShape | TLShapeId, scale: VecLike, options?: TLResizeShapeOptions): this;
|
|
readonly root: RootState;
|
|
rotateShapesBy(shapes: TLShape[] | TLShapeId[], delta: number): this;
|
|
screenToPage(point: VecLike): {
|
|
x: number;
|
|
y: number;
|
|
z: number;
|
|
};
|
|
select(...shapes: TLShape[] | TLShapeId[]): this;
|
|
selectAll(): this;
|
|
get selectedShapeIds(): TLShapeId[];
|
|
get selectedShapes(): TLShape[];
|
|
get selectionPageBounds(): Box2d | null;
|
|
get selectionRotatedPageBounds(): Box2d | undefined;
|
|
get selectionRotation(): number;
|
|
selectNone(): this;
|
|
sendBackward(shapes: TLShape[] | TLShapeId[]): this;
|
|
sendToBack(shapes: TLShape[] | TLShapeId[]): this;
|
|
setCamera(point: VecLike, animation?: TLAnimationOptions): this;
|
|
setCroppingShape(shape: null | TLShape | TLShapeId): this;
|
|
setCurrentPage(page: TLPage | TLPageId, historyOptions?: TLCommandHistoryOptions): this;
|
|
setCurrentTool(id: string, info?: {}): this;
|
|
setCursor: (cursor: Partial<TLCursor>) => this;
|
|
setEditingShape(shape: null | TLShape | TLShapeId): this;
|
|
setErasingShapes(shapes: TLShape[] | TLShapeId[]): this;
|
|
setFocusedGroup(shape: null | TLGroupShape | TLShapeId): this;
|
|
setHintingShapes(shapes: TLShape[] | TLShapeId[]): this;
|
|
setHoveredShape(shape: null | TLShape | TLShapeId): this;
|
|
setOpacityForNextShapes(opacity: number, historyOptions?: TLCommandHistoryOptions): this;
|
|
setOpacityForSelectedShapes(opacity: number, historyOptions?: TLCommandHistoryOptions): this;
|
|
setSelectedShapes(shapes: TLShape[] | TLShapeId[], historyOptions?: TLCommandHistoryOptions): this;
|
|
setStyleForNextShapes<T>(style: StyleProp<T>, value: T, historyOptions?: TLCommandHistoryOptions): this;
|
|
setStyleForSelectedShapes<T>(style: StyleProp<T>, value: T, historyOptions?: TLCommandHistoryOptions): this;
|
|
shapeUtils: {
|
|
readonly [K in string]?: ShapeUtil<TLUnknownShape>;
|
|
};
|
|
get sharedOpacity(): SharedStyle<number>;
|
|
get sharedStyles(): ReadonlySharedStyleMap;
|
|
readonly sideEffects: SideEffectManager<this>;
|
|
slideCamera(opts?: {
|
|
speed: number;
|
|
direction: VecLike;
|
|
friction: number;
|
|
speedThreshold?: number | undefined;
|
|
}): this;
|
|
readonly snaps: SnapManager;
|
|
stackShapes(shapes: TLShape[] | TLShapeId[], operation: 'horizontal' | 'vertical', gap: number): this;
|
|
startFollowingUser(userId: string): this;
|
|
stopCameraAnimation(): this;
|
|
stopFollowingUser(): this;
|
|
readonly store: TLStore;
|
|
stretchShapes(shapes: TLShape[] | TLShapeId[], operation: 'horizontal' | 'vertical'): this;
|
|
// (undocumented)
|
|
styleProps: {
|
|
[key: string]: Map<StyleProp<unknown>, string>;
|
|
};
|
|
readonly textMeasure: TextManager;
|
|
toggleLock(shapes: TLShape[] | TLShapeId[]): this;
|
|
undo(): this;
|
|
ungroupShapes(ids: TLShapeId[]): this;
|
|
// (undocumented)
|
|
ungroupShapes(ids: TLShape[]): this;
|
|
updateAssets(assets: TLAssetPartial[]): this;
|
|
updateCurrentPageState(partial: Partial<Omit<TLInstancePageState, 'editingShapeId' | 'focusedGroupId' | 'pageId' | 'selectedShapeIds'>>, historyOptions?: TLCommandHistoryOptions): this;
|
|
updateDocumentSettings(settings: Partial<TLDocument>): this;
|
|
updateInstanceState(partial: Partial<Omit<TLInstance, 'currentPageId'>>, historyOptions?: TLCommandHistoryOptions): this;
|
|
updatePage(partial: RequiredKeys<TLPage, 'id'>, historyOptions?: TLCommandHistoryOptions): this;
|
|
// @internal
|
|
updateRenderingBounds(): this;
|
|
updateShape<T extends TLUnknownShape>(partial: null | TLShapePartial<T> | undefined, historyOptions?: TLCommandHistoryOptions): this;
|
|
updateShapes<T extends TLUnknownShape>(partials: (null | TLShapePartial<T> | undefined)[], historyOptions?: TLCommandHistoryOptions): this;
|
|
updateViewportScreenBounds(center?: boolean): this;
|
|
readonly user: UserPreferencesManager;
|
|
get viewportPageBounds(): Box2d;
|
|
get viewportPageCenter(): Vec2d;
|
|
get viewportScreenBounds(): Box2d;
|
|
get viewportScreenCenter(): Vec2d;
|
|
visitDescendants(parent: TLPage | TLParentId | TLShape, visitor: (id: TLShapeId) => false | void): this;
|
|
zoomIn(point?: Vec2d, animation?: TLAnimationOptions): this;
|
|
get zoomLevel(): number;
|
|
zoomOut(point?: Vec2d, animation?: TLAnimationOptions): this;
|
|
zoomToBounds(bounds: Box2d, targetZoom?: number, animation?: TLAnimationOptions): this;
|
|
zoomToContent(): this;
|
|
zoomToFit(animation?: TLAnimationOptions): this;
|
|
zoomToSelection(animation?: TLAnimationOptions): this;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export class Ellipse2d extends Geometry2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed'> & {
|
|
width: number;
|
|
height: number;
|
|
});
|
|
// (undocumented)
|
|
config: Omit<Geometry2dOptions, 'isClosed'> & {
|
|
width: number;
|
|
height: number;
|
|
};
|
|
// (undocumented)
|
|
get edges(): Edge2d[];
|
|
// (undocumented)
|
|
_edges?: Edge2d[];
|
|
// (undocumented)
|
|
getBounds(): Box2d;
|
|
// (undocumented)
|
|
getVertices(): any[];
|
|
// (undocumented)
|
|
h: number;
|
|
// (undocumented)
|
|
hitTestLineSegment(A: Vec2d, B: Vec2d, zoom: number): boolean;
|
|
// (undocumented)
|
|
nearestPoint(A: Vec2d): Vec2d;
|
|
// (undocumented)
|
|
w: number;
|
|
}
|
|
|
|
export { EMPTY_ARRAY }
|
|
|
|
// @public (undocumented)
|
|
export const EPSILON: number;
|
|
|
|
// @public (undocumented)
|
|
export class ErrorBoundary extends React_3.Component<React_3.PropsWithRef<React_3.PropsWithChildren<TLErrorBoundaryProps>>, TLErrorBoundaryState> {
|
|
// (undocumented)
|
|
componentDidCatch(error: unknown): void;
|
|
// (undocumented)
|
|
static getDerivedStateFromError(error: Error): {
|
|
error: Error;
|
|
};
|
|
// (undocumented)
|
|
render(): boolean | JSX.Element | null | number | React_3.ReactFragment | string | undefined;
|
|
// (undocumented)
|
|
state: TLErrorBoundaryState;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export function ErrorScreen({ children }: {
|
|
children: any;
|
|
}): JSX.Element;
|
|
|
|
// @public (undocumented)
|
|
export const EVENT_NAME_MAP: Record<Exclude<TLEventName, TLPinchEventName>, keyof TLEventHandlers>;
|
|
|
|
// @internal (undocumented)
|
|
export function extractSessionStateFromLegacySnapshot(store: Record<string, UnknownRecord>): null | TLSessionStateSnapshot;
|
|
|
|
// @internal (undocumented)
|
|
export const featureFlags: {
|
|
peopleMenu: DebugFlag<boolean>;
|
|
highlighterTool: DebugFlag<boolean>;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type GapsSnapLine = {
|
|
id: string;
|
|
type: 'gaps';
|
|
direction: 'horizontal' | 'vertical';
|
|
gaps: Array<{
|
|
startEdge: [VecLike, VecLike];
|
|
endEdge: [VecLike, VecLike];
|
|
}>;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export abstract class Geometry2d {
|
|
constructor(opts: Geometry2dOptions);
|
|
// (undocumented)
|
|
get area(): number;
|
|
// (undocumented)
|
|
_area: number | undefined;
|
|
// (undocumented)
|
|
get bounds(): Box2d;
|
|
// (undocumented)
|
|
_bounds: Box2d | undefined;
|
|
// (undocumented)
|
|
get center(): Vec2d;
|
|
// (undocumented)
|
|
distanceToLineSegment(A: Vec2d, B: Vec2d): number;
|
|
// (undocumented)
|
|
distanceToPoint(point: Vec2d, hitInside?: boolean): number;
|
|
// (undocumented)
|
|
getArea(): number;
|
|
// (undocumented)
|
|
getBounds(): Box2d;
|
|
// (undocumented)
|
|
abstract getVertices(): Vec2d[];
|
|
// (undocumented)
|
|
hitTestLineSegment(A: Vec2d, B: Vec2d, distance?: number): boolean;
|
|
// (undocumented)
|
|
hitTestPoint(point: Vec2d, margin?: number, hitInside?: boolean): boolean;
|
|
// (undocumented)
|
|
isClosed: boolean;
|
|
// (undocumented)
|
|
isFilled: boolean;
|
|
// (undocumented)
|
|
isLabel: boolean;
|
|
// (undocumented)
|
|
isPointInBounds(point: Vec2d, margin?: number): boolean;
|
|
// (undocumented)
|
|
isSnappable: boolean;
|
|
// (undocumented)
|
|
abstract nearestPoint(point: Vec2d): Vec2d;
|
|
// (undocumented)
|
|
nearestPointOnLineSegment(A: Vec2d, B: Vec2d): Vec2d;
|
|
// (undocumented)
|
|
get outerVertices(): Vec2d[];
|
|
// (undocumented)
|
|
get snapPoints(): Vec2d[];
|
|
// (undocumented)
|
|
_snapPoints: undefined | Vec2d[];
|
|
// (undocumented)
|
|
toSimpleSvgPath(): string;
|
|
// (undocumented)
|
|
get vertices(): Vec2d[];
|
|
// (undocumented)
|
|
_vertices: undefined | Vec2d[];
|
|
}
|
|
|
|
// @public
|
|
export function getArcLength(C: VecLike, r: number, A: VecLike, B: VecLike): number;
|
|
|
|
// @public (undocumented)
|
|
export function getArrowheadPathForType(info: TLArrowInfo, side: 'end' | 'start', strokeWidth: number): string | undefined;
|
|
|
|
// @public (undocumented)
|
|
export function getArrowTerminalsInArrowSpace(editor: Editor, shape: TLArrowShape): {
|
|
start: Vec2d;
|
|
end: Vec2d;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export function getCursor(cursor: TLCursorType, rotation?: number, color?: string): string;
|
|
|
|
// @public
|
|
export function getCurvedArrowHandlePath(info: TLArrowInfo & {
|
|
isStraight: false;
|
|
}): string;
|
|
|
|
// @public (undocumented)
|
|
export function getFreshUserPreferences(): TLUserPreferences;
|
|
|
|
// @public
|
|
export function getIncrementedName(name: string, others: string[]): string;
|
|
|
|
// @public
|
|
export function getIndexAbove(below: string): string;
|
|
|
|
// @public
|
|
export function getIndexBelow(above: string): string;
|
|
|
|
// @public
|
|
export function getIndexBetween(below: string, above?: string): string;
|
|
|
|
// @public
|
|
export function getIndices(n: number, start?: string): string[];
|
|
|
|
// @public
|
|
export function getIndicesAbove(below: string, n: number): string[];
|
|
|
|
// @public
|
|
export function getIndicesBelow(above: string, n: number): string[];
|
|
|
|
// @public
|
|
export function getIndicesBetween(below: string | undefined, above: string | undefined, n: number): string[];
|
|
|
|
// @public (undocumented)
|
|
export function getPointerInfo(e: PointerEvent | React.PointerEvent): {
|
|
point: {
|
|
x: number;
|
|
y: number;
|
|
z: number;
|
|
};
|
|
shiftKey: boolean;
|
|
altKey: boolean;
|
|
ctrlKey: boolean;
|
|
pointerId: number;
|
|
button: number;
|
|
isPen: boolean;
|
|
};
|
|
|
|
// @public
|
|
export function getPointOnCircle(cx: number, cy: number, r: number, a: number): Vec2d;
|
|
|
|
// @public (undocumented)
|
|
export function getPolygonVertices(width: number, height: number, sides: number): Vec2d[];
|
|
|
|
// @internal (undocumented)
|
|
export function getRotationSnapshot({ editor }: {
|
|
editor: Editor;
|
|
}): null | TLRotationSnapshot;
|
|
|
|
// @public
|
|
export function getSolidCurvedArrowPath(info: TLArrowInfo & {
|
|
isStraight: false;
|
|
}): string;
|
|
|
|
// @public (undocumented)
|
|
export function getSolidStraightArrowPath(info: TLArrowInfo & {
|
|
isStraight: true;
|
|
}): string;
|
|
|
|
// @public
|
|
export const getStarBounds: (sides: number, w: number, h: number) => Box2d;
|
|
|
|
// @public (undocumented)
|
|
export function getStraightArrowHandlePath(info: TLArrowInfo & {
|
|
isStraight: true;
|
|
}): string;
|
|
|
|
// @public
|
|
export function getSvgPathFromPoints(points: VecLike[], closed?: boolean): string;
|
|
|
|
// @public
|
|
export function getSweep(C: VecLike, A: VecLike, B: VecLike): number;
|
|
|
|
// @public (undocumented)
|
|
export function getUserPreferences(): TLUserPreferences;
|
|
|
|
// @public (undocumented)
|
|
export const GRID_STEPS: {
|
|
min: number;
|
|
mid: number;
|
|
step: number;
|
|
}[];
|
|
|
|
// @public (undocumented)
|
|
export class Group2d extends Geometry2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed' | 'isFilled'> & {
|
|
children: Geometry2d[];
|
|
});
|
|
// (undocumented)
|
|
children: Geometry2d[];
|
|
// (undocumented)
|
|
distanceToPoint(point: Vec2d, hitInside?: boolean): number;
|
|
// (undocumented)
|
|
getArea(): number;
|
|
// (undocumented)
|
|
getVertices(): Vec2d[];
|
|
// (undocumented)
|
|
hitTestLineSegment(A: Vec2d, B: Vec2d, zoom: number): boolean;
|
|
// (undocumented)
|
|
hitTestPoint(point: Vec2d, margin: number, hitInside: boolean): boolean;
|
|
// (undocumented)
|
|
nearestPoint(point: Vec2d): Vec2d;
|
|
// (undocumented)
|
|
toSimpleSvgPath(): string;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export class GroupShapeUtil extends ShapeUtil<TLGroupShape> {
|
|
// (undocumented)
|
|
canBind: () => boolean;
|
|
// (undocumented)
|
|
component(shape: TLGroupShape): JSX.Element | null;
|
|
// (undocumented)
|
|
getDefaultProps(): TLGroupShape['props'];
|
|
// (undocumented)
|
|
getGeometry(shape: TLGroupShape): Geometry2d;
|
|
// (undocumented)
|
|
hideSelectionBoundsFg: () => boolean;
|
|
// (undocumented)
|
|
indicator(shape: TLGroupShape): JSX.Element;
|
|
// (undocumented)
|
|
static migrations: Migrations;
|
|
// (undocumented)
|
|
onChildrenChange: TLOnChildrenChangeHandler<TLGroupShape>;
|
|
// (undocumented)
|
|
static props: ShapeProps<TLGroupShape>;
|
|
// (undocumented)
|
|
static type: "group";
|
|
}
|
|
|
|
// @public
|
|
export function hardReset({ shouldReload }?: {
|
|
shouldReload?: boolean | undefined;
|
|
}): Promise<void>;
|
|
|
|
// @public (undocumented)
|
|
export function hardResetEditor(): void;
|
|
|
|
// @internal (undocumented)
|
|
export const HASH_PATTERN_ZOOM_NAMES: Record<string, string>;
|
|
|
|
// @public (undocumented)
|
|
export const HIT_TEST_MARGIN = 8;
|
|
|
|
// @public (undocumented)
|
|
export function HTMLContainer({ children, className, ...rest }: HTMLContainerProps): JSX.Element;
|
|
|
|
// @public (undocumented)
|
|
export type HTMLContainerProps = React_3.HTMLAttributes<HTMLDivElement>;
|
|
|
|
// @public
|
|
export function intersectLineSegmentPolygon(a1: VecLike, a2: VecLike, points: VecLike[]): null | VecLike[];
|
|
|
|
// @public
|
|
export function intersectLineSegmentPolyline(a1: VecLike, a2: VecLike, points: VecLike[]): null | VecLike[];
|
|
|
|
// @public
|
|
export function intersectPolygonPolygon(polygonA: VecLike[], polygonB: VecLike[]): null | VecLike[];
|
|
|
|
// @public
|
|
export function isAngleBetween(a: number, b: number, c: number): boolean;
|
|
|
|
// @public
|
|
export const isSafeFloat: (n: number) => boolean;
|
|
|
|
// @public
|
|
export function lerpAngles(a0: number, a1: number, t: number): number;
|
|
|
|
// @public (undocumented)
|
|
export function linesIntersect(A: VecLike, B: VecLike, C: VecLike, D: VecLike): boolean;
|
|
|
|
// @public (undocumented)
|
|
export function LoadingScreen({ children }: {
|
|
children: any;
|
|
}): JSX.Element;
|
|
|
|
// @public
|
|
export function loadSessionStateSnapshotIntoStore(store: TLStore, snapshot: TLSessionStateSnapshot): void;
|
|
|
|
// @public
|
|
export function longAngleDist(a0: number, a1: number): number;
|
|
|
|
// @public (undocumented)
|
|
export function loopToHtmlElement(elm: Element): HTMLElement;
|
|
|
|
// @public (undocumented)
|
|
export class Matrix2d {
|
|
constructor(a: number, b: number, c: number, d: number, e: number, f: number);
|
|
// (undocumented)
|
|
a: number;
|
|
// (undocumented)
|
|
static Absolute(m: MatLike): Matrix2dModel;
|
|
// (undocumented)
|
|
static applyToBounds(m: MatLike, box: Box2d): Box2d;
|
|
// (undocumented)
|
|
applyToPoint(point: VecLike): Vec2d;
|
|
// (undocumented)
|
|
static applyToPoint(m: MatLike, point: VecLike): Vec2d;
|
|
// (undocumented)
|
|
applyToPoints(points: VecLike[]): Vec2d[];
|
|
// (undocumented)
|
|
static applyToPoints(m: MatLike, points: VecLike[]): Vec2d[];
|
|
// (undocumented)
|
|
static applyToXY(m: MatLike, x: number, y: number): number[];
|
|
// (undocumented)
|
|
b: number;
|
|
// (undocumented)
|
|
c: number;
|
|
// (undocumented)
|
|
static Cast(m: MatLike): Matrix2d;
|
|
// (undocumented)
|
|
clone(): Matrix2d;
|
|
// (undocumented)
|
|
static Compose(...matrices: MatLike[]): Matrix2d;
|
|
// (undocumented)
|
|
d: number;
|
|
// (undocumented)
|
|
static Decompose(m: MatLike): MatrixInfo;
|
|
// (undocumented)
|
|
decompose(): MatrixInfo;
|
|
// (undocumented)
|
|
decomposed(): MatrixInfo;
|
|
// (undocumented)
|
|
e: number;
|
|
// (undocumented)
|
|
equals(m: Matrix2d | Matrix2dModel): boolean;
|
|
// (undocumented)
|
|
f: number;
|
|
// (undocumented)
|
|
static From(m: MatLike): Matrix2d;
|
|
// (undocumented)
|
|
static Identity(): Matrix2d;
|
|
// (undocumented)
|
|
identity(): this;
|
|
// (undocumented)
|
|
static Inverse(m: Matrix2dModel): Matrix2dModel;
|
|
// (undocumented)
|
|
invert(): this;
|
|
// (undocumented)
|
|
static Multiply(m1: Matrix2dModel, m2: Matrix2dModel): Matrix2dModel;
|
|
// (undocumented)
|
|
multiply(m: Matrix2d | Matrix2dModel): this;
|
|
// (undocumented)
|
|
static Point(m: MatLike): Vec2d;
|
|
// (undocumented)
|
|
point(): Vec2d;
|
|
// (undocumented)
|
|
static Rotate(r: number, cx?: number, cy?: number): Matrix2d;
|
|
// (undocumented)
|
|
rotate(r: number, cx?: number, cy?: number): Matrix2d;
|
|
// (undocumented)
|
|
static Rotation(m: MatLike): number;
|
|
// (undocumented)
|
|
rotation(): number;
|
|
// (undocumented)
|
|
static Scale: {
|
|
(x: number, y: number): Matrix2dModel;
|
|
(x: number, y: number, cx: number, cy: number): Matrix2dModel;
|
|
};
|
|
// (undocumented)
|
|
scale(x: number, y: number): this;
|
|
// (undocumented)
|
|
setTo(model: Matrix2dModel): this;
|
|
// (undocumented)
|
|
static Smooth(m: MatLike, precision?: number): MatLike;
|
|
// (undocumented)
|
|
toCssString(): string;
|
|
// (undocumented)
|
|
static toCssString(m: MatLike): string;
|
|
// (undocumented)
|
|
static Translate(x: number, y: number): Matrix2d;
|
|
// (undocumented)
|
|
translate(x: number, y: number): Matrix2d;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface Matrix2dModel {
|
|
// (undocumented)
|
|
a: number;
|
|
// (undocumented)
|
|
b: number;
|
|
// (undocumented)
|
|
c: number;
|
|
// (undocumented)
|
|
d: number;
|
|
// (undocumented)
|
|
e: number;
|
|
// (undocumented)
|
|
f: number;
|
|
}
|
|
|
|
// @internal (undocumented)
|
|
export const MAX_PAGES = 40;
|
|
|
|
// @internal (undocumented)
|
|
export const MAX_SHAPES_PER_PAGE = 2000;
|
|
|
|
// @internal (undocumented)
|
|
export const MAX_ZOOM = 8;
|
|
|
|
// @internal (undocumented)
|
|
export const MIN_ZOOM = 0.1;
|
|
|
|
// @internal (undocumented)
|
|
export const MULTI_CLICK_DURATION = 200;
|
|
|
|
// @internal (undocumented)
|
|
export function normalizeWheel(event: React.WheelEvent<HTMLElement> | WheelEvent): {
|
|
x: number;
|
|
y: number;
|
|
z: number;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export function openWindow(url: string, target?: string): void;
|
|
|
|
// @internal (undocumented)
|
|
export function OptionalErrorBoundary({ children, fallback, ...props }: Omit<TLErrorBoundaryProps, 'fallback'> & {
|
|
fallback: TLErrorFallbackComponent;
|
|
}): JSX.Element;
|
|
|
|
// @public
|
|
export function perimeterOfEllipse(rx: number, ry: number): number;
|
|
|
|
// @public (undocumented)
|
|
export const PI: number;
|
|
|
|
// @public (undocumented)
|
|
export const PI2: number;
|
|
|
|
// @public
|
|
export function pointInBounds(A: VecLike, b: Box2d): boolean;
|
|
|
|
// @public
|
|
export function pointInCircle(A: VecLike, C: VecLike, r: number): boolean;
|
|
|
|
// @public
|
|
export function pointInEllipse(A: VecLike, C: VecLike, rx: number, ry: number, rotation?: number): boolean;
|
|
|
|
// @public
|
|
export function pointInPolygon(A: VecLike, points: VecLike[]): boolean;
|
|
|
|
// @public
|
|
export function pointInPolyline(A: VecLike, points: VecLike[], distance?: number): boolean;
|
|
|
|
// @public
|
|
export function pointInRect(A: VecLike, point: VecLike, size: VecLike): boolean;
|
|
|
|
// @public
|
|
export function pointNearToLineSegment(A: VecLike, p1: VecLike, p2: VecLike, distance?: number): boolean;
|
|
|
|
// @public
|
|
export function pointNearToPolyline(A: VecLike, points: VecLike[], distance?: number): boolean;
|
|
|
|
// @public (undocumented)
|
|
export type PointsSnapLine = {
|
|
id: string;
|
|
type: 'points';
|
|
points: VecLike[];
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export class Polygon2d extends Polyline2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed'> & {
|
|
points: Vec2d[];
|
|
});
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export function polygonsIntersect(a: VecLike[], b: VecLike[]): boolean;
|
|
|
|
// @public (undocumented)
|
|
export class Polyline2d extends Geometry2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed' | 'isFilled'> & {
|
|
points: Vec2d[];
|
|
});
|
|
// (undocumented)
|
|
getVertices(): Vec2d[];
|
|
// (undocumented)
|
|
hitTestLineSegment(A: Vec2d, B: Vec2d, zoom: number): boolean;
|
|
// (undocumented)
|
|
get length(): number;
|
|
// (undocumented)
|
|
_length?: number;
|
|
// (undocumented)
|
|
nearestPoint(A: Vec2d): Vec2d;
|
|
// (undocumented)
|
|
points: Vec2d[];
|
|
// (undocumented)
|
|
get segments(): Edge2d[];
|
|
// (undocumented)
|
|
_segments?: Edge2d[];
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export const PositionedOnCanvas: MemoExoticComponent<({ x: offsetX, y: offsetY, rotation, ...rest }: {
|
|
x?: number | undefined;
|
|
y?: number | undefined;
|
|
rotation?: number | undefined;
|
|
} & HTMLProps<HTMLDivElement>) => JSX.Element>;
|
|
|
|
// @public (undocumented)
|
|
export function precise(A: VecLike): string;
|
|
|
|
// @public
|
|
export function preventDefault(event: Event | React_2.BaseSyntheticEvent): void;
|
|
|
|
// @public
|
|
export function radiansToDegrees(r: number): number;
|
|
|
|
// @public
|
|
export function rangeIntersection(a0: number, a1: number, b0: number, b1: number): [number, number] | null;
|
|
|
|
export { react }
|
|
|
|
// @public
|
|
export class ReadonlySharedStyleMap {
|
|
// (undocumented)
|
|
[Symbol.iterator](): IterableIterator<[StyleProp<unknown>, SharedStyle<unknown>]>;
|
|
constructor(entries?: Iterable<[StyleProp<unknown>, SharedStyle<unknown>]>);
|
|
// (undocumented)
|
|
entries(): IterableIterator<[StyleProp<unknown>, SharedStyle<unknown>]>;
|
|
// (undocumented)
|
|
equals(other: ReadonlySharedStyleMap): boolean;
|
|
// (undocumented)
|
|
get<T>(prop: StyleProp<T>): SharedStyle<T> | undefined;
|
|
// (undocumented)
|
|
getAsKnownValue<T>(prop: StyleProp<T>): T | undefined;
|
|
// (undocumented)
|
|
keys(): IterableIterator<StyleProp<unknown>>;
|
|
// @internal (undocumented)
|
|
protected map: Map<StyleProp<unknown>, SharedStyle<unknown>>;
|
|
// (undocumented)
|
|
get size(): number;
|
|
// (undocumented)
|
|
values(): IterableIterator<SharedStyle<unknown>>;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export class Rectangle2d extends Polygon2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed'> & {
|
|
x?: number;
|
|
y?: number;
|
|
width: number;
|
|
height: number;
|
|
});
|
|
// (undocumented)
|
|
getBounds(): Box2d;
|
|
// (undocumented)
|
|
h: number;
|
|
// (undocumented)
|
|
w: number;
|
|
// (undocumented)
|
|
x: number;
|
|
// (undocumented)
|
|
y: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export function refreshPage(): void;
|
|
|
|
// @public (undocumented)
|
|
export function releasePointerCapture(element: Element, event: PointerEvent | React_2.PointerEvent<Element>): void;
|
|
|
|
// @public (undocumented)
|
|
export type RequiredKeys<T, K extends keyof T> = Partial<Omit<T, K>> & Pick<T, K>;
|
|
|
|
// @public (undocumented)
|
|
export function resizeBox(shape: TLBaseBoxShape, info: {
|
|
newPoint: Vec2dModel;
|
|
handle: TLResizeHandle;
|
|
mode: TLResizeMode;
|
|
scaleX: number;
|
|
scaleY: number;
|
|
initialBounds: Box2d;
|
|
initialShape: TLBaseBoxShape;
|
|
}, opts?: Partial<{
|
|
minWidth: number;
|
|
maxWidth: number;
|
|
minHeight: number;
|
|
maxHeight: number;
|
|
}>): {
|
|
x: number;
|
|
y: number;
|
|
props: {
|
|
w: number;
|
|
h: number;
|
|
};
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type ResizeBoxOptions = Partial<{
|
|
minWidth: number;
|
|
maxWidth: number;
|
|
minHeight: number;
|
|
maxHeight: number;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export const ROTATE_CORNER_TO_SELECTION_CORNER: {
|
|
readonly top_left_rotate: "top_left";
|
|
readonly top_right_rotate: "top_right";
|
|
readonly bottom_right_rotate: "bottom_right";
|
|
readonly bottom_left_rotate: "bottom_left";
|
|
readonly mobile_rotate: "top_left";
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type RotateCorner = 'bottom_left_rotate' | 'bottom_right_rotate' | 'mobile_rotate' | 'top_left_rotate' | 'top_right_rotate';
|
|
|
|
// @public (undocumented)
|
|
export function rotateSelectionHandle(handle: SelectionHandle, rotation: number): SelectionHandle;
|
|
|
|
// @public (undocumented)
|
|
export const runtime: {
|
|
openWindow: (url: string, target: string) => void;
|
|
refreshPage: () => void;
|
|
hardReset: () => void;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type SelectionCorner = 'bottom_left' | 'bottom_right' | 'top_left' | 'top_right';
|
|
|
|
// @public (undocumented)
|
|
export type SelectionEdge = 'bottom' | 'left' | 'right' | 'top';
|
|
|
|
// @public (undocumented)
|
|
export type SelectionHandle = SelectionCorner | SelectionEdge;
|
|
|
|
// @public (undocumented)
|
|
export function setPointerCapture(element: Element, event: PointerEvent | React_2.PointerEvent<Element>): void;
|
|
|
|
// @public (undocumented)
|
|
export function setRuntimeOverrides(input: Partial<typeof runtime>): void;
|
|
|
|
// @public (undocumented)
|
|
export function setUserPreferences(user: TLUserPreferences): void;
|
|
|
|
// @public (undocumented)
|
|
export const ShapeIndicator: React_3.NamedExoticComponent<{
|
|
id: TLShapeId;
|
|
color?: string | undefined;
|
|
opacity?: number | undefined;
|
|
className?: string | undefined;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export abstract class ShapeUtil<Shape extends TLUnknownShape = TLUnknownShape> {
|
|
constructor(editor: Editor);
|
|
// @internal
|
|
backgroundComponent?(shape: Shape): any;
|
|
canBind: <K>(_shape: Shape, _otherShape?: K | undefined) => boolean;
|
|
canCrop: TLShapeUtilFlag<Shape>;
|
|
canDropShapes(shape: Shape, shapes: TLShape[]): boolean;
|
|
canEdit: TLShapeUtilFlag<Shape>;
|
|
canReceiveNewChildrenOfType(shape: Shape, type: TLShape['type']): boolean;
|
|
canResize: TLShapeUtilFlag<Shape>;
|
|
canScroll: TLShapeUtilFlag<Shape>;
|
|
canSnap: TLShapeUtilFlag<Shape>;
|
|
canUnmount: TLShapeUtilFlag<Shape>;
|
|
abstract component(shape: Shape): any;
|
|
// (undocumented)
|
|
editor: Editor;
|
|
// @internal (undocumented)
|
|
expandSelectionOutlinePx(shape: Shape): number;
|
|
getCanvasSvgDefs(): TLShapeUtilCanvasSvgDef[];
|
|
abstract getDefaultProps(): Shape['props'];
|
|
abstract getGeometry(shape: Shape): Geometry2d;
|
|
getHandles?(shape: Shape): TLHandle[];
|
|
getOutlineSegments(shape: Shape): Vec2d[][];
|
|
hideResizeHandles: TLShapeUtilFlag<Shape>;
|
|
hideRotateHandle: TLShapeUtilFlag<Shape>;
|
|
hideSelectionBoundsBg: TLShapeUtilFlag<Shape>;
|
|
hideSelectionBoundsFg: TLShapeUtilFlag<Shape>;
|
|
abstract indicator(shape: Shape): any;
|
|
isAspectRatioLocked: TLShapeUtilFlag<Shape>;
|
|
// (undocumented)
|
|
static migrations?: Migrations;
|
|
onBeforeCreate?: TLOnBeforeCreateHandler<Shape>;
|
|
onBeforeUpdate?: TLOnBeforeUpdateHandler<Shape>;
|
|
// @internal
|
|
onBindingChange?: TLOnBindingChangeHandler<Shape>;
|
|
onChildrenChange?: TLOnChildrenChangeHandler<Shape>;
|
|
onClick?: TLOnClickHandler<Shape>;
|
|
onDoubleClick?: TLOnDoubleClickHandler<Shape>;
|
|
onDoubleClickEdge?: TLOnDoubleClickHandler<Shape>;
|
|
onDoubleClickHandle?: TLOnDoubleClickHandleHandler<Shape>;
|
|
onDragShapesOut?: TLOnDragHandler<Shape>;
|
|
onDragShapesOver?: TLOnDragHandler<Shape, {
|
|
shouldHint: boolean;
|
|
}>;
|
|
onDropShapesOver?: TLOnDragHandler<Shape>;
|
|
onEditEnd?: TLOnEditEndHandler<Shape>;
|
|
onHandleChange?: TLOnHandleChangeHandler<Shape>;
|
|
onResize?: TLOnResizeHandler<Shape>;
|
|
onResizeEnd?: TLOnResizeEndHandler<Shape>;
|
|
onResizeStart?: TLOnResizeStartHandler<Shape>;
|
|
onRotate?: TLOnRotateHandler<Shape>;
|
|
onRotateEnd?: TLOnRotateEndHandler<Shape>;
|
|
onRotateStart?: TLOnRotateStartHandler<Shape>;
|
|
onTranslate?: TLOnTranslateHandler<Shape>;
|
|
onTranslateEnd?: TLOnTranslateEndHandler<Shape>;
|
|
onTranslateStart?: TLOnTranslateStartHandler<Shape>;
|
|
// (undocumented)
|
|
static props?: ShapeProps<TLUnknownShape>;
|
|
// @internal
|
|
providesBackgroundForChildren(shape: Shape): boolean;
|
|
toBackgroundSvg?(shape: Shape, ctx: SvgExportContext): null | Promise<SVGElement> | SVGElement;
|
|
toSvg?(shape: Shape, ctx: SvgExportContext): Promise<SVGElement> | SVGElement;
|
|
static type: string;
|
|
}
|
|
|
|
// @public
|
|
export type SharedStyle<T> = {
|
|
readonly type: 'mixed';
|
|
} | {
|
|
readonly type: 'shared';
|
|
readonly value: T;
|
|
};
|
|
|
|
// @internal (undocumented)
|
|
export class SharedStyleMap extends ReadonlySharedStyleMap {
|
|
// (undocumented)
|
|
applyValue<T>(prop: StyleProp<T>, value: T): void;
|
|
// (undocumented)
|
|
set<T>(prop: StyleProp<T>, value: SharedStyle<T>): void;
|
|
}
|
|
|
|
// @public
|
|
export function shortAngleDist(a0: number, a1: number): number;
|
|
|
|
export { Signal }
|
|
|
|
// @public (undocumented)
|
|
export const SIN: (x: number) => number;
|
|
|
|
// @public
|
|
export function snapAngle(r: number, segments: number): number;
|
|
|
|
// @public (undocumented)
|
|
export type SnapLine = GapsSnapLine | PointsSnapLine;
|
|
|
|
// @public (undocumented)
|
|
export class SnapManager {
|
|
constructor(editor: Editor);
|
|
// (undocumented)
|
|
clear(): void;
|
|
// (undocumented)
|
|
get currentCommonAncestor(): TLShapeId | undefined;
|
|
// (undocumented)
|
|
readonly editor: Editor;
|
|
// (undocumented)
|
|
getSnappingHandleDelta({ handlePoint, additionalSegments, }: {
|
|
handlePoint: Vec2d;
|
|
additionalSegments: Vec2d[][];
|
|
}): null | Vec2d;
|
|
// (undocumented)
|
|
get lines(): SnapLine[];
|
|
// (undocumented)
|
|
get outlinesInPageSpace(): Vec2d[][];
|
|
// (undocumented)
|
|
setLines(lines: SnapLine[]): void;
|
|
// (undocumented)
|
|
get snappablePoints(): SnapPoint[];
|
|
// (undocumented)
|
|
get snappableShapes(): GapNode[];
|
|
// (undocumented)
|
|
get snapPointsCache(): ComputedCache<SnapPoint[], TLShape>;
|
|
// (undocumented)
|
|
snapResize({ initialSelectionPageBounds, dragDelta, handle: originalHandle, isAspectRatioLocked, isResizingFromCenter, }: {
|
|
initialSelectionPageBounds: Box2d;
|
|
dragDelta: Vec2d;
|
|
handle: SelectionCorner | SelectionEdge;
|
|
isAspectRatioLocked: boolean;
|
|
isResizingFromCenter: boolean;
|
|
}): SnapData;
|
|
// (undocumented)
|
|
get snapThreshold(): number;
|
|
// (undocumented)
|
|
snapTranslate({ lockedAxis, initialSelectionPageBounds, initialSelectionSnapPoints, dragDelta, }: {
|
|
lockedAxis: 'x' | 'y' | null;
|
|
initialSelectionSnapPoints: SnapPoint[];
|
|
initialSelectionPageBounds: Box2d;
|
|
dragDelta: Vec2d;
|
|
}): SnapData;
|
|
// (undocumented)
|
|
get visibleGaps(): {
|
|
horizontal: Gap[];
|
|
vertical: Gap[];
|
|
};
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface SnapPoint {
|
|
// (undocumented)
|
|
handle?: SelectionCorner;
|
|
// (undocumented)
|
|
id: string;
|
|
// (undocumented)
|
|
x: number;
|
|
// (undocumented)
|
|
y: number;
|
|
}
|
|
|
|
// @public
|
|
export function sortByIndex<T extends {
|
|
index: string;
|
|
}>(a: T, b: T): -1 | 0 | 1;
|
|
|
|
// @public (undocumented)
|
|
export class Stadium2d extends Ellipse2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed'> & {
|
|
width: number;
|
|
height: number;
|
|
});
|
|
// (undocumented)
|
|
config: Omit<Geometry2dOptions, 'isClosed'> & {
|
|
width: number;
|
|
height: number;
|
|
};
|
|
// (undocumented)
|
|
getVertices(): Vec2d[];
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export abstract class StateNode implements Partial<TLEventHandlers> {
|
|
constructor(editor: Editor, parent?: StateNode);
|
|
// (undocumented)
|
|
static children?: () => TLStateNodeConstructor[];
|
|
// (undocumented)
|
|
children?: Record<string, StateNode>;
|
|
// (undocumented)
|
|
current: Atom<StateNode | undefined>;
|
|
// (undocumented)
|
|
get currentToolIdMask(): string | undefined;
|
|
set currentToolIdMask(id: string | undefined);
|
|
_currentToolIdMask: Atom<string | undefined, unknown>;
|
|
// (undocumented)
|
|
editor: Editor;
|
|
// (undocumented)
|
|
enter(info: any, from: string): void;
|
|
// (undocumented)
|
|
exit(info: any, from: string): void;
|
|
// (undocumented)
|
|
handleEvent(info: Exclude<TLEventInfo, TLPinchEventInfo>): void;
|
|
// (undocumented)
|
|
static id: string;
|
|
// (undocumented)
|
|
id: string;
|
|
// (undocumented)
|
|
static initial?: string;
|
|
// (undocumented)
|
|
initial?: string;
|
|
// (undocumented)
|
|
isActive: boolean;
|
|
// (undocumented)
|
|
onCancel?: TLEventHandlers['onCancel'];
|
|
// (undocumented)
|
|
onComplete?: TLEventHandlers['onComplete'];
|
|
// (undocumented)
|
|
onDoubleClick?: TLEventHandlers['onDoubleClick'];
|
|
// (undocumented)
|
|
onEnter?: TLEnterEventHandler;
|
|
// (undocumented)
|
|
onExit?: TLExitEventHandler;
|
|
// (undocumented)
|
|
onInterrupt?: TLEventHandlers['onInterrupt'];
|
|
// (undocumented)
|
|
onKeyDown?: TLEventHandlers['onKeyDown'];
|
|
// (undocumented)
|
|
onKeyRepeat?: TLEventHandlers['onKeyRepeat'];
|
|
// (undocumented)
|
|
onKeyUp?: TLEventHandlers['onKeyUp'];
|
|
// (undocumented)
|
|
onMiddleClick?: TLEventHandlers['onMiddleClick'];
|
|
// (undocumented)
|
|
onPointerDown?: TLEventHandlers['onPointerDown'];
|
|
// (undocumented)
|
|
onPointerMove?: TLEventHandlers['onPointerMove'];
|
|
// (undocumented)
|
|
onPointerUp?: TLEventHandlers['onPointerUp'];
|
|
// (undocumented)
|
|
onQuadrupleClick?: TLEventHandlers['onQuadrupleClick'];
|
|
// (undocumented)
|
|
onRightClick?: TLEventHandlers['onRightClick'];
|
|
// (undocumented)
|
|
onTripleClick?: TLEventHandlers['onTripleClick'];
|
|
// (undocumented)
|
|
onWheel?: TLEventHandlers['onWheel'];
|
|
// (undocumented)
|
|
parent: StateNode;
|
|
// (undocumented)
|
|
path: Computed<string>;
|
|
// (undocumented)
|
|
shapeType?: string;
|
|
// (undocumented)
|
|
transition(id: string, info: any): this;
|
|
// (undocumented)
|
|
type: TLStateNodeType;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export const stopEventPropagation: (e: any) => any;
|
|
|
|
// @internal (undocumented)
|
|
export const SVG_PADDING = 32;
|
|
|
|
// @public (undocumented)
|
|
export function SVGContainer({ children, className, ...rest }: SVGContainerProps): JSX.Element;
|
|
|
|
// @public (undocumented)
|
|
export type SVGContainerProps = React_3.HTMLAttributes<SVGElement>;
|
|
|
|
// @public (undocumented)
|
|
export interface SvgExportContext {
|
|
addExportDef(def: SvgExportDef): void;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface SvgExportDef {
|
|
// (undocumented)
|
|
getElement: () => null | Promise<null | SVGElement | SVGElement[]> | SVGElement | SVGElement[];
|
|
// (undocumented)
|
|
key: string;
|
|
}
|
|
|
|
// @public
|
|
export const TAB_ID: string;
|
|
|
|
// @public (undocumented)
|
|
export const TAU: number;
|
|
|
|
// @public (undocumented)
|
|
export type TLAnimationOptions = Partial<{
|
|
duration: number;
|
|
easing: (t: number) => number;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export type TLAnyShapeUtilConstructor = TLShapeUtilConstructor<any>;
|
|
|
|
// @public (undocumented)
|
|
export type TLBackgroundComponent = ComponentType;
|
|
|
|
// @public (undocumented)
|
|
export type TLBaseBoxShape = TLBaseShape<string, {
|
|
w: number;
|
|
h: number;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export interface TLBaseEventInfo {
|
|
// (undocumented)
|
|
altKey: boolean;
|
|
// (undocumented)
|
|
ctrlKey: boolean;
|
|
// (undocumented)
|
|
shiftKey: boolean;
|
|
// (undocumented)
|
|
type: UiEventType;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLBrushComponent = ComponentType<{
|
|
brush: Box2dModel;
|
|
color?: string;
|
|
opacity?: number;
|
|
className?: string;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export type TLCancelEvent = (info: TLCancelEventInfo) => void;
|
|
|
|
// @public (undocumented)
|
|
export type TLCancelEventInfo = {
|
|
type: 'misc';
|
|
name: 'cancel';
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLClickEvent = (info: TLClickEventInfo) => void;
|
|
|
|
// @public (undocumented)
|
|
export type TLClickEventInfo = TLBaseEventInfo & {
|
|
type: 'click';
|
|
name: TLCLickEventName;
|
|
point: VecLike;
|
|
pointerId: number;
|
|
button: number;
|
|
phase: 'down' | 'settle' | 'up';
|
|
} & TLPointerEventTarget;
|
|
|
|
// @public (undocumented)
|
|
export type TLCLickEventName = 'double_click' | 'quadruple_click' | 'triple_click';
|
|
|
|
// @public (undocumented)
|
|
export type TLCollaboratorHintComponent = ComponentType<{
|
|
className?: string;
|
|
point: Vec2dModel;
|
|
viewport: Box2d;
|
|
zoom: number;
|
|
opacity?: number;
|
|
color: string;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export type TLCommand<Name extends string = any, Data = any> = {
|
|
type: 'command';
|
|
id: string;
|
|
data: Data;
|
|
name: Name;
|
|
preservesRedoStack?: boolean;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLCommandHandler<Data> = {
|
|
do: (data: Data) => void;
|
|
undo: (data: Data) => void;
|
|
redo?: (data: Data) => void;
|
|
squash?: (prevData: Data, nextData: Data) => Data;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLCompleteEvent = (info: TLCompleteEventInfo) => void;
|
|
|
|
// @public (undocumented)
|
|
export type TLCompleteEventInfo = {
|
|
type: 'misc';
|
|
name: 'complete';
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export interface TLContent {
|
|
// (undocumented)
|
|
assets: TLAsset[];
|
|
// (undocumented)
|
|
rootShapeIds: TLShapeId[];
|
|
// (undocumented)
|
|
schema: SerializedSchema;
|
|
// (undocumented)
|
|
shapes: TLShape[];
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLCursorComponent = ComponentType<{
|
|
className?: string;
|
|
point: null | Vec2dModel;
|
|
zoom: number;
|
|
color?: string;
|
|
name: null | string;
|
|
chatMessage: string;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export const TldrawEditor: React_2.NamedExoticComponent<TldrawEditorProps>;
|
|
|
|
// @public
|
|
export interface TldrawEditorBaseProps {
|
|
autoFocus?: boolean;
|
|
children?: any;
|
|
className?: string;
|
|
components?: Partial<TLEditorComponents>;
|
|
initialState?: string;
|
|
onMount?: TLOnMountHandler;
|
|
shapeUtils?: readonly TLAnyShapeUtilConstructor[];
|
|
tools?: readonly TLStateNodeConstructor[];
|
|
user?: TLUser;
|
|
}
|
|
|
|
// @public
|
|
export type TldrawEditorProps = TldrawEditorBaseProps & ({
|
|
store: TLStore | TLStoreWithStatus;
|
|
} | {
|
|
store?: undefined;
|
|
snapshot?: StoreSnapshot<TLRecord>;
|
|
initialData?: SerializedStore<TLRecord>;
|
|
persistenceKey?: string;
|
|
sessionId?: string;
|
|
defaultName?: string;
|
|
});
|
|
|
|
// @public (undocumented)
|
|
export type TLEditorComponents = {
|
|
[K in keyof BaseEditorComponents]: BaseEditorComponents[K] | null;
|
|
} & {
|
|
ErrorFallback: TLErrorFallbackComponent;
|
|
ShapeErrorFallback: TLShapeErrorFallbackComponent;
|
|
ShapeIndicatorErrorFallback: TLShapeIndicatorErrorFallbackComponent;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export interface TLEditorOptions {
|
|
getContainer: () => HTMLElement;
|
|
initialState?: string;
|
|
shapeUtils: readonly TLShapeUtilConstructor<TLUnknownShape>[];
|
|
store: TLStore;
|
|
tools: readonly TLStateNodeConstructor[];
|
|
user?: TLUser;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLEnterEventHandler = (info: any, from: string) => void;
|
|
|
|
// @public (undocumented)
|
|
export interface TLErrorBoundaryProps {
|
|
// (undocumented)
|
|
children: React_3.ReactNode;
|
|
// (undocumented)
|
|
fallback: TLErrorFallbackComponent;
|
|
// (undocumented)
|
|
onError?: ((error: unknown) => void) | null;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface TLEventHandlers {
|
|
// (undocumented)
|
|
onCancel: TLCancelEvent;
|
|
// (undocumented)
|
|
onComplete: TLCompleteEvent;
|
|
// (undocumented)
|
|
onDoubleClick: TLClickEvent;
|
|
// (undocumented)
|
|
onInterrupt: TLInterruptEvent;
|
|
// (undocumented)
|
|
onKeyDown: TLKeyboardEvent;
|
|
// (undocumented)
|
|
onKeyRepeat: TLKeyboardEvent;
|
|
// (undocumented)
|
|
onKeyUp: TLKeyboardEvent;
|
|
// (undocumented)
|
|
onMiddleClick: TLPointerEvent;
|
|
// (undocumented)
|
|
onPointerDown: TLPointerEvent;
|
|
// (undocumented)
|
|
onPointerMove: TLPointerEvent;
|
|
// (undocumented)
|
|
onPointerUp: TLPointerEvent;
|
|
// (undocumented)
|
|
onQuadrupleClick: TLClickEvent;
|
|
// (undocumented)
|
|
onRightClick: TLPointerEvent;
|
|
// (undocumented)
|
|
onTripleClick: TLClickEvent;
|
|
// (undocumented)
|
|
onWheel: TLWheelEvent;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLEventInfo = TLCancelEventInfo | TLClickEventInfo | TLCompleteEventInfo | TLInterruptEventInfo | TLKeyboardEventInfo | TLPinchEventInfo | TLPointerEventInfo | TLWheelEventInfo;
|
|
|
|
// @public (undocumented)
|
|
export interface TLEventMap {
|
|
// (undocumented)
|
|
'change-history': [{
|
|
reason: 'bail';
|
|
markId?: string;
|
|
} | {
|
|
reason: 'push' | 'redo' | 'undo';
|
|
}];
|
|
// (undocumented)
|
|
'mark-history': [{
|
|
id: string;
|
|
}];
|
|
// (undocumented)
|
|
'max-shapes': [{
|
|
name: string;
|
|
pageId: TLPageId;
|
|
count: number;
|
|
}];
|
|
// (undocumented)
|
|
'stop-camera-animation': [];
|
|
// (undocumented)
|
|
'stop-following': [];
|
|
// (undocumented)
|
|
change: [HistoryEntry<TLRecord>];
|
|
// (undocumented)
|
|
crash: [{
|
|
error: unknown;
|
|
}];
|
|
// (undocumented)
|
|
event: [TLEventInfo];
|
|
// (undocumented)
|
|
frame: [number];
|
|
// (undocumented)
|
|
mount: [];
|
|
// (undocumented)
|
|
tick: [number];
|
|
// (undocumented)
|
|
update: [];
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLEventMapHandler<T extends keyof TLEventMap> = (...args: TLEventMap[T]) => void;
|
|
|
|
// @public (undocumented)
|
|
export type TLEventName = 'cancel' | 'complete' | 'interrupt' | 'wheel' | TLCLickEventName | TLKeyboardEventName | TLPinchEventName | TLPointerEventName;
|
|
|
|
// @public (undocumented)
|
|
export type TLExitEventHandler = (info: any, to: string) => void;
|
|
|
|
// @public (undocumented)
|
|
export type TLExternalAssetContent = {
|
|
type: 'file';
|
|
file: File;
|
|
} | {
|
|
type: 'url';
|
|
url: string;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLExternalContent = {
|
|
sources?: TLExternalContentSource[];
|
|
point?: VecLike;
|
|
} & ({
|
|
type: 'embed';
|
|
url: string;
|
|
embed: EmbedDefinition;
|
|
} | {
|
|
type: 'files';
|
|
files: File[];
|
|
ignoreParent: boolean;
|
|
} | {
|
|
type: 'svg-text';
|
|
text: string;
|
|
} | {
|
|
type: 'text';
|
|
text: string;
|
|
} | {
|
|
type: 'url';
|
|
url: string;
|
|
});
|
|
|
|
// @public (undocumented)
|
|
export type TLExternalContentSource = {
|
|
type: 'error';
|
|
data: null | string;
|
|
reason: string;
|
|
} | {
|
|
type: 'excalidraw';
|
|
data: any;
|
|
} | {
|
|
type: 'text';
|
|
data: string;
|
|
subtype: 'html' | 'json' | 'text' | 'url';
|
|
} | {
|
|
type: 'tldraw';
|
|
data: TLContent;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLGridComponent = ComponentType<{
|
|
x: number;
|
|
y: number;
|
|
z: number;
|
|
size: number;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export type TLHandleComponent = ComponentType<{
|
|
shapeId: TLShapeId;
|
|
handle: TLHandle;
|
|
zoom: number;
|
|
isCoarse: boolean;
|
|
className?: string;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export type TLHandlesComponent = ComponentType<{
|
|
className?: string;
|
|
children: any;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export type TLHistoryEntry = TLCommand | TLHistoryMark;
|
|
|
|
// @public (undocumented)
|
|
export type TLHistoryMark = {
|
|
type: 'STOP';
|
|
id: string;
|
|
onUndo: boolean;
|
|
onRedo: boolean;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLHoveredShapeIndicatorComponent = ComponentType<{
|
|
shapeId: TLShapeId;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export type TLInterruptEvent = (info: TLInterruptEventInfo) => void;
|
|
|
|
// @public (undocumented)
|
|
export type TLInterruptEventInfo = {
|
|
type: 'misc';
|
|
name: 'interrupt';
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLKeyboardEvent = (info: TLKeyboardEventInfo) => void;
|
|
|
|
// @public (undocumented)
|
|
export type TLKeyboardEventInfo = TLBaseEventInfo & {
|
|
type: 'keyboard';
|
|
name: TLKeyboardEventName;
|
|
key: string;
|
|
code: string;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLKeyboardEventName = 'key_down' | 'key_repeat' | 'key_up';
|
|
|
|
// @public (undocumented)
|
|
export type TLOnBeforeCreateHandler<T extends TLShape> = (next: T) => T | void;
|
|
|
|
// @public (undocumented)
|
|
export type TLOnBeforeUpdateHandler<T extends TLShape> = (prev: T, next: T) => T | void;
|
|
|
|
// @internal (undocumented)
|
|
export type TLOnBindingChangeHandler<T extends TLShape> = (shape: T) => TLShapePartial<T> | void;
|
|
|
|
// @public (undocumented)
|
|
export type TLOnChildrenChangeHandler<T extends TLShape> = (shape: T) => TLShapePartial[] | void;
|
|
|
|
// @public (undocumented)
|
|
export type TLOnClickHandler<T extends TLShape> = (shape: T) => TLShapePartial<T> | void;
|
|
|
|
// @public (undocumented)
|
|
export type TLOnDoubleClickHandleHandler<T extends TLShape> = (shape: T, handle: TLHandle) => TLShapePartial<T> | void;
|
|
|
|
// @public (undocumented)
|
|
export type TLOnDoubleClickHandler<T extends TLShape> = (shape: T) => TLShapePartial<T> | void;
|
|
|
|
// @public (undocumented)
|
|
export type TLOnDragHandler<T extends TLShape, R = void> = (shape: T, shapes: TLShape[]) => R;
|
|
|
|
// @public (undocumented)
|
|
export type TLOnEditEndHandler<T extends TLShape> = (shape: T) => void;
|
|
|
|
// @public (undocumented)
|
|
export type TLOnHandleChangeHandler<T extends TLShape> = (shape: T, info: {
|
|
handle: TLHandle;
|
|
isPrecise: boolean;
|
|
}) => TLShapePartial<T> | void;
|
|
|
|
// @public
|
|
export type TLOnMountHandler = (editor: Editor) => (() => void) | undefined | void;
|
|
|
|
// @public (undocumented)
|
|
export type TLOnResizeEndHandler<T extends TLShape> = TLEventChangeHandler<T>;
|
|
|
|
// @public (undocumented)
|
|
export type TLOnResizeHandler<T extends TLShape> = (shape: T, info: TLResizeInfo<T>) => Omit<TLShapePartial<T>, 'id' | 'type'> | undefined | void;
|
|
|
|
// @public (undocumented)
|
|
export type TLOnResizeStartHandler<T extends TLShape> = TLEventStartHandler<T>;
|
|
|
|
// @public (undocumented)
|
|
export type TLOnRotateEndHandler<T extends TLShape> = TLEventChangeHandler<T>;
|
|
|
|
// @public (undocumented)
|
|
export type TLOnRotateHandler<T extends TLShape> = TLEventChangeHandler<T>;
|
|
|
|
// @public (undocumented)
|
|
export type TLOnRotateStartHandler<T extends TLShape> = TLEventStartHandler<T>;
|
|
|
|
// @public (undocumented)
|
|
export type TLOnTranslateEndHandler<T extends TLShape> = TLEventChangeHandler<T>;
|
|
|
|
// @public (undocumented)
|
|
export type TLOnTranslateHandler<T extends TLShape> = TLEventChangeHandler<T>;
|
|
|
|
// @public (undocumented)
|
|
export type TLOnTranslateStartHandler<T extends TLShape> = TLEventStartHandler<T>;
|
|
|
|
// @public (undocumented)
|
|
export type TLPinchEvent = (info: TLPinchEventInfo) => void;
|
|
|
|
// @public (undocumented)
|
|
export type TLPinchEventInfo = TLBaseEventInfo & {
|
|
type: 'pinch';
|
|
name: TLPinchEventName;
|
|
point: Vec2dModel;
|
|
delta: Vec2dModel;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLPinchEventName = 'pinch_end' | 'pinch_start' | 'pinch';
|
|
|
|
// @public (undocumented)
|
|
export type TLPointerEvent = (info: TLPointerEventInfo) => void;
|
|
|
|
// @public (undocumented)
|
|
export type TLPointerEventInfo = TLBaseEventInfo & {
|
|
type: 'pointer';
|
|
name: TLPointerEventName;
|
|
point: VecLike;
|
|
pointerId: number;
|
|
button: number;
|
|
isPen: boolean;
|
|
} & TLPointerEventTarget;
|
|
|
|
// @public (undocumented)
|
|
export type TLPointerEventName = 'middle_click' | 'pointer_down' | 'pointer_move' | 'pointer_up' | 'right_click';
|
|
|
|
// @public (undocumented)
|
|
export type TLPointerEventTarget = {
|
|
target: 'canvas';
|
|
shape?: undefined;
|
|
} | {
|
|
target: 'handle';
|
|
shape: TLShape;
|
|
handle: TLHandle;
|
|
} | {
|
|
target: 'selection';
|
|
handle?: TLSelectionHandle;
|
|
shape?: undefined;
|
|
} | {
|
|
target: 'shape';
|
|
shape: TLShape;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLResizeHandle = SelectionCorner | SelectionEdge;
|
|
|
|
// @public
|
|
export type TLResizeInfo<T extends TLShape> = {
|
|
newPoint: Vec2d;
|
|
handle: TLResizeHandle;
|
|
mode: TLResizeMode;
|
|
scaleX: number;
|
|
scaleY: number;
|
|
initialBounds: Box2d;
|
|
initialShape: T;
|
|
};
|
|
|
|
// @public
|
|
export type TLResizeMode = 'resize_bounds' | 'scale_shape';
|
|
|
|
// @public (undocumented)
|
|
export type TLResizeShapeOptions = Partial<{
|
|
initialBounds: Box2d;
|
|
scaleOrigin: VecLike;
|
|
scaleAxisRotation: number;
|
|
initialShape: TLShape;
|
|
initialPageTransform: MatLike;
|
|
dragHandle: TLResizeHandle;
|
|
mode: TLResizeMode;
|
|
}>;
|
|
|
|
// @public
|
|
export type TLRotationSnapshot = {
|
|
selectionPageCenter: Vec2d;
|
|
initialCursorAngle: number;
|
|
initialSelectionRotation: number;
|
|
shapeSnapshots: {
|
|
shape: TLShape;
|
|
initialPagePoint: Vec2d;
|
|
}[];
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLScribbleComponent = ComponentType<{
|
|
scribble: TLScribble;
|
|
zoom: number;
|
|
color?: string;
|
|
opacity?: number;
|
|
className?: string;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export type TLSelectionBackgroundComponent = React_3.ComponentType<{
|
|
bounds: Box2d;
|
|
rotation: number;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export type TLSelectionForegroundComponent = ComponentType<{
|
|
bounds: Box2d;
|
|
rotation: number;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export type TLSelectionHandle = RotateCorner | SelectionCorner | SelectionEdge;
|
|
|
|
// @public
|
|
export interface TLSessionStateSnapshot {
|
|
// (undocumented)
|
|
currentPageId: TLPageId;
|
|
// (undocumented)
|
|
exportBackground: boolean;
|
|
// (undocumented)
|
|
isDebugMode: boolean;
|
|
// (undocumented)
|
|
isFocusMode: boolean;
|
|
// (undocumented)
|
|
isGridMode: boolean;
|
|
// (undocumented)
|
|
isToolLocked: boolean;
|
|
// (undocumented)
|
|
pageStates: Array<{
|
|
pageId: TLPageId;
|
|
camera: {
|
|
x: number;
|
|
y: number;
|
|
z: number;
|
|
};
|
|
selectedShapeIds: TLShapeId[];
|
|
focusedGroupId: null | TLShapeId;
|
|
}>;
|
|
// (undocumented)
|
|
version: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLShapeIndicatorComponent = React_3.ComponentType<{
|
|
id: TLShapeId;
|
|
color?: string | undefined;
|
|
opacity?: number;
|
|
className?: string;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export interface TLShapeUtilCanvasSvgDef {
|
|
// (undocumented)
|
|
component: React.ComponentType;
|
|
// (undocumented)
|
|
key: string;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface TLShapeUtilConstructor<T extends TLUnknownShape, U extends ShapeUtil<T> = ShapeUtil<T>> {
|
|
// (undocumented)
|
|
new (editor: Editor): U;
|
|
// (undocumented)
|
|
migrations?: Migrations;
|
|
// (undocumented)
|
|
props?: ShapeProps<T>;
|
|
// (undocumented)
|
|
type: T['type'];
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLShapeUtilFlag<T> = (shape: T) => boolean;
|
|
|
|
// @public (undocumented)
|
|
export type TLSnapLineComponent = React_3.ComponentType<{
|
|
className?: string;
|
|
line: SnapLine;
|
|
zoom: number;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export type TLSpinnerComponent = ComponentType<object>;
|
|
|
|
// @public (undocumented)
|
|
export interface TLStateNodeConstructor {
|
|
// (undocumented)
|
|
new (editor: Editor, parent?: StateNode): StateNode;
|
|
// (undocumented)
|
|
children?: () => TLStateNodeConstructor[];
|
|
// (undocumented)
|
|
id: string;
|
|
// (undocumented)
|
|
initial?: string;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLStoreEventInfo = HistoryEntry<TLRecord>;
|
|
|
|
// @public (undocumented)
|
|
export type TLStoreOptions = {
|
|
initialData?: SerializedStore<TLRecord>;
|
|
defaultName?: string;
|
|
} & ({
|
|
schema?: StoreSchema<TLRecord, TLStoreProps>;
|
|
} | {
|
|
shapeUtils?: readonly TLAnyShapeUtilConstructor[];
|
|
});
|
|
|
|
// @public (undocumented)
|
|
export type TLStoreWithStatus = {
|
|
readonly status: 'error';
|
|
readonly store?: undefined;
|
|
readonly error: Error;
|
|
} | {
|
|
readonly status: 'loading';
|
|
readonly store?: undefined;
|
|
readonly error?: undefined;
|
|
} | {
|
|
readonly status: 'not-synced';
|
|
readonly store: TLStore;
|
|
readonly error?: undefined;
|
|
} | {
|
|
readonly status: 'synced-local';
|
|
readonly store: TLStore;
|
|
readonly error?: undefined;
|
|
} | {
|
|
readonly status: 'synced-remote';
|
|
readonly connectionStatus: 'offline' | 'online';
|
|
readonly store: TLStore;
|
|
readonly error?: undefined;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLSvgDefsComponent = React.ComponentType;
|
|
|
|
// @public (undocumented)
|
|
export type TLTickEvent = (elapsed: number) => void;
|
|
|
|
// @public
|
|
export interface TLUserPreferences {
|
|
// (undocumented)
|
|
animationSpeed: number;
|
|
// (undocumented)
|
|
color: string;
|
|
// (undocumented)
|
|
id: string;
|
|
// (undocumented)
|
|
isDarkMode: boolean;
|
|
// (undocumented)
|
|
isSnapMode: boolean;
|
|
// (undocumented)
|
|
locale: string;
|
|
// (undocumented)
|
|
name: string;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLWheelEvent = (info: TLWheelEventInfo) => void;
|
|
|
|
// @public (undocumented)
|
|
export type TLWheelEventInfo = TLBaseEventInfo & {
|
|
type: 'wheel';
|
|
name: 'wheel';
|
|
delta: Vec2dModel;
|
|
};
|
|
|
|
// @public
|
|
export function toDomPrecision(v: number): number;
|
|
|
|
// @public (undocumented)
|
|
export function toFixed(v: number): number;
|
|
|
|
// @public
|
|
export function toPrecision(n: number, precision?: number): number;
|
|
|
|
export { track }
|
|
|
|
export { transact }
|
|
|
|
export { transaction }
|
|
|
|
// @public (undocumented)
|
|
export type UiEvent = TLCancelEvent | TLClickEvent | TLCompleteEvent | TLKeyboardEvent | TLPinchEvent | TLPointerEvent;
|
|
|
|
// @public (undocumented)
|
|
export type UiEventType = 'click' | 'keyboard' | 'pinch' | 'pointer' | 'wheel' | 'zoom';
|
|
|
|
// @public (undocumented)
|
|
export function uniq<T>(array: {
|
|
readonly length: number;
|
|
readonly [n: number]: T;
|
|
} | null | undefined): T[];
|
|
|
|
// @public
|
|
export function uniqueId(): string;
|
|
|
|
export { useComputed }
|
|
|
|
// @public (undocumented)
|
|
export function useContainer(): HTMLDivElement;
|
|
|
|
// @public (undocumented)
|
|
export const useEditor: () => Editor;
|
|
|
|
// @public (undocumented)
|
|
export function useIsCropping(shapeId: TLShapeId): boolean;
|
|
|
|
// @public (undocumented)
|
|
export function useIsDarkMode(): boolean;
|
|
|
|
// @public (undocumented)
|
|
export function useIsEditing(shapeId: TLShapeId): boolean;
|
|
|
|
// @internal (undocumented)
|
|
export function useLocalStore({ persistenceKey, sessionId, ...rest }: {
|
|
persistenceKey?: string;
|
|
sessionId?: string;
|
|
snapshot?: StoreSnapshot<TLRecord>;
|
|
} & TLStoreOptions): TLStoreWithStatus;
|
|
|
|
// @internal (undocumented)
|
|
export function usePeerIds(): string[];
|
|
|
|
// @internal (undocumented)
|
|
export function usePresence(userId: string): null | TLInstancePresence;
|
|
|
|
export { useQuickReactor }
|
|
|
|
// @internal (undocumented)
|
|
export const USER_COLORS: readonly ["#FF802B", "#EC5E41", "#F2555A", "#F04F88", "#E34BA9", "#BD54C6", "#9D5BD2", "#7B66DC", "#02B1CC", "#11B3A3", "#39B178", "#55B467"];
|
|
|
|
export { useReactor }
|
|
|
|
// @public (undocumented)
|
|
export function useSelectionEvents(handle: TLSelectionHandle): {
|
|
onPointerDown: PointerEventHandler<Element>;
|
|
onPointerMove: (e: React.PointerEvent) => void;
|
|
onPointerUp: PointerEventHandler<Element>;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export function useTLStore(opts: TLStoreOptions & {
|
|
snapshot?: StoreSnapshot<TLRecord>;
|
|
}): TLStore;
|
|
|
|
// @public (undocumented)
|
|
export function useTransform(ref: React.RefObject<HTMLElement | SVGElement>, x?: number, y?: number, scale?: number, rotate?: number, additionalOffset?: VecLike): void;
|
|
|
|
export { useValue }
|
|
|
|
// @public (undocumented)
|
|
export class Vec2d {
|
|
constructor(x?: number, y?: number, z?: number);
|
|
// (undocumented)
|
|
static Abs(A: VecLike): Vec2d;
|
|
// (undocumented)
|
|
abs(): this;
|
|
// (undocumented)
|
|
static Add(A: VecLike, B: VecLike): Vec2d;
|
|
// (undocumented)
|
|
add(V: VecLike): this;
|
|
// (undocumented)
|
|
static AddScalar(A: VecLike, n: number): Vec2d;
|
|
// (undocumented)
|
|
addScalar(n: number): this;
|
|
// (undocumented)
|
|
static AddXY(A: VecLike, x: number, y: number): Vec2d;
|
|
// (undocumented)
|
|
addXY(x: number, y: number): this;
|
|
// (undocumented)
|
|
static Angle(A: VecLike, B: VecLike): number;
|
|
// (undocumented)
|
|
angle(B: VecLike): number;
|
|
// (undocumented)
|
|
static Average(arr: VecLike[]): Vec2d;
|
|
// (undocumented)
|
|
static Cast(A: VecLike): Vec2d;
|
|
// (undocumented)
|
|
static Clamp(A: Vec2d, min: number, max?: number): Vec2d;
|
|
// (undocumented)
|
|
clamp(min: number, max?: number): this;
|
|
// (undocumented)
|
|
static Clockwise(A: VecLike, B: VecLike, C: VecLike): boolean;
|
|
// (undocumented)
|
|
clone(): Vec2d;
|
|
// (undocumented)
|
|
static Cpr(A: VecLike, B: VecLike): number;
|
|
// (undocumented)
|
|
cpr(V: VecLike): number;
|
|
// (undocumented)
|
|
static Cross(A: VecLike, V: VecLike): Vec2d;
|
|
// (undocumented)
|
|
cross(V: VecLike): this;
|
|
// (undocumented)
|
|
static Dist(A: VecLike, B: VecLike): number;
|
|
// (undocumented)
|
|
dist(V: VecLike): number;
|
|
// (undocumented)
|
|
static Dist2(A: VecLike, B: VecLike): number;
|
|
// (undocumented)
|
|
static DistanceToLineSegment(A: VecLike, B: VecLike, P: VecLike, clamp?: boolean): number;
|
|
// (undocumented)
|
|
distanceToLineSegment(A: VecLike, B: VecLike): number;
|
|
// (undocumented)
|
|
static DistanceToLineThroughPoint(A: VecLike, u: VecLike, P: VecLike): number;
|
|
// (undocumented)
|
|
static Div(A: VecLike, t: number): Vec2d;
|
|
// (undocumented)
|
|
div(t: number): this;
|
|
// (undocumented)
|
|
static DivV(A: VecLike, B: VecLike): Vec2d;
|
|
// (undocumented)
|
|
divV(V: VecLike): this;
|
|
// (undocumented)
|
|
static Dpr(A: VecLike, B: VecLike): number;
|
|
// (undocumented)
|
|
dpr(V: VecLike): number;
|
|
// (undocumented)
|
|
static Equals(A: VecLike, B: VecLike): boolean;
|
|
// (undocumented)
|
|
equals(B: VecLike): boolean;
|
|
// (undocumented)
|
|
static EqualsXY(A: VecLike, x: number, y: number): boolean;
|
|
// (undocumented)
|
|
equalsXY(x: number, y: number): boolean;
|
|
// (undocumented)
|
|
static From({ x, y, z }: Vec2dModel): Vec2d;
|
|
// (undocumented)
|
|
static FromAngle(r: number, length?: number): Vec2d;
|
|
// (undocumented)
|
|
static FromArray(v: number[]): Vec2d;
|
|
// (undocumented)
|
|
static Len(A: VecLike): number;
|
|
// (undocumented)
|
|
len(): number;
|
|
// (undocumented)
|
|
static Len2(A: VecLike): number;
|
|
// (undocumented)
|
|
len2(): number;
|
|
// (undocumented)
|
|
static Lrp(A: VecLike, B: VecLike, t: number): Vec2d;
|
|
// (undocumented)
|
|
lrp(B: VecLike, t: number): Vec2d;
|
|
// (undocumented)
|
|
static Max(A: VecLike, B: VecLike): Vec2d;
|
|
// (undocumented)
|
|
static Med(A: VecLike, B: VecLike): Vec2d;
|
|
// (undocumented)
|
|
static Min(A: VecLike, B: VecLike): Vec2d;
|
|
// (undocumented)
|
|
static Mul(A: VecLike, t: number): Vec2d;
|
|
// (undocumented)
|
|
mul(t: number): this;
|
|
// (undocumented)
|
|
static MulV(A: VecLike, B: VecLike): Vec2d;
|
|
// (undocumented)
|
|
mulV(V: VecLike): this;
|
|
// (undocumented)
|
|
static NearestPointOnLineSegment(A: VecLike, B: VecLike, P: VecLike, clamp?: boolean): Vec2d;
|
|
static NearestPointOnLineThroughPoint(A: VecLike, u: VecLike, P: VecLike): Vec2d;
|
|
// (undocumented)
|
|
static Neg(A: VecLike): Vec2d;
|
|
// (undocumented)
|
|
neg(): this;
|
|
// (undocumented)
|
|
norm(): this;
|
|
// (undocumented)
|
|
static Nudge(A: VecLike, B: VecLike, distance: number): Vec2d;
|
|
// (undocumented)
|
|
nudge(B: VecLike, distance: number): this;
|
|
// (undocumented)
|
|
static Per(A: VecLike): Vec2d;
|
|
// (undocumented)
|
|
per(): this;
|
|
static PointsBetween(A: Vec2dModel, B: Vec2dModel, steps?: number): Vec2d[];
|
|
// (undocumented)
|
|
get pressure(): number;
|
|
// (undocumented)
|
|
static Pry(A: VecLike, B: VecLike): number;
|
|
// (undocumented)
|
|
pry(V: VecLike): number;
|
|
// (undocumented)
|
|
static Rescale(A: VecLike, n: number): Vec2d;
|
|
// (undocumented)
|
|
static Rot(A: VecLike, r?: number): Vec2d;
|
|
// (undocumented)
|
|
rot(r: number): this;
|
|
// (undocumented)
|
|
static RotWith(A: VecLike, C: VecLike, r: number): Vec2d;
|
|
// (undocumented)
|
|
rotWith(C: VecLike, r: number): this;
|
|
// (undocumented)
|
|
static ScaleWithOrigin(A: VecLike, scale: number, origin: VecLike): Vec2d;
|
|
// (undocumented)
|
|
set(x?: number, y?: number, z?: number): this;
|
|
// (undocumented)
|
|
setTo({ x, y, z }: VecLike): this;
|
|
// (undocumented)
|
|
static Slope(A: VecLike, B: VecLike): number;
|
|
// (undocumented)
|
|
slope(B: VecLike): number;
|
|
// (undocumented)
|
|
static Snap(A: VecLike, step?: number): Vec2d;
|
|
// (undocumented)
|
|
static SnapToGrid(A: VecLike, gridSize?: number): Vec2d;
|
|
// (undocumented)
|
|
snapToGrid(gridSize: number): this;
|
|
// (undocumented)
|
|
static Sub(A: VecLike, B: VecLike): Vec2d;
|
|
// (undocumented)
|
|
sub(V: VecLike): this;
|
|
// (undocumented)
|
|
static SubScalar(A: VecLike, n: number): Vec2d;
|
|
// (undocumented)
|
|
subScalar(n: number): this;
|
|
// (undocumented)
|
|
static SubXY(A: VecLike, x: number, y: number): Vec2d;
|
|
// (undocumented)
|
|
subXY(x: number, y: number): this;
|
|
// (undocumented)
|
|
static Tan(A: VecLike, B: VecLike): Vec2d;
|
|
// (undocumented)
|
|
tan(V: VecLike): Vec2d;
|
|
// (undocumented)
|
|
static ToAngle(A: VecLike): number;
|
|
// (undocumented)
|
|
toAngle(): number;
|
|
// (undocumented)
|
|
static ToArray(A: VecLike): number[];
|
|
// (undocumented)
|
|
toArray(): number[];
|
|
// (undocumented)
|
|
static ToFixed(A: VecLike, n?: number): Vec2d;
|
|
// (undocumented)
|
|
toFixed(): Vec2d;
|
|
// (undocumented)
|
|
static ToJson(A: VecLike): {
|
|
x: number;
|
|
y: number;
|
|
z: number | undefined;
|
|
};
|
|
// (undocumented)
|
|
toJson(): Vec2dModel;
|
|
// (undocumented)
|
|
static ToString(A: VecLike): string;
|
|
// (undocumented)
|
|
toString(): string;
|
|
// (undocumented)
|
|
static Uni(A: VecLike): Vec2d;
|
|
// (undocumented)
|
|
uni(): Vec2d;
|
|
// (undocumented)
|
|
x: number;
|
|
// (undocumented)
|
|
y: number;
|
|
// (undocumented)
|
|
z: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type VecLike = Vec2d | Vec2dModel;
|
|
|
|
// @public (undocumented)
|
|
export class WeakMapCache<T extends object, K> {
|
|
// (undocumented)
|
|
access(item: T): K | undefined;
|
|
// (undocumented)
|
|
bust(): void;
|
|
// (undocumented)
|
|
get<P extends T>(item: P, cb: (item: P) => K): NonNullable<K>;
|
|
// (undocumented)
|
|
has(item: T): boolean;
|
|
// (undocumented)
|
|
invalidate(item: T): void;
|
|
// (undocumented)
|
|
items: WeakMap<T, K>;
|
|
// (undocumented)
|
|
set(item: T, value: K): void;
|
|
}
|
|
|
|
export { whyAmIRunning }
|
|
|
|
// @internal (undocumented)
|
|
export const ZOOMS: number[];
|
|
|
|
|
|
export * from "@tldraw/store";
|
|
export * from "@tldraw/tlschema";
|
|
export * from "@tldraw/utils";
|
|
export * from "@tldraw/validate";
|
|
|
|
// (No @packageDocumentation comment for this package)
|
|
|
|
```
|