14abf25ab6
This PR adds an (optional) options argument to the `Editor.groupShapes` and `Editor.ungroupShapes` methods. Taha's original PR: This PR seeks to make it easier to disentangle shape selection logic from the grouping shapes logic. This is one of two approaches we could take to this problem. Other PR is here: https://github.com/tldraw/tldraw/pull/3691 I think this is a better method because it doesn't require consumers of the library with their own custom actions to change the way their own grouping logic works. As evidenced by all the tests failing on the other PR. ### Change Type <!-- ❗ Please select a 'Scope' label ❗️ --> - [x] `sdk` — Changes the tldraw SDK - [ ] `dotcom` — Changes the tldraw.com web app - [ ] `docs` — Changes to the documentation, examples, or templates. - [ ] `vs code` — Changes to the vscode plugin - [ ] `internal` — Does not affect user-facing stuff <!-- ❗ Please select a 'Type' label ❗️ --> - [ ] `bugfix` — Bug fix - [ ] `feature` — New feature - [x] `improvement` — Improving existing features - [ ] `chore` — Updating dependencies, other boring stuff - [ ] `galaxy brain` — Architectural changes - [ ] `tests` — Changes to any test code - [ ] `tools` — Changes to infrastructure, CI, internal scripts, debugging tools, etc. - [ ] `dunno` — I don't know ### Test Plan 1. Add a step-by-step description of how to test your PR here. 2. - [ ] Unit Tests - [ ] End to end tests ### Release Notes - Add a brief release note for your PR here. --------- Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
3339 lines
102 KiB
Markdown
3339 lines
102 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 { BoxModel } from '@tldraw/tlschema';
|
|
import { ComponentType } from 'react';
|
|
import { Computed } from '@tldraw/state';
|
|
import { computed } from '@tldraw/state';
|
|
import { EmbedDefinition } from '@tldraw/tlschema';
|
|
import { EMPTY_ARRAY } from '@tldraw/state';
|
|
import EventEmitter from 'eventemitter3';
|
|
import { Expand } from '@tldraw/utils';
|
|
import { HistoryEntry } from '@tldraw/store';
|
|
import { IndexKey } from '@tldraw/utils';
|
|
import { JsonObject } from '@tldraw/utils';
|
|
import { JSX as JSX_2 } from 'react/jsx-runtime';
|
|
import { LegacyMigrations } from '@tldraw/store';
|
|
import { MigrationSequence } from '@tldraw/store';
|
|
import { NamedExoticComponent } from 'react';
|
|
import { PerformanceTracker } from '@tldraw/utils';
|
|
import { PointerEventHandler } from 'react';
|
|
import { react } from '@tldraw/state';
|
|
import { default as React_2 } from 'react';
|
|
import * as React_3 from 'react';
|
|
import { ReactElement } from 'react';
|
|
import { ReactNode } from 'react';
|
|
import { RecordProps } from '@tldraw/tlschema';
|
|
import { RecordsDiff } from '@tldraw/store';
|
|
import { SerializedSchema } from '@tldraw/store';
|
|
import { SerializedStore } from '@tldraw/store';
|
|
import { Signal } from '@tldraw/state';
|
|
import { Store } from '@tldraw/store';
|
|
import { StoreSchema } from '@tldraw/store';
|
|
import { StoreSideEffects } from '@tldraw/store';
|
|
import { StoreSnapshot } from '@tldraw/store';
|
|
import { StyleProp } from '@tldraw/tlschema';
|
|
import { StylePropValue } from '@tldraw/tlschema';
|
|
import { TLAsset } from '@tldraw/tlschema';
|
|
import { TLAssetId } from '@tldraw/tlschema';
|
|
import { TLAssetPartial } from '@tldraw/tlschema';
|
|
import { TLBaseShape } from '@tldraw/tlschema';
|
|
import { TLBinding } from '@tldraw/tlschema';
|
|
import { TLBindingCreate } from '@tldraw/tlschema';
|
|
import { TLBindingId } from '@tldraw/tlschema';
|
|
import { TLBindingUpdate } 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 { TLPropsMigrations } 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 { TLUnknownBinding } 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 { VecModel } from '@tldraw/tlschema';
|
|
import { whyAmIRunning } from '@tldraw/state';
|
|
|
|
// @public
|
|
export function angleDistance(fromAngle: number, toAngle: number, direction: number): number;
|
|
|
|
// @internal (undocumented)
|
|
export function applyRotationToSnapshotShapes({ delta, editor, snapshot, stage, }: {
|
|
delta: number;
|
|
editor: Editor;
|
|
snapshot: TLRotationSnapshot;
|
|
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: Vec;
|
|
end: Vec;
|
|
largeArcFlag: number;
|
|
start: Vec;
|
|
sweepFlag: number;
|
|
});
|
|
// (undocumented)
|
|
angleEnd: number;
|
|
// (undocumented)
|
|
angleStart: number;
|
|
// (undocumented)
|
|
_center: Vec;
|
|
// (undocumented)
|
|
end: Vec;
|
|
// (undocumented)
|
|
getLength(): number;
|
|
// (undocumented)
|
|
getSvgPathData(first?: boolean): string;
|
|
// (undocumented)
|
|
getVertices(): Vec[];
|
|
// (undocumented)
|
|
hitTestLineSegment(A: Vec, B: Vec): boolean;
|
|
// (undocumented)
|
|
largeArcFlag: number;
|
|
// (undocumented)
|
|
measure: number;
|
|
// (undocumented)
|
|
nearestPoint(point: Vec): Vec;
|
|
// (undocumented)
|
|
radius: number;
|
|
// (undocumented)
|
|
start: Vec;
|
|
// (undocumented)
|
|
sweepFlag: number;
|
|
}
|
|
|
|
// @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)
|
|
onCreate?: (_shape: null | TLShape) => null | void;
|
|
// (undocumented)
|
|
abstract shapeType: string;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export abstract class BaseBoxShapeUtil<Shape extends TLBaseBoxShape> extends ShapeUtil<Shape> {
|
|
// (undocumented)
|
|
getGeometry(shape: Shape): Geometry2d;
|
|
// (undocumented)
|
|
getHandleSnapGeometry(shape: Shape): HandleSnapGeometry;
|
|
// (undocumented)
|
|
onResize: TLOnResizeHandler<any>;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface BindingOnChangeOptions<Binding extends TLUnknownBinding> {
|
|
// (undocumented)
|
|
bindingAfter: Binding;
|
|
// (undocumented)
|
|
bindingBefore: Binding;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface BindingOnCreateOptions<Binding extends TLUnknownBinding> {
|
|
// (undocumented)
|
|
binding: Binding;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface BindingOnShapeChangeOptions<Binding extends TLUnknownBinding> {
|
|
// (undocumented)
|
|
binding: Binding;
|
|
// (undocumented)
|
|
shapeAfter: TLShape;
|
|
// (undocumented)
|
|
shapeBefore: TLShape;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface BindingOnUnbindOptions<Binding extends TLUnknownBinding> {
|
|
// (undocumented)
|
|
binding: Binding;
|
|
// (undocumented)
|
|
reason: BindingUnbindReason;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export enum BindingUnbindReason {
|
|
// (undocumented)
|
|
DeletingBinding = "deleting_binding",
|
|
// (undocumented)
|
|
DeletingFromShape = "deleting_from_shape",
|
|
// (undocumented)
|
|
DeletingToShape = "deleting_to_shape"
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export abstract class BindingUtil<Binding extends TLUnknownBinding = TLUnknownBinding> {
|
|
constructor(editor: Editor);
|
|
// (undocumented)
|
|
editor: Editor;
|
|
abstract getDefaultProps(): Partial<Binding['props']>;
|
|
// (undocumented)
|
|
static migrations?: TLPropsMigrations;
|
|
// (undocumented)
|
|
onAfterChange?(options: BindingOnChangeOptions<Binding>): void;
|
|
// (undocumented)
|
|
onAfterChangeFromShape?(options: BindingOnShapeChangeOptions<Binding>): void;
|
|
// (undocumented)
|
|
onAfterChangeToShape?(options: BindingOnShapeChangeOptions<Binding>): void;
|
|
// (undocumented)
|
|
onAfterCreate?(options: BindingOnCreateOptions<Binding>): void;
|
|
// (undocumented)
|
|
onAfterUnbind?(options: BindingOnUnbindOptions<Binding>): void;
|
|
// (undocumented)
|
|
onBeforeChange?(options: BindingOnChangeOptions<Binding>): Binding | void;
|
|
// (undocumented)
|
|
onBeforeCreate?(options: BindingOnCreateOptions<Binding>): Binding | void;
|
|
// (undocumented)
|
|
onBeforeUnbind?(options: BindingOnUnbindOptions<Binding>): void;
|
|
// (undocumented)
|
|
onOperationComplete?(): void;
|
|
// (undocumented)
|
|
static props?: RecordProps<TLUnknownBinding>;
|
|
static type: string;
|
|
}
|
|
|
|
// @public
|
|
export interface BoundsSnapGeometry {
|
|
points?: VecModel[];
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface BoundsSnapPoint {
|
|
// (undocumented)
|
|
handle?: SelectionCorner;
|
|
// (undocumented)
|
|
id: string;
|
|
// (undocumented)
|
|
x: number;
|
|
// (undocumented)
|
|
y: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export class Box {
|
|
constructor(x?: number, y?: number, w?: number, h?: number);
|
|
// (undocumented)
|
|
get aspectRatio(): number;
|
|
// (undocumented)
|
|
get center(): Vec;
|
|
set center(v: Vec);
|
|
// (undocumented)
|
|
clone(): Box;
|
|
// (undocumented)
|
|
static Collides: (A: Box, B: Box) => boolean;
|
|
// (undocumented)
|
|
collides(B: Box): boolean;
|
|
// (undocumented)
|
|
static Common: (boxes: Box[]) => Box;
|
|
// (undocumented)
|
|
static Contains: (A: Box, B: Box) => boolean;
|
|
// (undocumented)
|
|
contains(B: Box): boolean;
|
|
// (undocumented)
|
|
static ContainsPoint: (A: Box, B: VecLike, margin?: number) => boolean;
|
|
// (undocumented)
|
|
containsPoint(V: VecLike, margin?: number): boolean;
|
|
// (undocumented)
|
|
get corners(): Vec[];
|
|
// (undocumented)
|
|
get cornersAndCenter(): Vec[];
|
|
// (undocumented)
|
|
static Equals(a: Box | BoxModel, b: Box | BoxModel): boolean;
|
|
// (undocumented)
|
|
equals(other: Box | BoxModel): boolean;
|
|
// (undocumented)
|
|
static Expand(A: Box, B: Box): Box;
|
|
// (undocumented)
|
|
expand(A: Box): this;
|
|
// (undocumented)
|
|
static ExpandBy(A: Box, n: number): Box;
|
|
// (undocumented)
|
|
expandBy(n: number): this;
|
|
// (undocumented)
|
|
static From(box: BoxModel): Box;
|
|
// (undocumented)
|
|
static FromCenter(center: VecLike, size: VecLike): Box;
|
|
// (undocumented)
|
|
static FromPoints(points: VecLike[]): Box;
|
|
// (undocumented)
|
|
getHandlePoint(handle: SelectionCorner | SelectionEdge): Vec;
|
|
// (undocumented)
|
|
h: number;
|
|
// (undocumented)
|
|
get height(): number;
|
|
set height(n: number);
|
|
// (undocumented)
|
|
static Includes: (A: Box, B: Box) => boolean;
|
|
// (undocumented)
|
|
includes(B: Box): 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(): Vec;
|
|
set point(val: Vec);
|
|
// (undocumented)
|
|
static Resize(box: Box, handle: SelectionCorner | SelectionEdge | string, dx: number, dy: number, isAspectRatioLocked?: boolean): {
|
|
box: Box;
|
|
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: Box): this;
|
|
// (undocumented)
|
|
static Sides: (A: Box, inset?: number) => Vec[][];
|
|
// (undocumented)
|
|
get sides(): Array<[Vec, Vec]>;
|
|
// (undocumented)
|
|
get size(): Vec;
|
|
// (undocumented)
|
|
snapToGrid(size: number): void;
|
|
// (undocumented)
|
|
toFixed(): this;
|
|
// (undocumented)
|
|
toJson(): BoxModel;
|
|
// (undocumented)
|
|
translate(delta: VecLike): this;
|
|
// (undocumented)
|
|
union(box: BoxModel): this;
|
|
// (undocumented)
|
|
w: number;
|
|
// (undocumented)
|
|
get width(): number;
|
|
set width(n: number);
|
|
// (undocumented)
|
|
x: number;
|
|
// (undocumented)
|
|
y: number;
|
|
// (undocumented)
|
|
static ZeroFix(other: Box | BoxModel): Box;
|
|
// (undocumented)
|
|
zeroFix(): this;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type BoxLike = Box | BoxModel;
|
|
|
|
// @public (undocumented)
|
|
export function canonicalizeRotation(a: number): number;
|
|
|
|
// @public
|
|
export function centerOfCircleFromThreePoints(a: VecLike, b: VecLike, c: VecLike): Vec;
|
|
|
|
// @public (undocumented)
|
|
export class Circle2d extends Geometry2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed'> & {
|
|
isFilled: boolean;
|
|
radius: number;
|
|
x?: number;
|
|
y?: number;
|
|
});
|
|
// (undocumented)
|
|
_center: Vec;
|
|
// (undocumented)
|
|
config: Omit<Geometry2dOptions, 'isClosed'> & {
|
|
isFilled: boolean;
|
|
radius: number;
|
|
x?: number;
|
|
y?: number;
|
|
};
|
|
// (undocumented)
|
|
getBounds(): Box;
|
|
// (undocumented)
|
|
getSvgPathData(): string;
|
|
// (undocumented)
|
|
getVertices(): Vec[];
|
|
// (undocumented)
|
|
hitTestLineSegment(A: Vec, B: Vec, distance?: number): boolean;
|
|
// (undocumented)
|
|
nearestPoint(point: Vec): Vec;
|
|
// (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 }
|
|
|
|
// @internal (undocumented)
|
|
export function ContainerProvider({ container, children, }: {
|
|
children: React.ReactNode;
|
|
container: HTMLDivElement;
|
|
}): JSX_2.Element;
|
|
|
|
// @public (undocumented)
|
|
export const coreShapes: readonly [typeof GroupShapeUtil];
|
|
|
|
// @public
|
|
export function counterClockwiseAngleDist(a0: number, a1: number): number;
|
|
|
|
// @public
|
|
export function createSessionStateSnapshotSignal(store: TLStore): Signal<null | TLSessionStateSnapshot>;
|
|
|
|
// @public
|
|
export function createTLStore({ initialData, defaultName, id, ...rest }: TLStoreOptions): TLStore;
|
|
|
|
// @public (undocumented)
|
|
export function createTLUser(opts?: {
|
|
derivePresenceState?: ((store: TLStore) => Signal<null | TLInstancePresence>) | undefined;
|
|
setUserPreferences?: ((userPreferences: TLUserPreferences) => void) | undefined;
|
|
userPreferences?: Signal<TLUserPreferences, unknown> | undefined;
|
|
}): TLUser;
|
|
|
|
// @public (undocumented)
|
|
export class CubicBezier2d extends Polyline2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed' | 'isFilled'> & {
|
|
cp1: Vec;
|
|
cp2: Vec;
|
|
end: Vec;
|
|
start: Vec;
|
|
});
|
|
// (undocumented)
|
|
a: Vec;
|
|
// (undocumented)
|
|
b: Vec;
|
|
// (undocumented)
|
|
c: Vec;
|
|
// (undocumented)
|
|
d: Vec;
|
|
// (undocumented)
|
|
static GetAtT(segment: CubicBezier2d, t: number): Vec;
|
|
// (undocumented)
|
|
getLength(precision?: number): number;
|
|
// (undocumented)
|
|
getSvgPathData(first?: boolean): string;
|
|
// (undocumented)
|
|
getVertices(): Vec[];
|
|
// (undocumented)
|
|
midPoint(): Vec;
|
|
// (undocumented)
|
|
nearestPoint(A: Vec): Vec;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export class CubicSpline2d extends Geometry2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed' | 'isFilled'> & {
|
|
points: Vec[];
|
|
});
|
|
// (undocumented)
|
|
getLength(): number;
|
|
// (undocumented)
|
|
getSvgPathData(): string;
|
|
// (undocumented)
|
|
getVertices(): Vec[];
|
|
// (undocumented)
|
|
hitTestLineSegment(A: Vec, B: Vec): boolean;
|
|
// (undocumented)
|
|
nearestPoint(A: Vec): Vec;
|
|
// (undocumented)
|
|
points: Vec[];
|
|
// (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: {
|
|
readonly debugCursors: DebugFlag<boolean>;
|
|
readonly debugGeometry: DebugFlag<boolean>;
|
|
readonly debugSvg: DebugFlag<boolean>;
|
|
readonly editOnType: DebugFlag<boolean>;
|
|
readonly forceSrgb: DebugFlag<boolean>;
|
|
readonly hideShapes: DebugFlag<boolean>;
|
|
readonly logElementRemoves: DebugFlag<boolean>;
|
|
readonly logPointerCaptures: DebugFlag<boolean>;
|
|
readonly logPreventDefaults: DebugFlag<boolean>;
|
|
readonly measurePerformance: DebugFlag<boolean>;
|
|
readonly reconnectOnPing: DebugFlag<boolean>;
|
|
readonly showFps: DebugFlag<boolean>;
|
|
readonly throwToBlob: DebugFlag<boolean>;
|
|
};
|
|
|
|
// @internal (undocumented)
|
|
export const DEFAULT_ANIMATION_OPTIONS: {
|
|
duration: number;
|
|
easing: (t: number) => number;
|
|
};
|
|
|
|
// @internal (undocumented)
|
|
export const DEFAULT_CAMERA_OPTIONS: TLCameraOptions;
|
|
|
|
// @public (undocumented)
|
|
export function DefaultBackground(): JSX_2.Element;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultBrush: ({ brush, color, opacity, className }: TLBrushProps) => JSX_2.Element;
|
|
|
|
// @public (undocumented)
|
|
export function DefaultCanvas({ className }: TLCanvasComponentProps): JSX_2.Element;
|
|
|
|
// @public (undocumented)
|
|
export function DefaultCollaboratorHint({ className, zoom, point, color, viewport, opacity, }: TLCollaboratorHintProps): JSX_2.Element;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultCursor: NamedExoticComponent<TLCursorProps>;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultErrorFallback: TLErrorFallbackComponent;
|
|
|
|
// @public (undocumented)
|
|
export function DefaultGrid({ x, y, z, size }: TLGridProps): JSX_2.Element;
|
|
|
|
// @public (undocumented)
|
|
export function DefaultHandle({ handle, isCoarse, className, zoom }: TLHandleProps): JSX_2.Element;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultHandles: ({ children }: TLHandlesProps) => JSX_2.Element;
|
|
|
|
// @public (undocumented)
|
|
export function DefaultScribble({ scribble, zoom, color, opacity, className }: TLScribbleProps): JSX_2.Element | null;
|
|
|
|
// @public (undocumented)
|
|
export function DefaultSelectionBackground({ bounds, rotation }: TLSelectionBackgroundProps): JSX_2.Element;
|
|
|
|
// @public (undocumented)
|
|
export function DefaultSelectionForeground({ bounds, rotation }: TLSelectionForegroundProps): JSX_2.Element;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultShapeIndicator: NamedExoticComponent<TLShapeIndicatorProps>;
|
|
|
|
// @public (undocumented)
|
|
export function DefaultSnapIndicator({ className, line, zoom }: TLSnapIndicatorProps): JSX_2.Element;
|
|
|
|
// @public (undocumented)
|
|
export function DefaultSpinner(): JSX_2.Element;
|
|
|
|
// @public (undocumented)
|
|
export const DefaultSvgDefs: () => null;
|
|
|
|
// @public (undocumented)
|
|
export const defaultTldrawOptions: {
|
|
readonly adjacentShapeMargin: 10;
|
|
readonly animationMediumMs: 320;
|
|
readonly cameraMovingTimoutMs: 64;
|
|
readonly cameraSlideFriction: 0.09;
|
|
readonly coarseDragDistanceSquared: 36;
|
|
readonly coarseHandleRadius: 20;
|
|
readonly coarsePointerWidth: 12;
|
|
readonly collaboratorCheckIntervalMs: 1200;
|
|
readonly collaboratorIdleTimeoutMs: 3000;
|
|
readonly collaboratorInactiveTimeoutMs: 60000;
|
|
readonly defaultSvgPadding: 32;
|
|
readonly doubleClickDurationMs: 450;
|
|
readonly dragDistanceSquared: 16;
|
|
readonly edgeScrollDistance: 8;
|
|
readonly edgeScrollSpeed: 20;
|
|
readonly followChaseViewportSnap: 2;
|
|
readonly gridSteps: readonly [{
|
|
readonly mid: 0.15;
|
|
readonly min: -1;
|
|
readonly step: 64;
|
|
}, {
|
|
readonly mid: 0.375;
|
|
readonly min: 0.05;
|
|
readonly step: 16;
|
|
}, {
|
|
readonly mid: 1;
|
|
readonly min: 0.15;
|
|
readonly step: 4;
|
|
}, {
|
|
readonly mid: 2.5;
|
|
readonly min: 0.7;
|
|
readonly step: 1;
|
|
}];
|
|
readonly handleRadius: 12;
|
|
readonly hitTestMargin: 8;
|
|
readonly longPressDurationMs: 500;
|
|
readonly maxPages: 40;
|
|
readonly maxShapesPerPage: 4000;
|
|
readonly multiClickDurationMs: 200;
|
|
readonly textShadowLod: 0.35;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export const defaultUserPreferences: Readonly<{
|
|
animationSpeed: 0 | 1;
|
|
color: "#02B1CC" | "#11B3A3" | "#39B178" | "#55B467" | "#7B66DC" | "#9D5BD2" | "#BD54C6" | "#E34BA9" | "#EC5E41" | "#F04F88" | "#F2555A" | "#FF802B";
|
|
edgeScrollSpeed: 1;
|
|
isDarkMode: false;
|
|
isSnapMode: false;
|
|
isWrapMode: false;
|
|
locale: "ar" | "ca" | "cs" | "da" | "de" | "en" | "es" | "fa" | "fi" | "fr" | "gl" | "he" | "hi-in" | "hr" | "hu" | "id" | "it" | "ja" | "ko-kr" | "ku" | "my" | "ne" | "no" | "pl" | "pt-br" | "pt-pt" | "ro" | "ru" | "sl" | "sv" | "te" | "th" | "tr" | "uk" | "vi" | "zh-cn" | "zh-tw";
|
|
name: "New User";
|
|
}>;
|
|
|
|
// @public
|
|
export function degreesToRadians(d: number): number;
|
|
|
|
// @public (undocumented)
|
|
export const EASINGS: {
|
|
readonly easeInCubic: (t: number) => number;
|
|
readonly easeInExpo: (t: number) => number;
|
|
readonly easeInOutCubic: (t: number) => number;
|
|
readonly easeInOutExpo: (t: number) => number;
|
|
readonly easeInOutQuad: (t: number) => number;
|
|
readonly easeInOutQuart: (t: number) => number;
|
|
readonly easeInOutQuint: (t: number) => number;
|
|
readonly easeInOutSine: (t: number) => number;
|
|
readonly easeInQuad: (t: number) => number;
|
|
readonly easeInQuart: (t: number) => number;
|
|
readonly easeInQuint: (t: number) => number;
|
|
readonly easeInSine: (t: number) => number;
|
|
readonly easeOutCubic: (t: number) => number;
|
|
readonly easeOutExpo: (t: number) => number;
|
|
readonly easeOutQuad: (t: number) => number;
|
|
readonly easeOutQuart: (t: number) => number;
|
|
readonly easeOutQuint: (t: number) => number;
|
|
readonly easeOutSine: (t: number) => number;
|
|
readonly linear: (t: number) => number;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export class Edge2d extends Geometry2d {
|
|
constructor(config: {
|
|
end: Vec;
|
|
start: Vec;
|
|
});
|
|
// (undocumented)
|
|
d: Vec;
|
|
// (undocumented)
|
|
end: Vec;
|
|
// (undocumented)
|
|
getLength(): number;
|
|
// (undocumented)
|
|
getSvgPathData(first?: boolean): string;
|
|
// (undocumented)
|
|
getVertices(): Vec[];
|
|
// (undocumented)
|
|
hitTestLineSegment(A: Vec, B: Vec, distance?: number): boolean;
|
|
// (undocumented)
|
|
midPoint(): Vec;
|
|
// (undocumented)
|
|
nearestPoint(point: Vec): Vec;
|
|
// (undocumented)
|
|
start: Vec;
|
|
// (undocumented)
|
|
u: Vec;
|
|
// (undocumented)
|
|
ul: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export class Editor extends EventEmitter<TLEventMap> {
|
|
constructor({ store, user, shapeUtils, bindingUtils, tools, getContainer, cameraOptions, initialState, autoFocus, inferDarkMode, options, }: TLEditorOptions);
|
|
addOpenMenu(id: string): this;
|
|
alignShapes(shapes: TLShape[] | TLShapeId[], operation: 'bottom' | 'center-horizontal' | 'center-vertical' | 'left' | 'right' | 'top'): this;
|
|
animateShape(partial: null | TLShapePartial | undefined, opts?: Partial<{
|
|
animation: Partial<{
|
|
duration: number;
|
|
easing: (t: number) => number;
|
|
}>;
|
|
force: boolean;
|
|
immediate: boolean;
|
|
reset: boolean;
|
|
}>): this;
|
|
animateShapes(partials: (null | TLShapePartial | undefined)[], opts?: Partial<{
|
|
animation: Partial<{
|
|
duration: number;
|
|
easing: (t: number) => number;
|
|
}>;
|
|
force: boolean;
|
|
immediate: boolean;
|
|
reset: boolean;
|
|
}>): this;
|
|
// @internal (undocumented)
|
|
annotateError(error: unknown, { origin, willCrashApp, tags, extras, }: {
|
|
extras?: Record<string, unknown>;
|
|
origin: string;
|
|
tags?: Record<string, boolean | number | string>;
|
|
willCrashApp: boolean;
|
|
}): this;
|
|
bail(): this;
|
|
bailToMark(id: string): this;
|
|
batch(fn: () => void, opts?: TLHistoryBatchOptions): this;
|
|
bindingUtils: {
|
|
readonly [K in string]?: BindingUtil<TLUnknownBinding>;
|
|
};
|
|
bringForward(shapes: TLShape[] | TLShapeId[]): this;
|
|
bringToFront(shapes: TLShape[] | TLShapeId[]): this;
|
|
// (undocumented)
|
|
canBindShapes({ fromShape, toShape, binding, }: {
|
|
binding: {
|
|
type: TLBinding['type'];
|
|
} | TLBinding | TLBinding['type'];
|
|
fromShape: {
|
|
type: TLShape['type'];
|
|
} | TLShape | TLShape['type'];
|
|
toShape: {
|
|
type: TLShape['type'];
|
|
} | TLShape | TLShape['type'];
|
|
}): boolean;
|
|
cancel(): this;
|
|
cancelDoubleClick(): void;
|
|
// @internal (undocumented)
|
|
capturedPointerId: null | number;
|
|
centerOnPoint(point: VecLike, opts?: TLCameraMoveOptions): this;
|
|
clearOpenMenus(): this;
|
|
// @internal
|
|
protected _clickManager: ClickManager;
|
|
complete(): this;
|
|
// @internal (undocumented)
|
|
crash(error: unknown): this;
|
|
createAssets(assets: TLAsset[]): this;
|
|
// (undocumented)
|
|
createBinding<B extends TLBinding = TLBinding>(partial: TLBindingCreate<B>): this;
|
|
// (undocumented)
|
|
createBindings(partials: TLBindingCreate[]): this;
|
|
// @internal (undocumented)
|
|
createErrorAnnotations(origin: string, willCrashApp: 'unknown' | boolean): {
|
|
extras: {
|
|
activeStateNode?: string;
|
|
editingShape?: TLUnknownShape;
|
|
inputs?: Record<string, unknown>;
|
|
selectedShapes?: TLUnknownShape[];
|
|
};
|
|
tags: {
|
|
origin: string;
|
|
willCrashApp: 'unknown' | boolean;
|
|
};
|
|
};
|
|
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;
|
|
deleteAssets(assets: TLAsset[] | TLAssetId[]): this;
|
|
// (undocumented)
|
|
deleteBinding(binding: TLBinding | TLBindingId): this;
|
|
// (undocumented)
|
|
deleteBindings(bindings: (TLBinding | TLBindingId)[]): 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;
|
|
duplicatePage(page: TLPage | TLPageId, createId?: TLPageId): this;
|
|
duplicateShapes(shapes: TLShape[] | TLShapeId[], offset?: VecLike): this;
|
|
readonly environment: EnvironmentManager;
|
|
// @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;
|
|
focus(): this;
|
|
getAncestorPageId(shape?: TLShape | TLShapeId): TLPageId | undefined;
|
|
getAsset(asset: TLAsset | TLAssetId): TLAsset | undefined;
|
|
getAssetForExternalContent(info: TLExternalAssetContent): Promise<TLAsset | undefined>;
|
|
getAssets(): (TLBookmarkAsset | TLImageAsset | TLVideoAsset)[];
|
|
getBaseZoom(): number;
|
|
// (undocumented)
|
|
getBinding(id: TLBindingId): TLBinding | undefined;
|
|
// (undocumented)
|
|
getBindingsFromShape<Binding extends TLUnknownBinding = TLBinding>(shape: TLShape | TLShapeId, type: Binding['type']): Binding[];
|
|
// (undocumented)
|
|
getBindingsInvolvingShape<Binding extends TLUnknownBinding = TLBinding>(shape: TLShape | TLShapeId, type?: Binding['type']): Binding[];
|
|
// (undocumented)
|
|
getBindingsToShape<Binding extends TLUnknownBinding = TLBinding>(shape: TLShape | TLShapeId, type: Binding['type']): Binding[];
|
|
getBindingUtil<S extends TLUnknownBinding>(binding: {
|
|
type: S['type'];
|
|
} | S): BindingUtil<S>;
|
|
// (undocumented)
|
|
getBindingUtil<S extends TLUnknownBinding>(type: S['type']): BindingUtil<S>;
|
|
// (undocumented)
|
|
getBindingUtil<T extends BindingUtil>(type: T extends BindingUtil<infer R> ? R['type'] : string): T;
|
|
getCamera(): TLCamera;
|
|
getCameraOptions(): TLCameraOptions;
|
|
getCameraState(): "idle" | "moving";
|
|
getCanRedo(): boolean;
|
|
getCanUndo(): boolean;
|
|
getCollaborators(): TLInstancePresence[];
|
|
getCollaboratorsOnCurrentPage(): TLInstancePresence[];
|
|
getContainer: () => HTMLElement;
|
|
getContentFromCurrentPage(shapes: TLShape[] | TLShapeId[]): TLContent | undefined;
|
|
// @internal
|
|
getCrashingError(): unknown;
|
|
getCroppingShapeId(): null | TLShapeId;
|
|
getCulledShapes(): Set<TLShapeId>;
|
|
getCurrentPage(): TLPage;
|
|
getCurrentPageBounds(): Box | undefined;
|
|
getCurrentPageId(): TLPageId;
|
|
getCurrentPageRenderingShapesSorted(): TLShape[];
|
|
getCurrentPageShapeIds(): Set<TLShapeId>;
|
|
// @internal (undocumented)
|
|
getCurrentPageShapeIdsSorted(): TLShapeId[];
|
|
getCurrentPageShapes(): TLShape[];
|
|
getCurrentPageShapesSorted(): TLShape[];
|
|
getCurrentPageState(): TLInstancePageState;
|
|
getCurrentTool(): StateNode;
|
|
getCurrentToolId(): string;
|
|
getDocumentSettings(): TLDocument;
|
|
getDroppingOverShape(point: VecLike, droppingShapes?: TLShape[]): TLUnknownShape | undefined;
|
|
getEditingShape(): TLShape | undefined;
|
|
getEditingShapeId(): null | TLShapeId;
|
|
getErasingShapeIds(): TLShapeId[];
|
|
getErasingShapes(): NonNullable<TLShape | undefined>[];
|
|
getFocusedGroup(): TLShape | undefined;
|
|
getFocusedGroupId(): TLPageId | TLShapeId;
|
|
getHighestIndexForParent(parent: TLPage | TLParentId | TLShape): IndexKey;
|
|
getHintingShape(): NonNullable<TLShape | undefined>[];
|
|
getHintingShapeIds(): TLShapeId[];
|
|
getHoveredShape(): TLShape | undefined;
|
|
getHoveredShapeId(): null | TLShapeId;
|
|
getInitialMetaForShape(_shape: TLShape): JsonObject;
|
|
getInitialZoom(): number;
|
|
getInstanceState(): TLInstance;
|
|
getIsMenuOpen(): boolean;
|
|
getOnlySelectedShape(): null | TLShape;
|
|
getOnlySelectedShapeId(): null | TLShapeId;
|
|
getOpenMenus(): string[];
|
|
getOutermostSelectableShape(shape: TLShape | TLShapeId, filter?: (shape: TLShape) => boolean): TLShape;
|
|
getPage(page: TLPage | TLPageId): TLPage | undefined;
|
|
getPages(): TLPage[];
|
|
getPageShapeIds(page: TLPage | TLPageId): Set<TLShapeId>;
|
|
getPageStates(): TLInstancePageState[];
|
|
getPath(): string;
|
|
getPointInParentSpace(shape: TLShape | TLShapeId, point: VecLike): Vec;
|
|
getPointInShapeSpace(shape: TLShape | TLShapeId, point: VecLike): Vec;
|
|
getRenderingShapes(): {
|
|
backgroundIndex: number;
|
|
id: TLShapeId;
|
|
index: number;
|
|
opacity: number;
|
|
shape: TLShape;
|
|
util: ShapeUtil<TLUnknownShape>;
|
|
}[];
|
|
getSelectedShapeAtPoint(point: VecLike): TLShape | undefined;
|
|
getSelectedShapeIds(): TLShapeId[];
|
|
getSelectedShapes(): TLShape[];
|
|
getSelectionPageBounds(): Box | null;
|
|
getSelectionRotatedPageBounds(): Box | undefined;
|
|
getSelectionRotatedScreenBounds(): Box | undefined;
|
|
getSelectionRotation(): number;
|
|
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?: {
|
|
filter?: ((shape: TLShape) => boolean) | undefined;
|
|
hitFrameInside?: boolean | undefined;
|
|
hitInside?: boolean | undefined;
|
|
hitLabels?: boolean | undefined;
|
|
hitLocked?: boolean | undefined;
|
|
margin?: number | undefined;
|
|
renderingOnly?: 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): Mat;
|
|
getShapeMask(shape: TLShape | TLShapeId): undefined | VecLike[];
|
|
getShapeMaskedPageBounds(shape: TLShape | TLShapeId): Box | undefined;
|
|
// @internal
|
|
getShapeNearestSibling(siblingShape: TLShape, targetShape: TLShape | undefined): TLShape | undefined;
|
|
getShapePageBounds(shape: TLShape | TLShapeId): Box | undefined;
|
|
getShapePageTransform(shape: TLShape | TLShapeId): Mat;
|
|
getShapeParent(shape?: TLShape | TLShapeId): TLShape | undefined;
|
|
getShapeParentTransform(shape: TLShape | TLShapeId): Mat;
|
|
getShapesAtPoint(point: VecLike, opts?: {
|
|
hitInside?: boolean | undefined;
|
|
margin?: number | 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;
|
|
getSharedOpacity(): SharedStyle<number>;
|
|
getSharedStyles(): ReadonlySharedStyleMap;
|
|
getSortedChildIdsForParent(parent: TLPage | TLParentId | TLShape): TLShapeId[];
|
|
getStateDescendant<T extends StateNode>(path: string): T | undefined;
|
|
getStyleForNextShape<T>(style: StyleProp<T>): T;
|
|
// @deprecated (undocumented)
|
|
getSvg(shapes: TLShape[] | TLShapeId[], opts?: Partial<TLSvgOptions>): Promise<SVGSVGElement | undefined>;
|
|
getSvgElement(shapes: TLShape[] | TLShapeId[], opts?: Partial<TLSvgOptions>): Promise<{
|
|
height: number;
|
|
svg: SVGSVGElement;
|
|
width: number;
|
|
} | undefined>;
|
|
getSvgString(shapes: TLShape[] | TLShapeId[], opts?: Partial<TLSvgOptions>): Promise<{
|
|
height: number;
|
|
svg: string;
|
|
width: number;
|
|
} | undefined>;
|
|
// @internal (undocumented)
|
|
getUnorderedRenderingShapes(useEditorState: boolean): {
|
|
backgroundIndex: number;
|
|
id: TLShapeId;
|
|
index: number;
|
|
opacity: number;
|
|
shape: TLShape;
|
|
util: ShapeUtil;
|
|
}[];
|
|
getViewportPageBounds(): Box;
|
|
getViewportScreenBounds(): Box;
|
|
getViewportScreenCenter(): Vec;
|
|
getZoomLevel(): number;
|
|
groupShapes(shapes: TLShape[], options?: Partial<{
|
|
groupId: TLShapeId;
|
|
select: boolean;
|
|
}>): this;
|
|
// (undocumented)
|
|
groupShapes(ids: TLShapeId[], options?: Partial<{
|
|
groupId: TLShapeId;
|
|
select: boolean;
|
|
}>): this;
|
|
hasAncestor(shape: TLShape | TLShapeId | undefined, ancestorId: TLShapeId): boolean;
|
|
readonly history: HistoryManager<TLRecord>;
|
|
inputs: {
|
|
buttons: Set<number>;
|
|
keys: Set<string>;
|
|
originScreenPoint: Vec;
|
|
originPagePoint: Vec;
|
|
currentScreenPoint: Vec;
|
|
currentPagePoint: Vec;
|
|
previousScreenPoint: Vec;
|
|
previousPagePoint: Vec;
|
|
pointerVelocity: Vec;
|
|
altKey: boolean;
|
|
ctrlKey: boolean;
|
|
isPen: boolean;
|
|
shiftKey: boolean;
|
|
isDragging: boolean;
|
|
isEditing: boolean;
|
|
isPanning: boolean;
|
|
isPinching: boolean;
|
|
isPointing: boolean;
|
|
};
|
|
interrupt(): this;
|
|
isAncestorSelected(shape: TLShape | TLShapeId): boolean;
|
|
isIn(path: string): boolean;
|
|
isInAny(...paths: string[]): boolean;
|
|
isPointInShape(shape: TLShape | TLShapeId, point: VecLike, opts?: {
|
|
hitInside?: boolean | undefined;
|
|
margin?: number | 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): this;
|
|
moveShapesToPage(shapes: TLShape[] | TLShapeId[], pageId: TLPageId): this;
|
|
nudgeShapes(shapes: TLShape[] | TLShapeId[], offset: VecLike): this;
|
|
// (undocumented)
|
|
readonly options: TldrawOptions;
|
|
packShapes(shapes: TLShape[] | TLShapeId[], gap: number): this;
|
|
pageToScreen(point: VecLike): Vec;
|
|
pageToViewport(point: VecLike): Vec;
|
|
popFocusedGroupId(): this;
|
|
putContentOntoCurrentPage(content: TLContent, options?: {
|
|
point?: VecLike;
|
|
preserveIds?: boolean;
|
|
preservePosition?: boolean;
|
|
select?: 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): this;
|
|
reparentShapes(shapes: TLShape[] | TLShapeId[], parentId: TLParentId, insertIndex?: IndexKey): this;
|
|
resetZoom(point?: Vec, opts?: TLCameraMoveOptions): this;
|
|
resizeShape(shape: TLShape | TLShapeId, scale: VecLike, options?: TLResizeShapeOptions): this;
|
|
readonly root: RootState;
|
|
rotateShapesBy(shapes: TLShape[] | TLShapeId[], delta: number): this;
|
|
screenToPage(point: VecLike): Vec;
|
|
readonly scribbles: ScribbleManager;
|
|
select(...shapes: TLShape[] | TLShapeId[]): this;
|
|
selectAll(): this;
|
|
selectNone(): this;
|
|
sendBackward(shapes: TLShape[] | TLShapeId[]): this;
|
|
sendToBack(shapes: TLShape[] | TLShapeId[]): this;
|
|
setCamera(point: VecLike, opts?: TLCameraMoveOptions): this;
|
|
setCameraOptions(options: Partial<TLCameraOptions>): this;
|
|
setCroppingShape(shape: null | TLShape | TLShapeId): this;
|
|
setCurrentPage(page: TLPage | TLPageId): 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?: TLHistoryBatchOptions): this;
|
|
setOpacityForSelectedShapes(opacity: number): this;
|
|
setSelectedShapes(shapes: TLShape[] | TLShapeId[]): this;
|
|
setStyleForNextShapes<T>(style: StyleProp<T>, value: T, historyOptions?: TLHistoryBatchOptions): this;
|
|
setStyleForSelectedShapes<S extends StyleProp<any>>(style: S, value: StylePropValue<S>): this;
|
|
shapeUtils: {
|
|
readonly [K in string]?: ShapeUtil<TLUnknownShape>;
|
|
};
|
|
readonly sideEffects: StoreSideEffects<TLRecord>;
|
|
slideCamera(opts?: {
|
|
direction: VecLike;
|
|
friction?: number | undefined;
|
|
speed: 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<any>, string>;
|
|
};
|
|
readonly textMeasure: TextManager;
|
|
toggleLock(shapes: TLShape[] | TLShapeId[]): this;
|
|
undo(): this;
|
|
ungroupShapes(ids: TLShapeId[], options?: Partial<{
|
|
select: boolean;
|
|
}>): this;
|
|
// (undocumented)
|
|
ungroupShapes(shapes: TLShape[], options?: Partial<{
|
|
select: boolean;
|
|
}>): this;
|
|
updateAssets(assets: TLAssetPartial[]): this;
|
|
// (undocumented)
|
|
updateBinding<B extends TLBinding = TLBinding>(partial: TLBindingUpdate<B>): this;
|
|
// (undocumented)
|
|
updateBindings(partials: (null | TLBindingUpdate | undefined)[]): this;
|
|
updateCurrentPageState(partial: Partial<Omit<TLInstancePageState, 'editingShapeId' | 'focusedGroupId' | 'pageId' | 'selectedShapeIds'>>, historyOptions?: TLHistoryBatchOptions): this;
|
|
// (undocumented)
|
|
_updateCurrentPageState: (partial: Partial<Omit<TLInstancePageState, 'selectedShapeIds'>>, historyOptions?: TLHistoryBatchOptions) => void;
|
|
updateDocumentSettings(settings: Partial<TLDocument>): this;
|
|
updateInstanceState(partial: Partial<Omit<TLInstance, 'currentPageId'>>, historyOptions?: TLHistoryBatchOptions): this;
|
|
updatePage(partial: RequiredKeys<Partial<TLPage>, 'id'>): this;
|
|
updateShape<T extends TLUnknownShape>(partial: null | TLShapePartial<T> | undefined): this;
|
|
updateShapes<T extends TLUnknownShape>(partials: (null | TLShapePartial<T> | undefined)[]): this;
|
|
updateViewportScreenBounds(screenBounds: Box, center?: boolean): this;
|
|
readonly user: UserPreferencesManager;
|
|
visitDescendants(parent: TLPage | TLParentId | TLShape, visitor: (id: TLShapeId) => false | void): this;
|
|
zoomIn(point?: Vec, opts?: TLCameraMoveOptions): this;
|
|
zoomOut(point?: Vec, opts?: TLCameraMoveOptions): this;
|
|
zoomToBounds(bounds: BoxLike, opts?: {
|
|
inset?: number;
|
|
targetZoom?: number;
|
|
} & TLCameraMoveOptions): this;
|
|
zoomToFit(opts?: TLCameraMoveOptions): this;
|
|
zoomToSelection(opts?: TLCameraMoveOptions): this;
|
|
zoomToUser(userId: string, opts?: TLCameraMoveOptions): this;
|
|
}
|
|
|
|
// @internal (undocumented)
|
|
export const EditorContext: React_2.Context<Editor | null>;
|
|
|
|
// @public (undocumented)
|
|
export class Ellipse2d extends Geometry2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed'> & {
|
|
height: number;
|
|
width: number;
|
|
});
|
|
// (undocumented)
|
|
config: Omit<Geometry2dOptions, 'isClosed'> & {
|
|
height: number;
|
|
width: number;
|
|
};
|
|
// (undocumented)
|
|
get edges(): Edge2d[];
|
|
// (undocumented)
|
|
_edges?: Edge2d[];
|
|
// (undocumented)
|
|
getBounds(): Box;
|
|
// (undocumented)
|
|
getLength(): number;
|
|
// (undocumented)
|
|
getSvgPathData(first?: boolean): string;
|
|
// (undocumented)
|
|
getVertices(): any[];
|
|
// (undocumented)
|
|
h: number;
|
|
// (undocumented)
|
|
hitTestLineSegment(A: Vec, B: Vec): boolean;
|
|
// (undocumented)
|
|
nearestPoint(A: Vec): Vec;
|
|
// (undocumented)
|
|
w: number;
|
|
}
|
|
|
|
export { EMPTY_ARRAY }
|
|
|
|
// @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_2.Element | Iterable<React_3.ReactNode> | null | number | string | undefined;
|
|
// (undocumented)
|
|
state: TLErrorBoundaryState;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export function ErrorScreen({ children }: {
|
|
children: ReactNode;
|
|
}): JSX_2.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: Record<string, DebugFlag<boolean>>;
|
|
|
|
// @public (undocumented)
|
|
export interface GapsSnapIndicator {
|
|
// (undocumented)
|
|
direction: 'horizontal' | 'vertical';
|
|
// (undocumented)
|
|
gaps: Array<{
|
|
endEdge: [VecLike, VecLike];
|
|
startEdge: [VecLike, VecLike];
|
|
}>;
|
|
// (undocumented)
|
|
id: string;
|
|
// (undocumented)
|
|
type: 'gaps';
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export abstract class Geometry2d {
|
|
constructor(opts: Geometry2dOptions);
|
|
// (undocumented)
|
|
get area(): number;
|
|
// (undocumented)
|
|
get bounds(): Box;
|
|
// (undocumented)
|
|
get center(): Vec;
|
|
// (undocumented)
|
|
debugColor?: string;
|
|
// (undocumented)
|
|
distanceToLineSegment(A: Vec, B: Vec): number;
|
|
// (undocumented)
|
|
distanceToPoint(point: Vec, hitInside?: boolean): number;
|
|
// (undocumented)
|
|
getArea(): number;
|
|
// (undocumented)
|
|
getBounds(): Box;
|
|
// (undocumented)
|
|
getLength(): number;
|
|
// (undocumented)
|
|
abstract getSvgPathData(first: boolean): string;
|
|
// (undocumented)
|
|
abstract getVertices(): Vec[];
|
|
// (undocumented)
|
|
hitTestLineSegment(A: Vec, B: Vec, distance?: number): boolean;
|
|
// (undocumented)
|
|
hitTestPoint(point: Vec, margin?: number, hitInside?: boolean): boolean;
|
|
// (undocumented)
|
|
ignore?: boolean;
|
|
// (undocumented)
|
|
isClosed: boolean;
|
|
// (undocumented)
|
|
isFilled: boolean;
|
|
// (undocumented)
|
|
isLabel: boolean;
|
|
// (undocumented)
|
|
isPointInBounds(point: Vec, margin?: number): boolean;
|
|
// (undocumented)
|
|
get length(): number;
|
|
// (undocumented)
|
|
abstract nearestPoint(point: Vec): Vec;
|
|
// (undocumented)
|
|
nearestPointOnLineSegment(A: Vec, B: Vec): Vec;
|
|
// (undocumented)
|
|
toSimpleSvgPath(): string;
|
|
// (undocumented)
|
|
get vertices(): Vec[];
|
|
}
|
|
|
|
// @public
|
|
export function getArcMeasure(A: number, B: number, sweepFlag: number, largeArcFlag: number): number;
|
|
|
|
// @public (undocumented)
|
|
export function getCursor(cursor: TLCursorType, rotation?: number, color?: string): string;
|
|
|
|
// @public (undocumented)
|
|
export function getFreshUserPreferences(): TLUserPreferences;
|
|
|
|
// @public
|
|
export function getIncrementedName(name: string, others: string[]): string;
|
|
|
|
// @public (undocumented)
|
|
export function getPointerInfo(e: PointerEvent | React.PointerEvent): {
|
|
altKey: boolean;
|
|
button: number;
|
|
ctrlKey: boolean;
|
|
isPen: boolean;
|
|
point: {
|
|
x: number;
|
|
y: number;
|
|
z: number;
|
|
};
|
|
pointerId: number;
|
|
shiftKey: boolean;
|
|
};
|
|
|
|
// @public
|
|
export function getPointInArcT(mAB: number, A: number, B: number, P: number): number;
|
|
|
|
// @public
|
|
export function getPointOnCircle(center: VecLike, r: number, a: number): Vec;
|
|
|
|
// @public (undocumented)
|
|
export function getPointsOnArc(startPoint: VecLike, endPoint: VecLike, center: null | VecLike, radius: number, numPoints: number): Vec[];
|
|
|
|
// @public (undocumented)
|
|
export function getPolygonVertices(width: number, height: number, sides: number): Vec[];
|
|
|
|
// @internal (undocumented)
|
|
export function getRotationSnapshot({ editor }: {
|
|
editor: Editor;
|
|
}): null | TLRotationSnapshot;
|
|
|
|
// @public
|
|
export function getSvgPathFromPoints(points: VecLike[], closed?: boolean): string;
|
|
|
|
// @public (undocumented)
|
|
export function getUserPreferences(): TLUserPreferences;
|
|
|
|
// @public (undocumented)
|
|
export class Group2d extends Geometry2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed' | 'isFilled'> & {
|
|
children: Geometry2d[];
|
|
});
|
|
// (undocumented)
|
|
children: Geometry2d[];
|
|
// (undocumented)
|
|
distanceToPoint(point: Vec, hitInside?: boolean): number;
|
|
// (undocumented)
|
|
getArea(): number;
|
|
// (undocumented)
|
|
getLength(): number;
|
|
// (undocumented)
|
|
getSvgPathData(): string;
|
|
// (undocumented)
|
|
getVertices(): Vec[];
|
|
// (undocumented)
|
|
hitTestLineSegment(A: Vec, B: Vec, zoom: number): boolean;
|
|
// (undocumented)
|
|
hitTestPoint(point: Vec, margin: number, hitInside: boolean): boolean;
|
|
// (undocumented)
|
|
ignoredChildren: Geometry2d[];
|
|
// (undocumented)
|
|
nearestPoint(point: Vec): Vec;
|
|
// (undocumented)
|
|
toSimpleSvgPath(): string;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export class GroupShapeUtil extends ShapeUtil<TLGroupShape> {
|
|
// (undocumented)
|
|
canBind: () => boolean;
|
|
// (undocumented)
|
|
component(shape: TLGroupShape): JSX_2.Element | null;
|
|
// (undocumented)
|
|
getDefaultProps(): TLGroupShape['props'];
|
|
// (undocumented)
|
|
getGeometry(shape: TLGroupShape): Geometry2d;
|
|
// (undocumented)
|
|
hideSelectionBoundsFg: () => boolean;
|
|
// (undocumented)
|
|
indicator(shape: TLGroupShape): JSX_2.Element;
|
|
// (undocumented)
|
|
static migrations: TLPropsMigrations;
|
|
// (undocumented)
|
|
onChildrenChange: TLOnChildrenChangeHandler<TLGroupShape>;
|
|
// (undocumented)
|
|
static props: RecordProps<TLGroupShape>;
|
|
// (undocumented)
|
|
static type: "group";
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export const HALF_PI: number;
|
|
|
|
// @public
|
|
export interface HandleSnapGeometry {
|
|
getSelfSnapOutline?(handle: TLHandle): Geometry2d | null;
|
|
getSelfSnapPoints?(handle: TLHandle): VecModel[];
|
|
outline?: Geometry2d | null;
|
|
points?: VecModel[];
|
|
}
|
|
|
|
// @public
|
|
export function hardReset({ shouldReload }?: {
|
|
shouldReload?: boolean | undefined;
|
|
}): Promise<void>;
|
|
|
|
// @public (undocumented)
|
|
export function hardResetEditor(): void;
|
|
|
|
// @public (undocumented)
|
|
export class HistoryManager<R extends UnknownRecord> {
|
|
constructor(opts: {
|
|
annotateError?: (error: unknown) => void;
|
|
store: Store<R>;
|
|
});
|
|
// (undocumented)
|
|
bail: () => this;
|
|
// (undocumented)
|
|
bailToMark: (id: string) => this;
|
|
// (undocumented)
|
|
batch: (fn: () => void, opts?: TLHistoryBatchOptions) => this;
|
|
// (undocumented)
|
|
clear(): void;
|
|
// @internal (undocumented)
|
|
debug(): {
|
|
pendingDiff: {
|
|
diff: RecordsDiff<R>;
|
|
isEmpty: boolean;
|
|
};
|
|
redos: (NonNullable<TLHistoryEntry<R>> | undefined)[];
|
|
state: HistoryRecorderState;
|
|
undos: (NonNullable<TLHistoryEntry<R>> | undefined)[];
|
|
};
|
|
// (undocumented)
|
|
readonly dispose: () => void;
|
|
// (undocumented)
|
|
getNumRedos(): number;
|
|
// (undocumented)
|
|
getNumUndos(): number;
|
|
// (undocumented)
|
|
ignore(fn: () => void): this;
|
|
// @internal (undocumented)
|
|
_isInBatch: boolean;
|
|
// (undocumented)
|
|
mark: (id?: string) => string;
|
|
// (undocumented)
|
|
onBatchComplete: () => void;
|
|
// (undocumented)
|
|
redo: () => this | undefined;
|
|
// @internal (undocumented)
|
|
stacks: Atom< {
|
|
redos: Stack<TLHistoryEntry<R>>;
|
|
undos: Stack<TLHistoryEntry<R>>;
|
|
}, unknown>;
|
|
// (undocumented)
|
|
undo: () => this;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export function HTMLContainer({ children, className, ...rest }: HTMLContainerProps): JSX_2.Element;
|
|
|
|
// @public (undocumented)
|
|
export type HTMLContainerProps = React_3.HTMLAttributes<HTMLDivElement>;
|
|
|
|
// @public
|
|
export function intersectCircleCircle(c1: VecLike, r1: number, c2: VecLike, r2: number): Vec[];
|
|
|
|
// @public
|
|
export function intersectCirclePolygon(c: VecLike, r: number, points: VecLike[]): null | VecLike[];
|
|
|
|
// @public
|
|
export function intersectCirclePolyline(c: VecLike, r: number, points: VecLike[]): null | VecLike[];
|
|
|
|
// @public
|
|
export function intersectLineSegmentCircle(a1: VecLike, a2: VecLike, c: VecLike, r: number): null | VecLike[];
|
|
|
|
// @public
|
|
export function intersectLineSegmentLineSegment(a1: VecLike, a2: VecLike, b1: VecLike, b2: VecLike): null | Vec;
|
|
|
|
// @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 intersectPolygonBounds(points: VecLike[], bounds: Box): null | VecLike[];
|
|
|
|
// @public
|
|
export function intersectPolygonPolygon(polygonA: VecLike[], polygonB: VecLike[]): null | VecLike[];
|
|
|
|
// @public
|
|
export const isSafeFloat: (n: number) => boolean;
|
|
|
|
// @public (undocumented)
|
|
export function linesIntersect(A: VecLike, B: VecLike, C: VecLike, D: VecLike): boolean;
|
|
|
|
// @public (undocumented)
|
|
export function LoadingScreen({ children }: {
|
|
children: ReactNode;
|
|
}): JSX_2.Element;
|
|
|
|
// @public
|
|
export function loadSessionStateSnapshotIntoStore(store: TLStore, snapshot: TLSessionStateSnapshot): void;
|
|
|
|
// @public (undocumented)
|
|
export function loopToHtmlElement(elm: Element): HTMLElement;
|
|
|
|
// @public (undocumented)
|
|
export class Mat {
|
|
constructor(a: number, b: number, c: number, d: number, e: number, f: number);
|
|
// (undocumented)
|
|
a: number;
|
|
// (undocumented)
|
|
static Absolute(m: MatLike): MatModel;
|
|
// (undocumented)
|
|
static applyToBounds(m: MatLike, box: Box): Box;
|
|
// (undocumented)
|
|
applyToPoint(point: VecLike): Vec;
|
|
// (undocumented)
|
|
static applyToPoint(m: MatLike, point: VecLike): Vec;
|
|
// (undocumented)
|
|
applyToPoints(points: VecLike[]): Vec[];
|
|
// (undocumented)
|
|
static applyToPoints(m: MatLike, points: VecLike[]): Vec[];
|
|
// (undocumented)
|
|
static applyToXY(m: MatLike, x: number, y: number): number[];
|
|
// (undocumented)
|
|
b: number;
|
|
// (undocumented)
|
|
c: number;
|
|
// (undocumented)
|
|
static Cast(m: MatLike): Mat;
|
|
// (undocumented)
|
|
clone(): Mat;
|
|
// (undocumented)
|
|
static Compose(...matrices: MatLike[]): Mat;
|
|
// (undocumented)
|
|
d: number;
|
|
// (undocumented)
|
|
static Decompose(m: MatLike): {
|
|
rotation: number;
|
|
scaleX: number;
|
|
scaleY: number;
|
|
x: number;
|
|
y: number;
|
|
};
|
|
// (undocumented)
|
|
decompose(): {
|
|
rotation: number;
|
|
scaleX: number;
|
|
scaleY: number;
|
|
x: number;
|
|
y: number;
|
|
};
|
|
// (undocumented)
|
|
decomposed(): {
|
|
rotation: number;
|
|
scaleX: number;
|
|
scaleY: number;
|
|
x: number;
|
|
y: number;
|
|
};
|
|
// (undocumented)
|
|
e: number;
|
|
// (undocumented)
|
|
equals(m: Mat | MatModel): boolean;
|
|
// (undocumented)
|
|
f: number;
|
|
// (undocumented)
|
|
static From(m: MatLike): Mat;
|
|
// (undocumented)
|
|
static Identity(): Mat;
|
|
// (undocumented)
|
|
identity(): this;
|
|
// (undocumented)
|
|
static Inverse(m: MatModel): MatModel;
|
|
// (undocumented)
|
|
invert(): this;
|
|
// (undocumented)
|
|
static Multiply(m1: MatModel, m2: MatModel): MatModel;
|
|
// (undocumented)
|
|
multiply(m: Mat | MatModel): this;
|
|
// (undocumented)
|
|
static Point(m: MatLike): Vec;
|
|
// (undocumented)
|
|
point(): Vec;
|
|
// (undocumented)
|
|
static Rotate(r: number, cx?: number, cy?: number): Mat;
|
|
// (undocumented)
|
|
rotate(r: number, cx?: number, cy?: number): Mat;
|
|
// (undocumented)
|
|
static Rotation(m: MatLike): number;
|
|
// (undocumented)
|
|
rotation(): number;
|
|
// (undocumented)
|
|
static Scale: {
|
|
(x: number, y: number, cx: number, cy: number): MatModel;
|
|
(x: number, y: number): MatModel;
|
|
};
|
|
// (undocumented)
|
|
scale(x: number, y: number): this;
|
|
// (undocumented)
|
|
setTo(model: MatModel): 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): Mat;
|
|
// (undocumented)
|
|
translate(x: number, y: number): Mat;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type MatLike = Mat | MatModel;
|
|
|
|
// @public (undocumented)
|
|
export interface MatModel {
|
|
// (undocumented)
|
|
a: number;
|
|
// (undocumented)
|
|
b: number;
|
|
// (undocumented)
|
|
c: number;
|
|
// (undocumented)
|
|
d: number;
|
|
// (undocumented)
|
|
e: number;
|
|
// (undocumented)
|
|
f: number;
|
|
}
|
|
|
|
// @public
|
|
export function moveCameraWhenCloseToEdge(editor: Editor): void;
|
|
|
|
// @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_2.Element;
|
|
|
|
// @public
|
|
export function perimeterOfEllipse(rx: number, ry: number): number;
|
|
|
|
// @public (undocumented)
|
|
export const PI: number;
|
|
|
|
// @public (undocumented)
|
|
export const PI2: number;
|
|
|
|
// @public (undocumented)
|
|
export class Point2d extends Geometry2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed' | 'isFilled'> & {
|
|
margin: number;
|
|
point: Vec;
|
|
});
|
|
// (undocumented)
|
|
getSvgPathData(): string;
|
|
// (undocumented)
|
|
getVertices(): Vec[];
|
|
// (undocumented)
|
|
hitTestLineSegment(A: Vec, B: Vec, margin: number): boolean;
|
|
// (undocumented)
|
|
nearestPoint(): Vec;
|
|
// (undocumented)
|
|
point: Vec;
|
|
}
|
|
|
|
// @public
|
|
export function pointInPolygon(A: VecLike, points: VecLike[]): boolean;
|
|
|
|
// @public (undocumented)
|
|
export interface PointsSnapIndicator {
|
|
// (undocumented)
|
|
id: string;
|
|
// (undocumented)
|
|
points: VecLike[];
|
|
// (undocumented)
|
|
type: 'points';
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export class Polygon2d extends Polyline2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed'> & {
|
|
points: Vec[];
|
|
});
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export function polygonIntersectsPolyline(polygon: VecLike[], polyline: VecLike[]): boolean;
|
|
|
|
// @public (undocumented)
|
|
export function polygonsIntersect(a: VecLike[], b: VecLike[]): boolean;
|
|
|
|
// @public (undocumented)
|
|
export class Polyline2d extends Geometry2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed' | 'isFilled'> & {
|
|
points: Vec[];
|
|
});
|
|
// (undocumented)
|
|
getLength(): number;
|
|
// (undocumented)
|
|
getSvgPathData(): string;
|
|
// (undocumented)
|
|
getVertices(): Vec[];
|
|
// (undocumented)
|
|
hitTestLineSegment(A: Vec, B: Vec, distance?: number): boolean;
|
|
// (undocumented)
|
|
nearestPoint(A: Vec): Vec;
|
|
// (undocumented)
|
|
points: Vec[];
|
|
// (undocumented)
|
|
get segments(): Edge2d[];
|
|
// (undocumented)
|
|
_segments?: Edge2d[];
|
|
}
|
|
|
|
// @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<any>, SharedStyle<unknown>]>;
|
|
constructor(entries?: Iterable<[StyleProp<unknown>, SharedStyle<unknown>]>);
|
|
// (undocumented)
|
|
entries(): IterableIterator<[StyleProp<any>, 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<any>>;
|
|
// @internal (undocumented)
|
|
protected map: Map<StyleProp<any>, SharedStyle<unknown>>;
|
|
// (undocumented)
|
|
get size(): number;
|
|
// (undocumented)
|
|
values(): IterableIterator<SharedStyle<unknown>>;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export class Rectangle2d extends Polygon2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed'> & {
|
|
height: number;
|
|
width: number;
|
|
x?: number;
|
|
y?: number;
|
|
});
|
|
// (undocumented)
|
|
getBounds(): Box;
|
|
// (undocumented)
|
|
getSvgPathData(): string;
|
|
// (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> = Required<Pick<T, K>> & Omit<T, K>;
|
|
|
|
// @public (undocumented)
|
|
export function resizeBox(shape: TLBaseBoxShape, info: {
|
|
handle: TLResizeHandle;
|
|
initialBounds: Box;
|
|
initialShape: TLBaseBoxShape;
|
|
mode: TLResizeMode;
|
|
newPoint: VecModel;
|
|
scaleX: number;
|
|
scaleY: number;
|
|
}, opts?: Partial<{
|
|
maxHeight: number;
|
|
maxWidth: number;
|
|
minHeight: number;
|
|
minWidth: number;
|
|
}>): {
|
|
props: {
|
|
h: number;
|
|
w: number;
|
|
};
|
|
x: number;
|
|
y: number;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type ResizeBoxOptions = Partial<{
|
|
maxHeight: number;
|
|
maxWidth: number;
|
|
minHeight: number;
|
|
minWidth: number;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export const ROTATE_CORNER_TO_SELECTION_CORNER: {
|
|
readonly bottom_left_rotate: "bottom_left";
|
|
readonly bottom_right_rotate: "bottom_right";
|
|
readonly mobile_rotate: "top_left";
|
|
readonly top_left_rotate: "top_left";
|
|
readonly top_right_rotate: "top_right";
|
|
};
|
|
|
|
// @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: {
|
|
hardReset: () => void;
|
|
openWindow: (url: string, target: string) => void;
|
|
refreshPage: () => 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 abstract class ShapeUtil<Shape extends TLUnknownShape = TLUnknownShape> {
|
|
constructor(editor: Editor);
|
|
// @internal
|
|
backgroundComponent?(shape: Shape): any;
|
|
canBeLaidOut: TLShapeUtilFlag<Shape>;
|
|
canBind(opts: TLShapeUtilCanBindOpts<Shape>): boolean;
|
|
canCrop: TLShapeUtilFlag<Shape>;
|
|
canDropShapes(shape: Shape, shapes: TLShape[]): boolean;
|
|
canEdit: TLShapeUtilFlag<Shape>;
|
|
canEditInReadOnly: TLShapeUtilFlag<Shape>;
|
|
canReceiveNewChildrenOfType(shape: Shape, type: TLShape['type']): boolean;
|
|
canResize: TLShapeUtilFlag<Shape>;
|
|
canScroll: TLShapeUtilFlag<Shape>;
|
|
canSnap: TLShapeUtilFlag<Shape>;
|
|
abstract component(shape: Shape): any;
|
|
// (undocumented)
|
|
editor: Editor;
|
|
// @internal (undocumented)
|
|
expandSelectionOutlinePx(shape: Shape): number;
|
|
getBoundsSnapGeometry(shape: Shape): BoundsSnapGeometry;
|
|
getCanvasSvgDefs(): TLShapeUtilCanvasSvgDef[];
|
|
abstract getDefaultProps(): Shape['props'];
|
|
abstract getGeometry(shape: Shape): Geometry2d;
|
|
getHandles?(shape: Shape): TLHandle[];
|
|
getHandleSnapGeometry(shape: Shape): HandleSnapGeometry;
|
|
hideResizeHandles: TLShapeUtilFlag<Shape>;
|
|
hideRotateHandle: TLShapeUtilFlag<Shape>;
|
|
hideSelectionBoundsBg: TLShapeUtilFlag<Shape>;
|
|
hideSelectionBoundsFg: TLShapeUtilFlag<Shape>;
|
|
abstract indicator(shape: Shape): any;
|
|
isAspectRatioLocked: TLShapeUtilFlag<Shape>;
|
|
// (undocumented)
|
|
static migrations?: LegacyMigrations | MigrationSequence | TLPropsMigrations;
|
|
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>;
|
|
onDropShapesOver?: TLOnDragHandler<Shape>;
|
|
onEditEnd?: TLOnEditEndHandler<Shape>;
|
|
onHandleDrag?: TLOnHandleDragHandler<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?: RecordProps<TLUnknownShape>;
|
|
// @internal
|
|
providesBackgroundForChildren(shape: Shape): boolean;
|
|
toBackgroundSvg?(shape: Shape, ctx: SvgExportContext): null | Promise<null | ReactElement> | ReactElement;
|
|
toSvg?(shape: Shape, ctx: SvgExportContext): null | Promise<null | ReactElement> | ReactElement;
|
|
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;
|
|
|
|
// @public (undocumented)
|
|
export const SIDES: readonly ["top", "right", "bottom", "left"];
|
|
|
|
export { Signal }
|
|
|
|
// @public (undocumented)
|
|
export const SIN: (x: number) => number;
|
|
|
|
// @public
|
|
export function snapAngle(r: number, segments: number): number;
|
|
|
|
// @public (undocumented)
|
|
export type SnapIndicator = GapsSnapIndicator | PointsSnapIndicator;
|
|
|
|
// @public (undocumented)
|
|
export class SnapManager {
|
|
constructor(editor: Editor);
|
|
// (undocumented)
|
|
clearIndicators(): void;
|
|
// (undocumented)
|
|
readonly editor: Editor;
|
|
// (undocumented)
|
|
getCurrentCommonAncestor(): TLShapeId | undefined;
|
|
// (undocumented)
|
|
getIndicators(): SnapIndicator[];
|
|
// (undocumented)
|
|
getSnappableShapes(): Set<TLShapeId>;
|
|
// (undocumented)
|
|
getSnapThreshold(): number;
|
|
// (undocumented)
|
|
readonly handles: HandleSnaps;
|
|
// (undocumented)
|
|
setIndicators(indicators: SnapIndicator[]): void;
|
|
// (undocumented)
|
|
readonly shapeBounds: BoundsSnaps;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export class Stadium2d extends Geometry2d {
|
|
constructor(config: Omit<Geometry2dOptions, 'isClosed'> & {
|
|
height: number;
|
|
width: number;
|
|
});
|
|
// (undocumented)
|
|
a: Arc2d;
|
|
// (undocumented)
|
|
b: Edge2d;
|
|
// (undocumented)
|
|
c: Arc2d;
|
|
// (undocumented)
|
|
config: Omit<Geometry2dOptions, 'isClosed'> & {
|
|
height: number;
|
|
width: number;
|
|
};
|
|
// (undocumented)
|
|
d: Edge2d;
|
|
// (undocumented)
|
|
getBounds(): Box;
|
|
// (undocumented)
|
|
getLength(): number;
|
|
// (undocumented)
|
|
getSvgPathData(): string;
|
|
// (undocumented)
|
|
getVertices(): Vec[];
|
|
// (undocumented)
|
|
h: number;
|
|
// (undocumented)
|
|
hitTestLineSegment(A: Vec, B: Vec): boolean;
|
|
// (undocumented)
|
|
nearestPoint(A: Vec): Vec;
|
|
// (undocumented)
|
|
w: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export abstract class StateNode implements Partial<TLEventHandlers> {
|
|
constructor(editor: Editor, parent?: StateNode);
|
|
// (undocumented)
|
|
static children?: () => TLStateNodeConstructor[];
|
|
// (undocumented)
|
|
children?: Record<string, StateNode>;
|
|
_currentToolIdMask: Atom<string | undefined, unknown>;
|
|
// (undocumented)
|
|
editor: Editor;
|
|
// (undocumented)
|
|
enter: (info: any, from: string) => void;
|
|
// (undocumented)
|
|
exit: (info: any, from: string) => void;
|
|
getCurrent(): StateNode | undefined;
|
|
// (undocumented)
|
|
getCurrentToolIdMask(): string | undefined;
|
|
getIsActive(): boolean;
|
|
getPath(): string;
|
|
// (undocumented)
|
|
handleEvent: (info: Exclude<TLEventInfo, TLPinchEventInfo>) => void;
|
|
// (undocumented)
|
|
static id: string;
|
|
// (undocumented)
|
|
id: string;
|
|
// (undocumented)
|
|
static initial?: string;
|
|
// (undocumented)
|
|
initial?: string;
|
|
// (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)
|
|
onLongPress?: TLEventHandlers['onLongPress'];
|
|
// (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)
|
|
onTick?: TLEventHandlers['onTick'];
|
|
// (undocumented)
|
|
onTripleClick?: TLEventHandlers['onTripleClick'];
|
|
// (undocumented)
|
|
onWheel?: TLEventHandlers['onWheel'];
|
|
// (undocumented)
|
|
parent: StateNode;
|
|
// (undocumented)
|
|
_path: Computed<string>;
|
|
// (undocumented)
|
|
performanceTracker: PerformanceTracker;
|
|
// (undocumented)
|
|
setCurrentToolIdMask(id: string | undefined): void;
|
|
// (undocumented)
|
|
shapeType?: string;
|
|
transition: (id: string, info?: any) => this;
|
|
// (undocumented)
|
|
type: TLStateNodeType;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export const stopEventPropagation: (e: any) => any;
|
|
|
|
// @public (undocumented)
|
|
export function SVGContainer({ children, className, ...rest }: SVGContainerProps): JSX_2.Element;
|
|
|
|
// @public (undocumented)
|
|
export type SVGContainerProps = React_3.HTMLAttributes<SVGElement>;
|
|
|
|
// @public (undocumented)
|
|
export interface SvgExportContext {
|
|
addExportDef(def: SvgExportDef): void;
|
|
readonly isDarkMode: boolean;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface SvgExportDef {
|
|
// (undocumented)
|
|
getElement: () => null | Promise<null | ReactElement> | ReactElement;
|
|
// (undocumented)
|
|
key: string;
|
|
}
|
|
|
|
// @public
|
|
export const TAB_ID: string;
|
|
|
|
// @public (undocumented)
|
|
export type TLAnyBindingUtilConstructor = TLBindingUtilConstructor<any>;
|
|
|
|
// @public (undocumented)
|
|
export type TLAnyShapeUtilConstructor = TLShapeUtilConstructor<any>;
|
|
|
|
// @public (undocumented)
|
|
export type TLBaseBoxShape = TLBaseShape<string, {
|
|
h: number;
|
|
w: number;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export interface TLBaseEventInfo {
|
|
// (undocumented)
|
|
altKey: boolean;
|
|
// (undocumented)
|
|
ctrlKey: boolean;
|
|
// (undocumented)
|
|
shiftKey: boolean;
|
|
// (undocumented)
|
|
type: UiEventType;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface TLBindingUtilConstructor<T extends TLUnknownBinding, U extends BindingUtil<T> = BindingUtil<T>> {
|
|
// (undocumented)
|
|
new (editor: Editor): U;
|
|
// (undocumented)
|
|
migrations?: TLPropsMigrations;
|
|
// (undocumented)
|
|
props?: RecordProps<T>;
|
|
// (undocumented)
|
|
type: T['type'];
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface TLBrushProps {
|
|
// (undocumented)
|
|
brush: BoxModel;
|
|
// (undocumented)
|
|
className?: string;
|
|
// (undocumented)
|
|
color?: string;
|
|
// (undocumented)
|
|
opacity?: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface TLCameraConstraints {
|
|
baseZoom: 'default' | 'fit-max-100' | 'fit-max' | 'fit-min-100' | 'fit-min' | 'fit-x-100' | 'fit-x' | 'fit-y-100' | 'fit-y';
|
|
behavior: 'contain' | 'fixed' | 'free' | 'inside' | 'outside' | {
|
|
x: 'contain' | 'fixed' | 'free' | 'inside' | 'outside';
|
|
y: 'contain' | 'fixed' | 'free' | 'inside' | 'outside';
|
|
};
|
|
bounds: BoxModel;
|
|
initialZoom: 'default' | 'fit-max-100' | 'fit-max' | 'fit-min-100' | 'fit-min' | 'fit-x-100' | 'fit-x' | 'fit-y-100' | 'fit-y';
|
|
origin: VecLike;
|
|
padding: VecLike;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLCameraMoveOptions = Partial<{
|
|
animation: Partial<{
|
|
easing: (t: number) => number;
|
|
duration: number;
|
|
}>;
|
|
force: boolean;
|
|
immediate: boolean;
|
|
reset: boolean;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export interface TLCameraOptions {
|
|
constraints?: TLCameraConstraints;
|
|
isLocked: boolean;
|
|
panSpeed: number;
|
|
wheelBehavior: 'none' | 'pan' | 'zoom';
|
|
zoomSpeed: number;
|
|
zoomSteps: number[];
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLCancelEvent = (info: TLCancelEventInfo) => void;
|
|
|
|
// @public (undocumented)
|
|
export interface TLCancelEventInfo {
|
|
// (undocumented)
|
|
name: 'cancel';
|
|
// (undocumented)
|
|
type: 'misc';
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLClickEvent = (info: TLClickEventInfo) => void;
|
|
|
|
// @public (undocumented)
|
|
export type TLClickEventInfo = TLBaseEventInfo & {
|
|
button: number;
|
|
name: TLCLickEventName;
|
|
phase: 'down' | 'settle' | 'up';
|
|
point: VecLike;
|
|
pointerId: number;
|
|
type: 'click';
|
|
} & TLPointerEventTarget;
|
|
|
|
// @public (undocumented)
|
|
export type TLCLickEventName = 'double_click' | 'quadruple_click' | 'triple_click';
|
|
|
|
// @public (undocumented)
|
|
export interface TLCollaboratorHintProps {
|
|
// (undocumented)
|
|
className?: string;
|
|
// (undocumented)
|
|
color: string;
|
|
// (undocumented)
|
|
opacity?: number;
|
|
// (undocumented)
|
|
point: VecModel;
|
|
// (undocumented)
|
|
viewport: Box;
|
|
// (undocumented)
|
|
zoom: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLCompleteEvent = (info: TLCompleteEventInfo) => void;
|
|
|
|
// @public (undocumented)
|
|
export interface TLCompleteEventInfo {
|
|
// (undocumented)
|
|
name: 'complete';
|
|
// (undocumented)
|
|
type: 'misc';
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface TLContent {
|
|
// (undocumented)
|
|
assets: TLAsset[];
|
|
// (undocumented)
|
|
bindings: TLBinding[] | undefined;
|
|
// (undocumented)
|
|
rootShapeIds: TLShapeId[];
|
|
// (undocumented)
|
|
schema: SerializedSchema;
|
|
// (undocumented)
|
|
shapes: TLShape[];
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface TLCursorProps {
|
|
// (undocumented)
|
|
chatMessage: string;
|
|
// (undocumented)
|
|
className?: string;
|
|
// (undocumented)
|
|
color?: string;
|
|
// (undocumented)
|
|
name: null | string;
|
|
// (undocumented)
|
|
point: null | VecModel;
|
|
// (undocumented)
|
|
zoom: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export const TldrawEditor: React_2.NamedExoticComponent<TldrawEditorProps>;
|
|
|
|
// @public
|
|
export interface TldrawEditorBaseProps {
|
|
autoFocus?: boolean;
|
|
bindingUtils?: readonly TLAnyBindingUtilConstructor[];
|
|
cameraOptions?: Partial<TLCameraOptions>;
|
|
children?: ReactNode;
|
|
className?: string;
|
|
components?: TLEditorComponents;
|
|
inferDarkMode?: boolean;
|
|
initialState?: string;
|
|
onMount?: TLOnMountHandler;
|
|
options?: Partial<TldrawOptions>;
|
|
shapeUtils?: readonly TLAnyShapeUtilConstructor[];
|
|
tools?: readonly TLStateNodeConstructor[];
|
|
user?: TLUser;
|
|
}
|
|
|
|
// @public
|
|
export type TldrawEditorProps = Expand<TldrawEditorBaseProps & ({
|
|
defaultName?: string;
|
|
initialData?: SerializedStore<TLRecord>;
|
|
migrations?: readonly MigrationSequence[];
|
|
persistenceKey?: string;
|
|
sessionId?: string;
|
|
snapshot?: StoreSnapshot<TLRecord>;
|
|
store?: undefined;
|
|
} | {
|
|
store: TLStore | TLStoreWithStatus;
|
|
})>;
|
|
|
|
// @public
|
|
export interface TldrawOptions {
|
|
// (undocumented)
|
|
readonly adjacentShapeMargin: number;
|
|
// (undocumented)
|
|
readonly animationMediumMs: number;
|
|
// (undocumented)
|
|
readonly cameraMovingTimoutMs: number;
|
|
// (undocumented)
|
|
readonly cameraSlideFriction: number;
|
|
// (undocumented)
|
|
readonly coarseDragDistanceSquared: number;
|
|
// (undocumented)
|
|
readonly coarseHandleRadius: number;
|
|
// (undocumented)
|
|
readonly coarsePointerWidth: number;
|
|
// (undocumented)
|
|
readonly collaboratorCheckIntervalMs: number;
|
|
// (undocumented)
|
|
readonly collaboratorIdleTimeoutMs: number;
|
|
// (undocumented)
|
|
readonly collaboratorInactiveTimeoutMs: number;
|
|
// (undocumented)
|
|
readonly defaultSvgPadding: number;
|
|
// (undocumented)
|
|
readonly doubleClickDurationMs: number;
|
|
// (undocumented)
|
|
readonly dragDistanceSquared: number;
|
|
// (undocumented)
|
|
readonly edgeScrollDistance: number;
|
|
// (undocumented)
|
|
readonly edgeScrollSpeed: number;
|
|
// (undocumented)
|
|
readonly followChaseViewportSnap: number;
|
|
// (undocumented)
|
|
readonly gridSteps: readonly {
|
|
readonly mid: number;
|
|
readonly min: number;
|
|
readonly step: number;
|
|
}[];
|
|
// (undocumented)
|
|
readonly handleRadius: number;
|
|
// (undocumented)
|
|
readonly hitTestMargin: number;
|
|
// (undocumented)
|
|
readonly longPressDurationMs: number;
|
|
// (undocumented)
|
|
readonly maxPages: number;
|
|
// (undocumented)
|
|
readonly maxShapesPerPage: number;
|
|
// (undocumented)
|
|
readonly multiClickDurationMs: number;
|
|
// (undocumented)
|
|
readonly textShadowLod: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLEditorComponents = Partial<{
|
|
[K in keyof BaseEditorComponents]: BaseEditorComponents[K] | null;
|
|
} & ErrorComponents>;
|
|
|
|
// @public (undocumented)
|
|
export interface TLEditorOptions {
|
|
autoFocus?: boolean;
|
|
bindingUtils: readonly TLBindingUtilConstructor<TLUnknownBinding>[];
|
|
cameraOptions?: Partial<TLCameraOptions>;
|
|
getContainer: () => HTMLElement;
|
|
inferDarkMode?: boolean;
|
|
initialState?: string;
|
|
// (undocumented)
|
|
options?: Partial<TldrawOptions>;
|
|
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)
|
|
onLongPress: TLPointerEvent;
|
|
// (undocumented)
|
|
onMiddleClick: TLPointerEvent;
|
|
// (undocumented)
|
|
onPointerDown: TLPointerEvent;
|
|
// (undocumented)
|
|
onPointerMove: TLPointerEvent;
|
|
// (undocumented)
|
|
onPointerUp: TLPointerEvent;
|
|
// (undocumented)
|
|
onQuadrupleClick: TLClickEvent;
|
|
// (undocumented)
|
|
onRightClick: TLPointerEvent;
|
|
// (undocumented)
|
|
onTick: TLTickEvent;
|
|
// (undocumented)
|
|
onTripleClick: TLClickEvent;
|
|
// (undocumented)
|
|
onWheel: TLWheelEvent;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLEventInfo = TLCancelEventInfo | TLClickEventInfo | TLCompleteEventInfo | TLInterruptEventInfo | TLKeyboardEventInfo | TLPinchEventInfo | TLPointerEventInfo | TLTickEventInfo | TLWheelEventInfo;
|
|
|
|
// @public (undocumented)
|
|
export interface TLEventMap {
|
|
// (undocumented)
|
|
'max-shapes': [{
|
|
count: number;
|
|
name: string;
|
|
pageId: TLPageId;
|
|
}];
|
|
// (undocumented)
|
|
'select-all-text': [{
|
|
shapeId: TLShapeId;
|
|
}];
|
|
// (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' | 'tick' | 'wheel' | TLCLickEventName | TLKeyboardEventName | TLPinchEventName | TLPointerEventName;
|
|
|
|
// @public (undocumented)
|
|
export type TLExitEventHandler = (info: any, to: string) => void;
|
|
|
|
// @public (undocumented)
|
|
export type TLExternalAssetContent = {
|
|
file: File;
|
|
type: 'file';
|
|
} | {
|
|
type: 'url';
|
|
url: string;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLExternalContent = {
|
|
point?: VecLike;
|
|
sources?: TLExternalContentSource[];
|
|
} & ({
|
|
embed: EmbedDefinition;
|
|
type: 'embed';
|
|
url: string;
|
|
} | {
|
|
files: File[];
|
|
ignoreParent: boolean;
|
|
type: 'files';
|
|
} | {
|
|
text: string;
|
|
type: 'svg-text';
|
|
} | {
|
|
text: string;
|
|
type: 'text';
|
|
} | {
|
|
type: 'url';
|
|
url: string;
|
|
});
|
|
|
|
// @public (undocumented)
|
|
export type TLExternalContentSource = {
|
|
data: any;
|
|
type: 'excalidraw';
|
|
} | {
|
|
data: null | string;
|
|
reason: string;
|
|
type: 'error';
|
|
} | {
|
|
data: string;
|
|
subtype: 'html' | 'json' | 'text' | 'url';
|
|
type: 'text';
|
|
} | {
|
|
data: TLContent;
|
|
type: 'tldraw';
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export interface TLGridProps {
|
|
// (undocumented)
|
|
size: number;
|
|
// (undocumented)
|
|
x: number;
|
|
// (undocumented)
|
|
y: number;
|
|
// (undocumented)
|
|
z: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface TLHandleProps {
|
|
// (undocumented)
|
|
className?: string;
|
|
// (undocumented)
|
|
handle: TLHandle;
|
|
// (undocumented)
|
|
isCoarse: boolean;
|
|
// (undocumented)
|
|
shapeId: TLShapeId;
|
|
// (undocumented)
|
|
zoom: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface TLHandlesProps {
|
|
// (undocumented)
|
|
children: ReactNode;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLInterruptEvent = (info: TLInterruptEventInfo) => void;
|
|
|
|
// @public (undocumented)
|
|
export interface TLInterruptEventInfo {
|
|
// (undocumented)
|
|
name: 'interrupt';
|
|
// (undocumented)
|
|
type: 'misc';
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLKeyboardEvent = (info: TLKeyboardEventInfo) => void;
|
|
|
|
// @public (undocumented)
|
|
export type TLKeyboardEventInfo = TLBaseEventInfo & {
|
|
code: string;
|
|
key: string;
|
|
name: TLKeyboardEventName;
|
|
type: 'keyboard';
|
|
};
|
|
|
|
// @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 TLOnHandleDragHandler<T extends TLShape> = (shape: T, info: {
|
|
handle: TLHandle;
|
|
initial?: T | undefined;
|
|
isPrecise: boolean;
|
|
}) => TLShapePartial<T> | void;
|
|
|
|
// @public
|
|
export type TLOnMountHandler = (editor: Editor) => (() => undefined | 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 & {
|
|
delta: VecModel;
|
|
name: TLPinchEventName;
|
|
point: VecModel;
|
|
type: 'pinch';
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLPinchEventName = 'pinch_end' | 'pinch_start' | 'pinch';
|
|
|
|
// @public (undocumented)
|
|
export type TLPointerEvent = (info: TLPointerEventInfo) => void;
|
|
|
|
// @public (undocumented)
|
|
export type TLPointerEventInfo = TLBaseEventInfo & {
|
|
button: number;
|
|
isPen: boolean;
|
|
name: TLPointerEventName;
|
|
point: VecLike;
|
|
pointerId: number;
|
|
type: 'pointer';
|
|
} & TLPointerEventTarget;
|
|
|
|
// @public (undocumented)
|
|
export type TLPointerEventName = 'long_press' | 'middle_click' | 'pointer_down' | 'pointer_move' | 'pointer_up' | 'right_click';
|
|
|
|
// @public (undocumented)
|
|
export type TLPointerEventTarget = {
|
|
handle: TLHandle;
|
|
shape: TLShape;
|
|
target: 'handle';
|
|
} | {
|
|
handle?: TLSelectionHandle;
|
|
shape?: undefined;
|
|
target: 'selection';
|
|
} | {
|
|
shape: TLShape;
|
|
target: 'shape';
|
|
} | {
|
|
shape?: undefined;
|
|
target: 'canvas';
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLResizeHandle = SelectionCorner | SelectionEdge;
|
|
|
|
// @public
|
|
export interface TLResizeInfo<T extends TLShape> {
|
|
// (undocumented)
|
|
handle: TLResizeHandle;
|
|
// (undocumented)
|
|
initialBounds: Box;
|
|
// (undocumented)
|
|
initialShape: T;
|
|
// (undocumented)
|
|
mode: TLResizeMode;
|
|
// (undocumented)
|
|
newPoint: Vec;
|
|
// (undocumented)
|
|
scaleX: number;
|
|
// (undocumented)
|
|
scaleY: number;
|
|
}
|
|
|
|
// @public
|
|
export type TLResizeMode = 'resize_bounds' | 'scale_shape';
|
|
|
|
// @public (undocumented)
|
|
export type TLResizeShapeOptions = Partial<{
|
|
dragHandle: TLResizeHandle;
|
|
initialBounds: Box;
|
|
initialPageTransform: MatLike;
|
|
initialShape: TLShape;
|
|
isAspectRatioLocked: boolean;
|
|
mode: TLResizeMode;
|
|
scaleAxisRotation: number;
|
|
scaleOrigin: VecLike;
|
|
skipStartAndEndCallbacks: boolean;
|
|
}>;
|
|
|
|
// @public
|
|
export interface TLRotationSnapshot {
|
|
// (undocumented)
|
|
initialCursorAngle: number;
|
|
// (undocumented)
|
|
initialSelectionRotation: number;
|
|
// (undocumented)
|
|
selectionPageCenter: Vec;
|
|
// (undocumented)
|
|
shapeSnapshots: {
|
|
initialPagePoint: Vec;
|
|
shape: TLShape;
|
|
}[];
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface TLScribbleProps {
|
|
// (undocumented)
|
|
className?: string;
|
|
// (undocumented)
|
|
color?: string;
|
|
// (undocumented)
|
|
opacity?: number;
|
|
// (undocumented)
|
|
scribble: TLScribble;
|
|
// (undocumented)
|
|
zoom: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface TLSelectionBackgroundProps {
|
|
// (undocumented)
|
|
bounds: Box;
|
|
// (undocumented)
|
|
rotation: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface TLSelectionForegroundProps {
|
|
// (undocumented)
|
|
bounds: Box;
|
|
// (undocumented)
|
|
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<{
|
|
camera: {
|
|
x: number;
|
|
y: number;
|
|
z: number;
|
|
};
|
|
focusedGroupId: null | TLShapeId;
|
|
pageId: TLPageId;
|
|
selectedShapeIds: TLShapeId[];
|
|
}>;
|
|
// (undocumented)
|
|
version: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface TLShapeIndicatorProps {
|
|
// (undocumented)
|
|
className?: string;
|
|
// (undocumented)
|
|
color?: string | undefined;
|
|
// (undocumented)
|
|
hidden?: boolean;
|
|
// (undocumented)
|
|
opacity?: number;
|
|
// (undocumented)
|
|
shapeId: TLShapeId;
|
|
}
|
|
|
|
// @public
|
|
export interface TLShapeUtilCanBindOpts<Shape extends TLUnknownShape = TLShape> {
|
|
bindingType: string;
|
|
fromShapeType: string;
|
|
toShapeType: 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?: LegacyMigrations | MigrationSequence | TLPropsMigrations;
|
|
// (undocumented)
|
|
props?: RecordProps<T>;
|
|
// (undocumented)
|
|
type: T['type'];
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLShapeUtilFlag<T> = (shape: T) => boolean;
|
|
|
|
// @public (undocumented)
|
|
export interface TLSnapIndicatorProps {
|
|
// (undocumented)
|
|
className?: string;
|
|
// (undocumented)
|
|
line: SnapIndicator;
|
|
// (undocumented)
|
|
zoom: number;
|
|
}
|
|
|
|
// @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 = {
|
|
defaultName?: string;
|
|
id?: string;
|
|
initialData?: SerializedStore<TLRecord>;
|
|
} & ({
|
|
bindingUtils?: readonly TLAnyBindingUtilConstructor[];
|
|
migrations?: readonly MigrationSequence[];
|
|
shapeUtils?: readonly TLAnyShapeUtilConstructor[];
|
|
} | {
|
|
schema?: StoreSchema<TLRecord, TLStoreProps>;
|
|
});
|
|
|
|
// @public (undocumented)
|
|
export type TLStoreWithStatus = {
|
|
readonly connectionStatus: 'offline' | 'online';
|
|
readonly error?: undefined;
|
|
readonly status: 'synced-remote';
|
|
readonly store: TLStore;
|
|
} | {
|
|
readonly error: Error;
|
|
readonly status: 'error';
|
|
readonly store?: undefined;
|
|
} | {
|
|
readonly error?: undefined;
|
|
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;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export interface TLSvgOptions {
|
|
// (undocumented)
|
|
background: boolean;
|
|
// (undocumented)
|
|
bounds: Box;
|
|
// (undocumented)
|
|
darkMode?: boolean;
|
|
// (undocumented)
|
|
padding: number;
|
|
// (undocumented)
|
|
preserveAspectRatio: React.SVGAttributes<SVGSVGElement>['preserveAspectRatio'];
|
|
// (undocumented)
|
|
scale: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLTickEvent = (info: TLTickEventInfo) => void;
|
|
|
|
// @public
|
|
export interface TLUserPreferences {
|
|
// (undocumented)
|
|
animationSpeed?: null | number;
|
|
// (undocumented)
|
|
color?: null | string;
|
|
// (undocumented)
|
|
edgeScrollSpeed?: null | number;
|
|
// (undocumented)
|
|
id: string;
|
|
// (undocumented)
|
|
isDarkMode?: boolean | null;
|
|
// (undocumented)
|
|
isSnapMode?: boolean | null;
|
|
// (undocumented)
|
|
isWrapMode?: boolean | null;
|
|
// (undocumented)
|
|
locale?: null | string;
|
|
// (undocumented)
|
|
name?: null | string;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLWheelEvent = (info: TLWheelEventInfo) => void;
|
|
|
|
// @public (undocumented)
|
|
export type TLWheelEventInfo = TLBaseEventInfo & {
|
|
delta: VecModel;
|
|
name: 'wheel';
|
|
point: VecModel;
|
|
type: 'wheel';
|
|
};
|
|
|
|
// @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 [n: number]: T;
|
|
readonly length: number;
|
|
} | null | undefined): T[];
|
|
|
|
// @public
|
|
export function uniqueId(): string;
|
|
|
|
export { useComputed }
|
|
|
|
// @public (undocumented)
|
|
export function useContainer(): HTMLDivElement;
|
|
|
|
// @public (undocumented)
|
|
export function useEditor(): Editor;
|
|
|
|
// @public (undocumented)
|
|
export function useEditorComponents(): Partial<{
|
|
Background: ComponentType | null;
|
|
Brush: ComponentType<TLBrushProps> | null;
|
|
Canvas: ComponentType<TLCanvasComponentProps> | null;
|
|
CollaboratorBrush: ComponentType<TLBrushProps> | null;
|
|
CollaboratorCursor: ComponentType<TLCursorProps> | null;
|
|
CollaboratorHint: ComponentType<TLCollaboratorHintProps> | null;
|
|
CollaboratorScribble: ComponentType<TLScribbleProps> | null;
|
|
CollaboratorShapeIndicator: ComponentType<TLShapeIndicatorProps> | null;
|
|
Cursor: ComponentType<TLCursorProps> | null;
|
|
Grid: ComponentType<TLGridProps> | null;
|
|
Handle: ComponentType<TLHandleProps> | null;
|
|
Handles: ComponentType<TLHandlesProps> | null;
|
|
InFrontOfTheCanvas: ComponentType | null;
|
|
LoadingScreen: ComponentType | null;
|
|
OnTheCanvas: ComponentType | null;
|
|
Scribble: ComponentType<TLScribbleProps> | null;
|
|
SelectionBackground: ComponentType<TLSelectionBackgroundProps> | null;
|
|
SelectionForeground: ComponentType<TLSelectionForegroundProps> | null;
|
|
ShapeIndicator: ComponentType<TLShapeIndicatorProps> | null;
|
|
SnapIndicator: ComponentType<TLSnapIndicatorProps> | null;
|
|
Spinner: ComponentType | null;
|
|
SvgDefs: ComponentType | null;
|
|
ZoomBrush: ComponentType<TLBrushProps> | null;
|
|
} & ErrorComponents> & ErrorComponents;
|
|
|
|
// @internal
|
|
export function useEvent<Args extends Array<unknown>, Result>(handler: (...args: Args) => Result): (...args: Args) => Result;
|
|
|
|
// @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 }
|
|
|
|
// @internal
|
|
export function useSafeId(): string;
|
|
|
|
// @public (undocumented)
|
|
export function useSelectionEvents(handle: TLSelectionHandle): {
|
|
onPointerDown: PointerEventHandler<Element>;
|
|
onPointerMove: (e: React.PointerEvent) => void;
|
|
onPointerUp: PointerEventHandler<Element>;
|
|
};
|
|
|
|
// @internal (undocumented)
|
|
export function useShallowArrayIdentity<T>(arr: readonly T[]): readonly T[];
|
|
|
|
// @internal (undocumented)
|
|
export function useShallowObjectIdentity<T extends Record<string, unknown>>(arr: T): T;
|
|
|
|
// @public
|
|
export function useSvgExportContext(): {
|
|
isDarkMode: boolean;
|
|
} | null;
|
|
|
|
// @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 Vec {
|
|
constructor(x?: number, y?: number, z?: number);
|
|
// (undocumented)
|
|
static Abs(A: VecLike): Vec;
|
|
// (undocumented)
|
|
abs(): this;
|
|
// (undocumented)
|
|
static Add(A: VecLike, B: VecLike): Vec;
|
|
// (undocumented)
|
|
add(V: VecLike): this;
|
|
// (undocumented)
|
|
static AddScalar(A: VecLike, n: number): Vec;
|
|
// (undocumented)
|
|
addScalar(n: number): this;
|
|
// (undocumented)
|
|
static AddXY(A: VecLike, x: number, y: number): Vec;
|
|
// (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[]): Vec;
|
|
// (undocumented)
|
|
static Cast(A: VecLike): Vec;
|
|
// (undocumented)
|
|
static Clamp(A: Vec, min: number, max?: number): Vec;
|
|
// (undocumented)
|
|
clamp(min: number, max?: number): this;
|
|
// (undocumented)
|
|
static Clockwise(A: VecLike, B: VecLike, C: VecLike): boolean;
|
|
// (undocumented)
|
|
clone(): Vec;
|
|
static Cpr(A: VecLike, B: VecLike): number;
|
|
// (undocumented)
|
|
cpr(V: VecLike): number;
|
|
// (undocumented)
|
|
static Cross(A: VecLike, V: VecLike): Vec;
|
|
// (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 DistMin(A: VecLike, B: VecLike, n: number): boolean;
|
|
// (undocumented)
|
|
static Div(A: VecLike, t: number): Vec;
|
|
// (undocumented)
|
|
div(t: number): this;
|
|
// (undocumented)
|
|
static DivV(A: VecLike, B: VecLike): Vec;
|
|
// (undocumented)
|
|
divV(V: VecLike): this;
|
|
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 }: VecModel): Vec;
|
|
// (undocumented)
|
|
static FromAngle(r: number, length?: number): Vec;
|
|
// (undocumented)
|
|
static FromArray(v: number[]): Vec;
|
|
// (undocumented)
|
|
static IsNaN(A: VecLike): boolean;
|
|
// (undocumented)
|
|
static Len(A: VecLike): number;
|
|
// (undocumented)
|
|
len(): number;
|
|
// (undocumented)
|
|
static Len2(A: VecLike): number;
|
|
// (undocumented)
|
|
len2(): number;
|
|
static Lrp(A: VecLike, B: VecLike, t: number): Vec;
|
|
// (undocumented)
|
|
lrp(B: VecLike, t: number): Vec;
|
|
// (undocumented)
|
|
static Max(A: VecLike, B: VecLike): Vec;
|
|
// (undocumented)
|
|
static Med(A: VecLike, B: VecLike): Vec;
|
|
// (undocumented)
|
|
static Min(A: VecLike, B: VecLike): Vec;
|
|
// (undocumented)
|
|
static Mul(A: VecLike, t: number): Vec;
|
|
// (undocumented)
|
|
mul(t: number): this;
|
|
// (undocumented)
|
|
static MulV(A: VecLike, B: VecLike): Vec;
|
|
// (undocumented)
|
|
mulV(V: VecLike): this;
|
|
// (undocumented)
|
|
static NearestPointOnLineSegment(A: VecLike, B: VecLike, P: VecLike, clamp?: boolean): Vec;
|
|
static NearestPointOnLineThroughPoint(A: VecLike, u: VecLike, P: VecLike): Vec;
|
|
// (undocumented)
|
|
static Neg(A: VecLike): Vec;
|
|
// (undocumented)
|
|
neg(): this;
|
|
// (undocumented)
|
|
norm(): this;
|
|
// (undocumented)
|
|
static Nudge(A: VecLike, B: VecLike, distance: number): Vec;
|
|
// (undocumented)
|
|
nudge(B: VecLike, distance: number): this;
|
|
static Per(A: VecLike): Vec;
|
|
// (undocumented)
|
|
per(): this;
|
|
static PointsBetween(A: VecModel, B: VecModel, steps?: number): Vec[];
|
|
// (undocumented)
|
|
get pressure(): number;
|
|
static Pry(A: VecLike, B: VecLike): number;
|
|
// (undocumented)
|
|
pry(V: VecLike): number;
|
|
// (undocumented)
|
|
static Rescale(A: VecLike, n: number): Vec;
|
|
// (undocumented)
|
|
static Rot(A: VecLike, r?: number): Vec;
|
|
// (undocumented)
|
|
rot(r: number): this;
|
|
// (undocumented)
|
|
static RotWith(A: VecLike, C: VecLike, r: number): Vec;
|
|
// (undocumented)
|
|
rotWith(C: VecLike, r: number): this;
|
|
// (undocumented)
|
|
static ScaleWithOrigin(A: VecLike, scale: number, origin: VecLike): Vec;
|
|
// (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): Vec;
|
|
// (undocumented)
|
|
static SnapToGrid(A: VecLike, gridSize?: number): Vec;
|
|
// (undocumented)
|
|
snapToGrid(gridSize: number): this;
|
|
// (undocumented)
|
|
static Sub(A: VecLike, B: VecLike): Vec;
|
|
// (undocumented)
|
|
sub(V: VecLike): this;
|
|
// (undocumented)
|
|
static SubScalar(A: VecLike, n: number): Vec;
|
|
// (undocumented)
|
|
subScalar(n: number): this;
|
|
// (undocumented)
|
|
static SubXY(A: VecLike, x: number, y: number): Vec;
|
|
// (undocumented)
|
|
subXY(x: number, y: number): this;
|
|
// (undocumented)
|
|
static Tan(A: VecLike, B: VecLike): Vec;
|
|
// (undocumented)
|
|
tan(V: VecLike): Vec;
|
|
// (undocumented)
|
|
static ToAngle(A: VecLike): number;
|
|
// (undocumented)
|
|
toAngle(): number;
|
|
// (undocumented)
|
|
static ToArray(A: VecLike): number[];
|
|
// (undocumented)
|
|
toArray(): number[];
|
|
// (undocumented)
|
|
static ToCss(A: VecLike): string;
|
|
// (undocumented)
|
|
static ToFixed(A: VecLike): Vec;
|
|
// (undocumented)
|
|
toFixed(): Vec;
|
|
// (undocumented)
|
|
static ToInt(A: VecLike): Vec;
|
|
// (undocumented)
|
|
static ToJson(A: VecLike): {
|
|
x: number;
|
|
y: number;
|
|
z: number | undefined;
|
|
};
|
|
// (undocumented)
|
|
toJson(): VecModel;
|
|
// (undocumented)
|
|
static ToString(A: VecLike): string;
|
|
// (undocumented)
|
|
toString(): string;
|
|
static Uni(A: VecLike): Vec;
|
|
// (undocumented)
|
|
uni(): Vec;
|
|
// (undocumented)
|
|
x: number;
|
|
// (undocumented)
|
|
y: number;
|
|
// (undocumented)
|
|
z: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type VecLike = Vec | VecModel;
|
|
|
|
export { whyAmIRunning }
|
|
|
|
|
|
export * from "@tldraw/store";
|
|
export * from "@tldraw/tlschema";
|
|
export * from "@tldraw/utils";
|
|
export * from "@tldraw/validate";
|
|
|
|
// (No @packageDocumentation comment for this package)
|
|
|
|
```
|