3bc72cb822
This PR adds some things that we need for the Project Name feature on tldraw.com. It should be reviewed alongside https://github.com/tldraw/tldraw-lite/pull/1814 ## Name Property This PR adds a `name` property to `TLDocument`. We use this to store a project's name. <img width="454" alt="Screenshot 2023-05-09 at 15 47 26" src="https://github.com/tldraw/tldraw/assets/15892272/f3be438e-aa0f-4dec-8f51-8dfd9f9d0ced"> ## Top Zone This PR adds a `topZone` area of the UI that we can add stuff to, similar to how `shareZone` works. It also adds an example to show where the `topZone` and `shareZone` are: <img width="1511" alt="Screenshot 2023-05-12 at 10 57 40" src="https://github.com/tldraw/tldraw/assets/15892272/f5e1cd33-017e-4aaf-bfee-4d85119e2974"> ## Breakpoints This PR change's the UI's breakpoints a little bit. It moves the action bar to the bottom a little bit earlier. (This gives us more space at the top for the project name). ![2023-05-12 at 11 08 26 - Fuchsia Bison](https://github.com/tldraw/tldraw/assets/15892272/34563cea-b1d1-47be-ac5e-5650ee0ba02d) ![2023-05-12 at 13 45 04 - Tan Mole](https://github.com/tldraw/tldraw/assets/15892272/ab190bd3-51d4-4a8b-88de-c72ab14bcba6) ## Input Blur This PR adds an `onBlur` parameter to `Input`. This was needed because 'clicking off' the input wasn't firing `onComplete` or `onCancel`. <img width="620" alt="Screenshot 2023-05-09 at 16 12 58" src="https://github.com/tldraw/tldraw/assets/15892272/3b28da74-0a74-4063-8053-e59e47027caf"> ## Create Project Name This PR adds an internal `createProjectName` property to `TldrawEditorConfig`. Similar to `derivePresenceState`, you can pass a custom function to it. It lets you control what gets used as the default project name. We use it to set different names in our local projects compared to shared projects. In the future, when we add more advanced project features, we could handle this better within the UI. <img width="454" alt="Screenshot 2023-05-09 at 15 47 26" src="https://github.com/tldraw/tldraw/assets/15892272/da9a4699-ac32-40d9-a97c-6c682acfac41"> ### Test Plan 1. Gradually reduce the width of the browser window. 2. Check that the actions menu jumps to the bottom before the style panel moves to the bottom. --- 1. In the examples app, open the `/zones` example. 2. Check that there's a 'top zone' at the top. - [ ] Unit Tests - [ ] Webdriver tests ### Release Note - [dev] Added a `topZone` area where you can put stuff. - [dev] Added a `name` property to `TLDocument` - and `app` methods for it. - [dev] Added an internal `createProjectName` config property for controlling the default project name. - [dev] Added an `onBlur` parameter to `Input`. - Moved the actions bar to the bottom on medium-sized screens. --------- Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
1405 lines
46 KiB
Markdown
1405 lines
46 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/tlstore';
|
|
import { ID } from '@tldraw/tlstore';
|
|
import { Migrations } from '@tldraw/tlstore';
|
|
import { RecordType } from '@tldraw/tlstore';
|
|
import { Signal } from 'signia';
|
|
import { Store } from '@tldraw/tlstore';
|
|
import { StoreSchema } from '@tldraw/tlstore';
|
|
import { StoreSchemaOptions } from '@tldraw/tlstore';
|
|
import { StoreSnapshot } from '@tldraw/tlstore';
|
|
import { T } from '@tldraw/tlvalidate';
|
|
import { UnknownRecord } from '@tldraw/tlstore';
|
|
|
|
// @internal (undocumented)
|
|
export const alignValidator: T.Validator<"end" | "middle" | "start">;
|
|
|
|
// @internal (undocumented)
|
|
export const arrowheadValidator: T.Validator<"arrow" | "bar" | "diamond" | "dot" | "inverted" | "none" | "pipe" | "square" | "triangle">;
|
|
|
|
// @public (undocumented)
|
|
export const arrowShapeTypeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const arrowShapeTypeValidator: T.Validator<TLArrowShape>;
|
|
|
|
// @public (undocumented)
|
|
export const arrowTerminalTypeValidator: T.Validator<TLArrowTerminal>;
|
|
|
|
// @internal (undocumented)
|
|
export const assetIdValidator: T.Validator<TLAssetId>;
|
|
|
|
// @public (undocumented)
|
|
export const AssetRecordType: RecordType<TLAsset, "props" | "type">;
|
|
|
|
// @public (undocumented)
|
|
export const assetTypeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const assetTypeValidator: T.Validator<TLAsset>;
|
|
|
|
// @public (undocumented)
|
|
export const bookmarkAssetMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const bookmarkAssetTypeValidator: T.Validator<TLBookmarkAsset>;
|
|
|
|
// @public (undocumented)
|
|
export const bookmarkShapeTypeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const bookmarkShapeTypeValidator: T.Validator<TLBookmarkShape>;
|
|
|
|
// @public (undocumented)
|
|
export interface Box2dModel {
|
|
// (undocumented)
|
|
h: number;
|
|
// (undocumented)
|
|
w: number;
|
|
// (undocumented)
|
|
x: number;
|
|
// (undocumented)
|
|
y: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export const CameraRecordType: RecordType<TLCamera, never>;
|
|
|
|
// @public (undocumented)
|
|
export const cameraTypeValidator: T.Validator<TLCamera>;
|
|
|
|
// @internal (undocumented)
|
|
export function CLIENT_FIXUP_SCRIPT(persistedStore: StoreSnapshot<TLRecord>): StoreSnapshot<TLRecord>;
|
|
|
|
// @internal (undocumented)
|
|
export const colorValidator: T.Validator<"black" | "blue" | "green" | "grey" | "light-blue" | "light-green" | "light-red" | "light-violet" | "orange" | "red" | "violet" | "yellow">;
|
|
|
|
// @public (undocumented)
|
|
export function createAssetValidator<Type extends string, Props extends object>(type: Type, props: T.Validator<Props>): T.ObjectValidator<{
|
|
id: TLAssetId;
|
|
typeName: 'asset';
|
|
type: Type;
|
|
props: Props;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export function createCustomShapeId(id: string): TLShapeId;
|
|
|
|
// @internal (undocumented)
|
|
export function createIntegrityChecker(store: TLStore): () => void;
|
|
|
|
// @internal (undocumented)
|
|
export const createPresenceStateDerivation: ($user: Signal<{
|
|
id: string;
|
|
color: string;
|
|
name: string;
|
|
}>) => (store: TLStore) => Signal<null | TLInstancePresence>;
|
|
|
|
// @public (undocumented)
|
|
export function createShapeId(): TLShapeId;
|
|
|
|
// @public (undocumented)
|
|
export function createShapeValidator<Type extends string, Props extends object>(type: Type, props: T.Validator<Props>): T.ObjectValidator<{
|
|
id: TLShapeId;
|
|
typeName: "shape";
|
|
x: number;
|
|
y: number;
|
|
rotation: number;
|
|
index: string;
|
|
parentId: TLParentId;
|
|
type: Type;
|
|
isLocked: boolean;
|
|
props: Props;
|
|
}>;
|
|
|
|
// @public
|
|
export function createTLSchema(opts?: {
|
|
customShapes: Record<string, SchemaShapeInfo>;
|
|
}): StoreSchema<TLRecord, TLStoreProps>;
|
|
|
|
// @public (undocumented)
|
|
export const cursorTypeValidator: T.Validator<string>;
|
|
|
|
// @public (undocumented)
|
|
export const cursorValidator: T.Validator<TLCursor>;
|
|
|
|
// @internal (undocumented)
|
|
export const dashValidator: T.Validator<"dashed" | "dotted" | "draw" | "solid">;
|
|
|
|
// @public (undocumented)
|
|
export const DocumentRecordType: RecordType<TLDocument, never>;
|
|
|
|
// @public (undocumented)
|
|
export const documentTypeValidator: T.Validator<TLDocument>;
|
|
|
|
// @public (undocumented)
|
|
export const drawShapeTypeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const drawShapeTypeValidator: T.Validator<TLDrawShape>;
|
|
|
|
// @public (undocumented)
|
|
export const EMBED_DEFINITIONS: readonly [{
|
|
readonly type: "tldraw";
|
|
readonly title: "tldraw";
|
|
readonly hostnames: readonly ["beta.tldraw.com", "lite.tldraw.com", "www.tldraw.com"];
|
|
readonly minWidth: 300;
|
|
readonly minHeight: 300;
|
|
readonly width: 720;
|
|
readonly height: 500;
|
|
readonly doesResize: true;
|
|
readonly toEmbedUrl: (url: string) => string | undefined;
|
|
readonly fromEmbedUrl: (url: string) => string | undefined;
|
|
}, {
|
|
readonly type: "codesandbox";
|
|
readonly title: "CodeSandbox";
|
|
readonly hostnames: readonly ["codesandbox.io"];
|
|
readonly minWidth: 300;
|
|
readonly minHeight: 300;
|
|
readonly width: 720;
|
|
readonly height: 500;
|
|
readonly doesResize: true;
|
|
readonly toEmbedUrl: (url: string) => string | undefined;
|
|
readonly fromEmbedUrl: (url: string) => string | undefined;
|
|
}, {
|
|
readonly type: "codepen";
|
|
readonly title: "Codepen";
|
|
readonly hostnames: readonly ["codepen.io"];
|
|
readonly minWidth: 300;
|
|
readonly minHeight: 300;
|
|
readonly width: 520;
|
|
readonly height: 400;
|
|
readonly doesResize: true;
|
|
readonly toEmbedUrl: (url: string) => string | undefined;
|
|
readonly fromEmbedUrl: (url: string) => string | undefined;
|
|
}, {
|
|
readonly type: "scratch";
|
|
readonly title: "Scratch";
|
|
readonly hostnames: readonly ["scratch.mit.edu"];
|
|
readonly width: 520;
|
|
readonly height: 400;
|
|
readonly doesResize: false;
|
|
readonly toEmbedUrl: (url: string) => string | undefined;
|
|
readonly fromEmbedUrl: (url: string) => string | undefined;
|
|
}, {
|
|
readonly type: "youtube";
|
|
readonly title: "YouTube";
|
|
readonly hostnames: readonly ["*.youtube.com", "youtube.com", "youtu.be"];
|
|
readonly width: 800;
|
|
readonly height: 450;
|
|
readonly doesResize: true;
|
|
readonly overridePermissions: {
|
|
readonly 'allow-presentation': true;
|
|
};
|
|
readonly isAspectRatioLocked: true;
|
|
readonly toEmbedUrl: (url: string) => string | undefined;
|
|
readonly fromEmbedUrl: (url: string) => string | undefined;
|
|
}, {
|
|
readonly type: "figma";
|
|
readonly title: "Figma";
|
|
readonly hostnames: readonly ["figma.com"];
|
|
readonly width: 720;
|
|
readonly height: 500;
|
|
readonly doesResize: true;
|
|
readonly toEmbedUrl: (url: string) => string | undefined;
|
|
readonly fromEmbedUrl: (url: string) => string | undefined;
|
|
}, {
|
|
readonly type: "google_maps";
|
|
readonly title: "Google Maps";
|
|
readonly hostnames: readonly ["google.*"];
|
|
readonly width: 720;
|
|
readonly height: 500;
|
|
readonly doesResize: true;
|
|
readonly toEmbedUrl: (url: string) => string | undefined;
|
|
readonly fromEmbedUrl: (url: string) => string | undefined;
|
|
}, {
|
|
readonly type: "google_calendar";
|
|
readonly title: "Google Calendar";
|
|
readonly hostnames: readonly ["calendar.google.*"];
|
|
readonly width: 720;
|
|
readonly height: 500;
|
|
readonly minWidth: 460;
|
|
readonly minHeight: 360;
|
|
readonly doesResize: true;
|
|
readonly instructionLink: "https://support.google.com/calendar/answer/41207?hl=en";
|
|
readonly toEmbedUrl: (url: string) => string | undefined;
|
|
readonly fromEmbedUrl: (url: string) => string | undefined;
|
|
}, {
|
|
readonly type: "google_slides";
|
|
readonly title: "Google Slides";
|
|
readonly hostnames: readonly ["docs.google.*"];
|
|
readonly width: 720;
|
|
readonly height: 500;
|
|
readonly minWidth: 460;
|
|
readonly minHeight: 360;
|
|
readonly doesResize: true;
|
|
readonly toEmbedUrl: (url: string) => string | undefined;
|
|
readonly fromEmbedUrl: (url: string) => string | undefined;
|
|
}, {
|
|
readonly type: "github_gist";
|
|
readonly title: "GitHub Gist";
|
|
readonly hostnames: readonly ["gist.github.com"];
|
|
readonly width: 720;
|
|
readonly height: 500;
|
|
readonly doesResize: true;
|
|
readonly toEmbedUrl: (url: string) => string | undefined;
|
|
readonly fromEmbedUrl: (url: string) => string | undefined;
|
|
}, {
|
|
readonly type: "replit";
|
|
readonly title: "Replit";
|
|
readonly hostnames: readonly ["replit.com"];
|
|
readonly width: 720;
|
|
readonly height: 500;
|
|
readonly doesResize: true;
|
|
readonly toEmbedUrl: (url: string) => string | undefined;
|
|
readonly fromEmbedUrl: (url: string) => string | undefined;
|
|
}, {
|
|
readonly type: "felt";
|
|
readonly title: "Felt";
|
|
readonly hostnames: readonly ["felt.com"];
|
|
readonly width: 720;
|
|
readonly height: 500;
|
|
readonly doesResize: true;
|
|
readonly toEmbedUrl: (url: string) => string | undefined;
|
|
readonly fromEmbedUrl: (url: string) => string | undefined;
|
|
}, {
|
|
readonly type: "spotify";
|
|
readonly title: "Spotify";
|
|
readonly hostnames: readonly ["open.spotify.com"];
|
|
readonly width: 720;
|
|
readonly height: 500;
|
|
readonly minHeight: 500;
|
|
readonly overrideOutlineRadius: 12;
|
|
readonly doesResize: true;
|
|
readonly toEmbedUrl: (url: string) => string | undefined;
|
|
readonly fromEmbedUrl: (url: string) => string | undefined;
|
|
}, {
|
|
readonly type: "vimeo";
|
|
readonly title: "Vimeo";
|
|
readonly hostnames: readonly ["vimeo.com", "player.vimeo.com"];
|
|
readonly width: 640;
|
|
readonly height: 360;
|
|
readonly doesResize: true;
|
|
readonly isAspectRatioLocked: true;
|
|
readonly toEmbedUrl: (url: string) => string | undefined;
|
|
readonly fromEmbedUrl: (url: string) => string | undefined;
|
|
}, {
|
|
readonly type: "excalidraw";
|
|
readonly title: "Excalidraw";
|
|
readonly hostnames: readonly ["excalidraw.com"];
|
|
readonly width: 720;
|
|
readonly height: 500;
|
|
readonly doesResize: true;
|
|
readonly isAspectRatioLocked: true;
|
|
readonly toEmbedUrl: (url: string) => string | undefined;
|
|
readonly fromEmbedUrl: (url: string) => string | undefined;
|
|
}, {
|
|
readonly type: "observable";
|
|
readonly title: "Observable";
|
|
readonly hostnames: readonly ["observablehq.com"];
|
|
readonly width: 720;
|
|
readonly height: 500;
|
|
readonly doesResize: true;
|
|
readonly isAspectRatioLocked: false;
|
|
readonly backgroundColor: "#fff";
|
|
readonly toEmbedUrl: (url: string) => string | undefined;
|
|
readonly fromEmbedUrl: (url: string) => string | undefined;
|
|
}];
|
|
|
|
// @public (undocumented)
|
|
export type EmbedDefinition = {
|
|
readonly type: string;
|
|
readonly title: string;
|
|
readonly hostnames: readonly string[];
|
|
readonly minWidth?: number;
|
|
readonly minHeight?: number;
|
|
readonly width: number;
|
|
readonly height: number;
|
|
readonly doesResize: boolean;
|
|
readonly isAspectRatioLocked?: boolean;
|
|
readonly overridePermissions?: TLEmbedShapePermissions;
|
|
readonly instructionLink?: string;
|
|
readonly backgroundColor?: string;
|
|
readonly overrideOutlineRadius?: number;
|
|
readonly toEmbedUrl: (url: string) => string | undefined;
|
|
readonly fromEmbedUrl: (url: string) => string | undefined;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export const embedShapeTypeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const embedShapeTypeValidator: T.Validator<TLEmbedShape>;
|
|
|
|
// @internal (undocumented)
|
|
export const fillValidator: T.Validator<"none" | "pattern" | "semi" | "solid">;
|
|
|
|
// @internal (undocumented)
|
|
export function fixupRecord(oldRecord: TLRecord): {
|
|
record: any;
|
|
issues: string[];
|
|
};
|
|
|
|
// @internal (undocumented)
|
|
export const fontValidator: T.Validator<"draw" | "mono" | "sans" | "serif">;
|
|
|
|
// @public (undocumented)
|
|
export const frameShapeTypeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const frameShapeTypeValidator: T.Validator<TLFrameShape>;
|
|
|
|
// @public (undocumented)
|
|
export const geoShapeTypeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const geoShapeTypeValidator: T.Validator<TLGeoShape>;
|
|
|
|
// @internal (undocumented)
|
|
export const geoValidator: T.Validator<"arrow-down" | "arrow-left" | "arrow-right" | "arrow-up" | "check-box" | "diamond" | "ellipse" | "hexagon" | "octagon" | "oval" | "pentagon" | "rectangle" | "rhombus-2" | "rhombus" | "star" | "trapezoid" | "triangle" | "x-box">;
|
|
|
|
// @public (undocumented)
|
|
export function getDefaultTranslationLocale(): TLTranslationLocale;
|
|
|
|
// @public (undocumented)
|
|
export const groupShapeTypeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const groupShapeTypeValidator: T.Validator<TLGroupShape>;
|
|
|
|
// @public (undocumented)
|
|
export const handleTypeValidator: T.Validator<TLHandle>;
|
|
|
|
// @public (undocumented)
|
|
export const highlightShapeTypeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const highlightShapeTypeValidator: T.Validator<TLHighlightShape>;
|
|
|
|
// @public (undocumented)
|
|
export const iconShapeTypeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const iconShapeTypeValidator: T.Validator<TLIconShape>;
|
|
|
|
// @internal (undocumented)
|
|
export const iconValidator: T.Validator<"activity" | "airplay" | "alert-circle" | "alert-octagon" | "alert-triangle" | "align-center" | "align-justify" | "align-left" | "align-right" | "anchor" | "aperture" | "archive" | "arrow-down-circle" | "arrow-down-left" | "arrow-down-right" | "arrow-down" | "arrow-left-circle" | "arrow-left" | "arrow-right-circle" | "arrow-right" | "arrow-up-circle" | "arrow-up-left" | "arrow-up-right" | "arrow-up" | "at-sign" | "award" | "bar-chart-2" | "bar-chart" | "battery-charging" | "battery" | "bell-off" | "bell" | "bluetooth" | "bold" | "book-open" | "book" | "bookmark" | "briefcase" | "calendar" | "camera-off" | "camera" | "cast" | "check-circle" | "check-square" | "check" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "chevrons-down" | "chevrons-left" | "chevrons-right" | "chevrons-up" | "chrome" | "circle" | "clipboard" | "clock" | "cloud-drizzle" | "cloud-lightning" | "cloud-off" | "cloud-rain" | "cloud-snow" | "cloud" | "codepen" | "codesandbox" | "coffee" | "columns" | "command" | "compass" | "copy" | "corner-down-left" | "corner-down-right" | "corner-left-down" | "corner-left-up" | "corner-right-down" | "corner-right-up" | "corner-up-left" | "corner-up-right" | "cpu" | "credit-card" | "crop" | "crosshair" | "database" | "delete" | "disc" | "divide-circle" | "divide-square" | "divide" | "dollar-sign" | "download-cloud" | "download" | "dribbble" | "droplet" | "edit-2" | "edit-3" | "edit" | "external-link" | "eye-off" | "eye" | "facebook" | "fast-forward" | "feather" | "figma" | "file-minus" | "file-plus" | "file-text" | "file" | "film" | "filter" | "flag" | "folder-minus" | "folder-plus" | "folder" | "framer" | "frown" | "geo" | "gift" | "git-branch" | "git-commit" | "git-merge" | "git-pull-request" | "github" | "gitlab" | "globe" | "grid" | "hard-drive" | "hash" | "headphones" | "heart" | "help-circle" | "hexagon" | "home" | "image" | "inbox" | "info" | "instagram" | "italic" | "key" | "layers" | "layout" | "life-buoy" | "link-2" | "link" | "linkedin" | "list" | "loader" | "lock" | "log-in" | "log-out" | "mail" | "map-pin" | "map" | "maximize-2" | "maximize" | "meh" | "menu" | "message-circle" | "message-square" | "mic-off" | "mic" | "minimize-2" | "minimize" | "minus-circle" | "minus-square" | "minus" | "monitor" | "moon" | "more-horizontal" | "more-vertical" | "mouse-pointer" | "move" | "music" | "navigation-2" | "navigation" | "octagon" | "package" | "paperclip" | "pause-circle" | "pause" | "pen-tool" | "percent" | "phone-call" | "phone-forwarded" | "phone-incoming" | "phone-missed" | "phone-off" | "phone-outgoing" | "phone" | "pie-chart" | "play-circle" | "play" | "plus-circle" | "plus-square" | "plus" | "pocket" | "power" | "printer" | "radio" | "refresh-ccw" | "refresh-cw" | "repeat" | "rewind" | "rotate-ccw" | "rotate-cw" | "rss" | "save" | "scissors" | "search" | "send" | "server" | "settings" | "share-2" | "share" | "shield-off" | "shield" | "shopping-bag" | "shopping-cart" | "shuffle" | "sidebar" | "skip-back" | "skip-forward" | "slack" | "slash" | "sliders" | "smartphone" | "smile" | "speaker" | "square" | "star" | "stop-circle" | "sun" | "sunrise" | "sunset" | "table" | "tablet" | "tag" | "target" | "terminal" | "thermometer" | "thumbs-down" | "thumbs-up" | "toggle-left" | "toggle-right" | "tool" | "trash-2" | "trash" | "trello" | "trending-down" | "trending-up" | "triangle" | "truck" | "tv" | "twitch" | "twitter" | "type" | "umbrella" | "underline" | "unlock" | "upload-cloud" | "upload" | "user-check" | "user-minus" | "user-plus" | "user-x" | "user" | "users" | "video-off" | "video" | "voicemail" | "volume-1" | "volume-2" | "volume-x" | "volume" | "watch" | "wifi-off" | "wifi" | "wind" | "x-circle" | "x-octagon" | "x-square" | "x" | "youtube" | "zap-off" | "zap" | "zoom-in" | "zoom-out">;
|
|
|
|
// @internal (undocumented)
|
|
export function idValidator<Id extends ID<UnknownRecord>>(prefix: Id['__type__']['typeName']): T.Validator<Id>;
|
|
|
|
// @public (undocumented)
|
|
export const imageAssetMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const imageAssetTypeValidator: T.Validator<TLImageAsset>;
|
|
|
|
// @public (undocumented)
|
|
export const imageShapeTypeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const imageShapeTypeValidator: T.Validator<TLImageShape>;
|
|
|
|
// @internal (undocumented)
|
|
export const instanceIdValidator: T.Validator<TLInstanceId>;
|
|
|
|
// @public (undocumented)
|
|
export const instancePageStateMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const InstancePageStateRecordType: RecordType<TLInstancePageState, "cameraId" | "instanceId" | "pageId">;
|
|
|
|
// @public (undocumented)
|
|
export const instancePageStateTypeValidator: T.Validator<TLInstancePageState>;
|
|
|
|
// @public (undocumented)
|
|
export const InstancePresenceRecordType: RecordType<TLInstancePresence, "currentPageId" | "instanceId" | "userId" | "userName">;
|
|
|
|
// @public (undocumented)
|
|
export const InstanceRecordType: RecordType<TLInstance, "currentPageId">;
|
|
|
|
// @public (undocumented)
|
|
export const instanceTypeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const instanceTypeValidator: T.Validator<TLInstance>;
|
|
|
|
// @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 lineShapeTypeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const lineShapeTypeValidator: T.Validator<TLLineShape>;
|
|
|
|
// @public (undocumented)
|
|
export const noteShapeTypeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const noteShapeTypeValidator: T.Validator<TLNoteShape>;
|
|
|
|
// @public (undocumented)
|
|
export const onValidationFailure: StoreSchemaOptions<TLRecord, TLStoreProps>['onValidationFailure'];
|
|
|
|
// @internal (undocumented)
|
|
export const opacityValidator: T.Validator<"0.1" | "0.25" | "0.5" | "0.75" | "1">;
|
|
|
|
// @internal (undocumented)
|
|
export const pageIdValidator: T.Validator<TLPageId>;
|
|
|
|
// @public (undocumented)
|
|
export const PageRecordType: RecordType<TLPage, "index" | "name">;
|
|
|
|
// @public (undocumented)
|
|
export const pageTypeValidator: T.Validator<TLPage>;
|
|
|
|
// @internal (undocumented)
|
|
export const parentIdValidator: T.Validator<TLParentId>;
|
|
|
|
// @public (undocumented)
|
|
export const PointerRecordType: RecordType<TLPointer, never>;
|
|
|
|
// @public (undocumented)
|
|
export const pointerTypeValidator: T.Validator<TLPointer>;
|
|
|
|
// @internal (undocumented)
|
|
export const rootShapeTypeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export type SchemaShapeInfo = {
|
|
migrations?: Migrations;
|
|
validator?: {
|
|
validate: (record: any) => any;
|
|
};
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export const scribbleTypeValidator: T.Validator<TLScribble>;
|
|
|
|
// @public (undocumented)
|
|
export type SetValue<T extends Set<any>> = T extends Set<infer U> ? U : never;
|
|
|
|
// @internal (undocumented)
|
|
export const shapeIdValidator: T.Validator<TLShapeId>;
|
|
|
|
// @internal (undocumented)
|
|
export const sizeValidator: T.Validator<"l" | "m" | "s" | "xl">;
|
|
|
|
// @public (undocumented)
|
|
export type SmooshedUnionObject<T> = {
|
|
[K in T extends infer P ? keyof P : never]: T extends infer P ? K extends keyof P ? P[K] : never : never;
|
|
};
|
|
|
|
// @internal (undocumented)
|
|
export const splineValidator: T.Validator<"cubic" | "line">;
|
|
|
|
// @public (undocumented)
|
|
export const storeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const textShapeTypeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const textShapeTypeValidator: T.Validator<TLTextShape>;
|
|
|
|
// @public (undocumented)
|
|
export const TL_ALIGN_TYPES: Set<"end" | "middle" | "start">;
|
|
|
|
// @public (undocumented)
|
|
export const TL_ARROW_TERMINAL_TYPE: Set<"binding" | "point">;
|
|
|
|
// @public (undocumented)
|
|
export const TL_ARROWHEAD_TYPES: Set<"arrow" | "bar" | "diamond" | "dot" | "inverted" | "none" | "pipe" | "square" | "triangle">;
|
|
|
|
// @public (undocumented)
|
|
export const TL_COLOR_TYPES: Set<"black" | "blue" | "green" | "grey" | "light-blue" | "light-green" | "light-red" | "light-violet" | "orange" | "red" | "violet" | "yellow">;
|
|
|
|
// @public (undocumented)
|
|
export const TL_CURSOR_TYPES: Set<string>;
|
|
|
|
// @public (undocumented)
|
|
export const TL_DASH_TYPES: Set<"dashed" | "dotted" | "draw" | "solid">;
|
|
|
|
// @public (undocumented)
|
|
export const TL_DRAW_SHAPE_SEGMENT_TYPE: Set<"free" | "straight">;
|
|
|
|
// @public (undocumented)
|
|
export const TL_FILL_TYPES: Set<"none" | "pattern" | "semi" | "solid">;
|
|
|
|
// @public (undocumented)
|
|
export const TL_FONT_TYPES: Set<"draw" | "mono" | "sans" | "serif">;
|
|
|
|
// @public (undocumented)
|
|
export const TL_GEO_TYPES: Set<"arrow-down" | "arrow-left" | "arrow-right" | "arrow-up" | "check-box" | "diamond" | "ellipse" | "hexagon" | "octagon" | "oval" | "pentagon" | "rectangle" | "rhombus-2" | "rhombus" | "star" | "trapezoid" | "triangle" | "x-box">;
|
|
|
|
// @public (undocumented)
|
|
export const TL_HANDLE_TYPES: Set<"create" | "vertex" | "virtual">;
|
|
|
|
// @public (undocumented)
|
|
export const TL_ICON_TYPES: Set<"activity" | "airplay" | "alert-circle" | "alert-octagon" | "alert-triangle" | "align-center" | "align-justify" | "align-left" | "align-right" | "anchor" | "aperture" | "archive" | "arrow-down-circle" | "arrow-down-left" | "arrow-down-right" | "arrow-down" | "arrow-left-circle" | "arrow-left" | "arrow-right-circle" | "arrow-right" | "arrow-up-circle" | "arrow-up-left" | "arrow-up-right" | "arrow-up" | "at-sign" | "award" | "bar-chart-2" | "bar-chart" | "battery-charging" | "battery" | "bell-off" | "bell" | "bluetooth" | "bold" | "book-open" | "book" | "bookmark" | "briefcase" | "calendar" | "camera-off" | "camera" | "cast" | "check-circle" | "check-square" | "check" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "chevrons-down" | "chevrons-left" | "chevrons-right" | "chevrons-up" | "chrome" | "circle" | "clipboard" | "clock" | "cloud-drizzle" | "cloud-lightning" | "cloud-off" | "cloud-rain" | "cloud-snow" | "cloud" | "codepen" | "codesandbox" | "coffee" | "columns" | "command" | "compass" | "copy" | "corner-down-left" | "corner-down-right" | "corner-left-down" | "corner-left-up" | "corner-right-down" | "corner-right-up" | "corner-up-left" | "corner-up-right" | "cpu" | "credit-card" | "crop" | "crosshair" | "database" | "delete" | "disc" | "divide-circle" | "divide-square" | "divide" | "dollar-sign" | "download-cloud" | "download" | "dribbble" | "droplet" | "edit-2" | "edit-3" | "edit" | "external-link" | "eye-off" | "eye" | "facebook" | "fast-forward" | "feather" | "figma" | "file-minus" | "file-plus" | "file-text" | "file" | "film" | "filter" | "flag" | "folder-minus" | "folder-plus" | "folder" | "framer" | "frown" | "geo" | "gift" | "git-branch" | "git-commit" | "git-merge" | "git-pull-request" | "github" | "gitlab" | "globe" | "grid" | "hard-drive" | "hash" | "headphones" | "heart" | "help-circle" | "hexagon" | "home" | "image" | "inbox" | "info" | "instagram" | "italic" | "key" | "layers" | "layout" | "life-buoy" | "link-2" | "link" | "linkedin" | "list" | "loader" | "lock" | "log-in" | "log-out" | "mail" | "map-pin" | "map" | "maximize-2" | "maximize" | "meh" | "menu" | "message-circle" | "message-square" | "mic-off" | "mic" | "minimize-2" | "minimize" | "minus-circle" | "minus-square" | "minus" | "monitor" | "moon" | "more-horizontal" | "more-vertical" | "mouse-pointer" | "move" | "music" | "navigation-2" | "navigation" | "octagon" | "package" | "paperclip" | "pause-circle" | "pause" | "pen-tool" | "percent" | "phone-call" | "phone-forwarded" | "phone-incoming" | "phone-missed" | "phone-off" | "phone-outgoing" | "phone" | "pie-chart" | "play-circle" | "play" | "plus-circle" | "plus-square" | "plus" | "pocket" | "power" | "printer" | "radio" | "refresh-ccw" | "refresh-cw" | "repeat" | "rewind" | "rotate-ccw" | "rotate-cw" | "rss" | "save" | "scissors" | "search" | "send" | "server" | "settings" | "share-2" | "share" | "shield-off" | "shield" | "shopping-bag" | "shopping-cart" | "shuffle" | "sidebar" | "skip-back" | "skip-forward" | "slack" | "slash" | "sliders" | "smartphone" | "smile" | "speaker" | "square" | "star" | "stop-circle" | "sun" | "sunrise" | "sunset" | "table" | "tablet" | "tag" | "target" | "terminal" | "thermometer" | "thumbs-down" | "thumbs-up" | "toggle-left" | "toggle-right" | "tool" | "trash-2" | "trash" | "trello" | "trending-down" | "trending-up" | "triangle" | "truck" | "tv" | "twitch" | "twitter" | "type" | "umbrella" | "underline" | "unlock" | "upload-cloud" | "upload" | "user-check" | "user-minus" | "user-plus" | "user-x" | "user" | "users" | "video-off" | "video" | "voicemail" | "volume-1" | "volume-2" | "volume-x" | "volume" | "watch" | "wifi-off" | "wifi" | "wind" | "x-circle" | "x-octagon" | "x-square" | "x" | "youtube" | "zap-off" | "zap" | "zoom-in" | "zoom-out">;
|
|
|
|
// @public (undocumented)
|
|
export const TL_OPACITY_TYPES: Set<"0.1" | "0.25" | "0.5" | "0.75" | "1">;
|
|
|
|
// @public (undocumented)
|
|
export const TL_SCRIBBLE_STATES: Set<"active" | "paused" | "starting" | "stopping">;
|
|
|
|
// @public (undocumented)
|
|
export const TL_SIZE_TYPES: Set<"l" | "m" | "s" | "xl">;
|
|
|
|
// @public (undocumented)
|
|
export const TL_SPLINE_TYPES: Set<"cubic" | "line">;
|
|
|
|
// @public (undocumented)
|
|
export const TL_STYLE_TYPES: Set<"align" | "arrowheadEnd" | "arrowheadStart" | "color" | "dash" | "fill" | "font" | "geo" | "icon" | "labelColor" | "opacity" | "size" | "spline" | "verticalAlign">;
|
|
|
|
// @public (undocumented)
|
|
export const TL_UI_COLOR_TYPES: Set<"accent" | "black" | "laser" | "muted-1" | "selection-fill" | "selection-stroke" | "white">;
|
|
|
|
// @public (undocumented)
|
|
export interface TLAlignStyle extends TLBaseStyle {
|
|
// (undocumented)
|
|
id: TLAlignType;
|
|
// (undocumented)
|
|
type: 'align';
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface TLAlignStyle extends TLBaseStyle {
|
|
// (undocumented)
|
|
id: TLAlignType;
|
|
// (undocumented)
|
|
type: 'align';
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLAlignType = SetValue<typeof TL_ALIGN_TYPES>;
|
|
|
|
// @public (undocumented)
|
|
export interface TLArrowheadEndStyle extends TLBaseStyle {
|
|
// (undocumented)
|
|
id: TLArrowheadType;
|
|
// (undocumented)
|
|
type: 'arrowheadEnd';
|
|
}
|
|
|
|
// @public
|
|
export interface TLArrowHeadModel {
|
|
// (undocumented)
|
|
id: string;
|
|
// (undocumented)
|
|
type: TLArrowheadType;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface TLArrowheadStartStyle extends TLBaseStyle {
|
|
// (undocumented)
|
|
id: TLArrowheadType;
|
|
// (undocumented)
|
|
type: 'arrowheadStart';
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLArrowheadType = SetValue<typeof TL_ARROWHEAD_TYPES>;
|
|
|
|
// @public (undocumented)
|
|
export type TLArrowShape = TLBaseShape<'arrow', TLArrowShapeProps>;
|
|
|
|
// @public (undocumented)
|
|
export type TLArrowShapeProps = {
|
|
labelColor: TLColorType;
|
|
color: TLColorType;
|
|
fill: TLFillType;
|
|
dash: TLDashType;
|
|
size: TLSizeType;
|
|
opacity: TLOpacityType;
|
|
arrowheadStart: TLArrowheadType;
|
|
arrowheadEnd: TLArrowheadType;
|
|
font: TLFontType;
|
|
start: TLArrowTerminal;
|
|
end: TLArrowTerminal;
|
|
bend: number;
|
|
text: string;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLArrowTerminal = {
|
|
type: 'binding';
|
|
boundShapeId: TLShapeId;
|
|
normalizedAnchor: Vec2dModel;
|
|
isExact: boolean;
|
|
} | {
|
|
type: 'point';
|
|
x: number;
|
|
y: number;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLArrowTerminalType = SetValue<typeof TL_ARROW_TERMINAL_TYPE>;
|
|
|
|
// @public (undocumented)
|
|
export type TLAsset = TLBookmarkAsset | TLImageAsset | TLVideoAsset;
|
|
|
|
// @public (undocumented)
|
|
export type TLAssetId = ID<TLBaseAsset<any, any>>;
|
|
|
|
// @public (undocumented)
|
|
export type TLAssetPartial<T extends TLAsset = TLAsset> = T extends T ? {
|
|
id: TLAssetId;
|
|
type: T['type'];
|
|
props?: Partial<T['props']>;
|
|
} & Partial<Omit<T, 'id' | '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)
|
|
props: Props;
|
|
// (undocumented)
|
|
type: Type;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface TLBaseShape<Type extends string, Props extends object> extends BaseRecord<'shape', TLShapeId> {
|
|
// (undocumented)
|
|
index: string;
|
|
// (undocumented)
|
|
isLocked: boolean;
|
|
// (undocumented)
|
|
parentId: TLParentId;
|
|
// (undocumented)
|
|
props: Props;
|
|
// (undocumented)
|
|
rotation: number;
|
|
// (undocumented)
|
|
type: Type;
|
|
// (undocumented)
|
|
x: number;
|
|
// (undocumented)
|
|
y: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export interface TLBaseStyle {
|
|
// (undocumented)
|
|
icon: string;
|
|
// (undocumented)
|
|
type: TLStyleType;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLBookmarkAsset = TLBaseAsset<'bookmark', {
|
|
title: string;
|
|
description: string;
|
|
image: string;
|
|
src: null | string;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export type TLBookmarkShape = TLBaseShape<'bookmark', TLBookmarkShapeProps>;
|
|
|
|
// @public (undocumented)
|
|
export type TLBookmarkShapeProps = {
|
|
opacity: TLOpacityType;
|
|
w: number;
|
|
h: number;
|
|
assetId: null | TLAssetId;
|
|
url: string;
|
|
};
|
|
|
|
// @public
|
|
export interface TLCamera extends BaseRecord<'camera', TLCameraId> {
|
|
// (undocumented)
|
|
x: number;
|
|
// (undocumented)
|
|
y: number;
|
|
// (undocumented)
|
|
z: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLCameraId = ID<TLCamera>;
|
|
|
|
// @public (undocumented)
|
|
export interface TLColorStyle extends TLBaseStyle {
|
|
// (undocumented)
|
|
id: TLColorType;
|
|
// (undocumented)
|
|
type: 'color';
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLColorType = SetValue<typeof TL_COLOR_TYPES>;
|
|
|
|
// @public (undocumented)
|
|
export interface TLCursor {
|
|
// (undocumented)
|
|
color: TLUiColorType;
|
|
// (undocumented)
|
|
rotation: number;
|
|
// (undocumented)
|
|
type: TLCursorType;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLCursorType = SetValue<typeof TL_CURSOR_TYPES>;
|
|
|
|
// @public (undocumented)
|
|
export interface TLDashStyle extends TLBaseStyle {
|
|
// (undocumented)
|
|
id: TLDashType;
|
|
// (undocumented)
|
|
type: 'dash';
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLDashType = SetValue<typeof TL_DASH_TYPES>;
|
|
|
|
// @public
|
|
export type TLDefaultShape = TLArrowShape | TLBookmarkShape | TLDrawShape | TLEmbedShape | TLFrameShape | TLGeoShape | TLGroupShape | TLHighlightShape | TLIconShape | TLImageShape | TLLineShape | TLNoteShape | TLTextShape | TLVideoShape;
|
|
|
|
// @public
|
|
export interface TLDocument extends BaseRecord<'document', ID<TLDocument>> {
|
|
// (undocumented)
|
|
gridSize: number;
|
|
// (undocumented)
|
|
name: string;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export const TLDOCUMENT_ID: ID<TLDocument>;
|
|
|
|
// @public (undocumented)
|
|
export type TLDrawShape = TLBaseShape<'draw', TLDrawShapeProps>;
|
|
|
|
// @public (undocumented)
|
|
export type TLDrawShapeProps = {
|
|
color: TLColorType;
|
|
fill: TLFillType;
|
|
dash: TLDashType;
|
|
size: TLSizeType;
|
|
opacity: TLOpacityType;
|
|
segments: TLDrawShapeSegment[];
|
|
isComplete: boolean;
|
|
isClosed: boolean;
|
|
isPen: boolean;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLDrawShapeSegment = {
|
|
type: SetValue<typeof TL_DRAW_SHAPE_SEGMENT_TYPE>;
|
|
points: Vec2dModel[];
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLEmbedShape = TLBaseShape<'embed', TLEmbedShapeProps>;
|
|
|
|
// @public
|
|
export const tlEmbedShapePermissionDefaults: {
|
|
readonly 'allow-downloads-without-user-activation': false;
|
|
readonly 'allow-downloads': false;
|
|
readonly 'allow-modals': false;
|
|
readonly 'allow-orientation-lock': false;
|
|
readonly 'allow-pointer-lock': false;
|
|
readonly 'allow-popups': true;
|
|
readonly 'allow-popups-to-escape-sandbox': false;
|
|
readonly 'allow-presentation': false;
|
|
readonly 'allow-storage-access-by-user-activation': false;
|
|
readonly 'allow-top-navigation': false;
|
|
readonly 'allow-top-navigation-by-user-activation': false;
|
|
readonly 'allow-scripts': true;
|
|
readonly 'allow-same-origin': true;
|
|
readonly 'allow-forms': true;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLEmbedShapePermissionName = keyof typeof tlEmbedShapePermissionDefaults;
|
|
|
|
// @public (undocumented)
|
|
export type TLEmbedShapePermissions = {
|
|
[K in TLEmbedShapePermissionName]?: boolean;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLEmbedShapeProps = {
|
|
opacity: TLOpacityType;
|
|
w: number;
|
|
h: number;
|
|
url: string;
|
|
tmpOldUrl?: string;
|
|
doesResize: boolean;
|
|
overridePermissions?: TLEmbedShapePermissions;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export interface TLFillStyle extends TLBaseStyle {
|
|
// (undocumented)
|
|
id: TLFillType;
|
|
// (undocumented)
|
|
type: 'fill';
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLFillType = SetValue<typeof TL_FILL_TYPES>;
|
|
|
|
// @public (undocumented)
|
|
export interface TLFontStyle extends TLBaseStyle {
|
|
// (undocumented)
|
|
id: TLFontType;
|
|
// (undocumented)
|
|
type: 'font';
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLFontType = SetValue<typeof TL_FONT_TYPES>;
|
|
|
|
// @public (undocumented)
|
|
export type TLFrameShape = TLBaseShape<'frame', TLFrameShapeProps>;
|
|
|
|
// @public (undocumented)
|
|
export type TLFrameShapeProps = {
|
|
opacity: TLOpacityType;
|
|
w: number;
|
|
h: number;
|
|
name: string;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLGeoShape = TLBaseShape<'geo', TLGeoShapeProps>;
|
|
|
|
// @public (undocumented)
|
|
export type TLGeoShapeProps = {
|
|
geo: TLGeoType;
|
|
labelColor: TLColorType;
|
|
color: TLColorType;
|
|
fill: TLFillType;
|
|
dash: TLDashType;
|
|
size: TLSizeType;
|
|
opacity: TLOpacityType;
|
|
font: TLFontType;
|
|
align: TLAlignType;
|
|
verticalAlign: TLVerticalAlignType;
|
|
url: string;
|
|
w: number;
|
|
h: number;
|
|
text: string;
|
|
growY: number;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export interface TLGeoStyle extends TLBaseStyle {
|
|
// (undocumented)
|
|
id: TLGeoType;
|
|
// (undocumented)
|
|
type: 'geo';
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLGeoType = SetValue<typeof TL_GEO_TYPES>;
|
|
|
|
// @public (undocumented)
|
|
export type TLGroupShape = TLBaseShape<'group', TLGroupShapeProps>;
|
|
|
|
// @public (undocumented)
|
|
export type TLGroupShapeProps = {
|
|
opacity: TLOpacityType;
|
|
};
|
|
|
|
// @public
|
|
export interface TLHandle {
|
|
// (undocumented)
|
|
canBind?: boolean;
|
|
id: string;
|
|
// (undocumented)
|
|
index: string;
|
|
// (undocumented)
|
|
type: TLHandleType;
|
|
// (undocumented)
|
|
x: number;
|
|
// (undocumented)
|
|
y: number;
|
|
}
|
|
|
|
// @public
|
|
export interface TLHandlePartial {
|
|
x: number;
|
|
// (undocumented)
|
|
y: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLHandleType = SetValue<typeof TL_HANDLE_TYPES>;
|
|
|
|
// @public (undocumented)
|
|
export type TLHighlightShape = TLBaseShape<'highlight', TLHighlightShapeProps>;
|
|
|
|
// @public (undocumented)
|
|
export type TLHighlightShapeProps = {
|
|
color: TLColorType;
|
|
size: TLSizeType;
|
|
opacity: TLOpacityType;
|
|
segments: TLDrawShapeSegment[];
|
|
isComplete: boolean;
|
|
isPen: boolean;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLIconShape = TLBaseShape<'icon', TLIconShapeProps>;
|
|
|
|
// @public (undocumented)
|
|
export type TLIconShapeProps = {
|
|
size: TLSizeType;
|
|
icon: TLIconType;
|
|
dash: TLDashType;
|
|
color: TLColorType;
|
|
opacity: TLOpacityType;
|
|
scale: number;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export interface TLIconStyle extends TLBaseStyle {
|
|
// (undocumented)
|
|
id: TLIconType;
|
|
// (undocumented)
|
|
type: 'icon';
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLIconType = SetValue<typeof TL_ICON_TYPES>;
|
|
|
|
// @public (undocumented)
|
|
export type TLImageAsset = TLBaseAsset<'image', {
|
|
w: number;
|
|
h: number;
|
|
name: string;
|
|
isAnimated: boolean;
|
|
mimeType: null | string;
|
|
src: null | string;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export type TLImageCrop = {
|
|
topLeft: Vec2dModel;
|
|
bottomRight: Vec2dModel;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLImageShape = TLBaseShape<'image', TLImageShapeProps>;
|
|
|
|
// @public (undocumented)
|
|
export type TLImageShapeProps = {
|
|
opacity: TLOpacityType;
|
|
url: string;
|
|
playing: boolean;
|
|
w: number;
|
|
h: number;
|
|
assetId: null | TLAssetId;
|
|
crop: null | TLImageCrop;
|
|
};
|
|
|
|
// @public
|
|
export interface TLInstance extends BaseRecord<'instance', TLInstanceId> {
|
|
// (undocumented)
|
|
brush: Box2dModel | null;
|
|
// (undocumented)
|
|
currentPageId: TLPageId;
|
|
// (undocumented)
|
|
cursor: TLCursor;
|
|
// (undocumented)
|
|
exportBackground: boolean;
|
|
// (undocumented)
|
|
followingUserId: null | string;
|
|
// (undocumented)
|
|
isDebugMode: boolean;
|
|
// (undocumented)
|
|
isFocusMode: boolean;
|
|
// (undocumented)
|
|
isToolLocked: boolean;
|
|
// (undocumented)
|
|
propsForNextShape: TLInstancePropsForNextShape;
|
|
// (undocumented)
|
|
screenBounds: Box2dModel;
|
|
// (undocumented)
|
|
scribble: null | TLScribble;
|
|
// (undocumented)
|
|
zoomBrush: Box2dModel | null;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLInstanceId = ID<TLInstance>;
|
|
|
|
// @public
|
|
export interface TLInstancePageState extends BaseRecord<'instance_page_state', TLInstancePageStateId> {
|
|
// (undocumented)
|
|
cameraId: ID<TLCamera>;
|
|
// (undocumented)
|
|
croppingId: null | TLShapeId;
|
|
// (undocumented)
|
|
editingId: null | TLShapeId;
|
|
// (undocumented)
|
|
erasingIds: TLShapeId[];
|
|
// (undocumented)
|
|
focusLayerId: null | TLShapeId;
|
|
// (undocumented)
|
|
hintingIds: TLShapeId[];
|
|
// (undocumented)
|
|
hoveredId: null | TLShapeId;
|
|
// (undocumented)
|
|
instanceId: ID<TLInstance>;
|
|
// (undocumented)
|
|
pageId: ID<TLPage>;
|
|
// (undocumented)
|
|
selectedIds: TLShapeId[];
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLInstancePageStateId = ID<TLInstancePageState>;
|
|
|
|
// @public (undocumented)
|
|
export interface TLInstancePresence extends BaseRecord<'instance_presence', TLInstancePresenceID> {
|
|
// (undocumented)
|
|
brush: Box2dModel | null;
|
|
// (undocumented)
|
|
camera: {
|
|
x: number;
|
|
y: number;
|
|
z: number;
|
|
};
|
|
// (undocumented)
|
|
color: string;
|
|
// (undocumented)
|
|
currentPageId: TLPageId;
|
|
// (undocumented)
|
|
cursor: {
|
|
x: number;
|
|
y: number;
|
|
type: TLCursor['type'];
|
|
rotation: number;
|
|
};
|
|
// (undocumented)
|
|
followingUserId: null | string;
|
|
// (undocumented)
|
|
instanceId: TLInstanceId;
|
|
// (undocumented)
|
|
lastActivityTimestamp: number;
|
|
// (undocumented)
|
|
screenBounds: Box2dModel;
|
|
// (undocumented)
|
|
scribble: null | TLScribble;
|
|
// (undocumented)
|
|
selectedIds: TLShapeId[];
|
|
// (undocumented)
|
|
userId: string;
|
|
// (undocumented)
|
|
userName: string;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLInstancePropsForNextShape = Pick<TLShapeProps, TLStyleType>;
|
|
|
|
// @public (undocumented)
|
|
export type TLLineShape = TLBaseShape<'line', TLLineShapeProps>;
|
|
|
|
// @public (undocumented)
|
|
export type TLLineShapeProps = {
|
|
color: TLColorType;
|
|
dash: TLDashType;
|
|
size: TLSizeType;
|
|
opacity: TLOpacityType;
|
|
spline: TLSplineType;
|
|
handles: {
|
|
[key: string]: TLHandle;
|
|
};
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLNoteShape = TLBaseShape<'note', TLNoteShapeProps>;
|
|
|
|
// @public (undocumented)
|
|
export type TLNoteShapeProps = {
|
|
color: TLColorType;
|
|
size: TLSizeType;
|
|
font: TLFontType;
|
|
align: TLAlignType;
|
|
opacity: TLOpacityType;
|
|
growY: number;
|
|
url: string;
|
|
text: string;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLNullableShapeProps = {
|
|
[K in TLShapeProp]?: null | TLShapeProps[K];
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export interface TLOpacityStyle extends TLBaseStyle {
|
|
// (undocumented)
|
|
id: TLOpacityType;
|
|
// (undocumented)
|
|
type: 'opacity';
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLOpacityType = SetValue<typeof TL_OPACITY_TYPES>;
|
|
|
|
// @public
|
|
export interface TLPage extends BaseRecord<'page', TLPageId> {
|
|
// (undocumented)
|
|
index: string;
|
|
// (undocumented)
|
|
name: string;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLPageId = ID<TLPage>;
|
|
|
|
// @public (undocumented)
|
|
export type TLParentId = TLPageId | TLShapeId;
|
|
|
|
// @public
|
|
export interface TLPointer extends BaseRecord<'pointer', TLPointerId> {
|
|
// (undocumented)
|
|
lastActivityTimestamp: number;
|
|
// (undocumented)
|
|
x: number;
|
|
// (undocumented)
|
|
y: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export const TLPOINTER_ID: TLPointerId;
|
|
|
|
// @public (undocumented)
|
|
export type TLPointerId = ID<TLPointer>;
|
|
|
|
// @public (undocumented)
|
|
export type TLRecord = TLAsset | TLCamera | TLDocument | TLInstance | TLInstancePageState | TLInstancePresence | TLPage | TLPointer | TLShape | TLUserDocument;
|
|
|
|
// @public (undocumented)
|
|
export type TLScribble = {
|
|
points: Vec2dModel[];
|
|
size: number;
|
|
color: TLUiColorType;
|
|
opacity: number;
|
|
state: SetValue<typeof TL_SCRIBBLE_STATES>;
|
|
delay: number;
|
|
};
|
|
|
|
// @public
|
|
export type TLShape = TLDefaultShape | TLUnknownShape;
|
|
|
|
// @public (undocumented)
|
|
export type TLShapeId = ID<TLUnknownShape>;
|
|
|
|
// @public (undocumented)
|
|
export type TLShapePartial<T extends TLShape = TLShape> = T extends T ? {
|
|
id: TLShapeId;
|
|
type: T['type'];
|
|
props?: Partial<T['props']>;
|
|
} & Partial<Omit<T, 'id' | 'props' | 'type'>> : never;
|
|
|
|
// @public (undocumented)
|
|
export type TLShapeProp = keyof TLShapeProps;
|
|
|
|
// @public (undocumented)
|
|
export type TLShapeProps = SmooshedUnionObject<TLShape['props']>;
|
|
|
|
// @public (undocumented)
|
|
export interface TLSizeStyle extends TLBaseStyle {
|
|
// (undocumented)
|
|
id: TLSizeType;
|
|
// (undocumented)
|
|
type: 'size';
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLSizeType = SetValue<typeof TL_SIZE_TYPES>;
|
|
|
|
// @public (undocumented)
|
|
export type TLSplineType = SetValue<typeof TL_SPLINE_TYPES>;
|
|
|
|
// @public (undocumented)
|
|
export interface TLSplineTypeStyle extends TLBaseStyle {
|
|
// (undocumented)
|
|
id: TLSplineType;
|
|
// (undocumented)
|
|
type: 'spline';
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLStore = Store<TLRecord, TLStoreProps>;
|
|
|
|
// @public (undocumented)
|
|
export type TLStoreProps = {
|
|
instanceId: TLInstanceId;
|
|
documentId: typeof TLDOCUMENT_ID;
|
|
defaultName: string;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLStoreSchema = StoreSchema<TLRecord, TLStoreProps>;
|
|
|
|
// @public (undocumented)
|
|
export type TLStoreSnapshot = StoreSnapshot<TLRecord>;
|
|
|
|
// @public (undocumented)
|
|
export interface TLStyleCollections {
|
|
// (undocumented)
|
|
align: TLAlignStyle[];
|
|
// (undocumented)
|
|
arrowheadEnd: TLArrowheadEndStyle[];
|
|
// (undocumented)
|
|
arrowheadStart: TLArrowheadStartStyle[];
|
|
// (undocumented)
|
|
color: TLColorStyle[];
|
|
// (undocumented)
|
|
dash: TLDashStyle[];
|
|
// (undocumented)
|
|
fill: TLFillStyle[];
|
|
// (undocumented)
|
|
font: TLFontStyle[];
|
|
// (undocumented)
|
|
geo: TLGeoStyle[];
|
|
// (undocumented)
|
|
opacity: TLOpacityStyle[];
|
|
// (undocumented)
|
|
size: TLSizeStyle[];
|
|
// (undocumented)
|
|
spline: TLSplineTypeStyle[];
|
|
// (undocumented)
|
|
verticalAlign: TLVerticalAlignStyle[];
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLStyleItem = TLAlignStyle | TLColorStyle | TLDashStyle | TLFillStyle | TLFontStyle | TLOpacityStyle | TLSizeStyle;
|
|
|
|
// @public (undocumented)
|
|
export type TLStyleProps = Pick<TLShapeProps, TLStyleType>;
|
|
|
|
// @public (undocumented)
|
|
export type TLStyleType = SetValue<typeof TL_STYLE_TYPES>;
|
|
|
|
// @public (undocumented)
|
|
export type TLTextShape = TLBaseShape<'text', TLTextShapeProps>;
|
|
|
|
// @public (undocumented)
|
|
export type TLTextShapeProps = {
|
|
color: TLColorType;
|
|
size: TLSizeType;
|
|
font: TLFontType;
|
|
align: TLAlignType;
|
|
opacity: TLOpacityType;
|
|
w: number;
|
|
text: string;
|
|
scale: number;
|
|
autoSize: boolean;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export type TLUiColorType = SetValue<typeof TL_UI_COLOR_TYPES>;
|
|
|
|
// @public
|
|
export type TLUnknownShape = TLBaseShape<string, object>;
|
|
|
|
// @public
|
|
export interface TLUserDocument extends BaseRecord<'user_document', TLUserDocumentId> {
|
|
// (undocumented)
|
|
isGridMode: boolean;
|
|
// (undocumented)
|
|
isMobileMode: boolean;
|
|
// (undocumented)
|
|
isPenMode: boolean;
|
|
// (undocumented)
|
|
isSnapMode: boolean;
|
|
// (undocumented)
|
|
lastUpdatedPageId: ID<TLPage> | null;
|
|
// (undocumented)
|
|
lastUsedTabId: ID<TLInstance> | null;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export type TLUserDocumentId = ID<TLUserDocument>;
|
|
|
|
// @public (undocumented)
|
|
export type TLVerticalAlignType = SetValue<typeof TL_VERTICAL_ALIGN_TYPES>;
|
|
|
|
// @public (undocumented)
|
|
export type TLVideoAsset = TLBaseAsset<'video', {
|
|
w: number;
|
|
h: number;
|
|
name: string;
|
|
isAnimated: boolean;
|
|
mimeType: null | string;
|
|
src: null | string;
|
|
}>;
|
|
|
|
// @public (undocumented)
|
|
export type TLVideoShape = TLBaseShape<'video', TLVideoShapeProps>;
|
|
|
|
// @public (undocumented)
|
|
export type TLVideoShapeProps = {
|
|
opacity: TLOpacityType;
|
|
w: number;
|
|
h: number;
|
|
time: number;
|
|
playing: boolean;
|
|
url: string;
|
|
assetId: null | TLAssetId;
|
|
};
|
|
|
|
// @public (undocumented)
|
|
export const uiColorTypeValidator: T.Validator<"accent" | "black" | "laser" | "muted-1" | "selection-fill" | "selection-stroke" | "white">;
|
|
|
|
// @public (undocumented)
|
|
export const UserDocumentRecordType: RecordType<TLUserDocument, never>;
|
|
|
|
// @public (undocumented)
|
|
export const userDocumentTypeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const userDocumentTypeValidator: T.Validator<TLUserDocument>;
|
|
|
|
// @public (undocumented)
|
|
export interface Vec2dModel {
|
|
// (undocumented)
|
|
x: number;
|
|
// (undocumented)
|
|
y: number;
|
|
// (undocumented)
|
|
z?: number;
|
|
}
|
|
|
|
// @public (undocumented)
|
|
export const videoAssetMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const videoAssetTypeValidator: T.Validator<TLVideoAsset>;
|
|
|
|
// @public (undocumented)
|
|
export const videoShapeTypeMigrations: Migrations;
|
|
|
|
// @public (undocumented)
|
|
export const videoShapeTypeValidator: T.Validator<TLVideoShape>;
|
|
|
|
// (No @packageDocumentation comment for this package)
|
|
|
|
```
|