mocanvasv4.11.2
DocsDemosLicensing

@mocanvas/mocanvas · interface

TLUiComponents

interface TLUiComponents

The UI half of the chrome override map.

TLComponents (in the editor package) covers everything, including the canvas layers. This is the strictly-UI subset: the panels and menus that only exist once there is chrome at all. An app hands one object; the two maps are separated so the editor package can define its own slots without depending on the UI package's.

Every slot is optional. undefined keeps the default, null removes it.

On this page

A11yActionsMenuContextMenuCursorChatBubbleDebugMenuDebugPanelDialogsFollowingIndicatorHelperButtonsHelpMenuImageToolbarKeyboardShortcutsDialogMainMenuMenuPanelMinimapNavigationPanelPageMenuPeopleMenuPeopleMenuAvatarPeopleMenuFacePilePeopleMenuItemQuickActionsRichTextToolbarSharePanelStylePanelToastsToolbarTopPanelUserPresenceEditorVideoToolbarZoomMenu

Properties · 31

A11y?: TLUiComponentSlot

The live region the canvas announces through.

ActionsMenu?: TLUiComponentSlot<TLUiActionsMenuProps>

The selection actions menu.

ContextMenu?: TLUiComponentSlot<TLUiContextMenuProps>

The right-click menu. Wraps the canvas, since it owns the trigger.

CursorChatBubble?: TLUiComponentSlot

The follow-me chat bubble on the local cursor.

DebugMenu?: TLUiComponentSlot<TLUiDebugMenuProps>

The debug menu.

DebugPanel?: TLUiComponentSlot

The frame-statistics chip.

Dialogs?: TLUiComponentSlot

The dialog stack.

FollowingIndicator?: TLUiComponentSlot

The banner shown while following another user's camera.

HelperButtons?: TLUiComponentSlot<TLUiHelperButtonsProps>

The small buttons above the toolbar.

HelpMenu?: TLUiComponentSlot<TLUiHelpMenuProps>

The help menu.

ImageToolbar?: TLUiComponentSlot<TLUiImageToolbarProps>

The contextual bar over a selected image.

KeyboardShortcutsDialog?: TLUiComponentSlot<TLUiKeyboardShortcutsDialogProps>

The shortcuts dialog.

MainMenu?: TLUiComponentSlot<TLUiMainMenuProps>

The top-left menu.

MenuPanel?: TLUiComponentSlot

The plate the main menu and page menu sit on.

Minimap?: TLUiComponentSlot

The minimap inside the navigation panel.

NavigationPanel?: TLUiComponentSlot

The zoom / minimap cluster.

PageMenu?: TLUiComponentSlot

The page picker.

PeopleMenu?: TLUiComponentSlot<DefaultPeopleMenuProps>

The collaborator list.

PeopleMenuAvatar?: TLUiComponentSlot<TLUiPeopleMenuAvatarProps>

One collaborator's avatar.

PeopleMenuFacePile?: TLUiComponentSlot<TLUiPeopleMenuFacePileProps>

The stacked avatars on the people menu's trigger.

PeopleMenuItem?: TLUiComponentSlot<TLUiPeopleMenuItemProps>

One row in the collaborator list.

QuickActions?: TLUiComponentSlot<TLUiQuickActionsProps>

The undo/redo/duplicate row.

RichTextToolbar?: TLUiComponentSlot<TLUiRichTextToolbarProps>

The formatting bar over a text shape being edited.

SharePanel?: TLUiComponentSlot

The top-right panel.

StylePanel?: TLUiComponentSlot<TLUiStylePanelProps>

The style panel.

Toasts?: TLUiComponentSlot

The toast stack.

Toolbar?: TLUiComponentSlot

The tool bar.

TopPanel?: TLUiComponentSlot

The strip above the menu panel.

UserPresenceEditor?: TLUiComponentSlot

The local person's name and colour editor.

VideoToolbar?: TLUiComponentSlot<TLUiVideoToolbarProps>

The contextual bar over a selected video.

ZoomMenu?: TLUiComponentSlot<TLUiZoomMenuProps>

The zoom menu.

Mentioned here

TLComponents
All of @mocanvas/mocanvasGuidesDemos
mocanvas
DocsLicensingmocanvas@symbio.agency

mocanvas is built by Symbio. Free for non-commercial, non-profit and development use; commercial use needs an agreement. Not affiliated with or endorsed by tldraw.