tldraw/packages/tlschema/api-report.md
David Sheldrick 4f70a4f4e8
New migrations again (#3220)
Describe what your pull request does. If appropriate, add GIFs or images
showing the before and after.

### Change Type

- [x] `sdk` — Changes the tldraw SDK
- [x] `galaxy brain` — Architectural changes



### 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

#### BREAKING CHANGES

- The `Migrations` type is now called `LegacyMigrations`.
- The serialized schema format (e.g. returned by
`StoreSchema.serialize()` and `Store.getSnapshot()`) has changed. You
don't need to do anything about it unless you were reading data directly
from the schema for some reason. In which case it'd be best to avoid
that in the future! We have no plans to change the schema format again
(this time was traumatic enough) but you never know.
- `compareRecordVersions` and the `RecordVersion` type have both
disappeared. There is no replacement. These were public by mistake
anyway, so hopefully nobody had been using it.
- `compareSchemas` is a bit less useful now. Our migrations system has
become a little fuzzy to allow for simpler UX when adding/removing
custom extensions and 3rd party dependencies, and as a result we can no
longer compare serialized schemas in any rigorous manner. You can rely
on this function to return `0` if the schemas are the same. Otherwise it
will return `-1` if the schema on the right _seems_ to be newer than the
schema on the left, but it cannot guarantee that in situations where
migration sequences have been removed over time (e.g. if you remove one
of the builtin tldraw shapes).

Generally speaking, the best way to check schema compatibility now is to
call `store.schema.getMigrationsSince(persistedSchema)`. This will throw
an error if there is no upgrade path from the `persistedSchema` to the
current version.

- `defineMigrations` has been deprecated and will be removed in a future
release. For upgrade instructions see
https://tldraw.dev/docs/persistence#Updating-legacy-shape-migrations-defineMigrations

- `migrate` has been removed. Nobody should have been using this but if
you were you'll need to find an alternative. For migrating tldraw data,
you should stick to using `schema.migrateStoreSnapshot` and, if you are
building a nuanced sync engine that supports some amount of backwards
compatibility, also feel free to use `schema.migratePersistedRecord`.
- the `Migration` type has changed. If you need the old one for some
reason it has been renamed to `LegacyMigration`. It will be removed in a
future release.
- the `Migrations` type has been renamed to `LegacyMigrations` and will
be removed in a future release.
- the `SerializedSchema` type has been augmented. If you need the old
version specifically you can use `SerializedSchemaV1`

---------

Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
2024-04-15 12:53:42 +00:00

1303 lines
40 KiB
Markdown

## API Report File for "@tldraw/tlschema"
> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
```ts
import { BaseRecord } from '@tldraw/store';
import { Expand } from '@tldraw/utils';
import { IndexKey } from '@tldraw/utils';
import { JsonObject } from '@tldraw/utils';
import { LegacyMigrations } from '@tldraw/store';
import { MigrationId } from '@tldraw/store';
import { MigrationSequence } from '@tldraw/store';
import { RecordId } from '@tldraw/store';
import { RecordType } from '@tldraw/store';
import { SerializedStore } from '@tldraw/store';
import { Signal } from '@tldraw/state';
import { Store } from '@tldraw/store';
import { StoreSchema } from '@tldraw/store';
import { StoreSnapshot } from '@tldraw/store';
import { T } from '@tldraw/validate';
import { UnknownRecord } from '@tldraw/store';
// @public (undocumented)
export const ArrowShapeArrowheadEndStyle: EnumStyleProp<"arrow" | "bar" | "diamond" | "dot" | "inverted" | "none" | "pipe" | "square" | "triangle">;
// @public (undocumented)
export const ArrowShapeArrowheadStartStyle: EnumStyleProp<"arrow" | "bar" | "diamond" | "dot" | "inverted" | "none" | "pipe" | "square" | "triangle">;
// @internal (undocumented)
export const arrowShapeMigrations: TLShapePropsMigrations;
// @public (undocumented)
export const arrowShapeProps: {
arrowheadEnd: EnumStyleProp<"arrow" | "bar" | "diamond" | "dot" | "inverted" | "none" | "pipe" | "square" | "triangle">;
arrowheadStart: EnumStyleProp<"arrow" | "bar" | "diamond" | "dot" | "inverted" | "none" | "pipe" | "square" | "triangle">;
bend: T.Validator<number>;
color: EnumStyleProp<"black" | "blue" | "green" | "grey" | "light-blue" | "light-green" | "light-red" | "light-violet" | "orange" | "red" | "violet" | "white" | "yellow">;
dash: EnumStyleProp<"dashed" | "dotted" | "draw" | "solid">;
end: T.UnionValidator<"type", {
binding: T.ObjectValidator<{
boundShapeId: TLShapeId;
isExact: boolean;
isPrecise: boolean;
normalizedAnchor: VecModel;
type: "binding";
} & {}>;
point: T.ObjectValidator<{
type: "point";
x: number;
y: number;
} & {}>;
}, never>;
fill: EnumStyleProp<"none" | "pattern" | "semi" | "solid">;
font: EnumStyleProp<"draw" | "mono" | "sans" | "serif">;
labelColor: EnumStyleProp<"black" | "blue" | "green" | "grey" | "light-blue" | "light-green" | "light-red" | "light-violet" | "orange" | "red" | "violet" | "white" | "yellow">;
labelPosition: T.Validator<number>;
size: EnumStyleProp<"l" | "m" | "s" | "xl">;
start: T.UnionValidator<"type", {
binding: T.ObjectValidator<{
boundShapeId: TLShapeId;
isExact: boolean;
isPrecise: boolean;
normalizedAnchor: VecModel;
type: "binding";
} & {}>;
point: T.ObjectValidator<{
type: "point";
x: number;
y: number;
} & {}>;
}, never>;
text: T.Validator<string>;
};
// @public
export const assetIdValidator: T.Validator<TLAssetId>;
// @internal (undocumented)
export const assetMigrations: MigrationSequence;
// @public (undocumented)
export const AssetRecordType: RecordType<TLAsset, "props" | "type">;
// @internal (undocumented)
export const assetValidator: T.Validator<TLAsset>;
// @internal (undocumented)
export const bookmarkShapeMigrations: TLShapePropsMigrations;
// @public (undocumented)
export const bookmarkShapeProps: {
assetId: T.Validator<TLAssetId | null>;
h: T.Validator<number>;
url: T.Validator<string>;
w: T.Validator<number>;
};
// @public
export interface BoxModel {
// (undocumented)
h: number;
// (undocumented)
w: number;
// (undocumented)
x: number;
// (undocumented)
y: number;
}
// @public (undocumented)
export const boxModelValidator: T.Validator<BoxModel>;
// @public (undocumented)
export const CameraRecordType: RecordType<TLCamera, never>;
// @public
export const canvasUiColorTypeValidator: T.Validator<"accent" | "black" | "laser" | "muted-1" | "selection-fill" | "selection-stroke" | "white">;
// @public
export function createAssetValidator<Type extends string, Props extends JsonObject>(type: Type, props: T.Validator<Props>): T.ObjectValidator<{ [P in "id" | "meta" | "typeName" | (undefined extends Props ? never : "props") | (undefined extends Type ? never : "type")]: {
id: TLAssetId;
meta: JsonObject;
props: Props;
type: Type;
typeName: 'asset';
}[P]; } & { [P_1 in (undefined extends Props ? "props" : never) | (undefined extends Type ? "type" : never)]?: {
id: TLAssetId;
meta: JsonObject;
props: Props;
type: Type;
typeName: 'asset';
}[P_1] | undefined; }>;
// @public
export const createPresenceStateDerivation: ($user: Signal<{
color: string;
id: string;
name: string;
}>, instanceId?: TLInstancePresence['id']) => (store: TLStore) => Signal<null | TLInstancePresence>;
// @public (undocumented)
export function createShapeId(id?: string): TLShapeId;
// @public (undocumented)
export function createShapePropsMigrationSequence(migrations: TLShapePropsMigrations): TLShapePropsMigrations;
// @public (undocumented)
export function createShapeValidator<Type extends string, Props extends JsonObject, Meta extends JsonObject>(type: Type, props?: {
[K in keyof Props]: T.Validatable<Props[K]>;
}, meta?: {
[K in keyof Meta]: T.Validatable<Meta[K]>;
}): T.ObjectValidator<{ [P in "id" | "index" | "isLocked" | "meta" | "opacity" | "parentId" | "rotation" | "typeName" | "x" | "y" | (undefined extends Props ? never : "props") | (undefined extends Type ? never : "type")]: TLBaseShape<Type, Props>[P]; } & { [P_1 in (undefined extends Props ? "props" : never) | (undefined extends Type ? "type" : never)]?: TLBaseShape<Type, Props>[P_1] | undefined; }>;
// @public
export function createTLSchema({ shapes, migrations, }?: {
migrations?: readonly MigrationSequence[];
shapes?: Record<string, SchemaShapeInfo>;
}): TLSchema;
// @public (undocumented)
export const DefaultColorStyle: EnumStyleProp<"black" | "blue" | "green" | "grey" | "light-blue" | "light-green" | "light-red" | "light-violet" | "orange" | "red" | "violet" | "white" | "yellow">;
// @public (undocumented)
export const DefaultColorThemePalette: {
darkMode: TLDefaultColorTheme;
lightMode: TLDefaultColorTheme;
};
// @public (undocumented)
export const DefaultDashStyle: EnumStyleProp<"dashed" | "dotted" | "draw" | "solid">;
// @public (undocumented)
export const DefaultFillStyle: EnumStyleProp<"none" | "pattern" | "semi" | "solid">;
// @public (undocumented)
export const DefaultFontFamilies: {
draw: string;
mono: string;
sans: string;
serif: string;
};
// @public (undocumented)
export const DefaultFontStyle: EnumStyleProp<"draw" | "mono" | "sans" | "serif">;
// @public (undocumented)
export const DefaultHorizontalAlignStyle: EnumStyleProp<"end-legacy" | "end" | "middle-legacy" | "middle" | "start-legacy" | "start">;
// @public (undocumented)
export const DefaultSizeStyle: EnumStyleProp<"l" | "m" | "s" | "xl">;
// @public (undocumented)
export const DefaultVerticalAlignStyle: EnumStyleProp<"end" | "middle" | "start">;
// @public (undocumented)
export const DocumentRecordType: RecordType<TLDocument, never>;
// @internal (undocumented)
export const drawShapeMigrations: TLShapePropsMigrations;
// @public (undocumented)
export const drawShapeProps: {
color: EnumStyleProp<"black" | "blue" | "green" | "grey" | "light-blue" | "light-green" | "light-red" | "light-violet" | "orange" | "red" | "violet" | "white" | "yellow">;
dash: EnumStyleProp<"dashed" | "dotted" | "draw" | "solid">;
fill: EnumStyleProp<"none" | "pattern" | "semi" | "solid">;
isClosed: T.Validator<boolean>;
isComplete: T.Validator<boolean>;
isPen: T.Validator<boolean>;
segments: T.ArrayOfValidator<{
points: VecModel[];
type: "free" | "straight";
} & {}>;
size: EnumStyleProp<"l" | "m" | "s" | "xl">;
};
// @public (undocumented)
export const EMBED_DEFINITIONS: readonly [{
readonly doesResize: true;
readonly fromEmbedUrl: (url: string) => string | undefined;
readonly height: 500;
readonly hostnames: readonly ["beta.tldraw.com", "tldraw.com", "localhost:3000"];
readonly minHeight: 300;
readonly minWidth: 300;
readonly overridePermissions: {
readonly 'allow-top-navigation': true;
};
readonly title: "tldraw";
readonly toEmbedUrl: (url: string) => string | undefined;
readonly type: "tldraw";
readonly width: 720;
}, {
readonly doesResize: true;
readonly fromEmbedUrl: (url: string) => string | undefined;
readonly height: 500;
readonly hostnames: readonly ["figma.com"];
readonly title: "Figma";
readonly toEmbedUrl: (url: string) => string | undefined;
readonly type: "figma";
readonly width: 720;
}, {
readonly doesResize: true;
readonly fromEmbedUrl: (url: string) => string | undefined;
readonly height: 500;
readonly hostnames: readonly ["google.*"];
readonly title: "Google Maps";
readonly toEmbedUrl: (url: string) => string | undefined;
readonly type: "google_maps";
readonly width: 720;
}, {
readonly doesResize: true;
readonly fromEmbedUrl: (url: string) => string | undefined;
readonly height: 500;
readonly hostnames: readonly ["val.town"];
readonly minHeight: 100;
readonly minWidth: 260;
readonly title: "Val Town";
readonly toEmbedUrl: (url: string) => string | undefined;
readonly type: "val_town";
readonly width: 720;
}, {
readonly doesResize: true;
readonly fromEmbedUrl: (url: string) => string | undefined;
readonly height: 500;
readonly hostnames: readonly ["codesandbox.io"];
readonly minHeight: 300;
readonly minWidth: 300;
readonly title: "CodeSandbox";
readonly toEmbedUrl: (url: string) => string | undefined;
readonly type: "codesandbox";
readonly width: 720;
}, {
readonly doesResize: true;
readonly fromEmbedUrl: (url: string) => string | undefined;
readonly height: 400;
readonly hostnames: readonly ["codepen.io"];
readonly minHeight: 300;
readonly minWidth: 300;
readonly title: "Codepen";
readonly toEmbedUrl: (url: string) => string | undefined;
readonly type: "codepen";
readonly width: 520;
}, {
readonly doesResize: false;
readonly fromEmbedUrl: (url: string) => string | undefined;
readonly height: 400;
readonly hostnames: readonly ["scratch.mit.edu"];
readonly title: "Scratch";
readonly toEmbedUrl: (url: string) => string | undefined;
readonly type: "scratch";
readonly width: 520;
}, {
readonly doesResize: true;
readonly fromEmbedUrl: (url: string) => string | undefined;
readonly height: 450;
readonly hostnames: readonly ["*.youtube.com", "youtube.com", "youtu.be"];
readonly isAspectRatioLocked: true;
readonly overridePermissions: {
readonly 'allow-presentation': true;
};
readonly title: "YouTube";
readonly toEmbedUrl: (url: string) => string | undefined;
readonly type: "youtube";
readonly width: 800;
}, {
readonly doesResize: true;
readonly fromEmbedUrl: (url: string) => string | undefined;
readonly height: 500;
readonly hostnames: readonly ["calendar.google.*"];
readonly instructionLink: "https://support.google.com/calendar/answer/41207?hl=en";
readonly minHeight: 360;
readonly minWidth: 460;
readonly title: "Google Calendar";
readonly toEmbedUrl: (url: string) => string | undefined;
readonly type: "google_calendar";
readonly width: 720;
}, {
readonly doesResize: true;
readonly fromEmbedUrl: (url: string) => string | undefined;
readonly height: 500;
readonly hostnames: readonly ["docs.google.*"];
readonly minHeight: 360;
readonly minWidth: 460;
readonly title: "Google Slides";
readonly toEmbedUrl: (url: string) => string | undefined;
readonly type: "google_slides";
readonly width: 720;
}, {
readonly doesResize: true;
readonly fromEmbedUrl: (url: string) => string | undefined;
readonly height: 500;
readonly hostnames: readonly ["gist.github.com"];
readonly title: "GitHub Gist";
readonly toEmbedUrl: (url: string) => string | undefined;
readonly type: "github_gist";
readonly width: 720;
}, {
readonly doesResize: true;
readonly fromEmbedUrl: (url: string) => string | undefined;
readonly height: 500;
readonly hostnames: readonly ["replit.com"];
readonly title: "Replit";
readonly toEmbedUrl: (url: string) => string | undefined;
readonly type: "replit";
readonly width: 720;
}, {
readonly doesResize: true;
readonly fromEmbedUrl: (url: string) => string | undefined;
readonly height: 500;
readonly hostnames: readonly ["felt.com"];
readonly title: "Felt";
readonly toEmbedUrl: (url: string) => string | undefined;
readonly type: "felt";
readonly width: 720;
}, {
readonly doesResize: true;
readonly fromEmbedUrl: (url: string) => string | undefined;
readonly height: 500;
readonly hostnames: readonly ["open.spotify.com"];
readonly minHeight: 500;
readonly overrideOutlineRadius: 12;
readonly title: "Spotify";
readonly toEmbedUrl: (url: string) => string | undefined;
readonly type: "spotify";
readonly width: 720;
}, {
readonly doesResize: true;
readonly fromEmbedUrl: (url: string) => string | undefined;
readonly height: 360;
readonly hostnames: readonly ["vimeo.com", "player.vimeo.com"];
readonly isAspectRatioLocked: true;
readonly title: "Vimeo";
readonly toEmbedUrl: (url: string) => string | undefined;
readonly type: "vimeo";
readonly width: 640;
}, {
readonly doesResize: true;
readonly fromEmbedUrl: (url: string) => string | undefined;
readonly height: 500;
readonly hostnames: readonly ["excalidraw.com"];
readonly isAspectRatioLocked: true;
readonly title: "Excalidraw";
readonly toEmbedUrl: (url: string) => string | undefined;
readonly type: "excalidraw";
readonly width: 720;
}, {
readonly backgroundColor: "#fff";
readonly doesResize: true;
readonly fromEmbedUrl: (url: string) => string | undefined;
readonly height: 500;
readonly hostnames: readonly ["observablehq.com"];
readonly isAspectRatioLocked: false;
readonly title: "Observable";
readonly toEmbedUrl: (url: string) => string | undefined;
readonly type: "observable";
readonly width: 720;
}];
// @public (undocumented)
export type EmbedDefinition = {
readonly backgroundColor?: string;
readonly doesResize: boolean;
readonly fromEmbedUrl: (url: string) => string | undefined;
readonly height: number;
readonly hostnames: readonly string[];
readonly instructionLink?: string;
readonly isAspectRatioLocked?: boolean;
readonly minHeight?: number;
readonly minWidth?: number;
readonly overrideOutlineRadius?: number;
readonly overridePermissions?: TLEmbedShapePermissions;
readonly title: string;
readonly toEmbedUrl: (url: string) => string | undefined;
readonly type: string;
readonly width: number;
};
// @internal (undocumented)
export const embedShapeMigrations: TLShapePropsMigrations;
// @public
export const embedShapePermissionDefaults: {
readonly 'allow-downloads-without-user-activation': false;
readonly 'allow-downloads': false;
readonly 'allow-forms': true;
readonly 'allow-modals': false;
readonly 'allow-orientation-lock': false;
readonly 'allow-pointer-lock': false;
readonly 'allow-popups-to-escape-sandbox': false;
readonly 'allow-popups': true;
readonly 'allow-presentation': false;
readonly 'allow-same-origin': true;
readonly 'allow-scripts': true;
readonly 'allow-storage-access-by-user-activation': false;
readonly 'allow-top-navigation-by-user-activation': false;
readonly 'allow-top-navigation': false;
};
// @public (undocumented)
export const embedShapeProps: {
h: T.Validator<number>;
url: T.Validator<string>;
w: T.Validator<number>;
};
// @public
export class EnumStyleProp<T> extends StyleProp<T> {
// @internal
constructor(id: string, defaultValue: T, values: readonly T[]);
// (undocumented)
readonly values: readonly T[];
}
// @internal (undocumented)
export const frameShapeMigrations: TLShapePropsMigrations;
// @public (undocumented)
export const frameShapeProps: {
h: T.Validator<number>;
name: T.Validator<string>;
w: T.Validator<number>;
};
// @public (undocumented)
export const GeoShapeGeoStyle: EnumStyleProp<"arrow-down" | "arrow-left" | "arrow-right" | "arrow-up" | "check-box" | "cloud" | "diamond" | "ellipse" | "hexagon" | "octagon" | "oval" | "pentagon" | "rectangle" | "rhombus-2" | "rhombus" | "star" | "trapezoid" | "triangle" | "x-box">;
// @internal (undocumented)
export const geoShapeMigrations: TLShapePropsMigrations;
// @public (undocumented)
export const geoShapeProps: {
align: EnumStyleProp<"end-legacy" | "end" | "middle-legacy" | "middle" | "start-legacy" | "start">;
color: EnumStyleProp<"black" | "blue" | "green" | "grey" | "light-blue" | "light-green" | "light-red" | "light-violet" | "orange" | "red" | "violet" | "white" | "yellow">;
dash: EnumStyleProp<"dashed" | "dotted" | "draw" | "solid">;
fill: EnumStyleProp<"none" | "pattern" | "semi" | "solid">;
font: EnumStyleProp<"draw" | "mono" | "sans" | "serif">;
geo: EnumStyleProp<"arrow-down" | "arrow-left" | "arrow-right" | "arrow-up" | "check-box" | "cloud" | "diamond" | "ellipse" | "hexagon" | "octagon" | "oval" | "pentagon" | "rectangle" | "rhombus-2" | "rhombus" | "star" | "trapezoid" | "triangle" | "x-box">;
growY: T.Validator<number>;
h: T.Validator<number>;
labelColor: EnumStyleProp<"black" | "blue" | "green" | "grey" | "light-blue" | "light-green" | "light-red" | "light-violet" | "orange" | "red" | "violet" | "white" | "yellow">;
size: EnumStyleProp<"l" | "m" | "s" | "xl">;
text: T.Validator<string>;
url: T.Validator<string>;
verticalAlign: EnumStyleProp<"end" | "middle" | "start">;
w: T.Validator<number>;
};
// @public (undocumented)
export function getDefaultColorTheme(opts: {
isDarkMode: boolean;
}): TLDefaultColorTheme;
// @public (undocumented)
export function getDefaultTranslationLocale(): TLLanguage['locale'];
// @internal (undocumented)
export function getShapePropKeysByStyle(props: Record<string, T.Validatable<any>>): Map<StyleProp<unknown>, string>;
// @internal (undocumented)
export const groupShapeMigrations: TLShapePropsMigrations;
// @internal (undocumented)
export const groupShapeProps: ShapeProps<TLGroupShape>;
// @internal (undocumented)
export const highlightShapeMigrations: TLShapePropsMigrations;
// @public (undocumented)
export const highlightShapeProps: {
color: EnumStyleProp<"black" | "blue" | "green" | "grey" | "light-blue" | "light-green" | "light-red" | "light-violet" | "orange" | "red" | "violet" | "white" | "yellow">;
isComplete: T.Validator<boolean>;
isPen: T.Validator<boolean>;
segments: T.ArrayOfValidator<{
points: VecModel[];
type: "free" | "straight";
} & {}>;
size: EnumStyleProp<"l" | "m" | "s" | "xl">;
};
// @internal (undocumented)
export function idValidator<Id extends RecordId<UnknownRecord>>(prefix: Id['__type__']['typeName']): T.Validator<Id>;
// @internal (undocumented)
export const imageShapeMigrations: TLShapePropsMigrations;
// @public (undocumented)
export const imageShapeProps: {
assetId: T.Validator<TLAssetId | null>;
crop: T.Validator<({
bottomRight: VecModel;
topLeft: VecModel;
} & {}) | null>;
h: T.Validator<number>;
playing: T.Validator<boolean>;
url: T.Validator<string>;
w: T.Validator<number>;
};
// @public (undocumented)
export const InstancePageStateRecordType: RecordType<TLInstancePageState, "pageId">;
// @public (undocumented)
export const InstancePresenceRecordType: RecordType<TLInstancePresence, "currentPageId" | "userId" | "userName">;
// @public (undocumented)
export function isPageId(id: string): id is TLPageId;
// @public (undocumented)
export function isShape(record?: UnknownRecord): record is TLShape;
// @public (undocumented)
export function isShapeId(id?: string): id is TLShapeId;
// @public (undocumented)
export const LANGUAGES: readonly [{
readonly label: "Català";
readonly locale: "ca";
}, {
readonly label: "Čeština";
readonly locale: "cs";
}, {
readonly label: "Danish";
readonly locale: "da";
}, {
readonly label: "Deutsch";
readonly locale: "de";
}, {
readonly label: "English";
readonly locale: "en";
}, {
readonly label: "Español";
readonly locale: "es";
}, {
readonly label: "Français";
readonly locale: "fr";
}, {
readonly label: "Galego";
readonly locale: "gl";
}, {
readonly label: "Hrvatski";
readonly locale: "hr";
}, {
readonly label: "Italiano";
readonly locale: "it";
}, {
readonly label: "Magyar";
readonly locale: "hu";
}, {
readonly label: "Norwegian";
readonly locale: "no";
}, {
readonly label: "Polski";
readonly locale: "pl";
}, {
readonly label: "Português - Brasil";
readonly locale: "pt-br";
}, {
readonly label: "Português - Europeu";
readonly locale: "pt-pt";
}, {
readonly label: "Română";
readonly locale: "ro";
}, {
readonly label: "Russian";
readonly locale: "ru";
}, {
readonly label: "Slovenščina";
readonly locale: "sl";
}, {
readonly label: "Suomi";
readonly locale: "fi";
}, {
readonly label: "Svenska";
readonly locale: "sv";
}, {
readonly label: "Tiếng Việt";
readonly locale: "vi";
}, {
readonly label: "Türkçe";
readonly locale: "tr";
}, {
readonly label: "Ukrainian";
readonly locale: "uk";
}, {
readonly label: "עברית";
readonly locale: "he";
}, {
readonly label: "عربي";
readonly locale: "ar";
}, {
readonly label: "فارسی";
readonly locale: "fa";
}, {
readonly label: "کوردی";
readonly locale: "ku";
}, {
readonly label: "नेपाली";
readonly locale: "ne";
}, {
readonly label: "हिन्दी";
readonly locale: "hi-in";
}, {
readonly label: "తెలుగు";
readonly locale: "te";
}, {
readonly label: "ภาษาไทย";
readonly locale: "th";
}, {
readonly label: "မြန်မာစာ";
readonly locale: "my";
}, {
readonly label: "한국어";
readonly locale: "ko-kr";
}, {
readonly label: "日本語";
readonly locale: "ja";
}, {
readonly label: "简体中文";
readonly locale: "zh-cn";
}, {
readonly label: "繁體中文 (台灣)";
readonly locale: "zh-tw";
}];
// @internal (undocumented)
export const lineShapeMigrations: TLShapePropsMigrations;
// @public (undocumented)
export const lineShapeProps: {
color: EnumStyleProp<"black" | "blue" | "green" | "grey" | "light-blue" | "light-green" | "light-red" | "light-violet" | "orange" | "red" | "violet" | "white" | "yellow">;
dash: EnumStyleProp<"dashed" | "dotted" | "draw" | "solid">;
points: T.DictValidator<string, {
id: string;
index: IndexKey;
x: number;
y: number;
} & {}>;
size: EnumStyleProp<"l" | "m" | "s" | "xl">;
spline: EnumStyleProp<"cubic" | "line">;
};
// @public (undocumented)
export const LineShapeSplineStyle: EnumStyleProp<"cubic" | "line">;
// @internal (undocumented)
export const noteShapeMigrations: TLShapePropsMigrations;
// @public (undocumented)
export const noteShapeProps: {
align: EnumStyleProp<"end-legacy" | "end" | "middle-legacy" | "middle" | "start-legacy" | "start">;
color: EnumStyleProp<"black" | "blue" | "green" | "grey" | "light-blue" | "light-green" | "light-red" | "light-violet" | "orange" | "red" | "violet" | "white" | "yellow">;
font: EnumStyleProp<"draw" | "mono" | "sans" | "serif">;
fontSizeAdjustment: T.Validator<number>;
growY: T.Validator<number>;
size: EnumStyleProp<"l" | "m" | "s" | "xl">;
text: T.Validator<string>;
url: T.Validator<string>;
verticalAlign: EnumStyleProp<"end" | "middle" | "start">;
};
// @internal (undocumented)
export const opacityValidator: T.Validator<number>;
// @internal (undocumented)
export const pageIdValidator: T.Validator<TLPageId>;
// @public (undocumented)
export const PageRecordType: RecordType<TLPage, "index" | "name">;
// @public (undocumented)
export const parentIdValidator: T.Validator<TLParentId>;
// @public (undocumented)
export const PointerRecordType: RecordType<TLPointer, never>;
// @internal (undocumented)
export const rootShapeMigrations: MigrationSequence;
// @public (undocumented)
export type SchemaShapeInfo = {
meta?: Record<string, AnyValidator>;
migrations?: LegacyMigrations | MigrationSequence | TLShapePropsMigrations;
props?: Record<string, AnyValidator>;
};
// @internal (undocumented)
export const scribbleValidator: T.Validator<TLScribble>;
// @public (undocumented)
export const shapeIdValidator: T.Validator<TLShapeId>;
// @public (undocumented)
export type ShapeProps<Shape extends TLBaseShape<any, any>> = {
[K in keyof Shape['props']]: T.Validatable<Shape['props'][K]>;
};
// @public (undocumented)
export type ShapePropsType<Config extends Record<string, T.Validatable<any>>> = Expand<{
[K in keyof Config]: T.TypeOf<Config[K]>;
}>;
// @public
export class StyleProp<Type> implements T.Validatable<Type> {
// @internal
protected constructor(id: string, defaultValue: Type, type: T.Validatable<Type>);
// (undocumented)
readonly defaultValue: Type;
static define<Type>(uniqueId: string, options: {
defaultValue: Type;
type?: T.Validatable<Type>;
}): StyleProp<Type>;
static defineEnum<const Values extends readonly unknown[]>(uniqueId: string, options: {
defaultValue: Values[number];
values: Values;
}): EnumStyleProp<Values[number]>;
// (undocumented)
readonly id: string;
// (undocumented)
readonly type: T.Validatable<Type>;
// (undocumented)
validate(value: unknown): Type;
// (undocumented)
validateUsingKnownGoodVersion(prevValue: Type, newValue: unknown): Type;
}
// @public (undocumented)
export type StylePropValue<T extends StyleProp<any>> = T extends StyleProp<infer U> ? U : never;
// @internal (undocumented)
export const textShapeMigrations: TLShapePropsMigrations;
// @public (undocumented)
export const textShapeProps: {
align: EnumStyleProp<"end-legacy" | "end" | "middle-legacy" | "middle" | "start-legacy" | "start">;
autoSize: T.Validator<boolean>;
color: EnumStyleProp<"black" | "blue" | "green" | "grey" | "light-blue" | "light-green" | "light-red" | "light-violet" | "orange" | "red" | "violet" | "white" | "yellow">;
font: EnumStyleProp<"draw" | "mono" | "sans" | "serif">;
scale: T.Validator<number>;
size: EnumStyleProp<"l" | "m" | "s" | "xl">;
text: T.Validator<string>;
w: T.Validator<number>;
};
// @public
export const TL_CANVAS_UI_COLOR_TYPES: Set<"accent" | "black" | "laser" | "muted-1" | "selection-fill" | "selection-stroke" | "white">;
// @public (undocumented)
export type TLArrowShape = TLBaseShape<'arrow', TLArrowShapeProps>;
// @public (undocumented)
export type TLArrowShapeArrowheadStyle = T.TypeOf<typeof ArrowShapeArrowheadStartStyle>;
// @public (undocumented)
export type TLArrowShapeProps = ShapePropsType<typeof arrowShapeProps>;
// @public (undocumented)
export type TLArrowShapeTerminal = T.TypeOf<typeof ArrowShapeTerminal>;
// @public (undocumented)
export type TLAsset = TLBookmarkAsset | TLImageAsset | TLVideoAsset;
// @public (undocumented)
export type TLAssetId = RecordId<TLBaseAsset<any, any>>;
// @public (undocumented)
export type TLAssetPartial<T extends TLAsset = TLAsset> = T extends T ? {
id: TLAssetId;
meta?: Partial<T['meta']>;
props?: Partial<T['props']>;
type: T['type'];
} & Partial<Omit<T, 'id' | 'meta' | 'props' | 'type'>> : never;
// @public (undocumented)
export type TLAssetShape = Extract<TLShape, {
props: {
assetId: TLAssetId;
};
}>;
// @public (undocumented)
export interface TLBaseAsset<Type extends string, Props> extends BaseRecord<'asset', TLAssetId> {
// (undocumented)
meta: JsonObject;
// (undocumented)
props: Props;
// (undocumented)
type: Type;
}
// @public (undocumented)
export interface TLBaseShape<Type extends string, Props extends object> extends BaseRecord<'shape', TLShapeId> {
// (undocumented)
index: IndexKey;
// (undocumented)
isLocked: boolean;
// (undocumented)
meta: JsonObject;
// (undocumented)
opacity: TLOpacityType;
// (undocumented)
parentId: TLParentId;
// (undocumented)
props: Props;
// (undocumented)
rotation: number;
// (undocumented)
type: Type;
// (undocumented)
x: number;
// (undocumented)
y: number;
}
// @public
export type TLBookmarkAsset = TLBaseAsset<'bookmark', {
description: string;
image: string;
src: null | string;
title: string;
}>;
// @public (undocumented)
export type TLBookmarkShape = TLBaseShape<'bookmark', TLBookmarkShapeProps>;
// @public
export interface TLCamera extends BaseRecord<'camera', TLCameraId> {
// (undocumented)
meta: JsonObject;
// (undocumented)
x: number;
// (undocumented)
y: number;
// (undocumented)
z: number;
}
// @public
export type TLCameraId = RecordId<TLCamera>;
// @public
export type TLCanvasUiColor = SetValue<typeof TL_CANVAS_UI_COLOR_TYPES>;
// @public
export interface TLCursor {
// (undocumented)
rotation: number;
// (undocumented)
type: TLCursorType;
}
// @public
export type TLCursorType = SetValue<typeof TL_CURSOR_TYPES>;
// @public (undocumented)
export type TLDefaultColorStyle = T.TypeOf<typeof DefaultColorStyle>;
// @public (undocumented)
export type TLDefaultColorTheme = Expand<{
background: string;
id: 'dark' | 'light';
solid: string;
text: string;
} & Record<(typeof colors)[number], TLDefaultColorThemeColor>>;
// @public (undocumented)
export type TLDefaultColorThemeColor = {
highlight: {
p3: string;
srgb: string;
};
note: {
fill: string;
text: string;
};
pattern: string;
semi: string;
solid: string;
};
// @public (undocumented)
export type TLDefaultDashStyle = T.TypeOf<typeof DefaultDashStyle>;
// @public (undocumented)
export type TLDefaultFillStyle = T.TypeOf<typeof DefaultFillStyle>;
// @public (undocumented)
export type TLDefaultFontStyle = T.TypeOf<typeof DefaultFontStyle>;
// @public (undocumented)
export type TLDefaultHorizontalAlignStyle = T.TypeOf<typeof DefaultHorizontalAlignStyle>;
// @public
export type TLDefaultShape = TLArrowShape | TLBookmarkShape | TLDrawShape | TLEmbedShape | TLFrameShape | TLGeoShape | TLGroupShape | TLHighlightShape | TLImageShape | TLLineShape | TLNoteShape | TLTextShape | TLVideoShape;
// @public (undocumented)
export type TLDefaultSizeStyle = T.TypeOf<typeof DefaultSizeStyle>;
// @public (undocumented)
export type TLDefaultVerticalAlignStyle = T.TypeOf<typeof DefaultVerticalAlignStyle>;
// @public
export interface TLDocument extends BaseRecord<'document', RecordId<TLDocument>> {
// (undocumented)
gridSize: number;
// (undocumented)
meta: JsonObject;
// (undocumented)
name: string;
}
// @public (undocumented)
export const TLDOCUMENT_ID: RecordId<TLDocument>;
// @public (undocumented)
export type TLDrawShape = TLBaseShape<'draw', TLDrawShapeProps>;
// @public (undocumented)
export type TLDrawShapeSegment = T.TypeOf<typeof DrawShapeSegment>;
// @public (undocumented)
export type TLEmbedShape = TLBaseShape<'embed', TLEmbedShapeProps>;
// @public (undocumented)
export type TLEmbedShapePermissions = {
[K in keyof typeof embedShapePermissionDefaults]?: boolean;
};
// @public (undocumented)
export type TLFrameShape = TLBaseShape<'frame', TLFrameShapeProps>;
// @public (undocumented)
export type TLGeoShape = TLBaseShape<'geo', TLGeoShapeProps>;
// @public (undocumented)
export type TLGroupShape = TLBaseShape<'group', TLGroupShapeProps>;
// @public
export interface TLHandle {
// (undocumented)
canBind?: boolean;
// (undocumented)
canSnap?: boolean;
id: string;
// (undocumented)
index: IndexKey;
// (undocumented)
type: TLHandleType;
// (undocumented)
x: number;
// (undocumented)
y: number;
}
// @public
export type TLHandleType = SetValue<typeof TL_HANDLE_TYPES>;
// @public (undocumented)
export type TLHighlightShape = TLBaseShape<'highlight', TLHighlightShapeProps>;
// @public
export type TLImageAsset = TLBaseAsset<'image', {
h: number;
isAnimated: boolean;
mimeType: null | string;
name: string;
src: null | string;
w: number;
}>;
// @public (undocumented)
export type TLImageShape = TLBaseShape<'image', TLImageShapeProps>;
// @public (undocumented)
export type TLImageShapeCrop = T.TypeOf<typeof ImageShapeCrop>;
// @public (undocumented)
export type TLImageShapeProps = ShapePropsType<typeof imageShapeProps>;
// @public
export interface TLInstance extends BaseRecord<'instance', TLInstanceId> {
// (undocumented)
brush: BoxModel | null;
// (undocumented)
canMoveCamera: boolean;
// (undocumented)
chatMessage: string;
// (undocumented)
currentPageId: TLPageId;
// (undocumented)
cursor: TLCursor;
// (undocumented)
devicePixelRatio: number;
// (undocumented)
duplicateProps: {
offset: {
x: number;
y: number;
};
shapeIds: TLShapeId[];
} | null;
// (undocumented)
exportBackground: boolean;
// (undocumented)
followingUserId: null | string;
// (undocumented)
highlightedUserIds: string[];
// (undocumented)
insets: boolean[];
// (undocumented)
isChangingStyle: boolean;
// (undocumented)
isChatting: boolean;
isCoarsePointer: boolean;
// (undocumented)
isDebugMode: boolean;
// (undocumented)
isFocused: boolean;
// (undocumented)
isFocusMode: boolean;
// (undocumented)
isGridMode: boolean;
isHoveringCanvas: boolean | null;
// (undocumented)
isPenMode: boolean;
// (undocumented)
isReadonly: boolean;
// (undocumented)
isToolLocked: boolean;
// (undocumented)
meta: JsonObject;
// (undocumented)
opacityForNextShape: TLOpacityType;
// (undocumented)
openMenus: string[];
// (undocumented)
screenBounds: BoxModel;
// (undocumented)
scribbles: TLScribble[];
// (undocumented)
stylesForNextShape: Record<string, unknown>;
// (undocumented)
zoomBrush: BoxModel | null;
}
// @public (undocumented)
export const TLINSTANCE_ID: TLInstanceId;
// @public (undocumented)
export type TLInstanceId = RecordId<TLInstance>;
// @public
export interface TLInstancePageState extends BaseRecord<'instance_page_state', TLInstancePageStateId> {
// (undocumented)
croppingShapeId: null | TLShapeId;
// (undocumented)
editingShapeId: null | TLShapeId;
// (undocumented)
erasingShapeIds: TLShapeId[];
// (undocumented)
focusedGroupId: null | TLShapeId;
// (undocumented)
hintingShapeIds: TLShapeId[];
// (undocumented)
hoveredShapeId: null | TLShapeId;
// (undocumented)
meta: JsonObject;
// (undocumented)
pageId: RecordId<TLPage>;
// (undocumented)
selectedShapeIds: TLShapeId[];
}
// @public (undocumented)
export interface TLInstancePresence extends BaseRecord<'instance_presence', TLInstancePresenceID> {
// (undocumented)
brush: BoxModel | null;
// (undocumented)
camera: {
x: number;
y: number;
z: number;
};
// (undocumented)
chatMessage: string;
// (undocumented)
color: string;
// (undocumented)
currentPageId: TLPageId;
// (undocumented)
cursor: {
rotation: number;
type: TLCursor['type'];
x: number;
y: number;
};
// (undocumented)
followingUserId: null | string;
// (undocumented)
lastActivityTimestamp: number;
// (undocumented)
meta: JsonObject;
// (undocumented)
screenBounds: BoxModel;
// (undocumented)
scribbles: TLScribble[];
// (undocumented)
selectedShapeIds: TLShapeId[];
// (undocumented)
userId: string;
// (undocumented)
userName: string;
}
// @public (undocumented)
export type TLLanguage = (typeof LANGUAGES)[number];
// @public (undocumented)
export type TLLineShape = TLBaseShape<'line', TLLineShapeProps>;
// @public (undocumented)
export type TLNoteShape = TLBaseShape<'note', TLNoteShapeProps>;
// @public (undocumented)
export type TLOpacityType = number;
// @public
export interface TLPage extends BaseRecord<'page', TLPageId> {
// (undocumented)
index: IndexKey;
// (undocumented)
meta: JsonObject;
// (undocumented)
name: string;
}
// @public (undocumented)
export type TLPageId = RecordId<TLPage>;
// @public (undocumented)
export type TLParentId = TLPageId | TLShapeId;
// @public (undocumented)
export const TLPOINTER_ID: TLPointerId;
// @public (undocumented)
export type TLRecord = TLAsset | TLCamera | TLDocument | TLInstance | TLInstancePageState | TLInstancePresence | TLPage | TLPointer | TLShape;
// @public (undocumented)
export type TLSchema = StoreSchema<TLRecord, TLStoreProps>;
// @public
export type TLScribble = {
color: TLCanvasUiColor;
delay: number;
id: string;
opacity: number;
points: VecModel[];
shrink: number;
size: number;
state: SetValue<typeof TL_SCRIBBLE_STATES>;
taper: boolean;
};
// @public (undocumented)
export type TLSerializedStore = SerializedStore<TLRecord>;
// @public
export type TLShape = TLDefaultShape | TLUnknownShape;
// @public (undocumented)
export type TLShapeId = RecordId<TLUnknownShape>;
// @public (undocumented)
export type TLShapePartial<T extends TLShape = TLShape> = T extends T ? {
id: TLShapeId;
meta?: Partial<T['meta']>;
props?: Partial<T['props']>;
type: T['type'];
} & Partial<Omit<T, 'id' | 'meta' | 'props' | 'type'>> : never;
// @public (undocumented)
export type TLShapeProp = keyof TLShapeProps;
// @public (undocumented)
export type TLShapeProps = Identity<UnionToIntersection<TLDefaultShape['props']>>;
// @public (undocumented)
export type TLShapePropsMigrations = {
sequence: Array<{
readonly dependsOn: readonly MigrationId[];
} | {
readonly dependsOn?: MigrationId[];
readonly down?: ((props: any) => any) | typeof NO_DOWN_MIGRATION | typeof RETIRED_DOWN_MIGRATION;
readonly id: MigrationId;
readonly up: (props: any) => any;
}>;
};
// @public (undocumented)
export type TLStore = Store<TLRecord, TLStoreProps>;
// @public (undocumented)
export type TLStoreProps = {
defaultName: string;
};
// @public (undocumented)
export type TLStoreSchema = StoreSchema<TLRecord, TLStoreProps>;
// @public (undocumented)
export type TLStoreSnapshot = StoreSnapshot<TLRecord>;
// @public (undocumented)
export type TLTextShape = TLBaseShape<'text', TLTextShapeProps>;
// @public (undocumented)
export type TLTextShapeProps = ShapePropsType<typeof textShapeProps>;
// @public
export type TLUnknownShape = TLBaseShape<string, object>;
// @public
export type TLVideoAsset = TLBaseAsset<'video', {
h: number;
isAnimated: boolean;
mimeType: null | string;
name: string;
src: null | string;
w: number;
}>;
// @public (undocumented)
export type TLVideoShape = TLBaseShape<'video', TLVideoShapeProps>;
// @public
export interface VecModel {
// (undocumented)
x: number;
// (undocumented)
y: number;
// (undocumented)
z?: number;
}
// @public (undocumented)
export const vecModelValidator: T.Validator<VecModel>;
// @internal (undocumented)
export const videoShapeMigrations: TLShapePropsMigrations;
// @public (undocumented)
export const videoShapeProps: {
assetId: T.Validator<TLAssetId | null>;
h: T.Validator<number>;
playing: T.Validator<boolean>;
time: T.Validator<number>;
url: T.Validator<string>;
w: T.Validator<number>;
};
// (No @packageDocumentation comment for this package)
```