tldraw 4.6.0-next.fecc64eee134 → 5.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist-cjs/index.d.ts +719 -77
- package/dist-cjs/index.js +41 -20
- package/dist-cjs/index.js.map +3 -3
- package/dist-cjs/lib/Tldraw.js +10 -12
- package/dist-cjs/lib/Tldraw.js.map +2 -2
- package/dist-cjs/lib/defaultExternalContentHandlers.js +1 -1
- package/dist-cjs/lib/defaultExternalContentHandlers.js.map +2 -2
- package/dist-cjs/lib/defaultOverlayUtils.js +54 -0
- package/dist-cjs/lib/defaultOverlayUtils.js.map +7 -0
- package/dist-cjs/lib/overlays/ArrowBindingHintOverlayUtil.js +204 -0
- package/dist-cjs/lib/overlays/ArrowBindingHintOverlayUtil.js.map +7 -0
- package/dist-cjs/lib/overlays/ArrowHintOverlayUtil.js +180 -0
- package/dist-cjs/lib/overlays/ArrowHintOverlayUtil.js.map +7 -0
- package/dist-cjs/lib/overlays/BrushOverlayUtil.js +84 -0
- package/dist-cjs/lib/overlays/BrushOverlayUtil.js.map +7 -0
- package/dist-cjs/lib/overlays/CollaboratorBrushOverlayUtil.js +74 -0
- package/dist-cjs/lib/overlays/CollaboratorBrushOverlayUtil.js.map +7 -0
- package/dist-cjs/lib/overlays/CollaboratorCursorOverlayUtil.js +218 -0
- package/dist-cjs/lib/overlays/CollaboratorCursorOverlayUtil.js.map +7 -0
- package/dist-cjs/lib/overlays/CollaboratorHintOverlayUtil.js +87 -0
- package/dist-cjs/lib/overlays/CollaboratorHintOverlayUtil.js.map +7 -0
- package/dist-cjs/lib/overlays/CollaboratorScribbleOverlayUtil.js +102 -0
- package/dist-cjs/lib/overlays/CollaboratorScribbleOverlayUtil.js.map +7 -0
- package/dist-cjs/lib/overlays/CollaboratorShapeIndicatorOverlayUtil.js +69 -0
- package/dist-cjs/lib/overlays/CollaboratorShapeIndicatorOverlayUtil.js.map +7 -0
- package/dist-cjs/lib/overlays/ScribbleOverlayUtil.js +113 -0
- package/dist-cjs/lib/overlays/ScribbleOverlayUtil.js.map +7 -0
- package/dist-cjs/lib/overlays/SelectionForegroundOverlayUtil.js +462 -0
- package/dist-cjs/lib/overlays/SelectionForegroundOverlayUtil.js.map +7 -0
- package/dist-cjs/lib/overlays/ShapeHandleOverlayUtil.js +149 -0
- package/dist-cjs/lib/overlays/ShapeHandleOverlayUtil.js.map +7 -0
- package/dist-cjs/lib/overlays/SnapIndicatorOverlayUtil.js +160 -0
- package/dist-cjs/lib/overlays/SnapIndicatorOverlayUtil.js.map +7 -0
- package/dist-cjs/lib/overlays/ZoomBrushOverlayUtil.js +71 -0
- package/dist-cjs/lib/overlays/ZoomBrushOverlayUtil.js.map +7 -0
- package/dist-cjs/lib/shapes/arrow/ArrowShapeUtil.js +34 -181
- package/dist-cjs/lib/shapes/arrow/ArrowShapeUtil.js.map +3 -3
- package/dist-cjs/lib/shapes/arrow/elbow/routes/ElbowArrowRouteBuilder.js +2 -0
- package/dist-cjs/lib/shapes/arrow/elbow/routes/ElbowArrowRouteBuilder.js.map +1 -1
- package/dist-cjs/lib/shapes/bookmark/BookmarkShapeUtil.js +1 -11
- package/dist-cjs/lib/shapes/bookmark/BookmarkShapeUtil.js.map +2 -2
- package/dist-cjs/lib/shapes/bookmark/bookmarks.js +11 -2
- package/dist-cjs/lib/shapes/bookmark/bookmarks.js.map +2 -2
- package/dist-cjs/lib/shapes/draw/DrawShapeUtil.js +0 -27
- package/dist-cjs/lib/shapes/draw/DrawShapeUtil.js.map +2 -2
- package/dist-cjs/lib/shapes/draw/toolStates/Idle.js +4 -0
- package/dist-cjs/lib/shapes/draw/toolStates/Idle.js.map +2 -2
- package/dist-cjs/lib/shapes/embed/EmbedShapeUtil.js +1 -19
- package/dist-cjs/lib/shapes/embed/EmbedShapeUtil.js.map +2 -2
- package/dist-cjs/lib/shapes/frame/FrameShapeUtil.js +1 -55
- package/dist-cjs/lib/shapes/frame/FrameShapeUtil.js.map +3 -3
- package/dist-cjs/lib/shapes/geo/GeoShapeBody.js +3 -2
- package/dist-cjs/lib/shapes/geo/GeoShapeBody.js.map +2 -2
- package/dist-cjs/lib/shapes/geo/GeoShapeUtil.js +46 -48
- package/dist-cjs/lib/shapes/geo/GeoShapeUtil.js.map +2 -2
- package/dist-cjs/lib/shapes/geo/getGeoShapePath.js +191 -67
- package/dist-cjs/lib/shapes/geo/getGeoShapePath.js.map +2 -2
- package/dist-cjs/lib/shapes/geo/toolStates/Pointing.js +4 -1
- package/dist-cjs/lib/shapes/geo/toolStates/Pointing.js.map +2 -2
- package/dist-cjs/lib/shapes/highlight/HighlightShapeUtil.js +0 -21
- package/dist-cjs/lib/shapes/highlight/HighlightShapeUtil.js.map +2 -2
- package/dist-cjs/lib/shapes/image/ImageAlphaCache.js +2 -1
- package/dist-cjs/lib/shapes/image/ImageAlphaCache.js.map +2 -2
- package/dist-cjs/lib/shapes/image/ImageShapeUtil.js +0 -19
- package/dist-cjs/lib/shapes/image/ImageShapeUtil.js.map +2 -2
- package/dist-cjs/lib/shapes/line/LineShapeUtil.js +0 -17
- package/dist-cjs/lib/shapes/line/LineShapeUtil.js.map +2 -2
- package/dist-cjs/lib/shapes/note/NoteShapeUtil.js +22 -19
- package/dist-cjs/lib/shapes/note/NoteShapeUtil.js.map +2 -2
- package/dist-cjs/lib/shapes/note/noteHelpers.js +2 -1
- package/dist-cjs/lib/shapes/note/noteHelpers.js.map +2 -2
- package/dist-cjs/lib/shapes/shared/PathBuilder.js +3 -0
- package/dist-cjs/lib/shapes/shared/PathBuilder.js.map +1 -1
- package/dist-cjs/lib/shapes/text/TextShapeUtil.js +0 -9
- package/dist-cjs/lib/shapes/text/TextShapeUtil.js.map +2 -2
- package/dist-cjs/lib/shapes/video/VideoShapeUtil.js +0 -6
- package/dist-cjs/lib/shapes/video/VideoShapeUtil.js.map +2 -2
- package/dist-cjs/lib/styles.js +0 -22
- package/dist-cjs/lib/styles.js.map +2 -2
- package/dist-cjs/lib/tools/EraserTool/EraserTool.js +15 -1
- package/dist-cjs/lib/tools/EraserTool/EraserTool.js.map +2 -2
- package/dist-cjs/lib/tools/EraserTool/childStates/Erasing.js +9 -26
- package/dist-cjs/lib/tools/EraserTool/childStates/Erasing.js.map +2 -2
- package/dist-cjs/lib/tools/EraserTool/childStates/Idle.js +14 -1
- package/dist-cjs/lib/tools/EraserTool/childStates/Idle.js.map +2 -2
- package/dist-cjs/lib/tools/EraserTool/childStates/Pointing.js +9 -18
- package/dist-cjs/lib/tools/EraserTool/childStates/Pointing.js.map +2 -2
- package/dist-cjs/lib/tools/SelectTool/DragAndDropManager.js +47 -18
- package/dist-cjs/lib/tools/SelectTool/DragAndDropManager.js.map +2 -2
- package/dist-cjs/lib/tools/SelectTool/childStates/Brushing.js +1 -1
- package/dist-cjs/lib/tools/SelectTool/childStates/Brushing.js.map +2 -2
- package/dist-cjs/lib/tools/SelectTool/childStates/Crop/children/Idle.js +39 -0
- package/dist-cjs/lib/tools/SelectTool/childStates/Crop/children/Idle.js.map +2 -2
- package/dist-cjs/lib/tools/SelectTool/childStates/EditingShape.js +2 -1
- package/dist-cjs/lib/tools/SelectTool/childStates/EditingShape.js.map +2 -2
- package/dist-cjs/lib/tools/SelectTool/childStates/Idle.js +92 -6
- package/dist-cjs/lib/tools/SelectTool/childStates/Idle.js.map +2 -2
- package/dist-cjs/lib/tools/SelectTool/childStates/PointingResizeHandle.js +1 -2
- package/dist-cjs/lib/tools/SelectTool/childStates/PointingResizeHandle.js.map +2 -2
- package/dist-cjs/lib/tools/SelectTool/childStates/Resizing.js +1 -1
- package/dist-cjs/lib/tools/SelectTool/childStates/Resizing.js.map +2 -2
- package/dist-cjs/lib/tools/SelectTool/childStates/ScribbleBrushing.js +1 -1
- package/dist-cjs/lib/tools/SelectTool/childStates/ScribbleBrushing.js.map +2 -2
- package/dist-cjs/lib/tools/selection-logic/updateHoveredOverlayId.js +46 -0
- package/dist-cjs/lib/tools/selection-logic/updateHoveredOverlayId.js.map +7 -0
- package/dist-cjs/lib/ui/components/ContextMenu/DefaultContextMenu.js +11 -0
- package/dist-cjs/lib/ui/components/ContextMenu/DefaultContextMenu.js.map +2 -2
- package/dist-cjs/lib/ui/components/CursorChatBubble.js +1 -1
- package/dist-cjs/lib/ui/components/CursorChatBubble.js.map +1 -1
- package/dist-cjs/lib/ui/components/MainMenu/DefaultMainMenuContent.js +5 -5
- package/dist-cjs/lib/ui/components/MainMenu/DefaultMainMenuContent.js.map +2 -2
- package/dist-cjs/lib/ui/components/Minimap/DefaultMinimap.js +25 -7
- package/dist-cjs/lib/ui/components/Minimap/DefaultMinimap.js.map +3 -3
- package/dist-cjs/lib/ui/components/Minimap/MinimapManager.js +74 -107
- package/dist-cjs/lib/ui/components/Minimap/MinimapManager.js.map +3 -3
- package/dist-cjs/lib/ui/components/MobileStylePanel.js +8 -2
- package/dist-cjs/lib/ui/components/MobileStylePanel.js.map +2 -2
- package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanelContent.js +21 -6
- package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanelContent.js.map +2 -2
- package/dist-cjs/lib/ui/components/StylePanel/StylePanelButtonPicker.js +5 -1
- package/dist-cjs/lib/ui/components/StylePanel/StylePanelButtonPicker.js.map +2 -2
- package/dist-cjs/lib/ui/components/Toolbar/OverflowingToolbar.js +1 -1
- package/dist-cjs/lib/ui/components/Toolbar/OverflowingToolbar.js.map +2 -2
- package/dist-cjs/lib/ui/components/menu-items.js +2 -2
- package/dist-cjs/lib/ui/components/menu-items.js.map +2 -2
- package/dist-cjs/lib/ui/context/actions.js +5 -2
- package/dist-cjs/lib/ui/context/actions.js.map +2 -2
- package/dist-cjs/lib/ui/hooks/useClipboardEvents.js +13 -9
- package/dist-cjs/lib/ui/hooks/useClipboardEvents.js.map +2 -2
- package/dist-cjs/lib/ui/hooks/useKeyboardShortcuts.js +267 -75
- package/dist-cjs/lib/ui/hooks/useKeyboardShortcuts.js.map +3 -3
- package/dist-cjs/lib/ui/hooks/useTranslation/TLUiTranslationKey.js.map +1 -1
- package/dist-cjs/lib/ui/hooks/useTranslation/defaultTranslation.js +1 -0
- package/dist-cjs/lib/ui/hooks/useTranslation/defaultTranslation.js.map +2 -2
- package/dist-cjs/lib/ui/version.js +4 -4
- package/dist-cjs/lib/ui/version.js.map +1 -1
- package/dist-cjs/lib/utils/export/exportAs.js.map +2 -2
- package/dist-cjs/lib/utils/frames/frames.js +2 -2
- package/dist-cjs/lib/utils/frames/frames.js.map +2 -2
- package/dist-esm/index.d.mts +719 -77
- package/dist-esm/index.mjs +68 -23
- package/dist-esm/index.mjs.map +2 -2
- package/dist-esm/lib/Tldraw.mjs +10 -12
- package/dist-esm/lib/Tldraw.mjs.map +2 -2
- package/dist-esm/lib/defaultExternalContentHandlers.mjs +1 -1
- package/dist-esm/lib/defaultExternalContentHandlers.mjs.map +2 -2
- package/dist-esm/lib/defaultOverlayUtils.mjs +34 -0
- package/dist-esm/lib/defaultOverlayUtils.mjs.map +7 -0
- package/dist-esm/lib/overlays/ArrowBindingHintOverlayUtil.mjs +189 -0
- package/dist-esm/lib/overlays/ArrowBindingHintOverlayUtil.mjs.map +7 -0
- package/dist-esm/lib/overlays/ArrowHintOverlayUtil.mjs +160 -0
- package/dist-esm/lib/overlays/ArrowHintOverlayUtil.mjs.map +7 -0
- package/dist-esm/lib/overlays/BrushOverlayUtil.mjs +67 -0
- package/dist-esm/lib/overlays/BrushOverlayUtil.mjs.map +7 -0
- package/dist-esm/lib/overlays/CollaboratorBrushOverlayUtil.mjs +54 -0
- package/dist-esm/lib/overlays/CollaboratorBrushOverlayUtil.mjs.map +7 -0
- package/dist-esm/lib/overlays/CollaboratorCursorOverlayUtil.mjs +198 -0
- package/dist-esm/lib/overlays/CollaboratorCursorOverlayUtil.mjs.map +7 -0
- package/dist-esm/lib/overlays/CollaboratorHintOverlayUtil.mjs +67 -0
- package/dist-esm/lib/overlays/CollaboratorHintOverlayUtil.mjs.map +7 -0
- package/dist-esm/lib/overlays/CollaboratorScribbleOverlayUtil.mjs +82 -0
- package/dist-esm/lib/overlays/CollaboratorScribbleOverlayUtil.mjs.map +7 -0
- package/dist-esm/lib/overlays/CollaboratorShapeIndicatorOverlayUtil.mjs +49 -0
- package/dist-esm/lib/overlays/CollaboratorShapeIndicatorOverlayUtil.mjs.map +7 -0
- package/dist-esm/lib/overlays/ScribbleOverlayUtil.mjs +97 -0
- package/dist-esm/lib/overlays/ScribbleOverlayUtil.mjs.map +7 -0
- package/dist-esm/lib/overlays/SelectionForegroundOverlayUtil.mjs +451 -0
- package/dist-esm/lib/overlays/SelectionForegroundOverlayUtil.mjs.map +7 -0
- package/dist-esm/lib/overlays/ShapeHandleOverlayUtil.mjs +135 -0
- package/dist-esm/lib/overlays/ShapeHandleOverlayUtil.mjs.map +7 -0
- package/dist-esm/lib/overlays/SnapIndicatorOverlayUtil.mjs +143 -0
- package/dist-esm/lib/overlays/SnapIndicatorOverlayUtil.mjs.map +7 -0
- package/dist-esm/lib/overlays/ZoomBrushOverlayUtil.mjs +51 -0
- package/dist-esm/lib/overlays/ZoomBrushOverlayUtil.mjs.map +7 -0
- package/dist-esm/lib/shapes/arrow/ArrowShapeUtil.mjs +35 -182
- package/dist-esm/lib/shapes/arrow/ArrowShapeUtil.mjs.map +3 -3
- package/dist-esm/lib/shapes/arrow/elbow/routes/ElbowArrowRouteBuilder.mjs +2 -0
- package/dist-esm/lib/shapes/arrow/elbow/routes/ElbowArrowRouteBuilder.mjs.map +1 -1
- package/dist-esm/lib/shapes/bookmark/BookmarkShapeUtil.mjs +1 -12
- package/dist-esm/lib/shapes/bookmark/BookmarkShapeUtil.mjs.map +2 -2
- package/dist-esm/lib/shapes/bookmark/bookmarks.mjs +11 -2
- package/dist-esm/lib/shapes/bookmark/bookmarks.mjs.map +2 -2
- package/dist-esm/lib/shapes/draw/DrawShapeUtil.mjs +0 -27
- package/dist-esm/lib/shapes/draw/DrawShapeUtil.mjs.map +2 -2
- package/dist-esm/lib/shapes/draw/toolStates/Idle.mjs +4 -0
- package/dist-esm/lib/shapes/draw/toolStates/Idle.mjs.map +2 -2
- package/dist-esm/lib/shapes/embed/EmbedShapeUtil.mjs +1 -19
- package/dist-esm/lib/shapes/embed/EmbedShapeUtil.mjs.map +2 -2
- package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs +2 -58
- package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs.map +3 -3
- package/dist-esm/lib/shapes/geo/GeoShapeBody.mjs +3 -2
- package/dist-esm/lib/shapes/geo/GeoShapeBody.mjs.map +2 -2
- package/dist-esm/lib/shapes/geo/GeoShapeUtil.mjs +52 -50
- package/dist-esm/lib/shapes/geo/GeoShapeUtil.mjs.map +2 -2
- package/dist-esm/lib/shapes/geo/getGeoShapePath.mjs +191 -68
- package/dist-esm/lib/shapes/geo/getGeoShapePath.mjs.map +2 -2
- package/dist-esm/lib/shapes/geo/toolStates/Pointing.mjs +4 -1
- package/dist-esm/lib/shapes/geo/toolStates/Pointing.mjs.map +2 -2
- package/dist-esm/lib/shapes/highlight/HighlightShapeUtil.mjs +0 -21
- package/dist-esm/lib/shapes/highlight/HighlightShapeUtil.mjs.map +2 -2
- package/dist-esm/lib/shapes/image/ImageAlphaCache.mjs +3 -2
- package/dist-esm/lib/shapes/image/ImageAlphaCache.mjs.map +2 -2
- package/dist-esm/lib/shapes/image/ImageShapeUtil.mjs +0 -20
- package/dist-esm/lib/shapes/image/ImageShapeUtil.mjs.map +2 -2
- package/dist-esm/lib/shapes/line/LineShapeUtil.mjs +0 -17
- package/dist-esm/lib/shapes/line/LineShapeUtil.mjs.map +2 -2
- package/dist-esm/lib/shapes/note/NoteShapeUtil.mjs +22 -20
- package/dist-esm/lib/shapes/note/NoteShapeUtil.mjs.map +2 -2
- package/dist-esm/lib/shapes/note/noteHelpers.mjs +2 -1
- package/dist-esm/lib/shapes/note/noteHelpers.mjs.map +2 -2
- package/dist-esm/lib/shapes/shared/PathBuilder.mjs +3 -0
- package/dist-esm/lib/shapes/shared/PathBuilder.mjs.map +1 -1
- package/dist-esm/lib/shapes/text/TextShapeUtil.mjs +0 -10
- package/dist-esm/lib/shapes/text/TextShapeUtil.mjs.map +2 -2
- package/dist-esm/lib/shapes/video/VideoShapeUtil.mjs +0 -7
- package/dist-esm/lib/shapes/video/VideoShapeUtil.mjs.map +2 -2
- package/dist-esm/lib/styles.mjs +0 -22
- package/dist-esm/lib/styles.mjs.map +2 -2
- package/dist-esm/lib/tools/EraserTool/EraserTool.mjs +15 -1
- package/dist-esm/lib/tools/EraserTool/EraserTool.mjs.map +2 -2
- package/dist-esm/lib/tools/EraserTool/childStates/Erasing.mjs +10 -32
- package/dist-esm/lib/tools/EraserTool/childStates/Erasing.mjs.map +2 -2
- package/dist-esm/lib/tools/EraserTool/childStates/Idle.mjs +15 -2
- package/dist-esm/lib/tools/EraserTool/childStates/Idle.mjs.map +2 -2
- package/dist-esm/lib/tools/EraserTool/childStates/Pointing.mjs +10 -19
- package/dist-esm/lib/tools/EraserTool/childStates/Pointing.mjs.map +2 -2
- package/dist-esm/lib/tools/SelectTool/DragAndDropManager.mjs +47 -18
- package/dist-esm/lib/tools/SelectTool/DragAndDropManager.mjs.map +2 -2
- package/dist-esm/lib/tools/SelectTool/childStates/Brushing.mjs +1 -1
- package/dist-esm/lib/tools/SelectTool/childStates/Brushing.mjs.map +2 -2
- package/dist-esm/lib/tools/SelectTool/childStates/Crop/children/Idle.mjs +39 -0
- package/dist-esm/lib/tools/SelectTool/childStates/Crop/children/Idle.mjs.map +2 -2
- package/dist-esm/lib/tools/SelectTool/childStates/EditingShape.mjs +2 -1
- package/dist-esm/lib/tools/SelectTool/childStates/EditingShape.mjs.map +2 -2
- package/dist-esm/lib/tools/SelectTool/childStates/Idle.mjs +92 -6
- package/dist-esm/lib/tools/SelectTool/childStates/Idle.mjs.map +2 -2
- package/dist-esm/lib/tools/SelectTool/childStates/PointingResizeHandle.mjs +1 -2
- package/dist-esm/lib/tools/SelectTool/childStates/PointingResizeHandle.mjs.map +2 -2
- package/dist-esm/lib/tools/SelectTool/childStates/Resizing.mjs +1 -1
- package/dist-esm/lib/tools/SelectTool/childStates/Resizing.mjs.map +2 -2
- package/dist-esm/lib/tools/SelectTool/childStates/ScribbleBrushing.mjs +1 -1
- package/dist-esm/lib/tools/SelectTool/childStates/ScribbleBrushing.mjs.map +2 -2
- package/dist-esm/lib/tools/selection-logic/updateHoveredOverlayId.mjs +26 -0
- package/dist-esm/lib/tools/selection-logic/updateHoveredOverlayId.mjs.map +7 -0
- package/dist-esm/lib/ui/components/ContextMenu/DefaultContextMenu.mjs +12 -1
- package/dist-esm/lib/ui/components/ContextMenu/DefaultContextMenu.mjs.map +2 -2
- package/dist-esm/lib/ui/components/CursorChatBubble.mjs +1 -1
- package/dist-esm/lib/ui/components/CursorChatBubble.mjs.map +1 -1
- package/dist-esm/lib/ui/components/MainMenu/DefaultMainMenuContent.mjs +5 -5
- package/dist-esm/lib/ui/components/MainMenu/DefaultMainMenuContent.mjs.map +2 -2
- package/dist-esm/lib/ui/components/Minimap/DefaultMinimap.mjs +27 -9
- package/dist-esm/lib/ui/components/Minimap/DefaultMinimap.mjs.map +3 -3
- package/dist-esm/lib/ui/components/Minimap/MinimapManager.mjs +74 -108
- package/dist-esm/lib/ui/components/Minimap/MinimapManager.mjs.map +3 -3
- package/dist-esm/lib/ui/components/MobileStylePanel.mjs +8 -2
- package/dist-esm/lib/ui/components/MobileStylePanel.mjs.map +2 -2
- package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanelContent.mjs +21 -6
- package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanelContent.mjs.map +2 -2
- package/dist-esm/lib/ui/components/StylePanel/StylePanelButtonPicker.mjs +7 -2
- package/dist-esm/lib/ui/components/StylePanel/StylePanelButtonPicker.mjs.map +2 -2
- package/dist-esm/lib/ui/components/Toolbar/OverflowingToolbar.mjs +1 -1
- package/dist-esm/lib/ui/components/Toolbar/OverflowingToolbar.mjs.map +2 -2
- package/dist-esm/lib/ui/components/menu-items.mjs +2 -2
- package/dist-esm/lib/ui/components/menu-items.mjs.map +2 -2
- package/dist-esm/lib/ui/context/actions.mjs +5 -2
- package/dist-esm/lib/ui/context/actions.mjs.map +2 -2
- package/dist-esm/lib/ui/hooks/useClipboardEvents.mjs +13 -9
- package/dist-esm/lib/ui/hooks/useClipboardEvents.mjs.map +2 -2
- package/dist-esm/lib/ui/hooks/useKeyboardShortcuts.mjs +267 -65
- package/dist-esm/lib/ui/hooks/useKeyboardShortcuts.mjs.map +2 -2
- package/dist-esm/lib/ui/hooks/useTranslation/defaultTranslation.mjs +1 -0
- package/dist-esm/lib/ui/hooks/useTranslation/defaultTranslation.mjs.map +2 -2
- package/dist-esm/lib/ui/version.mjs +4 -4
- package/dist-esm/lib/ui/version.mjs.map +1 -1
- package/dist-esm/lib/utils/export/exportAs.mjs.map +2 -2
- package/dist-esm/lib/utils/frames/frames.mjs +2 -2
- package/dist-esm/lib/utils/frames/frames.mjs.map +2 -2
- package/package.json +4 -5
- package/src/index.ts +66 -20
- package/src/lib/Tldraw.test.tsx +161 -9
- package/src/lib/Tldraw.tsx +25 -12
- package/src/lib/defaultExternalContentHandlers.test.ts +175 -0
- package/src/lib/defaultExternalContentHandlers.ts +22 -12
- package/src/lib/defaultOverlayUtils.ts +32 -0
- package/src/lib/overlays/ArrowBindingHintOverlayUtil.ts +258 -0
- package/src/lib/overlays/ArrowHintOverlayUtil.ts +215 -0
- package/src/lib/overlays/BrushOverlayUtil.ts +108 -0
- package/src/lib/overlays/CollaboratorBrushOverlayUtil.ts +80 -0
- package/src/lib/overlays/CollaboratorCursorOverlayUtil.ts +301 -0
- package/src/lib/overlays/CollaboratorHintOverlayUtil.ts +110 -0
- package/src/lib/overlays/CollaboratorScribbleOverlayUtil.ts +122 -0
- package/src/lib/overlays/CollaboratorShapeIndicatorOverlayUtil.ts +85 -0
- package/src/lib/overlays/ScribbleOverlayUtil.ts +143 -0
- package/src/lib/overlays/SelectionForegroundOverlayUtil.ts +680 -0
- package/src/lib/overlays/ShapeHandleOverlayUtil.ts +209 -0
- package/src/lib/overlays/SnapIndicatorOverlayUtil.ts +195 -0
- package/src/lib/overlays/ZoomBrushOverlayUtil.ts +75 -0
- package/src/lib/shapes/arrow/ArrowShapeUtil.tsx +40 -232
- package/src/lib/shapes/bookmark/BookmarkShapeUtil.tsx +1 -14
- package/src/lib/shapes/bookmark/bookmarks.ts +16 -2
- package/src/lib/shapes/draw/DrawShapeUtil.tsx +0 -43
- package/src/lib/shapes/draw/toolStates/Idle.ts +5 -0
- package/src/lib/shapes/embed/EmbedShapeUtil.tsx +1 -21
- package/src/lib/shapes/frame/FrameShapeUtil.tsx +2 -90
- package/src/lib/shapes/geo/GeoShapeBody.tsx +4 -2
- package/src/lib/shapes/geo/GeoShapeUtil.test.tsx +85 -1
- package/src/lib/shapes/geo/GeoShapeUtil.tsx +86 -55
- package/src/lib/shapes/geo/getGeoShapePath.ts +307 -123
- package/src/lib/shapes/geo/toolStates/Pointing.ts +5 -6
- package/src/lib/shapes/highlight/HighlightShapeUtil.tsx +0 -26
- package/src/lib/shapes/image/ImageAlphaCache.ts +3 -2
- package/src/lib/shapes/image/ImageShapeUtil.tsx +0 -23
- package/src/lib/shapes/line/LineShapeUtil.tsx +0 -20
- package/src/lib/shapes/note/NoteShapeUtil.tsx +29 -22
- package/src/lib/shapes/note/noteCloning.test.ts +58 -0
- package/src/lib/shapes/note/noteHelpers.ts +1 -0
- package/src/lib/shapes/text/TextShapeUtil.tsx +0 -12
- package/src/lib/shapes/video/VideoShapeUtil.tsx +0 -9
- package/src/lib/styles.tsx +0 -22
- package/src/lib/tools/EraserTool/EraserTool.ts +18 -1
- package/src/lib/tools/EraserTool/childStates/Erasing.ts +16 -43
- package/src/lib/tools/EraserTool/childStates/Idle.ts +16 -2
- package/src/lib/tools/EraserTool/childStates/Pointing.ts +11 -26
- package/src/lib/tools/SelectTool/DragAndDropManager.ts +58 -18
- package/src/lib/tools/SelectTool/childStates/Brushing.ts +2 -2
- package/src/lib/tools/SelectTool/childStates/Crop/children/Idle.ts +54 -0
- package/src/lib/tools/SelectTool/childStates/EditingShape.ts +3 -2
- package/src/lib/tools/SelectTool/childStates/Idle.ts +120 -11
- package/src/lib/tools/SelectTool/childStates/PointingResizeHandle.ts +1 -2
- package/src/lib/tools/SelectTool/childStates/Resizing.ts +1 -1
- package/src/lib/tools/SelectTool/childStates/ScribbleBrushing.ts +2 -2
- package/src/lib/tools/selection-logic/updateHoveredOverlayId.ts +41 -0
- package/src/lib/ui/components/ContextMenu/DefaultContextMenu.tsx +20 -2
- package/src/lib/ui/components/CursorChatBubble.tsx +1 -1
- package/src/lib/ui/components/MainMenu/DefaultMainMenuContent.tsx +2 -4
- package/src/lib/ui/components/Minimap/DefaultMinimap.tsx +29 -8
- package/src/lib/ui/components/Minimap/MinimapManager.ts +97 -127
- package/src/lib/ui/components/MobileStylePanel.tsx +10 -5
- package/src/lib/ui/components/StylePanel/DefaultStylePanelContent.tsx +23 -6
- package/src/lib/ui/components/StylePanel/StylePanelButtonPicker.tsx +6 -1
- package/src/lib/ui/components/Toolbar/OverflowingToolbar.tsx +8 -1
- package/src/lib/ui/components/menu-items.tsx +2 -2
- package/src/lib/ui/context/actions.tsx +5 -2
- package/src/lib/ui/hooks/useClipboardEvents.ts +23 -11
- package/src/lib/ui/hooks/useKeyboardShortcuts.ts +335 -75
- package/src/lib/ui/hooks/useTranslation/TLUiTranslationKey.ts +1 -0
- package/src/lib/ui/hooks/useTranslation/defaultTranslation.ts +1 -0
- package/src/lib/ui/version.ts +4 -4
- package/src/lib/ui.css +3 -3
- package/src/lib/utils/export/exportAs.ts +1 -0
- package/src/lib/utils/frames/frames.ts +7 -7
- package/src/test/Editor.test.tsx +2 -2
- package/src/test/EraserTool.test.ts +144 -115
- package/src/test/SelectTool.test.ts +66 -1
- package/src/test/TestEditor.ts +89 -0
- package/src/test/TldrawEditor.test.tsx +13 -10
- package/src/test/commaKeyClick.test.ts +94 -0
- package/src/test/cropping.test.ts +55 -9
- package/src/test/custom-clipping.test.ts +2 -4
- package/src/test/customSnapping.test.tsx +3 -3
- package/src/test/dragAndDrop.test.ts +341 -0
- package/src/test/drawing.test.ts +10 -1
- package/src/test/frames.test.ts +62 -0
- package/src/test/getCulledShapes.test.tsx +2 -2
- package/src/test/groups.test.tsx +4 -10
- package/src/test/notVisibleShapes.test.ts +3 -1
- package/src/test/overlays/ArrowHintOverlayUtil.test.ts +128 -0
- package/src/test/overlays/BrushOverlayUtil.test.ts +50 -0
- package/src/test/overlays/BrushOverlayUtilDisplayValues.test.ts +97 -0
- package/src/test/overlays/CollaboratorBrushOverlayUtil.test.ts +80 -0
- package/src/test/overlays/CollaboratorCursorOverlayUtil.test.ts +343 -0
- package/src/test/overlays/CollaboratorHintOverlayUtil.test.ts +111 -0
- package/src/test/overlays/CollaboratorScribbleOverlayUtil.test.ts +100 -0
- package/src/test/overlays/OverlayManager.test.ts +273 -0
- package/src/test/overlays/ScribbleOverlayUtil.test.ts +79 -0
- package/src/test/overlays/SelectionForegroundOverlayUtil.test.ts +343 -0
- package/src/test/overlays/ShapeHandleOverlayUtil.test.ts +271 -0
- package/src/test/overlays/SnapIndicatorOverlayUtil.test.ts +74 -0
- package/src/test/overlays/ZoomBrushOverlayUtil.test.ts +50 -0
- package/src/test/resizing.test.ts +139 -392
- package/src/test/rightClickPanning.test.ts +42 -0
- package/src/test/rotating.test.ts +70 -86
- package/src/test/selection-omnibus.test.ts +2 -4
- package/src/test/shapeutils.test.ts +34 -1
- package/src/test/ui/StylePanel.test.tsx +46 -0
- package/tldraw.css +7 -246
- package/dist-cjs/lib/canvas/TldrawCropHandles.js +0 -174
- package/dist-cjs/lib/canvas/TldrawCropHandles.js.map +0 -7
- package/dist-cjs/lib/canvas/TldrawHandles.js +0 -45
- package/dist-cjs/lib/canvas/TldrawHandles.js.map +0 -7
- package/dist-cjs/lib/canvas/TldrawOverlays.js +0 -86
- package/dist-cjs/lib/canvas/TldrawOverlays.js.map +0 -7
- package/dist-cjs/lib/canvas/TldrawScribble.js +0 -65
- package/dist-cjs/lib/canvas/TldrawScribble.js.map +0 -7
- package/dist-cjs/lib/canvas/TldrawSelectionForeground.js +0 -519
- package/dist-cjs/lib/canvas/TldrawSelectionForeground.js.map +0 -7
- package/dist-cjs/lib/canvas/TldrawShapeIndicators.js +0 -45
- package/dist-cjs/lib/canvas/TldrawShapeIndicators.js.map +0 -7
- package/dist-cjs/lib/shapes/shared/SvgTextLabel.js +0 -82
- package/dist-cjs/lib/shapes/shared/SvgTextLabel.js.map +0 -7
- package/dist-cjs/lib/shapes/shared/freehand/getStrokeRadius.js +0 -27
- package/dist-cjs/lib/shapes/shared/freehand/getStrokeRadius.js.map +0 -7
- package/dist-cjs/lib/ui/components/Minimap/getRgba.js +0 -39
- package/dist-cjs/lib/ui/components/Minimap/getRgba.js.map +0 -7
- package/dist-cjs/lib/ui/components/Minimap/minimap-webgl-setup.js +0 -158
- package/dist-cjs/lib/ui/components/Minimap/minimap-webgl-setup.js.map +0 -7
- package/dist-cjs/lib/ui/components/Minimap/minimap-webgl-shapes.js +0 -126
- package/dist-cjs/lib/ui/components/Minimap/minimap-webgl-shapes.js.map +0 -7
- package/dist-esm/lib/canvas/TldrawCropHandles.mjs +0 -144
- package/dist-esm/lib/canvas/TldrawCropHandles.mjs.map +0 -7
- package/dist-esm/lib/canvas/TldrawHandles.mjs +0 -25
- package/dist-esm/lib/canvas/TldrawHandles.mjs.map +0 -7
- package/dist-esm/lib/canvas/TldrawOverlays.mjs +0 -66
- package/dist-esm/lib/canvas/TldrawOverlays.mjs.map +0 -7
- package/dist-esm/lib/canvas/TldrawScribble.mjs +0 -35
- package/dist-esm/lib/canvas/TldrawScribble.mjs.map +0 -7
- package/dist-esm/lib/canvas/TldrawSelectionForeground.mjs +0 -500
- package/dist-esm/lib/canvas/TldrawSelectionForeground.mjs.map +0 -7
- package/dist-esm/lib/canvas/TldrawShapeIndicators.mjs +0 -25
- package/dist-esm/lib/canvas/TldrawShapeIndicators.mjs.map +0 -7
- package/dist-esm/lib/shapes/shared/SvgTextLabel.mjs +0 -65
- package/dist-esm/lib/shapes/shared/SvgTextLabel.mjs.map +0 -7
- package/dist-esm/lib/shapes/shared/freehand/getStrokeRadius.mjs +0 -7
- package/dist-esm/lib/shapes/shared/freehand/getStrokeRadius.mjs.map +0 -7
- package/dist-esm/lib/ui/components/Minimap/getRgba.mjs +0 -19
- package/dist-esm/lib/ui/components/Minimap/getRgba.mjs.map +0 -7
- package/dist-esm/lib/ui/components/Minimap/minimap-webgl-setup.mjs +0 -138
- package/dist-esm/lib/ui/components/Minimap/minimap-webgl-setup.mjs.map +0 -7
- package/dist-esm/lib/ui/components/Minimap/minimap-webgl-shapes.mjs +0 -106
- package/dist-esm/lib/ui/components/Minimap/minimap-webgl-shapes.mjs.map +0 -7
- package/src/lib/canvas/TldrawCropHandles.tsx +0 -136
- package/src/lib/canvas/TldrawHandles.tsx +0 -31
- package/src/lib/canvas/TldrawOverlays.tsx +0 -85
- package/src/lib/canvas/TldrawScribble.tsx +0 -39
- package/src/lib/canvas/TldrawSelectionForeground.tsx +0 -557
- package/src/lib/canvas/TldrawShapeIndicators.tsx +0 -24
- package/src/lib/shapes/shared/SvgTextLabel.tsx +0 -86
- package/src/lib/shapes/shared/freehand/getStrokeRadius.ts +0 -13
- package/src/lib/ui/components/Minimap/getRgba.ts +0 -18
- package/src/lib/ui/components/Minimap/minimap-webgl-setup.ts +0 -155
- package/src/lib/ui/components/Minimap/minimap-webgl-shapes.ts +0 -144
- package/src/test/testutils/getSnapLines.ts +0 -25
- package/src/test/testutils/roundedBox.ts +0 -13
package/dist-cjs/index.d.ts
CHANGED
|
@@ -2,6 +2,7 @@ import { AssetUtil } from '@tldraw/editor';
|
|
|
2
2
|
import { Atom } from '@tldraw/editor';
|
|
3
3
|
import { BaseBoxShapeTool } from '@tldraw/editor';
|
|
4
4
|
import { BaseBoxShapeUtil } from '@tldraw/editor';
|
|
5
|
+
import { BaseFrameLikeShapeUtil } from '@tldraw/editor';
|
|
5
6
|
import { BindingOnChangeOptions } from '@tldraw/editor';
|
|
6
7
|
import { BindingOnCreateOptions } from '@tldraw/editor';
|
|
7
8
|
import { BindingOnShapeChangeOptions } from '@tldraw/editor';
|
|
@@ -36,6 +37,8 @@ import { MigrationFailureReason } from '@tldraw/editor';
|
|
|
36
37
|
import { MigrationSequence } from '@tldraw/store';
|
|
37
38
|
import { NamedExoticComponent } from 'react';
|
|
38
39
|
import { Node as Node_2 } from '@tiptap/pm/model';
|
|
40
|
+
import { OverlayOptionsWithDisplayValues } from '@tldraw/editor';
|
|
41
|
+
import { OverlayUtil } from '@tldraw/editor';
|
|
39
42
|
import { PerfectDashTerminal } from '@tldraw/editor';
|
|
40
43
|
import { PointerEvent as PointerEvent_2 } from 'react';
|
|
41
44
|
import { Polygon2d } from '@tldraw/editor';
|
|
@@ -53,10 +56,13 @@ import { RefAttributes } from 'react';
|
|
|
53
56
|
import { RefObject } from 'react';
|
|
54
57
|
import { Result } from '@tldraw/editor';
|
|
55
58
|
import { RichTextFontVisitorState } from '@tldraw/editor';
|
|
59
|
+
import { RotateCorner } from '@tldraw/editor';
|
|
56
60
|
import { SerializedSchema } from '@tldraw/editor';
|
|
61
|
+
import { ShapeIndicatorOverlayUtil } from '@tldraw/editor';
|
|
57
62
|
import { ShapeUtil } from '@tldraw/editor';
|
|
58
63
|
import { ShapeWithCrop } from '@tldraw/editor';
|
|
59
64
|
import { SharedStyle } from '@tldraw/editor';
|
|
65
|
+
import { SnapIndicator } from '@tldraw/editor';
|
|
60
66
|
import { StateNode } from '@tldraw/editor';
|
|
61
67
|
import { StyleProp } from '@tldraw/editor';
|
|
62
68
|
import { SvgExportContext } from '@tldraw/editor';
|
|
@@ -79,11 +85,10 @@ import { TLClickEventInfo } from '@tldraw/editor';
|
|
|
79
85
|
import { TLClipboardWriteInfo } from '@tldraw/editor';
|
|
80
86
|
import { TLContent } from '@tldraw/editor';
|
|
81
87
|
import { TLCropInfo } from '@tldraw/editor';
|
|
88
|
+
import { TLCursorType } from '@tldraw/editor';
|
|
82
89
|
import { TLDefaultColorStyle } from '@tldraw/tlschema';
|
|
83
90
|
import { TLDefaultFontStyle } from '@tldraw/tlschema';
|
|
84
91
|
import { TLDefaultSizeStyle } from '@tldraw/editor';
|
|
85
|
-
import { TLDragShapesOutInfo } from '@tldraw/editor';
|
|
86
|
-
import { TLDragShapesOverInfo } from '@tldraw/editor';
|
|
87
92
|
import { TldrawEditorBaseProps } from '@tldraw/editor';
|
|
88
93
|
import { TldrawEditorStoreProps } from '@tldraw/editor';
|
|
89
94
|
import { TldrawOptions } from '@tldraw/editor';
|
|
@@ -98,6 +103,7 @@ import { TLEmbedShapeProps } from '@tldraw/editor';
|
|
|
98
103
|
import { TLEventInfo } from '@tldraw/editor';
|
|
99
104
|
import { TLExportType } from '@tldraw/editor';
|
|
100
105
|
import { TLFileExternalAsset } from '@tldraw/editor';
|
|
106
|
+
import { TLFileReplaceExternalContent } from '@tldraw/editor';
|
|
101
107
|
import { TLFontFace } from '@tldraw/tlschema';
|
|
102
108
|
import { TLFontFace as TLFontFace_2 } from '@tldraw/editor';
|
|
103
109
|
import { TLFrameShape } from '@tldraw/editor';
|
|
@@ -107,7 +113,6 @@ import { TLGeoShape } from '@tldraw/editor';
|
|
|
107
113
|
import { TLGeoShapeProps } from '@tldraw/editor';
|
|
108
114
|
import { TLHandle } from '@tldraw/editor';
|
|
109
115
|
import { TLHandleDragInfo } from '@tldraw/editor';
|
|
110
|
-
import { TLHandlesProps } from '@tldraw/editor';
|
|
111
116
|
import { TLHighlightShape } from '@tldraw/editor';
|
|
112
117
|
import { TLHighlightShapeProps } from '@tldraw/editor';
|
|
113
118
|
import { TLImageAsset } from '@tldraw/editor';
|
|
@@ -119,6 +124,7 @@ import { TLLineShape } from '@tldraw/editor';
|
|
|
119
124
|
import { TLLineShapePoint } from '@tldraw/editor';
|
|
120
125
|
import { TLNoteShape } from '@tldraw/editor';
|
|
121
126
|
import { TLNoteShapeProps } from '@tldraw/editor';
|
|
127
|
+
import { TLOverlay } from '@tldraw/editor';
|
|
122
128
|
import { TLPageId } from '@tldraw/editor';
|
|
123
129
|
import { TLParentId } from '@tldraw/tlschema';
|
|
124
130
|
import { TLPointerEventInfo } from '@tldraw/editor';
|
|
@@ -126,8 +132,8 @@ import { TLPropsMigrations } from '@tldraw/tlschema';
|
|
|
126
132
|
import { TLResizeInfo } from '@tldraw/editor';
|
|
127
133
|
import { TLRichText } from '@tldraw/editor';
|
|
128
134
|
import { TLSchema } from '@tldraw/editor';
|
|
129
|
-
import {
|
|
130
|
-
import {
|
|
135
|
+
import { TLScribble } from '@tldraw/editor';
|
|
136
|
+
import { TLSelectionHandle } from '@tldraw/editor';
|
|
131
137
|
import { TLShape } from '@tldraw/editor';
|
|
132
138
|
import { TLShapeCrop } from '@tldraw/editor';
|
|
133
139
|
import { TLShapeId } from '@tldraw/editor';
|
|
@@ -183,6 +189,33 @@ export declare const allDefaultFontFaces: TLFontFace_2[];
|
|
|
183
189
|
/** @public @react */
|
|
184
190
|
export declare function ArrangeMenuSubmenu(): JSX.Element | null;
|
|
185
191
|
|
|
192
|
+
/**
|
|
193
|
+
* Overlay util for the dashed binding hint shown on bound arrows. Draws stubs
|
|
194
|
+
* along the arrow's handle path, from each bound endpoint's snapped body
|
|
195
|
+
* position to the user's intended (handle) position, with a precision marker
|
|
196
|
+
* at the handle.
|
|
197
|
+
*
|
|
198
|
+
* @public
|
|
199
|
+
*/
|
|
200
|
+
export declare class ArrowBindingHintOverlayUtil extends OverlayUtil<TLArrowBindingHintOverlay> {
|
|
201
|
+
static type: string;
|
|
202
|
+
options: {
|
|
203
|
+
crossSize: number;
|
|
204
|
+
dashedMinZoom: number;
|
|
205
|
+
dashLengthRatio: number;
|
|
206
|
+
dotRadius: number;
|
|
207
|
+
opacity: number;
|
|
208
|
+
strokeWidth: number;
|
|
209
|
+
zIndex: number;
|
|
210
|
+
};
|
|
211
|
+
isActive(): boolean;
|
|
212
|
+
getOverlays(): TLArrowBindingHintOverlay[];
|
|
213
|
+
render(ctx: CanvasRenderingContext2D, overlays: TLArrowBindingHintOverlay[]): void;
|
|
214
|
+
private drawEndpoint;
|
|
215
|
+
/** Tangent direction at the handle, oriented toward the body. */
|
|
216
|
+
private getMarkerAngle;
|
|
217
|
+
}
|
|
218
|
+
|
|
186
219
|
/**
|
|
187
220
|
* @public
|
|
188
221
|
*/
|
|
@@ -201,6 +234,26 @@ export declare class ArrowBindingUtil extends BindingUtil<TLArrowBinding> {
|
|
|
201
234
|
/** @public @react */
|
|
202
235
|
export declare function ArrowDownToolbarItem(): JSX.Element;
|
|
203
236
|
|
|
237
|
+
/**
|
|
238
|
+
* Overlay util for arrow target hints (target shape indicator + edge snap circles).
|
|
239
|
+
*
|
|
240
|
+
* @public
|
|
241
|
+
*/
|
|
242
|
+
export declare class ArrowHintOverlayUtil extends OverlayUtil<TLArrowHintOverlay> {
|
|
243
|
+
static type: string;
|
|
244
|
+
options: {
|
|
245
|
+
edgePointRadius: number;
|
|
246
|
+
edgeRadius: number;
|
|
247
|
+
handleRadius: number;
|
|
248
|
+
lineWidth: number;
|
|
249
|
+
zIndex: number;
|
|
250
|
+
};
|
|
251
|
+
isActive(): boolean;
|
|
252
|
+
getOverlays(): TLArrowHintOverlay[];
|
|
253
|
+
render(ctx: CanvasRenderingContext2D, overlays: TLArrowHintOverlay[]): void;
|
|
254
|
+
/* Excluded from this release type: _renderIndicatorPath */
|
|
255
|
+
}
|
|
256
|
+
|
|
204
257
|
/** @public @react */
|
|
205
258
|
export declare function ArrowLeftToolbarItem(): JSX.Element;
|
|
206
259
|
|
|
@@ -366,8 +419,6 @@ export declare class ArrowShapeUtil extends ShapeUtil<TLArrowShape> {
|
|
|
366
419
|
};
|
|
367
420
|
onDoubleClickHandle(shape: TLArrowShape, handle: TLHandle): TLShapePartial<TLArrowShape> | void;
|
|
368
421
|
component(shape: TLArrowShape): JSX.Element | null;
|
|
369
|
-
indicator(shape: TLArrowShape): JSX.Element | null;
|
|
370
|
-
useLegacyIndicator(): boolean;
|
|
371
422
|
getIndicatorPath(shape: TLArrowShape): {
|
|
372
423
|
additionalPaths: Path2D[];
|
|
373
424
|
clipPath: Path2D;
|
|
@@ -487,8 +538,6 @@ export declare class BookmarkShapeUtil extends BaseBoxShapeUtil<TLBookmarkShape>
|
|
|
487
538
|
getAriaDescriptor(shape: TLBookmarkShape): string | undefined;
|
|
488
539
|
getDefaultProps(): TLBookmarkShape['props'];
|
|
489
540
|
component(shape: TLBookmarkShape): JSX.Element;
|
|
490
|
-
indicator(shape: TLBookmarkShape): JSX.Element;
|
|
491
|
-
useLegacyIndicator(): boolean;
|
|
492
541
|
getIndicatorPath(shape: TLBookmarkShape): Path2D;
|
|
493
542
|
onBeforeCreate(next: TLBookmarkShape): {
|
|
494
543
|
id: TLShapeId_2;
|
|
@@ -549,6 +598,32 @@ export declare interface BreakPointProviderProps {
|
|
|
549
598
|
children: ReactNode;
|
|
550
599
|
}
|
|
551
600
|
|
|
601
|
+
/**
|
|
602
|
+
* Overlay util for the selection brush rectangle.
|
|
603
|
+
*
|
|
604
|
+
* @public
|
|
605
|
+
*/
|
|
606
|
+
export declare class BrushOverlayUtil extends OverlayUtil<TLBrushOverlay> {
|
|
607
|
+
static type: string;
|
|
608
|
+
options: BrushOverlayUtilOptions;
|
|
609
|
+
isActive(): boolean;
|
|
610
|
+
getOverlays(): TLBrushOverlay[];
|
|
611
|
+
render(ctx: CanvasRenderingContext2D, overlays: TLBrushOverlay[]): void;
|
|
612
|
+
renderMinimap(ctx: CanvasRenderingContext2D, overlays: TLBrushOverlay[], zoom: number): void;
|
|
613
|
+
}
|
|
614
|
+
|
|
615
|
+
/** @public */
|
|
616
|
+
export declare interface BrushOverlayUtilDisplayValues {
|
|
617
|
+
fillColor: string;
|
|
618
|
+
strokeColor: string;
|
|
619
|
+
lineWidth: number;
|
|
620
|
+
}
|
|
621
|
+
|
|
622
|
+
/** @public */
|
|
623
|
+
export declare interface BrushOverlayUtilOptions extends OverlayOptionsWithDisplayValues<TLBrushOverlay, BrushOverlayUtilDisplayValues> {
|
|
624
|
+
zIndex: number;
|
|
625
|
+
}
|
|
626
|
+
|
|
552
627
|
/* Excluded from this release type: buildFromV1Document */
|
|
553
628
|
|
|
554
629
|
/** @public @react */
|
|
@@ -593,6 +668,111 @@ export declare function ClipboardMenuGroup(): JSX.Element;
|
|
|
593
668
|
/** @public @react */
|
|
594
669
|
export declare function CloudToolbarItem(): JSX.Element;
|
|
595
670
|
|
|
671
|
+
/**
|
|
672
|
+
* Overlay util for collaborator selection brushes.
|
|
673
|
+
*
|
|
674
|
+
* @public
|
|
675
|
+
*/
|
|
676
|
+
export declare class CollaboratorBrushOverlayUtil extends OverlayUtil<TLCollaboratorBrushOverlay> {
|
|
677
|
+
static type: string;
|
|
678
|
+
options: {
|
|
679
|
+
lineWidth: number;
|
|
680
|
+
zIndex: number;
|
|
681
|
+
};
|
|
682
|
+
isActive(): boolean;
|
|
683
|
+
getOverlays(): TLCollaboratorBrushOverlay[];
|
|
684
|
+
render(ctx: CanvasRenderingContext2D, overlays: TLCollaboratorBrushOverlay[]): void;
|
|
685
|
+
renderMinimap(ctx: CanvasRenderingContext2D, overlays: TLCollaboratorBrushOverlay[]): void;
|
|
686
|
+
}
|
|
687
|
+
|
|
688
|
+
/**
|
|
689
|
+
* Overlay util for collaborator cursors (arrow + name tag + chat message).
|
|
690
|
+
*
|
|
691
|
+
* @public
|
|
692
|
+
*/
|
|
693
|
+
export declare class CollaboratorCursorOverlayUtil extends OverlayUtil<TLCollaboratorCursorOverlay> {
|
|
694
|
+
static type: string;
|
|
695
|
+
options: {
|
|
696
|
+
chatMaxWidth: number;
|
|
697
|
+
fontSize: number;
|
|
698
|
+
nameMaxWidth: number;
|
|
699
|
+
zIndex: number;
|
|
700
|
+
};
|
|
701
|
+
private _truncateCache;
|
|
702
|
+
isActive(): boolean;
|
|
703
|
+
getOverlays(): TLCollaboratorCursorOverlay[];
|
|
704
|
+
render(ctx: CanvasRenderingContext2D, overlays: TLCollaboratorCursorOverlay[]): void;
|
|
705
|
+
/** Name tag (no chat) - colored background with white text */
|
|
706
|
+
private _drawNameTag;
|
|
707
|
+
/** Name title (when chat is present) - text with shadow, no background */
|
|
708
|
+
private _drawNameTitle;
|
|
709
|
+
/** Chat bubble - colored background with white text */
|
|
710
|
+
private _drawChatBubble;
|
|
711
|
+
renderMinimap(ctx: CanvasRenderingContext2D, overlays: TLCollaboratorCursorOverlay[], zoom: number): void;
|
|
712
|
+
private _truncateText;
|
|
713
|
+
private _setTruncatedTextCache;
|
|
714
|
+
}
|
|
715
|
+
|
|
716
|
+
/**
|
|
717
|
+
* Overlay util for off-screen collaborator cursor hints.
|
|
718
|
+
* Shows a small directional arrow at the viewport edge pointing toward the collaborator.
|
|
719
|
+
*
|
|
720
|
+
* @public
|
|
721
|
+
*/
|
|
722
|
+
export declare class CollaboratorHintOverlayUtil extends OverlayUtil<TLCollaboratorHintOverlay> {
|
|
723
|
+
static type: string;
|
|
724
|
+
options: {
|
|
725
|
+
lineWidth: number;
|
|
726
|
+
viewportPadding: number;
|
|
727
|
+
zIndex: number;
|
|
728
|
+
};
|
|
729
|
+
isActive(): boolean;
|
|
730
|
+
getOverlays(): TLCollaboratorHintOverlay[];
|
|
731
|
+
render(ctx: CanvasRenderingContext2D, overlays: TLCollaboratorHintOverlay[]): void;
|
|
732
|
+
/* Excluded from this release type: _isCursorInViewport */
|
|
733
|
+
}
|
|
734
|
+
|
|
735
|
+
/**
|
|
736
|
+
* Overlay util for collaborator scribble strokes (eraser, lasso, etc.).
|
|
737
|
+
*
|
|
738
|
+
* @public
|
|
739
|
+
*/
|
|
740
|
+
export declare class CollaboratorScribbleOverlayUtil extends OverlayUtil<TLCollaboratorScribbleOverlay> {
|
|
741
|
+
static type: string;
|
|
742
|
+
options: {
|
|
743
|
+
cacheSize: number;
|
|
744
|
+
streamline: number;
|
|
745
|
+
zIndex: number;
|
|
746
|
+
};
|
|
747
|
+
private _collabScribblePathCache;
|
|
748
|
+
isActive(): boolean;
|
|
749
|
+
getOverlays(): TLCollaboratorScribbleOverlay[];
|
|
750
|
+
render(ctx: CanvasRenderingContext2D, overlays: TLCollaboratorScribbleOverlay[]): void;
|
|
751
|
+
}
|
|
752
|
+
|
|
753
|
+
/**
|
|
754
|
+
* Overlay util for remote collaborators' shape selection indicators.
|
|
755
|
+
*
|
|
756
|
+
* Renders a per-peer outline around each shape another user has selected,
|
|
757
|
+
* using the peer's color. Drawn under the local `ShapeIndicatorOverlayUtil`
|
|
758
|
+
* (lower z-index) so the local user's selection always appears on top.
|
|
759
|
+
*
|
|
760
|
+
* Non-interactive: contributes no hit-test geometry.
|
|
761
|
+
*
|
|
762
|
+
* @public
|
|
763
|
+
*/
|
|
764
|
+
export declare class CollaboratorShapeIndicatorOverlayUtil extends OverlayUtil<TLCollaboratorShapeIndicatorOverlay> {
|
|
765
|
+
static type: string;
|
|
766
|
+
options: {
|
|
767
|
+
alpha: number;
|
|
768
|
+
lineWidth: number;
|
|
769
|
+
zIndex: number;
|
|
770
|
+
};
|
|
771
|
+
isActive(): boolean;
|
|
772
|
+
getOverlays(): TLCollaboratorShapeIndicatorOverlay[];
|
|
773
|
+
render(ctx: CanvasRenderingContext2D, overlays: TLCollaboratorShapeIndicatorOverlay[]): void;
|
|
774
|
+
}
|
|
775
|
+
|
|
596
776
|
/** @public @react */
|
|
597
777
|
export declare function ColorSchemeMenu(): JSX.Element;
|
|
598
778
|
|
|
@@ -989,6 +1169,130 @@ export declare function DefaultFollowingIndicator(): JSX.Element | null;
|
|
|
989
1169
|
/** @public */
|
|
990
1170
|
export declare const DefaultFontFaces: TLDefaultFonts;
|
|
991
1171
|
|
|
1172
|
+
/**
|
|
1173
|
+
* Built-in geo type definitions keyed by their `geo` prop value. Every default
|
|
1174
|
+
* geo type (rectangle, ellipse, cloud, etc.) is registered here. The same
|
|
1175
|
+
* registry powers path generation, handle snapping, the style panel picker,
|
|
1176
|
+
* and creation defaults — so custom types added through
|
|
1177
|
+
* {@link @tldraw/tldraw#GeoShapeUtil.configure | GeoShapeUtil.configure()} get
|
|
1178
|
+
* the same treatment as the built-ins.
|
|
1179
|
+
*
|
|
1180
|
+
* The key order here defines the visual order of items in the geo style panel
|
|
1181
|
+
* picker.
|
|
1182
|
+
*
|
|
1183
|
+
* @public
|
|
1184
|
+
*/
|
|
1185
|
+
export declare const defaultGeoTypeDefinitions: {
|
|
1186
|
+
readonly 'arrow-down': {
|
|
1187
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1188
|
+
readonly icon: "geo-arrow-down";
|
|
1189
|
+
readonly snapType: "polygon";
|
|
1190
|
+
};
|
|
1191
|
+
readonly 'arrow-left': {
|
|
1192
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1193
|
+
readonly icon: "geo-arrow-left";
|
|
1194
|
+
readonly snapType: "polygon";
|
|
1195
|
+
};
|
|
1196
|
+
readonly 'arrow-right': {
|
|
1197
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1198
|
+
readonly icon: "geo-arrow-right";
|
|
1199
|
+
readonly snapType: "polygon";
|
|
1200
|
+
};
|
|
1201
|
+
readonly 'arrow-up': {
|
|
1202
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1203
|
+
readonly icon: "geo-arrow-up";
|
|
1204
|
+
readonly snapType: "polygon";
|
|
1205
|
+
};
|
|
1206
|
+
readonly 'check-box': {
|
|
1207
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1208
|
+
readonly icon: "geo-check-box";
|
|
1209
|
+
readonly snapType: "polygon";
|
|
1210
|
+
};
|
|
1211
|
+
readonly 'rhombus-2': {
|
|
1212
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1213
|
+
readonly icon: "geo-rhombus-2";
|
|
1214
|
+
readonly snapType: "polygon";
|
|
1215
|
+
};
|
|
1216
|
+
readonly 'x-box': {
|
|
1217
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape, strokeWidth: number) => PathBuilder;
|
|
1218
|
+
readonly icon: "geo-x-box";
|
|
1219
|
+
readonly snapType: "polygon";
|
|
1220
|
+
};
|
|
1221
|
+
readonly cloud: {
|
|
1222
|
+
readonly defaultSize: {
|
|
1223
|
+
readonly h: 180;
|
|
1224
|
+
readonly w: 300;
|
|
1225
|
+
};
|
|
1226
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1227
|
+
readonly icon: "geo-cloud";
|
|
1228
|
+
readonly snapType: "blobby";
|
|
1229
|
+
};
|
|
1230
|
+
readonly diamond: {
|
|
1231
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1232
|
+
readonly icon: "geo-diamond";
|
|
1233
|
+
readonly snapType: "polygon";
|
|
1234
|
+
};
|
|
1235
|
+
readonly ellipse: {
|
|
1236
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1237
|
+
readonly icon: "geo-ellipse";
|
|
1238
|
+
readonly snapType: "blobby";
|
|
1239
|
+
};
|
|
1240
|
+
readonly heart: {
|
|
1241
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1242
|
+
readonly icon: "geo-heart";
|
|
1243
|
+
readonly snapType: "blobby";
|
|
1244
|
+
};
|
|
1245
|
+
readonly hexagon: {
|
|
1246
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1247
|
+
readonly icon: "geo-hexagon";
|
|
1248
|
+
readonly snapType: "polygon";
|
|
1249
|
+
};
|
|
1250
|
+
readonly octagon: {
|
|
1251
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1252
|
+
readonly icon: "geo-octagon";
|
|
1253
|
+
readonly snapType: "polygon";
|
|
1254
|
+
};
|
|
1255
|
+
readonly oval: {
|
|
1256
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1257
|
+
readonly icon: "geo-oval";
|
|
1258
|
+
readonly snapType: "blobby";
|
|
1259
|
+
};
|
|
1260
|
+
readonly pentagon: {
|
|
1261
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1262
|
+
readonly icon: "geo-pentagon";
|
|
1263
|
+
readonly snapType: "polygon";
|
|
1264
|
+
};
|
|
1265
|
+
readonly rectangle: {
|
|
1266
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1267
|
+
readonly icon: "geo-rectangle";
|
|
1268
|
+
readonly snapType: "polygon";
|
|
1269
|
+
};
|
|
1270
|
+
readonly rhombus: {
|
|
1271
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1272
|
+
readonly icon: "geo-rhombus";
|
|
1273
|
+
readonly snapType: "polygon";
|
|
1274
|
+
};
|
|
1275
|
+
readonly star: {
|
|
1276
|
+
readonly defaultSize: {
|
|
1277
|
+
readonly h: 190;
|
|
1278
|
+
readonly w: 200;
|
|
1279
|
+
};
|
|
1280
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1281
|
+
readonly icon: "geo-star";
|
|
1282
|
+
readonly snapType: "polygon";
|
|
1283
|
+
};
|
|
1284
|
+
readonly trapezoid: {
|
|
1285
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1286
|
+
readonly icon: "geo-trapezoid";
|
|
1287
|
+
readonly snapType: "polygon";
|
|
1288
|
+
};
|
|
1289
|
+
readonly triangle: {
|
|
1290
|
+
readonly getPath: (w: number, h: number, shape: TLGeoShape) => PathBuilder;
|
|
1291
|
+
readonly icon: "geo-triangle";
|
|
1292
|
+
readonly snapType: "polygon";
|
|
1293
|
+
};
|
|
1294
|
+
};
|
|
1295
|
+
|
|
992
1296
|
/** @public */
|
|
993
1297
|
export declare function defaultHandleExternalEmbedContent<T>(editor: Editor, { point, url, embed }: {
|
|
994
1298
|
embed: T;
|
|
@@ -1011,6 +1315,9 @@ export declare function defaultHandleExternalFileContent(editor: Editor, { point
|
|
|
1011
1315
|
point?: VecLike;
|
|
1012
1316
|
}, options: TLDefaultExternalContentHandlerOpts): Promise<void>;
|
|
1013
1317
|
|
|
1318
|
+
/** @public */
|
|
1319
|
+
export declare function defaultHandleExternalFileReplaceContent(editor: Editor, { file, shapeId }: TLFileReplaceExternalContent, options: TLDefaultExternalContentHandlerOpts): Promise<TLAsset | undefined>;
|
|
1320
|
+
|
|
1014
1321
|
/** @public */
|
|
1015
1322
|
export declare function defaultHandleExternalSvgTextContent(editor: Editor, { point, text }: {
|
|
1016
1323
|
point?: VecLike;
|
|
@@ -1087,6 +1394,9 @@ export declare function DefaultMinimap(): JSX.Element;
|
|
|
1087
1394
|
/** @public @react */
|
|
1088
1395
|
export declare const DefaultNavigationPanel: NamedExoticComponent<object>;
|
|
1089
1396
|
|
|
1397
|
+
/** @public */
|
|
1398
|
+
export declare const defaultOverlayUtils: readonly [typeof CollaboratorShapeIndicatorOverlayUtil, typeof ShapeIndicatorOverlayUtil, typeof SelectionForegroundOverlayUtil, typeof ShapeHandleOverlayUtil, typeof BrushOverlayUtil, typeof ZoomBrushOverlayUtil, typeof SnapIndicatorOverlayUtil, typeof ScribbleOverlayUtil, typeof CollaboratorBrushOverlayUtil, typeof CollaboratorScribbleOverlayUtil, typeof CollaboratorHintOverlayUtil, typeof ArrowHintOverlayUtil, typeof ArrowBindingHintOverlayUtil, typeof CollaboratorCursorOverlayUtil];
|
|
1399
|
+
|
|
1090
1400
|
/** @public @react */
|
|
1091
1401
|
export declare const DefaultPageMenu: NamedExoticComponent<object>;
|
|
1092
1402
|
|
|
@@ -1289,8 +1599,6 @@ export declare class DrawShapeUtil extends ShapeUtil<TLDrawShape> {
|
|
|
1289
1599
|
getDefaultProps(): TLDrawShape['props'];
|
|
1290
1600
|
getGeometry(shape: TLDrawShape): Circle2d | Polyline2d;
|
|
1291
1601
|
component(shape: TLDrawShape): JSX.Element;
|
|
1292
|
-
indicator(shape: TLDrawShape): JSX.Element;
|
|
1293
|
-
useLegacyIndicator(): boolean;
|
|
1294
1602
|
getIndicatorPath(shape: TLDrawShape): Path2D;
|
|
1295
1603
|
toSvg(shape: TLDrawShape, ctx: SvgExportContext): JSX.Element;
|
|
1296
1604
|
getCanvasSvgDefs(): TLShapeUtilCanvasSvgDef[];
|
|
@@ -1627,8 +1935,6 @@ export declare class EmbedShapeUtil extends BaseBoxShapeUtil<TLEmbedShape> {
|
|
|
1627
1935
|
isAspectRatioLocked(shape: TLEmbedShape): boolean;
|
|
1628
1936
|
onResize(shape: TLEmbedShape, info: TLResizeInfo<TLEmbedShape>): TLEmbedShape;
|
|
1629
1937
|
component(shape: TLEmbedShape): JSX.Element | null;
|
|
1630
|
-
indicator(shape: TLEmbedShape): JSX.Element;
|
|
1631
|
-
useLegacyIndicator(): boolean;
|
|
1632
1938
|
getIndicatorPath(shape: TLEmbedShape): Path2D;
|
|
1633
1939
|
getInterpolatedProps(startShape: TLEmbedShape, endShape: TLEmbedShape, t: number): TLEmbedShapeProps;
|
|
1634
1940
|
}
|
|
@@ -1644,7 +1950,14 @@ export declare class EraserTool extends StateNode {
|
|
|
1644
1950
|
static initial: string;
|
|
1645
1951
|
static isLockable: boolean;
|
|
1646
1952
|
static children(): TLStateNodeConstructor[];
|
|
1647
|
-
|
|
1953
|
+
info: {
|
|
1954
|
+
onInteractionEnd?: string | undefined;
|
|
1955
|
+
};
|
|
1956
|
+
onEnter(info?: {
|
|
1957
|
+
onInteractionEnd?: string;
|
|
1958
|
+
}): void;
|
|
1959
|
+
onExit(): void;
|
|
1960
|
+
maybeReturnToOriginatingTool(): void;
|
|
1648
1961
|
}
|
|
1649
1962
|
|
|
1650
1963
|
/** @public @react */
|
|
@@ -1705,7 +2018,7 @@ export declare interface FeatureFlagsProps {
|
|
|
1705
2018
|
}
|
|
1706
2019
|
|
|
1707
2020
|
/**
|
|
1708
|
-
* Fit a frame to its content.
|
|
2021
|
+
* Fit a frame (or any frame-like container shape) to its content.
|
|
1709
2022
|
*
|
|
1710
2023
|
* @param id - Id of the frame you wish to fit to content.
|
|
1711
2024
|
* @param editor - tlraw editor instance.
|
|
@@ -1741,7 +2054,7 @@ export declare class FrameShapeTool extends BaseBoxShapeTool {
|
|
|
1741
2054
|
}
|
|
1742
2055
|
|
|
1743
2056
|
/** @public */
|
|
1744
|
-
export declare class FrameShapeUtil extends
|
|
2057
|
+
export declare class FrameShapeUtil extends BaseFrameLikeShapeUtil<TLFrameShape> {
|
|
1745
2058
|
static type: "frame";
|
|
1746
2059
|
static props: RecordProps<TLFrameShape>;
|
|
1747
2060
|
static migrations: TLPropsMigrations;
|
|
@@ -1759,13 +2072,7 @@ export declare class FrameShapeUtil extends BaseBoxShapeUtil<TLFrameShape> {
|
|
|
1759
2072
|
getText(shape: TLFrameShape): string | undefined;
|
|
1760
2073
|
component(shape: TLFrameShape): JSX.Element;
|
|
1761
2074
|
toSvg(shape: TLFrameShape, ctx: SvgExportContext): JSX.Element;
|
|
1762
|
-
indicator(shape: TLFrameShape): JSX.Element;
|
|
1763
|
-
useLegacyIndicator(): boolean;
|
|
1764
2075
|
getIndicatorPath(shape: TLFrameShape): Path2D;
|
|
1765
|
-
providesBackgroundForChildren(): boolean;
|
|
1766
|
-
getClipPath(shape: TLFrameShape): Vec[];
|
|
1767
|
-
canReceiveNewChildrenOfType(shape: TLShape): boolean;
|
|
1768
|
-
onResize(shape: any, info: TLResizeInfo<any>): any;
|
|
1769
2076
|
getInterpolatedProps(startShape: TLFrameShape, endShape: TLFrameShape, t: number): TLFrameShapeProps;
|
|
1770
2077
|
onDoubleClickEdge(shape: TLFrameShape, info: TLClickEventInfo): {
|
|
1771
2078
|
id: TLShapeId_2;
|
|
@@ -1779,8 +2086,6 @@ export declare class FrameShapeUtil extends BaseBoxShapeUtil<TLFrameShape> {
|
|
|
1779
2086
|
id: TLShapeId_2;
|
|
1780
2087
|
type: "frame";
|
|
1781
2088
|
};
|
|
1782
|
-
onDragShapesIn(shape: TLFrameShape, draggingShapes: TLShape[], { initialParentIds, initialIndices }: TLDragShapesOverInfo): void;
|
|
1783
|
-
onDragShapesOut(shape: TLFrameShape, draggingShapes: TLShape[], info: TLDragShapesOutInfo): void;
|
|
1784
2089
|
}
|
|
1785
2090
|
|
|
1786
2091
|
/** @public */
|
|
@@ -1803,6 +2108,26 @@ export declare function FrameToolbarItem(): JSX.Element;
|
|
|
1803
2108
|
/** @public */
|
|
1804
2109
|
export declare interface GeoShapeOptions extends ShapeOptionsWithDisplayValues<TLGeoShape, GeoShapeUtilDisplayValues> {
|
|
1805
2110
|
showTextOutline: boolean;
|
|
2111
|
+
/**
|
|
2112
|
+
* A map of custom geo type definitions. Each key becomes a new value for
|
|
2113
|
+
* {@link @tldraw/editor#GeoShapeGeoStyle} that can be used in the style panel
|
|
2114
|
+
* and on shapes. Custom geo types inherit all standard geo shape behavior
|
|
2115
|
+
* (labels, resizing, styling, etc.).
|
|
2116
|
+
*
|
|
2117
|
+
* @example
|
|
2118
|
+
* ```ts
|
|
2119
|
+
* const MyGeoShapeUtil = GeoShapeUtil.configure({
|
|
2120
|
+
* customGeoTypes: {
|
|
2121
|
+
* 'my-shape': {
|
|
2122
|
+
* getPath: (w, h) => new PathBuilder().moveTo(0, 0).lineTo(w, 0).lineTo(w, h).lineTo(0, h).close(),
|
|
2123
|
+
* snapType: 'polygon',
|
|
2124
|
+
* icon: 'geo-rectangle',
|
|
2125
|
+
* },
|
|
2126
|
+
* },
|
|
2127
|
+
* })
|
|
2128
|
+
* ```
|
|
2129
|
+
*/
|
|
2130
|
+
customGeoTypes?: Record<string, GeoTypeDefinition>;
|
|
1806
2131
|
}
|
|
1807
2132
|
|
|
1808
2133
|
/** @public */
|
|
@@ -1818,6 +2143,9 @@ export declare class GeoShapeUtil extends BaseBoxShapeUtil<TLGeoShape> {
|
|
|
1818
2143
|
static type: "geo";
|
|
1819
2144
|
static props: RecordProps<TLGeoShape>;
|
|
1820
2145
|
static migrations: TLPropsMigrations;
|
|
2146
|
+
static configure<T extends TLShapeUtilConstructor<any, any>>(this: T, options: T extends new (...args: any[]) => {
|
|
2147
|
+
options: infer Options;
|
|
2148
|
+
} ? Partial<Options> : never): T;
|
|
1821
2149
|
options: GeoShapeOptions;
|
|
1822
2150
|
canEdit(shape: TLGeoShape): boolean;
|
|
1823
2151
|
getDefaultProps(): TLGeoShape['props'];
|
|
@@ -1826,8 +2154,6 @@ export declare class GeoShapeUtil extends BaseBoxShapeUtil<TLGeoShape> {
|
|
|
1826
2154
|
getText(shape: TLGeoShape): string;
|
|
1827
2155
|
getFontFaces(shape: TLGeoShape): TLFontFace[];
|
|
1828
2156
|
component(shape: TLGeoShape): JSX.Element;
|
|
1829
|
-
indicator(shape: TLGeoShape): JSX.Element | null;
|
|
1830
|
-
useLegacyIndicator(): boolean;
|
|
1831
2157
|
getIndicatorPath(shape: TLGeoShape): Path2D | undefined;
|
|
1832
2158
|
toSvg(shape: TLGeoShape, ctx: SvgExportContext): JSX.Element;
|
|
1833
2159
|
getCanvasSvgDefs(): TLShapeUtilCanvasSvgDef[];
|
|
@@ -1909,6 +2235,39 @@ export declare class GeoShapeUtil extends BaseBoxShapeUtil<TLGeoShape> {
|
|
|
1909
2235
|
y: number;
|
|
1910
2236
|
} | undefined;
|
|
1911
2237
|
onDoubleClick(shape: TLGeoShape): {
|
|
2238
|
+
id: TLShapeId;
|
|
2239
|
+
index: IndexKey;
|
|
2240
|
+
isLocked: boolean;
|
|
2241
|
+
meta: JsonObject;
|
|
2242
|
+
opacity: number;
|
|
2243
|
+
parentId: TLParentId;
|
|
2244
|
+
props: {
|
|
2245
|
+
align: "end-legacy" | "end" | "middle-legacy" | "middle" | "start-legacy" | "start";
|
|
2246
|
+
color: TLDefaultColorStyle;
|
|
2247
|
+
dash: "dashed" | "dotted" | "draw" | "none" | "solid";
|
|
2248
|
+
fill: "fill" | "lined-fill" | "none" | "pattern" | "semi" | "solid";
|
|
2249
|
+
font: TLDefaultFontStyle;
|
|
2250
|
+
geo: "arrow-down" | "arrow-left" | "arrow-right" | "arrow-up" | "check-box" | "cloud" | "diamond" | "ellipse" | "heart" | "hexagon" | "octagon" | "oval" | "pentagon" | "rectangle" | "rhombus-2" | "rhombus" | "star" | "trapezoid" | "triangle" | "x-box";
|
|
2251
|
+
growY: number;
|
|
2252
|
+
h: number;
|
|
2253
|
+
labelColor: TLDefaultColorStyle;
|
|
2254
|
+
richText: {
|
|
2255
|
+
attrs?: any;
|
|
2256
|
+
content: unknown[];
|
|
2257
|
+
type: string;
|
|
2258
|
+
};
|
|
2259
|
+
scale: number;
|
|
2260
|
+
size: "l" | "m" | "s" | "xl";
|
|
2261
|
+
url: string;
|
|
2262
|
+
verticalAlign: "end" | "middle" | "start";
|
|
2263
|
+
w: number;
|
|
2264
|
+
};
|
|
2265
|
+
rotation: number;
|
|
2266
|
+
type: "geo";
|
|
2267
|
+
typeName: "shape";
|
|
2268
|
+
x: number;
|
|
2269
|
+
y: number;
|
|
2270
|
+
} | {
|
|
1912
2271
|
id: TLShapeId;
|
|
1913
2272
|
index: IndexKey;
|
|
1914
2273
|
isLocked: boolean;
|
|
@@ -1988,6 +2347,42 @@ export declare interface GeoShapeUtilDisplayValues {
|
|
|
1988
2347
|
minSizeWithLabel: number;
|
|
1989
2348
|
}
|
|
1990
2349
|
|
|
2350
|
+
/**
|
|
2351
|
+
* Defines the behavior for a geo shape type. Every built-in geo type is
|
|
2352
|
+
* registered through this same interface (see {@link defaultGeoTypeDefinitions}),
|
|
2353
|
+
* and consumers can register additional types via
|
|
2354
|
+
* {@link @tldraw/tldraw#GeoShapeUtil.configure | GeoShapeUtil.configure()}.
|
|
2355
|
+
*
|
|
2356
|
+
* @public
|
|
2357
|
+
*/
|
|
2358
|
+
export declare interface GeoTypeDefinition {
|
|
2359
|
+
/**
|
|
2360
|
+
* Generate the path geometry for this geo type.
|
|
2361
|
+
*
|
|
2362
|
+
* @param w - The width of the shape (already clamped to min 1)
|
|
2363
|
+
* @param h - The height of the shape (already clamped to min 1, includes growY)
|
|
2364
|
+
* @param shape - The full geo shape record, for access to props like id, dash, fill, etc.
|
|
2365
|
+
* @param strokeWidth - The scaled stroke width (strokeWidth * scale)
|
|
2366
|
+
*/
|
|
2367
|
+
getPath(w: number, h: number, shape: TLGeoShape, strokeWidth: number): PathBuilder;
|
|
2368
|
+
/** Snap behavior: 'polygon' snaps to vertices + center, 'blobby' snaps to center only. */
|
|
2369
|
+
snapType: 'blobby' | 'polygon';
|
|
2370
|
+
/** Default creation size when clicking (not dragging). Defaults to 200x200. */
|
|
2371
|
+
defaultSize?: {
|
|
2372
|
+
h: number;
|
|
2373
|
+
w: number;
|
|
2374
|
+
};
|
|
2375
|
+
/** Icon name for the style panel geo picker. */
|
|
2376
|
+
icon: string;
|
|
2377
|
+
/**
|
|
2378
|
+
* Optional double-click handler. Return an object with partial props to update the shape,
|
|
2379
|
+
* or void to do nothing.
|
|
2380
|
+
*/
|
|
2381
|
+
onDoubleClick?(shape: TLGeoShape): {
|
|
2382
|
+
props: Partial<TLGeoShape['props']>;
|
|
2383
|
+
} | void;
|
|
2384
|
+
}
|
|
2385
|
+
|
|
1991
2386
|
/** @public */
|
|
1992
2387
|
export declare function getArrowBindings(editor: Editor, shape: TLArrowShape): TLArrowBindings;
|
|
1993
2388
|
|
|
@@ -2068,6 +2463,14 @@ export declare function getFontFamily(theme: TLTheme, font: string): string;
|
|
|
2068
2463
|
*/
|
|
2069
2464
|
export declare function getFontStyleItems(theme: TLTheme): StyleValuesForUi<string>;
|
|
2070
2465
|
|
|
2466
|
+
/**
|
|
2467
|
+
* Look up a geo type definition by name, checking custom types first then
|
|
2468
|
+
* falling back to the built-in registry.
|
|
2469
|
+
*
|
|
2470
|
+
* @public
|
|
2471
|
+
*/
|
|
2472
|
+
export declare function getGeoTypeDefinition(name: string, customGeoTypes?: Record<string, GeoTypeDefinition>): GeoTypeDefinition | undefined;
|
|
2473
|
+
|
|
2071
2474
|
/** @public */
|
|
2072
2475
|
export declare function getHitShapeOnCanvasPointerDown(editor: Editor, hitLabels?: boolean): TLShape | undefined;
|
|
2073
2476
|
|
|
@@ -2205,8 +2608,6 @@ export declare class HighlightShapeUtil extends ShapeUtil<TLHighlightShape> {
|
|
|
2205
2608
|
getGeometry(shape: TLHighlightShape): Circle2d | Polygon2d;
|
|
2206
2609
|
component(shape: TLHighlightShape): JSX.Element;
|
|
2207
2610
|
backgroundComponent(shape: TLHighlightShape): JSX.Element;
|
|
2208
|
-
indicator(shape: TLHighlightShape): JSX.Element;
|
|
2209
|
-
useLegacyIndicator(): boolean;
|
|
2210
2611
|
getIndicatorPath(shape: TLHighlightShape): Path2D;
|
|
2211
2612
|
toSvg(shape: TLHighlightShape, ctx: SvgExportContext): JSX.Element;
|
|
2212
2613
|
toBackgroundSvg(shape: TLHighlightShape, ctx: SvgExportContext): JSX.Element;
|
|
@@ -2276,8 +2677,6 @@ export declare class ImageShapeUtil extends BaseBoxShapeUtil<TLImageShape> {
|
|
|
2276
2677
|
getAriaDescriptor(shape: TLImageShape): string;
|
|
2277
2678
|
onResize(shape: TLImageShape, info: TLResizeInfo<TLImageShape>): TLImageShape;
|
|
2278
2679
|
component(shape: TLImageShape): JSX.Element;
|
|
2279
|
-
indicator(shape: TLImageShape): JSX.Element | null;
|
|
2280
|
-
useLegacyIndicator(): boolean;
|
|
2281
2680
|
getIndicatorPath(shape: TLImageShape): Path2D | undefined;
|
|
2282
2681
|
toSvg(shape: TLImageShape, ctx: SvgExportContext): Promise<JSX.Element | null>;
|
|
2283
2682
|
onDoubleClickEdge(shape: TLImageShape): void;
|
|
@@ -2288,6 +2687,9 @@ export declare class ImageShapeUtil extends BaseBoxShapeUtil<TLImageShape> {
|
|
|
2288
2687
|
export declare interface ImageShapeUtilDisplayValues {
|
|
2289
2688
|
}
|
|
2290
2689
|
|
|
2690
|
+
/** @public @react */
|
|
2691
|
+
export declare function InputModeMenu(): JSX.Element;
|
|
2692
|
+
|
|
2291
2693
|
/** @public */
|
|
2292
2694
|
export declare const KeyboardShiftEnterTweakExtension: Extension<any, any>;
|
|
2293
2695
|
|
|
@@ -2412,8 +2814,6 @@ export declare class LineShapeUtil extends ShapeUtil<TLLineShape> {
|
|
|
2412
2814
|
y: number;
|
|
2413
2815
|
} | undefined;
|
|
2414
2816
|
component(shape: TLLineShape): JSX.Element;
|
|
2415
|
-
indicator(shape: TLLineShape): JSX.Element | null;
|
|
2416
|
-
useLegacyIndicator(): boolean;
|
|
2417
2817
|
getIndicatorPath(shape: TLLineShape): Path2D;
|
|
2418
2818
|
toSvg(shape: TLLineShape, ctx: SvgExportContext): JSX.Element;
|
|
2419
2819
|
getHandleSnapGeometry(shape: TLLineShape): HandleSnapGeometry;
|
|
@@ -2491,8 +2891,6 @@ export declare class NoteShapeUtil extends ShapeUtil<TLNoteShape> {
|
|
|
2491
2891
|
getReferencedUserIds(shape: TLNoteShape): string[];
|
|
2492
2892
|
getFontFaces(shape: TLNoteShape): TLFontFace[];
|
|
2493
2893
|
component(shape: TLNoteShape): JSX.Element;
|
|
2494
|
-
indicator(shape: TLNoteShape): JSX.Element;
|
|
2495
|
-
useLegacyIndicator(): boolean;
|
|
2496
2894
|
getIndicatorPath(shape: TLNoteShape): Path2D;
|
|
2497
2895
|
toSvg(shape: TLNoteShape, ctx: SvgExportContext): JSX.Element;
|
|
2498
2896
|
onBeforeCreate(next: TLNoteShape): {
|
|
@@ -2842,7 +3240,7 @@ export declare function registerDefaultExternalContentHandlers(editor: Editor, o
|
|
|
2842
3240
|
export declare function registerDefaultSideEffects(editor: Editor): () => void;
|
|
2843
3241
|
|
|
2844
3242
|
/**
|
|
2845
|
-
* Remove a frame.
|
|
3243
|
+
* Remove a frame (or any frame-like container shape).
|
|
2846
3244
|
*
|
|
2847
3245
|
* @param editor - tldraw editor instance.
|
|
2848
3246
|
* @param ids - Ids of the frames you wish to remove.
|
|
@@ -2984,9 +3382,71 @@ export declare const RTL_LANGUAGES: Set<string>;
|
|
|
2984
3382
|
*/
|
|
2985
3383
|
export declare function sanitizeSvg(svgText: string): string;
|
|
2986
3384
|
|
|
3385
|
+
/**
|
|
3386
|
+
* Overlay util for scribble strokes (eraser, lasso selection, etc.).
|
|
3387
|
+
*
|
|
3388
|
+
* @public
|
|
3389
|
+
*/
|
|
3390
|
+
export declare class ScribbleOverlayUtil extends OverlayUtil<TLScribbleOverlay> {
|
|
3391
|
+
static type: string;
|
|
3392
|
+
options: {
|
|
3393
|
+
cacheSize: number;
|
|
3394
|
+
streamline: number;
|
|
3395
|
+
zIndex: number;
|
|
3396
|
+
};
|
|
3397
|
+
private _scribblePathCache;
|
|
3398
|
+
isActive(): boolean;
|
|
3399
|
+
getOverlays(): TLScribbleOverlay[];
|
|
3400
|
+
render(ctx: CanvasRenderingContext2D, overlays: TLScribbleOverlay[]): void;
|
|
3401
|
+
}
|
|
3402
|
+
|
|
2987
3403
|
/** @public @react */
|
|
2988
3404
|
export declare function SelectAllMenuItem(): JSX.Element;
|
|
2989
3405
|
|
|
3406
|
+
/**
|
|
3407
|
+
* Overlay util for selection foreground handles (resize corners/edges, rotate corners, mobile rotate).
|
|
3408
|
+
* Each interactive element of the selection foreground becomes its own overlay instance.
|
|
3409
|
+
*
|
|
3410
|
+
* @public
|
|
3411
|
+
*/
|
|
3412
|
+
export declare class SelectionForegroundOverlayUtil extends OverlayUtil<TLSelectionForegroundOverlay> {
|
|
3413
|
+
static type: string;
|
|
3414
|
+
options: {
|
|
3415
|
+
lineWidth: number;
|
|
3416
|
+
zIndex: number;
|
|
3417
|
+
};
|
|
3418
|
+
isActive(): boolean;
|
|
3419
|
+
getOverlays(): TLSelectionForegroundOverlay[];
|
|
3420
|
+
getGeometry(overlay: TLSelectionForegroundOverlay): Geometry2d | null;
|
|
3421
|
+
render(ctx: CanvasRenderingContext2D, _overlays: TLSelectionForegroundOverlay[]): void;
|
|
3422
|
+
getCursor(overlay: TLSelectionForegroundOverlay): TLCursorType | undefined;
|
|
3423
|
+
private _collectResizeCornerOverlays;
|
|
3424
|
+
private _collectResizeEdgeOverlays;
|
|
3425
|
+
private _collectRotateOverlays;
|
|
3426
|
+
private _getResizeHandleGeometry;
|
|
3427
|
+
private _getRotateHandleGeometry;
|
|
3428
|
+
private _getMobileRotateGeometry;
|
|
3429
|
+
private _renderSelectionBox;
|
|
3430
|
+
private _renderResizeCorners;
|
|
3431
|
+
private _renderCropHandles;
|
|
3432
|
+
private _renderMobileRotateHandle;
|
|
3433
|
+
private _renderTextResizeHandles;
|
|
3434
|
+
/**
|
|
3435
|
+
* Single source of truth for the derived state the selection foreground needs.
|
|
3436
|
+
* Called from `getOverlays()`, `getGeometry()`, and `render()` so their visibility
|
|
3437
|
+
* predicates can't drift. Returns `null` when no selection UI should appear at all
|
|
3438
|
+
* (nothing selected, or the only selected shape is hidden).
|
|
3439
|
+
*/
|
|
3440
|
+
private _computeSelectionState;
|
|
3441
|
+
private _getMobileRotateCenter;
|
|
3442
|
+
private _getThemeColors;
|
|
3443
|
+
private _makeOverlay;
|
|
3444
|
+
private _getEdgeLocalPoints;
|
|
3445
|
+
private _getRotateHandleLocalCenter;
|
|
3446
|
+
private _getCornerLocalPoint;
|
|
3447
|
+
private _localRectToPoints;
|
|
3448
|
+
}
|
|
3449
|
+
|
|
2990
3450
|
/** @public */
|
|
2991
3451
|
export declare class SelectTool extends StateNode {
|
|
2992
3452
|
static id: string;
|
|
@@ -3015,12 +3475,48 @@ export declare function serializeTldrawJsonBlob(editor: Editor): Promise<Blob>;
|
|
|
3015
3475
|
/** @public */
|
|
3016
3476
|
export declare function setStrokePointRadii(strokePoints: StrokePoint[], options: StrokeOptions): StrokePoint[];
|
|
3017
3477
|
|
|
3478
|
+
/**
|
|
3479
|
+
* Overlay util for shape handles (arrow endpoints, line vertices, etc.).
|
|
3480
|
+
*
|
|
3481
|
+
* @public
|
|
3482
|
+
*/
|
|
3483
|
+
export declare class ShapeHandleOverlayUtil extends OverlayUtil<TLShapeHandleOverlay> {
|
|
3484
|
+
static type: string;
|
|
3485
|
+
options: {
|
|
3486
|
+
lineWidth: number;
|
|
3487
|
+
zIndex: number;
|
|
3488
|
+
};
|
|
3489
|
+
isActive(): boolean;
|
|
3490
|
+
getOverlays(): TLShapeHandleOverlay[];
|
|
3491
|
+
getGeometry(overlay: TLShapeHandleOverlay): Geometry2d | null;
|
|
3492
|
+
getCursor(_overlay: TLShapeHandleOverlay): TLCursorType | undefined;
|
|
3493
|
+
render(ctx: CanvasRenderingContext2D, overlays: TLShapeHandleOverlay[]): void;
|
|
3494
|
+
}
|
|
3495
|
+
|
|
3018
3496
|
/** @public */
|
|
3019
3497
|
export declare interface ShapeOptionsWithDisplayValues<Shape extends TLShape, DisplayValues extends object> {
|
|
3020
3498
|
getDefaultDisplayValues(editor: Editor, shape: Shape, theme: TLTheme, colorMode: 'dark' | 'light'): DisplayValues;
|
|
3021
3499
|
getCustomDisplayValues(editor: Editor, shape: Shape, theme: TLTheme, colorMode: 'dark' | 'light'): Partial<DisplayValues>;
|
|
3022
3500
|
}
|
|
3023
3501
|
|
|
3502
|
+
/**
|
|
3503
|
+
* Overlay util for snap alignment indicators (point snap lines and gap indicators).
|
|
3504
|
+
*
|
|
3505
|
+
* @public
|
|
3506
|
+
*/
|
|
3507
|
+
export declare class SnapIndicatorOverlayUtil extends OverlayUtil<TLSnapIndicatorOverlay> {
|
|
3508
|
+
static type: string;
|
|
3509
|
+
options: {
|
|
3510
|
+
lineWidth: number;
|
|
3511
|
+
zIndex: number;
|
|
3512
|
+
};
|
|
3513
|
+
isActive(): boolean;
|
|
3514
|
+
getOverlays(): TLSnapIndicatorOverlay[];
|
|
3515
|
+
render(ctx: CanvasRenderingContext2D, overlays: TLSnapIndicatorOverlay[]): void;
|
|
3516
|
+
private _renderPoints;
|
|
3517
|
+
private _renderGaps;
|
|
3518
|
+
}
|
|
3519
|
+
|
|
3024
3520
|
/** @public */
|
|
3025
3521
|
export declare interface SolidPathBuilderOpts extends BasePathBuilderOpts {
|
|
3026
3522
|
style: 'solid';
|
|
@@ -3285,8 +3781,6 @@ export declare class TextShapeUtil extends ShapeUtil<TLTextShape> {
|
|
|
3285
3781
|
canEdit(shape: TLTextShape): boolean;
|
|
3286
3782
|
isAspectRatioLocked(shape: TLTextShape): boolean;
|
|
3287
3783
|
component(shape: TLTextShape): JSX.Element;
|
|
3288
|
-
indicator(shape: TLTextShape): JSX.Element | null;
|
|
3289
|
-
useLegacyIndicator(): boolean;
|
|
3290
3784
|
getIndicatorPath(shape: TLTextShape): Path2D | undefined;
|
|
3291
3785
|
toSvg(shape: TLTextShape, ctx: SvgExportContext): JSX.Element;
|
|
3292
3786
|
onResize(shape: TLTextShape, info: TLResizeInfo<TLTextShape>): {
|
|
@@ -3380,12 +3874,55 @@ export declare interface TLArcInfo {
|
|
|
3380
3874
|
sweepFlag: number;
|
|
3381
3875
|
}
|
|
3382
3876
|
|
|
3877
|
+
/** @public */
|
|
3878
|
+
export declare interface TLArrowBindingHintOverlay extends TLOverlay {
|
|
3879
|
+
props: {
|
|
3880
|
+
arrowId: TLShapeId;
|
|
3881
|
+
};
|
|
3882
|
+
}
|
|
3883
|
+
|
|
3383
3884
|
/** @public */
|
|
3384
3885
|
export declare interface TLArrowBindings {
|
|
3385
3886
|
start: TLArrowBinding | undefined;
|
|
3386
3887
|
end: TLArrowBinding | undefined;
|
|
3387
3888
|
}
|
|
3388
3889
|
|
|
3890
|
+
/** @public */
|
|
3891
|
+
export declare interface TLArrowHintOverlay extends TLOverlay {
|
|
3892
|
+
props: {
|
|
3893
|
+
anchorX: number;
|
|
3894
|
+
anchorY: number;
|
|
3895
|
+
arrowKind: string;
|
|
3896
|
+
handles: {
|
|
3897
|
+
bottom: {
|
|
3898
|
+
isEnabled: boolean;
|
|
3899
|
+
x: number;
|
|
3900
|
+
y: number;
|
|
3901
|
+
};
|
|
3902
|
+
left: {
|
|
3903
|
+
isEnabled: boolean;
|
|
3904
|
+
x: number;
|
|
3905
|
+
y: number;
|
|
3906
|
+
};
|
|
3907
|
+
right: {
|
|
3908
|
+
isEnabled: boolean;
|
|
3909
|
+
x: number;
|
|
3910
|
+
y: number;
|
|
3911
|
+
};
|
|
3912
|
+
top: {
|
|
3913
|
+
isEnabled: boolean;
|
|
3914
|
+
x: number;
|
|
3915
|
+
y: number;
|
|
3916
|
+
};
|
|
3917
|
+
};
|
|
3918
|
+
isExact: boolean;
|
|
3919
|
+
isPrecise: boolean;
|
|
3920
|
+
showEdgeHints: boolean;
|
|
3921
|
+
snap: string;
|
|
3922
|
+
targetId: TLShapeId;
|
|
3923
|
+
};
|
|
3924
|
+
}
|
|
3925
|
+
|
|
3389
3926
|
/** @public */
|
|
3390
3927
|
export declare type TLArrowInfo = TLArcArrowInfo | TLElbowArrowInfo | TLStraightArrowInfo;
|
|
3391
3928
|
|
|
@@ -3396,6 +3933,68 @@ export declare interface TLArrowPoint {
|
|
|
3396
3933
|
arrowhead: TLArrowShapeArrowheadStyle;
|
|
3397
3934
|
}
|
|
3398
3935
|
|
|
3936
|
+
/** @public */
|
|
3937
|
+
export declare interface TLBrushOverlay extends TLOverlay {
|
|
3938
|
+
props: {
|
|
3939
|
+
h: number;
|
|
3940
|
+
w: number;
|
|
3941
|
+
x: number;
|
|
3942
|
+
y: number;
|
|
3943
|
+
};
|
|
3944
|
+
}
|
|
3945
|
+
|
|
3946
|
+
/** @public */
|
|
3947
|
+
export declare interface TLCollaboratorBrushOverlay extends TLOverlay {
|
|
3948
|
+
props: {
|
|
3949
|
+
color: string;
|
|
3950
|
+
h: number;
|
|
3951
|
+
w: number;
|
|
3952
|
+
x: number;
|
|
3953
|
+
y: number;
|
|
3954
|
+
};
|
|
3955
|
+
}
|
|
3956
|
+
|
|
3957
|
+
/** @public */
|
|
3958
|
+
export declare interface TLCollaboratorCursorOverlay extends TLOverlay {
|
|
3959
|
+
props: {
|
|
3960
|
+
chatMessage: string;
|
|
3961
|
+
color: string;
|
|
3962
|
+
name: null | string;
|
|
3963
|
+
x: number;
|
|
3964
|
+
y: number;
|
|
3965
|
+
};
|
|
3966
|
+
}
|
|
3967
|
+
|
|
3968
|
+
/** @public */
|
|
3969
|
+
export declare interface TLCollaboratorHintOverlay extends TLOverlay {
|
|
3970
|
+
props: {
|
|
3971
|
+
/** Clamped point on viewport edge, in page coordinates */
|
|
3972
|
+
x: number;
|
|
3973
|
+
/** Rotation angle pointing toward the collaborator's actual cursor */
|
|
3974
|
+
rotation: number;
|
|
3975
|
+
color: string;
|
|
3976
|
+
y: number;
|
|
3977
|
+
};
|
|
3978
|
+
}
|
|
3979
|
+
|
|
3980
|
+
/** @public */
|
|
3981
|
+
export declare interface TLCollaboratorScribbleOverlay extends TLOverlay {
|
|
3982
|
+
props: {
|
|
3983
|
+
color: string;
|
|
3984
|
+
scribble: TLScribble;
|
|
3985
|
+
};
|
|
3986
|
+
}
|
|
3987
|
+
|
|
3988
|
+
/** @public */
|
|
3989
|
+
export declare interface TLCollaboratorShapeIndicatorOverlay extends TLOverlay {
|
|
3990
|
+
props: {
|
|
3991
|
+
indicators: Array<{
|
|
3992
|
+
color: string;
|
|
3993
|
+
shapeIds: TLShapeId[];
|
|
3994
|
+
}>;
|
|
3995
|
+
};
|
|
3996
|
+
}
|
|
3997
|
+
|
|
3399
3998
|
/**
|
|
3400
3999
|
* Override the default react components used by the editor and UI. Set components to null to
|
|
3401
4000
|
* disable them entirely.
|
|
@@ -3454,9 +4053,6 @@ export declare function Tldraw(props: TldrawProps): JSX.Element;
|
|
|
3454
4053
|
/** @public */
|
|
3455
4054
|
export declare const TLDRAW_FILE_EXTENSION: ".tldr";
|
|
3456
4055
|
|
|
3457
|
-
/** @public @react */
|
|
3458
|
-
export declare function TldrawArrowHints(): JSX.Element | null;
|
|
3459
|
-
|
|
3460
4056
|
/** @public */
|
|
3461
4057
|
export declare interface TldrawBaseProps extends TldrawUiProps, TldrawEditorBaseProps, TLExternalContentProps {
|
|
3462
4058
|
/** Urls for custom assets.
|
|
@@ -3482,17 +4078,19 @@ export declare interface TldrawBaseProps extends TldrawUiProps, TldrawEditorBase
|
|
|
3482
4078
|
* @deprecated Use `options.text` instead. This prop will be removed in a future release.
|
|
3483
4079
|
*/
|
|
3484
4080
|
textOptions?: TLTextOptions;
|
|
3485
|
-
|
|
3486
|
-
|
|
3487
|
-
|
|
3488
|
-
|
|
3489
|
-
|
|
3490
|
-
|
|
3491
|
-
|
|
3492
|
-
|
|
3493
|
-
|
|
3494
|
-
|
|
3495
|
-
|
|
4081
|
+
/**
|
|
4082
|
+
* The locale to use for the editor's UI. When set, this takes priority over
|
|
4083
|
+
* both the browser's language preferences (`navigator.languages`) and the
|
|
4084
|
+
* user's locale preference (e.g. via
|
|
4085
|
+
* `editor.user.updateUserPreferences({ locale: '...' })`), giving the
|
|
4086
|
+
* application explicit control over the displayed language.
|
|
4087
|
+
*
|
|
4088
|
+
* @example
|
|
4089
|
+
* ```tsx
|
|
4090
|
+
* <Tldraw locale="fr" />
|
|
4091
|
+
* ```
|
|
4092
|
+
*/
|
|
4093
|
+
locale?: string;
|
|
3496
4094
|
}
|
|
3497
4095
|
|
|
3498
4096
|
/** @public */
|
|
@@ -3520,9 +4118,6 @@ export declare type TldrawFileParseError = {
|
|
|
3520
4118
|
version: number;
|
|
3521
4119
|
};
|
|
3522
4120
|
|
|
3523
|
-
/** @public @react */
|
|
3524
|
-
export declare function TldrawHandles({ children }: TLHandlesProps): JSX.Element | null;
|
|
3525
|
-
|
|
3526
4121
|
/**
|
|
3527
4122
|
* A rendered SVG image of a Tldraw snapshot.
|
|
3528
4123
|
*
|
|
@@ -3585,21 +4180,9 @@ export declare interface TldrawImageProps extends TLImageExportOptions {
|
|
|
3585
4180
|
textOptions?: TLTextOptions;
|
|
3586
4181
|
}
|
|
3587
4182
|
|
|
3588
|
-
/** @public @react */
|
|
3589
|
-
export declare function TldrawOverlays(): JSX.Element | null;
|
|
3590
|
-
|
|
3591
4183
|
/** @public */
|
|
3592
4184
|
export declare type TldrawProps = TldrawBaseProps & TldrawEditorStoreProps;
|
|
3593
4185
|
|
|
3594
|
-
/** @public @react */
|
|
3595
|
-
export declare function TldrawScribble({ scribble, zoom, color, opacity, className }: TLScribbleProps): JSX.Element | null;
|
|
3596
|
-
|
|
3597
|
-
/** @public */
|
|
3598
|
-
export declare const TldrawSelectionForeground: NamedExoticComponent<TLSelectionForegroundProps>;
|
|
3599
|
-
|
|
3600
|
-
/** @public @react */
|
|
3601
|
-
export declare function TldrawShapeIndicators(): JSX.Element;
|
|
3602
|
-
|
|
3603
4186
|
/**
|
|
3604
4187
|
* @public
|
|
3605
4188
|
* @react
|
|
@@ -3947,21 +4530,55 @@ export declare interface TLExternalContentProps {
|
|
|
3947
4530
|
*/
|
|
3948
4531
|
maxAssetSize?: number;
|
|
3949
4532
|
/**
|
|
3950
|
-
* The mime types of images that are allowed to be handled. When
|
|
3951
|
-
* `Tldraw` component,
|
|
3952
|
-
*
|
|
3953
|
-
*
|
|
4533
|
+
* The mime types of images that are allowed to be handled. When passed to
|
|
4534
|
+
* the `Tldraw` component, this also reconfigures the default `ImageAssetUtil`
|
|
4535
|
+
* to only accept files matching these types. If you only want to accept a
|
|
4536
|
+
* subset of image types and want to additionally block videos, pass
|
|
4537
|
+
* `acceptedVideoMimeTypes={[]}`. A file is accepted if its MIME type is in
|
|
4538
|
+
* this list, in `acceptedVideoMimeTypes`, or if any registered asset util
|
|
4539
|
+
* accepts it.
|
|
3954
4540
|
*/
|
|
3955
4541
|
acceptedImageMimeTypes?: readonly string[];
|
|
3956
4542
|
/**
|
|
3957
|
-
* The mime types of videos that are allowed to be handled. When
|
|
3958
|
-
* `Tldraw` component,
|
|
3959
|
-
*
|
|
3960
|
-
*
|
|
4543
|
+
* The mime types of videos that are allowed to be handled. When passed to
|
|
4544
|
+
* the `Tldraw` component, this also reconfigures the default `VideoAssetUtil`
|
|
4545
|
+
* to only accept files matching these types. A file is accepted if its MIME
|
|
4546
|
+
* type is in this list, in `acceptedImageMimeTypes`, or if any registered
|
|
4547
|
+
* asset util accepts it.
|
|
3961
4548
|
*/
|
|
3962
4549
|
acceptedVideoMimeTypes?: readonly string[];
|
|
3963
4550
|
}
|
|
3964
4551
|
|
|
4552
|
+
/** @public */
|
|
4553
|
+
export declare interface TLScribbleOverlay extends TLOverlay {
|
|
4554
|
+
props: {
|
|
4555
|
+
scribble: TLScribble;
|
|
4556
|
+
};
|
|
4557
|
+
}
|
|
4558
|
+
|
|
4559
|
+
/** @public */
|
|
4560
|
+
export declare interface TLSelectionForegroundOverlay extends TLOverlay {
|
|
4561
|
+
props: {
|
|
4562
|
+
handle: RotateCorner | TLSelectionHandle;
|
|
4563
|
+
overlayType: 'mobile_rotate' | 'resize_handle' | 'rotate_handle';
|
|
4564
|
+
};
|
|
4565
|
+
}
|
|
4566
|
+
|
|
4567
|
+
/** @public */
|
|
4568
|
+
export declare interface TLShapeHandleOverlay extends TLOverlay {
|
|
4569
|
+
props: {
|
|
4570
|
+
handle: TLHandle;
|
|
4571
|
+
shapeId: TLShapeId;
|
|
4572
|
+
};
|
|
4573
|
+
}
|
|
4574
|
+
|
|
4575
|
+
/** @public */
|
|
4576
|
+
export declare interface TLSnapIndicatorOverlay extends TLOverlay {
|
|
4577
|
+
props: {
|
|
4578
|
+
line: SnapIndicator;
|
|
4579
|
+
};
|
|
4580
|
+
}
|
|
4581
|
+
|
|
3965
4582
|
/** @public */
|
|
3966
4583
|
export declare interface TLStraightArrowInfo {
|
|
3967
4584
|
bindings: TLArrowBindings;
|
|
@@ -4896,7 +5513,7 @@ export declare interface TLUiTranslation {
|
|
|
4896
5513
|
export declare type TLUiTranslationContextType = TLUiTranslation;
|
|
4897
5514
|
|
|
4898
5515
|
/** @public */
|
|
4899
|
-
export declare type TLUiTranslationKey = 'a11y.adjust-shape-styles' | 'a11y.enlarge-shape' | 'a11y.enter-leave-container' | 'a11y.move-shape-faster' | 'a11y.move-shape' | 'a11y.multiple-shapes' | 'a11y.open-context-menu' | 'a11y.open-keyboard-shortcuts' | 'a11y.pan-camera' | 'a11y.repeat-shape' | 'a11y.rotate-shape-ccw-fine' | 'a11y.rotate-shape-ccw' | 'a11y.rotate-shape-cw-fine' | 'a11y.rotate-shape-cw' | 'a11y.select-shape-direction' | 'a11y.select-shape' | 'a11y.shape-image' | 'a11y.shape-index' | 'a11y.shape-video' | 'a11y.shrink-shape' | 'a11y.skip-to-main-content' | 'a11y.status' | 'action.align-bottom' | 'action.align-center-horizontal.short' | 'action.align-center-horizontal' | 'action.align-center-vertical.short' | 'action.align-center-vertical' | 'action.align-left' | 'action.align-right' | 'action.align-top' | 'action.back-to-content' | 'action.bring-forward' | 'action.bring-to-front' | 'action.convert-to-bookmark' | 'action.convert-to-embed' | 'action.copy-as-json.short' | 'action.copy-as-json' | 'action.copy-as-png.short' | 'action.copy-as-png' | 'action.copy-as-svg.short' | 'action.copy-as-svg' | 'action.copy' | 'action.cut' | 'action.delete' | 'action.distribute-horizontal.short' | 'action.distribute-horizontal' | 'action.distribute-vertical.short' | 'action.distribute-vertical' | 'action.download-original' | 'action.duplicate' | 'action.edit-link' | 'action.enhanced-a11y-mode.menu' | 'action.enhanced-a11y-mode' | 'action.exit-pen-mode' | 'action.export-all-as-png.short' | 'action.export-all-as-png' | 'action.export-all-as-svg.short' | 'action.export-all-as-svg' | 'action.export-as-png.short' | 'action.export-as-png' | 'action.export-as-svg.short' | 'action.export-as-svg' | 'action.fit-frame-to-content' | 'action.flatten-to-image' | 'action.flip-horizontal.short' | 'action.flip-horizontal' | 'action.flip-vertical.short' | 'action.flip-vertical' | 'action.fork-project-on-tldraw' | 'action.fork-project' | 'action.group' | 'action.insert-embed' | 'action.insert-media' | 'action.leave-shared-project' | 'action.new-project' | 'action.new-shared-project' | 'action.open-cursor-chat' | 'action.open-embed-link' | 'action.open-file' | 'action.open-kbd-shortcuts' | 'action.pack' | 'action.paste-error-description' | 'action.paste-error-title' | 'action.paste' | 'action.print' | 'action.redo' | 'action.remove-frame' | 'action.rename' | 'action.rotate-ccw' | 'action.rotate-cw' | 'action.save-copy' | 'action.select-all' | 'action.select-none' | 'action.select-zoom-tool' | 'action.send-backward' | 'action.send-to-back' | 'action.share-project' | 'action.stack-horizontal.short' | 'action.stack-horizontal' | 'action.stack-vertical.short' | 'action.stack-vertical' | 'action.stop-following' | 'action.stretch-horizontal.short' | 'action.stretch-horizontal' | 'action.stretch-vertical.short' | 'action.stretch-vertical' | 'action.toggle-auto-none' | 'action.toggle-auto-pan' | 'action.toggle-auto-size' | 'action.toggle-auto-zoom' | 'action.toggle-dark-mode.menu' | 'action.toggle-dark-mode' | 'action.toggle-debug-mode.menu' | 'action.toggle-debug-mode' | 'action.toggle-dynamic-size-mode.menu' | 'action.toggle-dynamic-size-mode' | 'action.toggle-edge-scrolling.menu' | 'action.toggle-edge-scrolling' | 'action.toggle-focus-mode.menu' | 'action.toggle-focus-mode' | 'action.toggle-grid.menu' | 'action.toggle-grid' | 'action.toggle-invert-zoom.menu' | 'action.toggle-invert-zoom' | 'action.toggle-keyboard-shortcuts.menu' | 'action.toggle-keyboard-shortcuts' | 'action.toggle-lock' | 'action.toggle-mouse' | 'action.toggle-paste-at-cursor.menu' | 'action.toggle-paste-at-cursor' | 'action.toggle-reduce-motion.menu' | 'action.toggle-reduce-motion' | 'action.toggle-snap-mode.menu' | 'action.toggle-snap-mode' | 'action.toggle-tool-lock.menu' | 'action.toggle-tool-lock' | 'action.toggle-trackpad' | 'action.toggle-transparent.context-menu' | 'action.toggle-transparent.menu' | 'action.toggle-transparent' | 'action.toggle-wrap-mode.menu' | 'action.toggle-wrap-mode' | 'action.undo' | 'action.ungroup' | 'action.unlock-all' | 'action.zoom-in' | 'action.zoom-out' | 'action.zoom-quick' | 'action.zoom-to-100' | 'action.zoom-to-fit' | 'action.zoom-to-selection' | 'actions-menu.title' | 'align-style.end' | 'align-style.justify' | 'align-style.middle' | 'align-style.start' | 'app.loading' | 'arrow-kind-style.arc' | 'arrow-kind-style.elbow' | 'arrowheadEnd-style.arrow' | 'arrowheadEnd-style.bar' | 'arrowheadEnd-style.diamond' | 'arrowheadEnd-style.dot' | 'arrowheadEnd-style.inverted' | 'arrowheadEnd-style.none' | 'arrowheadEnd-style.pipe' | 'arrowheadEnd-style.square' | 'arrowheadEnd-style.triangle' | 'arrowheadStart-style.arrow' | 'arrowheadStart-style.bar' | 'arrowheadStart-style.diamond' | 'arrowheadStart-style.dot' | 'arrowheadStart-style.inverted' | 'arrowheadStart-style.none' | 'arrowheadStart-style.pipe' | 'arrowheadStart-style.square' | 'arrowheadStart-style.triangle' | 'assets.files.amount-too-many' | 'assets.files.maximum-size' | 'assets.files.size-too-big' | 'assets.files.type-not-allowed' | 'assets.files.upload-failed' | 'assets.url.failed' | 'color-style.black' | 'color-style.blue' | 'color-style.green' | 'color-style.grey' | 'color-style.light-blue' | 'color-style.light-green' | 'color-style.light-red' | 'color-style.light-violet' | 'color-style.orange' | 'color-style.red' | 'color-style.violet' | 'color-style.white' | 'color-style.yellow' | 'context-menu.arrange' | 'context-menu.copy-as' | 'context-menu.edit' | 'context-menu.export-all-as' | 'context-menu.export-as' | 'context-menu.move-to-page' | 'context-menu.reorder' | 'context-menu.title' | 'context.pages.new-page' | 'cursor-chat.type-to-chat' | 'dash-style.dashed' | 'dash-style.dotted' | 'dash-style.draw' | 'dash-style.solid' | 'document-name-menu.copy-link' | 'document.default-name' | 'edit-link-dialog.cancel' | 'edit-link-dialog.clear' | 'edit-link-dialog.detail' | 'edit-link-dialog.external-link' | 'edit-link-dialog.invalid-url' | 'edit-link-dialog.save' | 'edit-link-dialog.title' | 'edit-link-dialog.url' | 'embed-dialog.back' | 'embed-dialog.cancel' | 'embed-dialog.create' | 'embed-dialog.instruction' | 'embed-dialog.invalid-url' | 'embed-dialog.title' | 'embed-dialog.url' | 'file-system.confirm-clear.cancel' | 'file-system.confirm-clear.continue' | 'file-system.confirm-clear.description' | 'file-system.confirm-clear.dont-show-again' | 'file-system.confirm-clear.title' | 'file-system.confirm-open.cancel' | 'file-system.confirm-open.description' | 'file-system.confirm-open.dont-show-again' | 'file-system.confirm-open.open' | 'file-system.confirm-open.title' | 'file-system.file-open-error.file-format-version-too-new' | 'file-system.file-open-error.generic-corrupted-file' | 'file-system.file-open-error.not-a-tldraw-file' | 'file-system.file-open-error.title' | 'file-system.shared-document-file-open-error.description' | 'file-system.shared-document-file-open-error.title' | 'fill-style.fill' | 'fill-style.lined-fill' | 'fill-style.none' | 'fill-style.pattern' | 'fill-style.semi' | 'fill-style.solid' | 'focus-mode.toggle-focus-mode' | 'font-style.draw' | 'font-style.mono' | 'font-style.sans' | 'font-style.serif' | 'geo-style.arrow-down' | 'geo-style.arrow-left' | 'geo-style.arrow-right' | 'geo-style.arrow-up' | 'geo-style.check-box' | 'geo-style.cloud' | 'geo-style.diamond' | 'geo-style.ellipse' | 'geo-style.heart' | 'geo-style.hexagon' | 'geo-style.octagon' | 'geo-style.oval' | 'geo-style.pentagon' | 'geo-style.rectangle' | 'geo-style.rhombus-2' | 'geo-style.rhombus' | 'geo-style.star' | 'geo-style.trapezoid' | 'geo-style.triangle' | 'geo-style.x-box' | 'handle.crop.bottom-left' | 'handle.crop.bottom-right' | 'handle.crop.bottom' | 'handle.crop.left' | 'handle.crop.right' | 'handle.crop.top-left' | 'handle.crop.top-right' | 'handle.crop.top' | 'handle.resize-bottom-left' | 'handle.resize-bottom-right' | 'handle.resize-bottom' | 'handle.resize-left' | 'handle.resize-right' | 'handle.resize-top-left' | 'handle.resize-top-right' | 'handle.resize-top' | 'handle.rotate.bottom_left_rotate' | 'handle.rotate.bottom_right_rotate' | 'handle.rotate.mobile_rotate' | 'handle.rotate.top_left_rotate' | 'handle.rotate.top_right_rotate' | 'help-menu.about' | 'help-menu.discord' | 'help-menu.github' | 'help-menu.import-tldr-file' | 'help-menu.keyboard-shortcuts' | 'help-menu.privacy' | 'help-menu.terms' | 'help-menu.title' | 'help-menu.twitter' | 'menu.accessibility' | 'menu.copy-as' | 'menu.edit' | 'menu.export-as' | 'menu.file' | 'menu.input-device' | 'menu.language' | 'menu.preferences' | 'menu.theme' | 'menu.title' | 'menu.view' | 'navigation-zone.minimap' | 'navigation-zone.title' | 'navigation-zone.toggle-minimap' | 'navigation-zone.zoom' | 'opacity-style.0.1' | 'opacity-style.0.25' | 'opacity-style.0.5' | 'opacity-style.0.75' | 'opacity-style.1' | 'page-menu.create-new-page' | 'page-menu.edit-done' | 'page-menu.edit-start' | 'page-menu.go-to-page' | 'page-menu.max-page-count-reached' | 'page-menu.new-page-initial-name' | 'page-menu.submenu.delete' | 'page-menu.submenu.duplicate-page' | 'page-menu.submenu.move-down' | 'page-menu.submenu.move-up' | 'page-menu.submenu.rename' | 'page-menu.submenu.title' | 'page-menu.title' | 'people-menu.anonymous-user' | 'people-menu.avatar-color' | 'people-menu.change-color' | 'people-menu.change-name' | 'people-menu.follow' | 'people-menu.following' | 'people-menu.invite' | 'people-menu.leading' | 'people-menu.title' | 'people-menu.user' | 'share-menu.copied' | 'share-menu.copy-link-note' | 'share-menu.copy-link' | 'share-menu.copy-readonly-link-note' | 'share-menu.copy-readonly-link' | 'share-menu.create-snapshot-link' | 'share-menu.creating-project' | 'share-menu.fork-note' | 'share-menu.offline-note' | 'share-menu.project-too-large' | 'share-menu.save-note' | 'share-menu.share-project' | 'share-menu.snapshot-link-note' | 'share-menu.title' | 'share-menu.upload-failed' | 'sharing.confirm-leave.cancel' | 'sharing.confirm-leave.description' | 'sharing.confirm-leave.dont-show-again' | 'sharing.confirm-leave.leave' | 'sharing.confirm-leave.title' | 'shortcuts-dialog.a11y' | 'shortcuts-dialog.collaboration' | 'shortcuts-dialog.edit' | 'shortcuts-dialog.file' | 'shortcuts-dialog.preferences' | 'shortcuts-dialog.text-formatting' | 'shortcuts-dialog.title' | 'shortcuts-dialog.tools' | 'shortcuts-dialog.transform' | 'shortcuts-dialog.view' | 'size-style.l' | 'size-style.m' | 'size-style.s' | 'size-style.xl' | 'spline-style.cubic' | 'spline-style.line' | 'status.offline' | 'style-panel.align' | 'style-panel.arrow-kind' | 'style-panel.arrowhead-end' | 'style-panel.arrowhead-start' | 'style-panel.arrowheads' | 'style-panel.color' | 'style-panel.dash' | 'style-panel.fill' | 'style-panel.font' | 'style-panel.geo' | 'style-panel.label-align' | 'style-panel.mixed' | 'style-panel.opacity' | 'style-panel.position' | 'style-panel.selected' | 'style-panel.size' | 'style-panel.spline' | 'style-panel.title' | 'style-panel.vertical-align' | 'theme.dark' | 'theme.light' | 'theme.system' | 'toast.close' | 'toast.error.copy-fail.desc' | 'toast.error.copy-fail.title' | 'toast.error.export-fail.desc' | 'toast.error.export-fail.title' | 'toast.error' | 'toast.info' | 'toast.success' | 'toast.warning' | 'tool-panel.more' | 'tool-panel.title' | 'tool.arrow-down' | 'tool.arrow-left' | 'tool.arrow-right' | 'tool.arrow-up' | 'tool.arrow' | 'tool.aspect-ratio.circle' | 'tool.aspect-ratio.landscape' | 'tool.aspect-ratio.original' | 'tool.aspect-ratio.portrait' | 'tool.aspect-ratio.square' | 'tool.aspect-ratio.wide' | 'tool.aspect-ratio' | 'tool.bookmark' | 'tool.check-box' | 'tool.cloud' | 'tool.diamond' | 'tool.draw' | 'tool.ellipse' | 'tool.embed' | 'tool.eraser' | 'tool.flip-horz' | 'tool.flip-vert' | 'tool.frame' | 'tool.hand' | 'tool.heart' | 'tool.hexagon' | 'tool.highlight' | 'tool.image-crop-confirm' | 'tool.image-crop' | 'tool.image-toolbar-title' | 'tool.image-zoom' | 'tool.laser' | 'tool.line' | 'tool.media-alt-text-confirm' | 'tool.media-alt-text-desc' | 'tool.media-alt-text' | 'tool.media' | 'tool.note' | 'tool.octagon' | 'tool.oval' | 'tool.pentagon' | 'tool.pointer-down' | 'tool.rectangle' | 'tool.replace-media' | 'tool.rhombus' | 'tool.rich-text-bold' | 'tool.rich-text-bulletList' | 'tool.rich-text-code' | 'tool.rich-text-header' | 'tool.rich-text-highlight' | 'tool.rich-text-italic' | 'tool.rich-text-link-remove' | 'tool.rich-text-link-visit' | 'tool.rich-text-link' | 'tool.rich-text-orderedList' | 'tool.rich-text-strikethrough' | 'tool.rich-text-toolbar-title' | 'tool.rotate-cw' | 'tool.select' | 'tool.star' | 'tool.text' | 'tool.trapezoid' | 'tool.triangle' | 'tool.x-box' | 'ui.checked' | 'ui.close' | 'ui.unchecked' | 'verticalAlign-style.end' | 'verticalAlign-style.middle' | 'verticalAlign-style.start' | 'vscode.file-open.backup-failed' | 'vscode.file-open.backup-saved' | 'vscode.file-open.backup' | 'vscode.file-open.desc' | 'vscode.file-open.dont-show-again' | 'vscode.file-open.open';
|
|
5516
|
+
export declare type TLUiTranslationKey = 'a11y.adjust-shape-styles' | 'a11y.enlarge-shape' | 'a11y.enter-leave-container' | 'a11y.move-shape-faster' | 'a11y.move-shape' | 'a11y.multiple-shapes' | 'a11y.open-context-menu' | 'a11y.open-keyboard-shortcuts' | 'a11y.pan-camera' | 'a11y.repeat-shape' | 'a11y.rotate-shape-ccw-fine' | 'a11y.rotate-shape-ccw' | 'a11y.rotate-shape-cw-fine' | 'a11y.rotate-shape-cw' | 'a11y.select-shape-direction' | 'a11y.select-shape' | 'a11y.shape-image' | 'a11y.shape-index' | 'a11y.shape-video' | 'a11y.shrink-shape' | 'a11y.skip-to-main-content' | 'a11y.status' | 'action.align-bottom' | 'action.align-center-horizontal.short' | 'action.align-center-horizontal' | 'action.align-center-vertical.short' | 'action.align-center-vertical' | 'action.align-left' | 'action.align-right' | 'action.align-top' | 'action.back-to-content' | 'action.bring-forward' | 'action.bring-to-front' | 'action.convert-to-bookmark' | 'action.convert-to-embed' | 'action.copy-as-json.short' | 'action.copy-as-json' | 'action.copy-as-png.short' | 'action.copy-as-png' | 'action.copy-as-svg.short' | 'action.copy-as-svg' | 'action.copy' | 'action.cut' | 'action.delete' | 'action.distribute-horizontal.short' | 'action.distribute-horizontal' | 'action.distribute-vertical.short' | 'action.distribute-vertical' | 'action.download-original' | 'action.duplicate' | 'action.edit-link' | 'action.enhanced-a11y-mode.menu' | 'action.enhanced-a11y-mode' | 'action.exit-pen-mode' | 'action.export-all-as-png.short' | 'action.export-all-as-png' | 'action.export-all-as-svg.short' | 'action.export-all-as-svg' | 'action.export-as-png.short' | 'action.export-as-png' | 'action.export-as-svg.short' | 'action.export-as-svg' | 'action.fit-frame-to-content' | 'action.flatten-to-image' | 'action.flip-horizontal.short' | 'action.flip-horizontal' | 'action.flip-vertical.short' | 'action.flip-vertical' | 'action.fork-project-on-tldraw' | 'action.fork-project' | 'action.group' | 'action.insert-embed' | 'action.insert-media' | 'action.leave-shared-project' | 'action.new-project' | 'action.new-shared-project' | 'action.open-cursor-chat' | 'action.open-embed-link' | 'action.open-file' | 'action.open-kbd-shortcuts' | 'action.pack' | 'action.paste-error-description' | 'action.paste-error-title' | 'action.paste' | 'action.print' | 'action.redo' | 'action.remove-frame' | 'action.rename' | 'action.rotate-ccw' | 'action.rotate-cw' | 'action.save-copy' | 'action.select-all' | 'action.select-none' | 'action.select-zoom-tool' | 'action.send-backward' | 'action.send-to-back' | 'action.share-project' | 'action.stack-horizontal.short' | 'action.stack-horizontal' | 'action.stack-vertical.short' | 'action.stack-vertical' | 'action.stop-following' | 'action.stretch-horizontal.short' | 'action.stretch-horizontal' | 'action.stretch-vertical.short' | 'action.stretch-vertical' | 'action.toggle-auto-none' | 'action.toggle-auto-pan' | 'action.toggle-auto-size' | 'action.toggle-auto-zoom' | 'action.toggle-dark-mode.menu' | 'action.toggle-dark-mode' | 'action.toggle-debug-mode.menu' | 'action.toggle-debug-mode' | 'action.toggle-dynamic-size-mode.menu' | 'action.toggle-dynamic-size-mode' | 'action.toggle-edge-scrolling.menu' | 'action.toggle-edge-scrolling' | 'action.toggle-focus-mode.menu' | 'action.toggle-focus-mode' | 'action.toggle-grid.menu' | 'action.toggle-grid' | 'action.toggle-invert-zoom.menu' | 'action.toggle-invert-zoom' | 'action.toggle-keyboard-shortcuts.menu' | 'action.toggle-keyboard-shortcuts' | 'action.toggle-lock' | 'action.toggle-mouse' | 'action.toggle-paste-at-cursor.menu' | 'action.toggle-paste-at-cursor' | 'action.toggle-reduce-motion.menu' | 'action.toggle-reduce-motion' | 'action.toggle-snap-mode.menu' | 'action.toggle-snap-mode' | 'action.toggle-tool-lock.menu' | 'action.toggle-tool-lock' | 'action.toggle-trackpad' | 'action.toggle-transparent.context-menu' | 'action.toggle-transparent.menu' | 'action.toggle-transparent' | 'action.toggle-wrap-mode.menu' | 'action.toggle-wrap-mode' | 'action.undo' | 'action.ungroup' | 'action.unlock-all' | 'action.zoom-in' | 'action.zoom-out' | 'action.zoom-quick' | 'action.zoom-to-100' | 'action.zoom-to-fit' | 'action.zoom-to-selection' | 'actions-menu.title' | 'align-style.end' | 'align-style.justify' | 'align-style.middle' | 'align-style.start' | 'app.loading' | 'arrow-kind-style.arc' | 'arrow-kind-style.elbow' | 'arrowheadEnd-style.arrow' | 'arrowheadEnd-style.bar' | 'arrowheadEnd-style.diamond' | 'arrowheadEnd-style.dot' | 'arrowheadEnd-style.inverted' | 'arrowheadEnd-style.none' | 'arrowheadEnd-style.pipe' | 'arrowheadEnd-style.square' | 'arrowheadEnd-style.triangle' | 'arrowheadStart-style.arrow' | 'arrowheadStart-style.bar' | 'arrowheadStart-style.diamond' | 'arrowheadStart-style.dot' | 'arrowheadStart-style.inverted' | 'arrowheadStart-style.none' | 'arrowheadStart-style.pipe' | 'arrowheadStart-style.square' | 'arrowheadStart-style.triangle' | 'assets.files.amount-too-many' | 'assets.files.maximum-size' | 'assets.files.size-too-big' | 'assets.files.type-not-allowed' | 'assets.files.upload-failed' | 'assets.url.failed' | 'color-style.black' | 'color-style.blue' | 'color-style.green' | 'color-style.grey' | 'color-style.light-blue' | 'color-style.light-green' | 'color-style.light-red' | 'color-style.light-violet' | 'color-style.orange' | 'color-style.red' | 'color-style.violet' | 'color-style.white' | 'color-style.yellow' | 'context-menu.arrange' | 'context-menu.copy-as' | 'context-menu.edit' | 'context-menu.export-all-as' | 'context-menu.export-as' | 'context-menu.move-to-page' | 'context-menu.reorder' | 'context-menu.title' | 'context.pages.new-page' | 'cursor-chat.type-to-chat' | 'dash-style.dashed' | 'dash-style.dotted' | 'dash-style.draw' | 'dash-style.solid' | 'document-name-menu.copy-link' | 'document.default-name' | 'edit-link-dialog.cancel' | 'edit-link-dialog.clear' | 'edit-link-dialog.detail' | 'edit-link-dialog.external-link' | 'edit-link-dialog.invalid-url' | 'edit-link-dialog.save' | 'edit-link-dialog.title' | 'edit-link-dialog.url' | 'embed-dialog.back' | 'embed-dialog.cancel' | 'embed-dialog.create' | 'embed-dialog.instruction' | 'embed-dialog.invalid-url' | 'embed-dialog.title' | 'embed-dialog.url' | 'file-system.confirm-clear.cancel' | 'file-system.confirm-clear.continue' | 'file-system.confirm-clear.description' | 'file-system.confirm-clear.dont-show-again' | 'file-system.confirm-clear.title' | 'file-system.confirm-open.cancel' | 'file-system.confirm-open.description' | 'file-system.confirm-open.dont-show-again' | 'file-system.confirm-open.open' | 'file-system.confirm-open.title' | 'file-system.file-open-error.file-format-version-too-new' | 'file-system.file-open-error.generic-corrupted-file' | 'file-system.file-open-error.not-a-tldraw-file' | 'file-system.file-open-error.title' | 'file-system.shared-document-file-open-error.description' | 'file-system.shared-document-file-open-error.title' | 'fill-style.fill' | 'fill-style.lined-fill' | 'fill-style.none' | 'fill-style.pattern' | 'fill-style.semi' | 'fill-style.solid' | 'focus-mode.toggle-focus-mode' | 'font-style.draw' | 'font-style.mono' | 'font-style.sans' | 'font-style.serif' | 'geo-style.arrow-down' | 'geo-style.arrow-left' | 'geo-style.arrow-right' | 'geo-style.arrow-up' | 'geo-style.check-box' | 'geo-style.cloud' | 'geo-style.diamond' | 'geo-style.ellipse' | 'geo-style.heart' | 'geo-style.hexagon' | 'geo-style.octagon' | 'geo-style.oval' | 'geo-style.pentagon' | 'geo-style.rectangle' | 'geo-style.rhombus-2' | 'geo-style.rhombus' | 'geo-style.star' | 'geo-style.trapezoid' | 'geo-style.triangle' | 'geo-style.x-box' | 'handle.crop.bottom-left' | 'handle.crop.bottom-right' | 'handle.crop.bottom' | 'handle.crop.left' | 'handle.crop.right' | 'handle.crop.top-left' | 'handle.crop.top-right' | 'handle.crop.top' | 'handle.resize-bottom-left' | 'handle.resize-bottom-right' | 'handle.resize-bottom' | 'handle.resize-left' | 'handle.resize-right' | 'handle.resize-top-left' | 'handle.resize-top-right' | 'handle.resize-top' | 'handle.rotate.bottom_left_rotate' | 'handle.rotate.bottom_right_rotate' | 'handle.rotate.mobile_rotate' | 'handle.rotate.top_left_rotate' | 'handle.rotate.top_right_rotate' | 'help-menu.about' | 'help-menu.discord' | 'help-menu.github' | 'help-menu.import-tldr-file' | 'help-menu.keyboard-shortcuts' | 'help-menu.privacy' | 'help-menu.terms' | 'help-menu.title' | 'help-menu.twitter' | 'menu.accessibility' | 'menu.color-theme' | 'menu.copy-as' | 'menu.edit' | 'menu.export-as' | 'menu.file' | 'menu.input-device' | 'menu.language' | 'menu.preferences' | 'menu.theme' | 'menu.title' | 'menu.view' | 'navigation-zone.minimap' | 'navigation-zone.title' | 'navigation-zone.toggle-minimap' | 'navigation-zone.zoom' | 'opacity-style.0.1' | 'opacity-style.0.25' | 'opacity-style.0.5' | 'opacity-style.0.75' | 'opacity-style.1' | 'page-menu.create-new-page' | 'page-menu.edit-done' | 'page-menu.edit-start' | 'page-menu.go-to-page' | 'page-menu.max-page-count-reached' | 'page-menu.new-page-initial-name' | 'page-menu.submenu.delete' | 'page-menu.submenu.duplicate-page' | 'page-menu.submenu.move-down' | 'page-menu.submenu.move-up' | 'page-menu.submenu.rename' | 'page-menu.submenu.title' | 'page-menu.title' | 'people-menu.anonymous-user' | 'people-menu.avatar-color' | 'people-menu.change-color' | 'people-menu.change-name' | 'people-menu.follow' | 'people-menu.following' | 'people-menu.invite' | 'people-menu.leading' | 'people-menu.title' | 'people-menu.user' | 'share-menu.copied' | 'share-menu.copy-link-note' | 'share-menu.copy-link' | 'share-menu.copy-readonly-link-note' | 'share-menu.copy-readonly-link' | 'share-menu.create-snapshot-link' | 'share-menu.creating-project' | 'share-menu.fork-note' | 'share-menu.offline-note' | 'share-menu.project-too-large' | 'share-menu.save-note' | 'share-menu.share-project' | 'share-menu.snapshot-link-note' | 'share-menu.title' | 'share-menu.upload-failed' | 'sharing.confirm-leave.cancel' | 'sharing.confirm-leave.description' | 'sharing.confirm-leave.dont-show-again' | 'sharing.confirm-leave.leave' | 'sharing.confirm-leave.title' | 'shortcuts-dialog.a11y' | 'shortcuts-dialog.collaboration' | 'shortcuts-dialog.edit' | 'shortcuts-dialog.file' | 'shortcuts-dialog.preferences' | 'shortcuts-dialog.text-formatting' | 'shortcuts-dialog.title' | 'shortcuts-dialog.tools' | 'shortcuts-dialog.transform' | 'shortcuts-dialog.view' | 'size-style.l' | 'size-style.m' | 'size-style.s' | 'size-style.xl' | 'spline-style.cubic' | 'spline-style.line' | 'status.offline' | 'style-panel.align' | 'style-panel.arrow-kind' | 'style-panel.arrowhead-end' | 'style-panel.arrowhead-start' | 'style-panel.arrowheads' | 'style-panel.color' | 'style-panel.dash' | 'style-panel.fill' | 'style-panel.font' | 'style-panel.geo' | 'style-panel.label-align' | 'style-panel.mixed' | 'style-panel.opacity' | 'style-panel.position' | 'style-panel.selected' | 'style-panel.size' | 'style-panel.spline' | 'style-panel.title' | 'style-panel.vertical-align' | 'theme.dark' | 'theme.light' | 'theme.system' | 'toast.close' | 'toast.error.copy-fail.desc' | 'toast.error.copy-fail.title' | 'toast.error.export-fail.desc' | 'toast.error.export-fail.title' | 'toast.error' | 'toast.info' | 'toast.success' | 'toast.warning' | 'tool-panel.more' | 'tool-panel.title' | 'tool.arrow-down' | 'tool.arrow-left' | 'tool.arrow-right' | 'tool.arrow-up' | 'tool.arrow' | 'tool.aspect-ratio.circle' | 'tool.aspect-ratio.landscape' | 'tool.aspect-ratio.original' | 'tool.aspect-ratio.portrait' | 'tool.aspect-ratio.square' | 'tool.aspect-ratio.wide' | 'tool.aspect-ratio' | 'tool.bookmark' | 'tool.check-box' | 'tool.cloud' | 'tool.diamond' | 'tool.draw' | 'tool.ellipse' | 'tool.embed' | 'tool.eraser' | 'tool.flip-horz' | 'tool.flip-vert' | 'tool.frame' | 'tool.hand' | 'tool.heart' | 'tool.hexagon' | 'tool.highlight' | 'tool.image-crop-confirm' | 'tool.image-crop' | 'tool.image-toolbar-title' | 'tool.image-zoom' | 'tool.laser' | 'tool.line' | 'tool.media-alt-text-confirm' | 'tool.media-alt-text-desc' | 'tool.media-alt-text' | 'tool.media' | 'tool.note' | 'tool.octagon' | 'tool.oval' | 'tool.pentagon' | 'tool.pointer-down' | 'tool.rectangle' | 'tool.replace-media' | 'tool.rhombus' | 'tool.rich-text-bold' | 'tool.rich-text-bulletList' | 'tool.rich-text-code' | 'tool.rich-text-header' | 'tool.rich-text-highlight' | 'tool.rich-text-italic' | 'tool.rich-text-link-remove' | 'tool.rich-text-link-visit' | 'tool.rich-text-link' | 'tool.rich-text-orderedList' | 'tool.rich-text-strikethrough' | 'tool.rich-text-toolbar-title' | 'tool.rotate-cw' | 'tool.select' | 'tool.star' | 'tool.text' | 'tool.trapezoid' | 'tool.triangle' | 'tool.x-box' | 'ui.checked' | 'ui.close' | 'ui.unchecked' | 'verticalAlign-style.end' | 'verticalAlign-style.middle' | 'verticalAlign-style.start' | 'vscode.file-open.backup-failed' | 'vscode.file-open.backup-saved' | 'vscode.file-open.backup' | 'vscode.file-open.desc' | 'vscode.file-open.dont-show-again' | 'vscode.file-open.open';
|
|
4900
5517
|
|
|
4901
5518
|
/** @public */
|
|
4902
5519
|
export declare interface TLUiTranslationProviderProps {
|
|
@@ -4990,6 +5607,16 @@ export declare interface TLUiZoomMenuProps {
|
|
|
4990
5607
|
|
|
4991
5608
|
/* Excluded from this release type: TLV1VideoShape */
|
|
4992
5609
|
|
|
5610
|
+
/** @public */
|
|
5611
|
+
export declare interface TLZoomBrushOverlay extends TLOverlay {
|
|
5612
|
+
props: {
|
|
5613
|
+
h: number;
|
|
5614
|
+
w: number;
|
|
5615
|
+
x: number;
|
|
5616
|
+
y: number;
|
|
5617
|
+
};
|
|
5618
|
+
}
|
|
5619
|
+
|
|
4993
5620
|
/** @public @react */
|
|
4994
5621
|
export declare function ToggleAutoSizeMenuItem(): JSX.Element | null;
|
|
4995
5622
|
|
|
@@ -5387,8 +6014,6 @@ export declare class VideoShapeUtil extends BaseBoxShapeUtil<TLVideoShape> {
|
|
|
5387
6014
|
createShapeForAsset(asset: TLAsset, position: VecModel): null | TLShapePartial;
|
|
5388
6015
|
getAriaDescriptor(shape: TLVideoShape): string;
|
|
5389
6016
|
component(shape: TLVideoShape): JSX.Element;
|
|
5390
|
-
indicator(shape: TLVideoShape): JSX.Element;
|
|
5391
|
-
useLegacyIndicator(): boolean;
|
|
5392
6017
|
getIndicatorPath(shape: TLVideoShape): Path2D;
|
|
5393
6018
|
toSvg(shape: TLVideoShape, ctx: SvgExportContext): Promise<JSX.Element | null>;
|
|
5394
6019
|
}
|
|
@@ -5403,6 +6028,23 @@ export declare function ViewSubmenu(): JSX.Element;
|
|
|
5403
6028
|
/** @public @react */
|
|
5404
6029
|
export declare function XBoxToolbarItem(): JSX.Element;
|
|
5405
6030
|
|
|
6031
|
+
/**
|
|
6032
|
+
* Overlay util for the zoom brush rectangle.
|
|
6033
|
+
*
|
|
6034
|
+
* @public
|
|
6035
|
+
*/
|
|
6036
|
+
export declare class ZoomBrushOverlayUtil extends OverlayUtil<TLZoomBrushOverlay> {
|
|
6037
|
+
static type: string;
|
|
6038
|
+
options: {
|
|
6039
|
+
lineWidth: number;
|
|
6040
|
+
zIndex: number;
|
|
6041
|
+
};
|
|
6042
|
+
isActive(): boolean;
|
|
6043
|
+
getOverlays(): TLZoomBrushOverlay[];
|
|
6044
|
+
render(ctx: CanvasRenderingContext2D, overlays: TLZoomBrushOverlay[]): void;
|
|
6045
|
+
renderMinimap(ctx: CanvasRenderingContext2D, overlays: TLZoomBrushOverlay[], zoom: number): void;
|
|
6046
|
+
}
|
|
6047
|
+
|
|
5406
6048
|
/** @public @react */
|
|
5407
6049
|
export declare function ZoomOrRotateMenuItem(): JSX.Element;
|
|
5408
6050
|
|