tldraw 3.16.0-canary.f55016ece635 → 3.16.0-canary.f5bf2b535ea7
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 +227 -110
- package/dist-cjs/index.js +29 -14
- package/dist-cjs/index.js.map +2 -2
- package/dist-cjs/lib/defaultExternalContentHandlers.js +10 -0
- package/dist-cjs/lib/defaultExternalContentHandlers.js.map +2 -2
- package/dist-cjs/lib/shapes/arrow/arrow-types.js.map +1 -1
- package/dist-cjs/lib/shapes/arrow/arrowLabel.js +6 -0
- package/dist-cjs/lib/shapes/arrow/arrowLabel.js.map +3 -3
- package/dist-cjs/lib/shapes/arrow/arrowTargetState.js +3 -2
- package/dist-cjs/lib/shapes/arrow/arrowTargetState.js.map +2 -2
- package/dist-cjs/lib/shapes/arrow/toolStates/Pointing.js +1 -1
- package/dist-cjs/lib/shapes/arrow/toolStates/Pointing.js.map +2 -2
- package/dist-cjs/lib/shapes/bookmark/BookmarkShapeUtil.js +4 -4
- package/dist-cjs/lib/shapes/bookmark/BookmarkShapeUtil.js.map +2 -2
- package/dist-cjs/lib/shapes/frame/FrameShapeUtil.js +8 -1
- package/dist-cjs/lib/shapes/frame/FrameShapeUtil.js.map +2 -2
- package/dist-cjs/lib/shapes/frame/components/FrameLabelInput.js +8 -2
- package/dist-cjs/lib/shapes/frame/components/FrameLabelInput.js.map +2 -2
- package/dist-cjs/lib/shapes/geo/GeoShapeUtil.js +1 -0
- package/dist-cjs/lib/shapes/geo/GeoShapeUtil.js.map +2 -2
- package/dist-cjs/lib/shapes/image/ImageShapeUtil.js +3 -0
- package/dist-cjs/lib/shapes/image/ImageShapeUtil.js.map +2 -2
- package/dist-cjs/lib/shapes/note/NoteShapeUtil.js +2 -1
- package/dist-cjs/lib/shapes/note/NoteShapeUtil.js.map +2 -2
- package/dist-cjs/lib/shapes/shared/HyperlinkButton.js +4 -4
- package/dist-cjs/lib/shapes/shared/HyperlinkButton.js.map +2 -2
- package/dist-cjs/lib/shapes/shared/PlainTextLabel.js +1 -3
- package/dist-cjs/lib/shapes/shared/PlainTextLabel.js.map +2 -2
- package/dist-cjs/lib/shapes/shared/useEditablePlainText.js +3 -5
- package/dist-cjs/lib/shapes/shared/useEditablePlainText.js.map +2 -2
- package/dist-cjs/lib/shapes/shared/useImageOrVideoAsset.js +0 -2
- package/dist-cjs/lib/shapes/shared/useImageOrVideoAsset.js.map +2 -2
- package/dist-cjs/lib/shapes/text/PlainTextArea.js +3 -2
- package/dist-cjs/lib/shapes/text/PlainTextArea.js.map +2 -2
- package/dist-cjs/lib/shapes/text/RichTextArea.js +3 -3
- package/dist-cjs/lib/shapes/text/RichTextArea.js.map +2 -2
- package/dist-cjs/lib/tools/SelectTool/childStates/DraggingHandle.js +3 -1
- package/dist-cjs/lib/tools/SelectTool/childStates/DraggingHandle.js.map +2 -2
- package/dist-cjs/lib/ui/components/A11y.js +1 -1
- package/dist-cjs/lib/ui/components/A11y.js.map +2 -2
- package/dist-cjs/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.js +5 -5
- package/dist-cjs/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.js.map +1 -1
- package/dist-cjs/lib/ui/components/LanguageMenu.js +1 -0
- package/dist-cjs/lib/ui/components/LanguageMenu.js.map +2 -2
- package/dist-cjs/lib/ui/components/Minimap/DefaultMinimap.js +2 -1
- package/dist-cjs/lib/ui/components/Minimap/DefaultMinimap.js.map +2 -2
- package/dist-cjs/lib/ui/components/PageMenu/DefaultPageMenu.js +1 -1
- package/dist-cjs/lib/ui/components/PageMenu/DefaultPageMenu.js.map +2 -2
- package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanel.js +9 -4
- package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanel.js.map +2 -2
- package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanelContent.js +255 -316
- package/dist-cjs/lib/ui/components/StylePanel/DefaultStylePanelContent.js.map +2 -2
- package/dist-cjs/lib/ui/components/StylePanel/StylePanelButtonPicker.js +147 -0
- package/dist-cjs/lib/ui/components/StylePanel/StylePanelButtonPicker.js.map +7 -0
- package/dist-cjs/lib/ui/components/StylePanel/StylePanelContext.js +68 -0
- package/dist-cjs/lib/ui/components/StylePanel/StylePanelContext.js.map +7 -0
- package/dist-cjs/lib/ui/components/StylePanel/{DoubleDropdownPicker.js → StylePanelDoubleDropdownPicker.js} +23 -22
- package/dist-cjs/lib/ui/components/StylePanel/StylePanelDoubleDropdownPicker.js.map +7 -0
- package/dist-cjs/lib/ui/components/StylePanel/{DropdownPicker.js → StylePanelDropdownPicker.js} +23 -20
- package/dist-cjs/lib/ui/components/StylePanel/StylePanelDropdownPicker.js.map +7 -0
- package/dist-cjs/lib/ui/components/StylePanel/StylePanelSubheading.js +28 -0
- package/dist-cjs/lib/ui/components/StylePanel/StylePanelSubheading.js.map +7 -0
- package/dist-cjs/lib/ui/components/Toolbar/AltTextEditor.js +2 -0
- package/dist-cjs/lib/ui/components/Toolbar/AltTextEditor.js.map +2 -2
- package/dist-cjs/lib/ui/components/Toolbar/DefaultImageToolbarContent.js +38 -9
- package/dist-cjs/lib/ui/components/Toolbar/DefaultImageToolbarContent.js.map +2 -2
- package/dist-cjs/lib/ui/components/Toolbar/DefaultVideoToolbarContent.js +15 -3
- package/dist-cjs/lib/ui/components/Toolbar/DefaultVideoToolbarContent.js.map +2 -2
- package/dist-cjs/lib/ui/components/Toolbar/LinkEditor.js +2 -1
- package/dist-cjs/lib/ui/components/Toolbar/LinkEditor.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/Toolbar/ToggleToolLockedButton.js +6 -2
- package/dist-cjs/lib/ui/components/Toolbar/ToggleToolLockedButton.js.map +2 -2
- package/dist-cjs/lib/ui/components/primitives/TldrawUiContextualToolbar.js +11 -2
- package/dist-cjs/lib/ui/components/primitives/TldrawUiContextualToolbar.js.map +2 -2
- package/dist-cjs/lib/ui/components/primitives/TldrawUiInput.js +5 -3
- package/dist-cjs/lib/ui/components/primitives/TldrawUiInput.js.map +2 -2
- package/dist-cjs/lib/ui/components/primitives/TldrawUiSlider.js +18 -5
- package/dist-cjs/lib/ui/components/primitives/TldrawUiSlider.js.map +2 -2
- package/dist-cjs/lib/ui/components/primitives/TldrawUiToolbar.js +3 -0
- package/dist-cjs/lib/ui/components/primitives/TldrawUiToolbar.js.map +2 -2
- package/dist-cjs/lib/ui/components/primitives/TldrawUiTooltip.js +47 -3
- package/dist-cjs/lib/ui/components/primitives/TldrawUiTooltip.js.map +2 -2
- package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.js +3 -0
- package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.js.map +2 -2
- package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js +8 -8
- package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js.map +2 -2
- package/dist-cjs/lib/ui/context/actions.js +13 -8
- package/dist-cjs/lib/ui/context/actions.js.map +2 -2
- package/dist-cjs/lib/ui/context/events.js.map +1 -1
- package/dist-cjs/lib/ui/hooks/useClipboardEvents.js +1 -1
- package/dist-cjs/lib/ui/hooks/useClipboardEvents.js.map +2 -2
- package/dist-cjs/lib/ui/hooks/useExportAs.js +3 -2
- package/dist-cjs/lib/ui/hooks/useExportAs.js.map +2 -2
- package/dist-cjs/lib/ui/hooks/useTools.js +1 -1
- package/dist-cjs/lib/ui/hooks/useTools.js.map +2 -2
- package/dist-cjs/lib/ui/hooks/useTranslation/TLUiTranslationKey.js.map +1 -1
- package/dist-cjs/lib/ui/hooks/useTranslation/defaultTranslation.js +6 -2
- package/dist-cjs/lib/ui/hooks/useTranslation/defaultTranslation.js.map +2 -2
- package/dist-cjs/lib/ui/kbd-utils.js +9 -3
- package/dist-cjs/lib/ui/kbd-utils.js.map +2 -2
- package/dist-cjs/lib/ui/version.js +3 -3
- package/dist-cjs/lib/ui/version.js.map +1 -1
- package/dist-cjs/lib/utils/export/copyAs.js +1 -2
- package/dist-cjs/lib/utils/export/copyAs.js.map +2 -2
- package/dist-cjs/lib/utils/export/export.js +0 -20
- package/dist-cjs/lib/utils/export/export.js.map +2 -2
- package/dist-cjs/lib/utils/export/exportAs.js +1 -2
- package/dist-cjs/lib/utils/export/exportAs.js.map +2 -2
- package/dist-esm/index.d.mts +227 -110
- package/dist-esm/index.mjs +59 -28
- package/dist-esm/index.mjs.map +2 -2
- package/dist-esm/lib/defaultExternalContentHandlers.mjs +10 -0
- package/dist-esm/lib/defaultExternalContentHandlers.mjs.map +2 -2
- package/dist-esm/lib/shapes/arrow/arrowLabel.mjs +6 -0
- package/dist-esm/lib/shapes/arrow/arrowLabel.mjs.map +3 -3
- package/dist-esm/lib/shapes/arrow/arrowTargetState.mjs +3 -2
- package/dist-esm/lib/shapes/arrow/arrowTargetState.mjs.map +2 -2
- package/dist-esm/lib/shapes/arrow/toolStates/Pointing.mjs +1 -1
- package/dist-esm/lib/shapes/arrow/toolStates/Pointing.mjs.map +2 -2
- package/dist-esm/lib/shapes/bookmark/BookmarkShapeUtil.mjs +4 -5
- package/dist-esm/lib/shapes/bookmark/BookmarkShapeUtil.mjs.map +2 -2
- package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs +8 -1
- package/dist-esm/lib/shapes/frame/FrameShapeUtil.mjs.map +2 -2
- package/dist-esm/lib/shapes/frame/components/FrameLabelInput.mjs +9 -3
- package/dist-esm/lib/shapes/frame/components/FrameLabelInput.mjs.map +2 -2
- package/dist-esm/lib/shapes/geo/GeoShapeUtil.mjs +1 -0
- package/dist-esm/lib/shapes/geo/GeoShapeUtil.mjs.map +2 -2
- package/dist-esm/lib/shapes/image/ImageShapeUtil.mjs +3 -0
- package/dist-esm/lib/shapes/image/ImageShapeUtil.mjs.map +2 -2
- package/dist-esm/lib/shapes/note/NoteShapeUtil.mjs +2 -1
- package/dist-esm/lib/shapes/note/NoteShapeUtil.mjs.map +2 -2
- package/dist-esm/lib/shapes/shared/HyperlinkButton.mjs +5 -5
- package/dist-esm/lib/shapes/shared/HyperlinkButton.mjs.map +2 -2
- package/dist-esm/lib/shapes/shared/PlainTextLabel.mjs +1 -3
- package/dist-esm/lib/shapes/shared/PlainTextLabel.mjs.map +2 -2
- package/dist-esm/lib/shapes/shared/useEditablePlainText.mjs +3 -6
- package/dist-esm/lib/shapes/shared/useEditablePlainText.mjs.map +2 -2
- package/dist-esm/lib/shapes/shared/useImageOrVideoAsset.mjs +0 -2
- package/dist-esm/lib/shapes/shared/useImageOrVideoAsset.mjs.map +2 -2
- package/dist-esm/lib/shapes/text/PlainTextArea.mjs +4 -3
- package/dist-esm/lib/shapes/text/PlainTextArea.mjs.map +2 -2
- package/dist-esm/lib/shapes/text/RichTextArea.mjs +3 -4
- package/dist-esm/lib/shapes/text/RichTextArea.mjs.map +2 -2
- package/dist-esm/lib/tools/SelectTool/childStates/DraggingHandle.mjs +3 -1
- package/dist-esm/lib/tools/SelectTool/childStates/DraggingHandle.mjs.map +2 -2
- package/dist-esm/lib/ui/components/A11y.mjs +1 -2
- package/dist-esm/lib/ui/components/A11y.mjs.map +2 -2
- package/dist-esm/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.mjs +5 -5
- package/dist-esm/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.mjs.map +1 -1
- package/dist-esm/lib/ui/components/LanguageMenu.mjs +1 -0
- package/dist-esm/lib/ui/components/LanguageMenu.mjs.map +2 -2
- package/dist-esm/lib/ui/components/Minimap/DefaultMinimap.mjs +2 -1
- package/dist-esm/lib/ui/components/Minimap/DefaultMinimap.mjs.map +2 -2
- package/dist-esm/lib/ui/components/PageMenu/DefaultPageMenu.mjs +1 -2
- package/dist-esm/lib/ui/components/PageMenu/DefaultPageMenu.mjs.map +2 -2
- package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanel.mjs +14 -5
- package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanel.mjs.map +2 -2
- package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanelContent.mjs +257 -320
- package/dist-esm/lib/ui/components/StylePanel/DefaultStylePanelContent.mjs.map +2 -2
- package/dist-esm/lib/ui/components/StylePanel/StylePanelButtonPicker.mjs +135 -0
- package/dist-esm/lib/ui/components/StylePanel/StylePanelButtonPicker.mjs.map +7 -0
- package/dist-esm/lib/ui/components/StylePanel/StylePanelContext.mjs +48 -0
- package/dist-esm/lib/ui/components/StylePanel/StylePanelContext.mjs.map +7 -0
- package/dist-esm/lib/ui/components/StylePanel/{DoubleDropdownPicker.mjs → StylePanelDoubleDropdownPicker.mjs} +20 -19
- package/dist-esm/lib/ui/components/StylePanel/StylePanelDoubleDropdownPicker.mjs.map +7 -0
- package/dist-esm/lib/ui/components/StylePanel/{DropdownPicker.mjs → StylePanelDropdownPicker.mjs} +20 -17
- package/dist-esm/lib/ui/components/StylePanel/StylePanelDropdownPicker.mjs.map +7 -0
- package/dist-esm/lib/ui/components/StylePanel/StylePanelSubheading.mjs +8 -0
- package/dist-esm/lib/ui/components/StylePanel/StylePanelSubheading.mjs.map +7 -0
- package/dist-esm/lib/ui/components/Toolbar/AltTextEditor.mjs +2 -0
- package/dist-esm/lib/ui/components/Toolbar/AltTextEditor.mjs.map +2 -2
- package/dist-esm/lib/ui/components/Toolbar/DefaultImageToolbarContent.mjs +38 -9
- package/dist-esm/lib/ui/components/Toolbar/DefaultImageToolbarContent.mjs.map +2 -2
- package/dist-esm/lib/ui/components/Toolbar/DefaultVideoToolbarContent.mjs +15 -3
- package/dist-esm/lib/ui/components/Toolbar/DefaultVideoToolbarContent.mjs.map +2 -2
- package/dist-esm/lib/ui/components/Toolbar/LinkEditor.mjs +2 -1
- package/dist-esm/lib/ui/components/Toolbar/LinkEditor.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/Toolbar/ToggleToolLockedButton.mjs +6 -2
- package/dist-esm/lib/ui/components/Toolbar/ToggleToolLockedButton.mjs.map +2 -2
- package/dist-esm/lib/ui/components/primitives/TldrawUiContextualToolbar.mjs +11 -3
- package/dist-esm/lib/ui/components/primitives/TldrawUiContextualToolbar.mjs.map +2 -2
- package/dist-esm/lib/ui/components/primitives/TldrawUiInput.mjs +6 -4
- package/dist-esm/lib/ui/components/primitives/TldrawUiInput.mjs.map +2 -2
- package/dist-esm/lib/ui/components/primitives/TldrawUiSlider.mjs +18 -5
- package/dist-esm/lib/ui/components/primitives/TldrawUiSlider.mjs.map +2 -2
- package/dist-esm/lib/ui/components/primitives/TldrawUiToolbar.mjs +3 -0
- package/dist-esm/lib/ui/components/primitives/TldrawUiToolbar.mjs.map +2 -2
- package/dist-esm/lib/ui/components/primitives/TldrawUiTooltip.mjs +48 -3
- package/dist-esm/lib/ui/components/primitives/TldrawUiTooltip.mjs.map +2 -2
- package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.mjs +3 -0
- package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.mjs.map +2 -2
- package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs +8 -8
- package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs.map +2 -2
- package/dist-esm/lib/ui/context/actions.mjs +13 -8
- package/dist-esm/lib/ui/context/actions.mjs.map +2 -2
- package/dist-esm/lib/ui/context/events.mjs.map +1 -1
- package/dist-esm/lib/ui/hooks/useClipboardEvents.mjs +1 -2
- package/dist-esm/lib/ui/hooks/useClipboardEvents.mjs.map +2 -2
- package/dist-esm/lib/ui/hooks/useExportAs.mjs +3 -2
- package/dist-esm/lib/ui/hooks/useExportAs.mjs.map +2 -2
- package/dist-esm/lib/ui/hooks/useTools.mjs +1 -1
- package/dist-esm/lib/ui/hooks/useTools.mjs.map +2 -2
- package/dist-esm/lib/ui/hooks/useTranslation/defaultTranslation.mjs +6 -2
- package/dist-esm/lib/ui/hooks/useTranslation/defaultTranslation.mjs.map +2 -2
- package/dist-esm/lib/ui/kbd-utils.mjs +9 -3
- package/dist-esm/lib/ui/kbd-utils.mjs.map +2 -2
- package/dist-esm/lib/ui/version.mjs +3 -3
- package/dist-esm/lib/ui/version.mjs.map +1 -1
- package/dist-esm/lib/utils/export/copyAs.mjs +1 -2
- package/dist-esm/lib/utils/export/copyAs.mjs.map +2 -2
- package/dist-esm/lib/utils/export/export.mjs +0 -20
- package/dist-esm/lib/utils/export/export.mjs.map +2 -2
- package/dist-esm/lib/utils/export/exportAs.mjs +1 -2
- package/dist-esm/lib/utils/export/exportAs.mjs.map +2 -2
- package/package.json +3 -3
- package/src/index.ts +45 -21
- package/src/lib/defaultExternalContentHandlers.ts +14 -0
- package/src/lib/shapes/arrow/ArrowShapeOptions.test.ts +83 -13
- package/src/lib/shapes/arrow/ArrowShapeTool.test.ts +99 -5
- package/src/lib/shapes/arrow/ArrowShapeUtil.test.ts +41 -0
- package/src/lib/shapes/arrow/arrow-types.ts +3 -5
- package/src/lib/shapes/arrow/arrowLabel.ts +8 -0
- package/src/lib/shapes/arrow/arrowTargetState.ts +34 -3
- package/src/lib/shapes/arrow/toolStates/Pointing.tsx +1 -1
- package/src/lib/shapes/bookmark/BookmarkShapeUtil.tsx +4 -5
- package/src/lib/shapes/frame/FrameShapeUtil.tsx +9 -0
- package/src/lib/shapes/frame/components/FrameLabelInput.tsx +10 -3
- package/src/lib/shapes/geo/GeoShapeUtil.tsx +1 -0
- package/src/lib/shapes/image/ImageShapeUtil.tsx +3 -0
- package/src/lib/shapes/note/NoteShapeUtil.tsx +1 -0
- package/src/lib/shapes/shared/HyperlinkButton.tsx +5 -5
- package/src/lib/shapes/shared/PlainTextLabel.tsx +0 -6
- package/src/lib/shapes/shared/useEditablePlainText.ts +3 -10
- package/src/lib/shapes/shared/useImageOrVideoAsset.ts +0 -7
- package/src/lib/shapes/text/PlainTextArea.tsx +4 -3
- package/src/lib/shapes/text/RichTextArea.tsx +3 -4
- package/src/lib/tools/SelectTool/childStates/DraggingHandle.tsx +6 -2
- package/src/lib/ui/components/A11y.tsx +1 -2
- package/src/lib/ui/components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialogContent.tsx +5 -5
- package/src/lib/ui/components/LanguageMenu.tsx +1 -0
- package/src/lib/ui/components/Minimap/DefaultMinimap.tsx +2 -1
- package/src/lib/ui/components/PageMenu/DefaultPageMenu.tsx +1 -2
- package/src/lib/ui/components/StylePanel/DefaultStylePanel.tsx +27 -13
- package/src/lib/ui/components/StylePanel/DefaultStylePanelContent.tsx +260 -381
- package/src/lib/ui/components/{primitives/TldrawUiButtonPicker.tsx → StylePanel/StylePanelButtonPicker.tsx} +70 -50
- package/src/lib/ui/components/StylePanel/StylePanelContext.tsx +63 -0
- package/src/lib/ui/components/StylePanel/{DoubleDropdownPicker.tsx → StylePanelDoubleDropdownPicker.tsx} +28 -19
- package/src/lib/ui/components/StylePanel/StylePanelDropdownPicker.tsx +119 -0
- package/src/lib/ui/components/StylePanel/StylePanelSubheading.tsx +9 -0
- package/src/lib/ui/components/Toolbar/AltTextEditor.tsx +2 -0
- package/src/lib/ui/components/Toolbar/DefaultImageToolbarContent.tsx +32 -15
- package/src/lib/ui/components/Toolbar/DefaultVideoToolbarContent.tsx +12 -4
- package/src/lib/ui/components/Toolbar/LinkEditor.tsx +1 -0
- package/src/lib/ui/components/Toolbar/OverflowingToolbar.tsx +1 -1
- package/src/lib/ui/components/Toolbar/ToggleToolLockedButton.tsx +9 -2
- package/src/lib/ui/components/primitives/TldrawUiContextualToolbar.tsx +7 -3
- package/src/lib/ui/components/primitives/TldrawUiInput.tsx +6 -3
- package/src/lib/ui/components/primitives/TldrawUiSlider.tsx +52 -32
- package/src/lib/ui/components/primitives/TldrawUiToolbar.tsx +5 -1
- package/src/lib/ui/components/primitives/TldrawUiTooltip.tsx +67 -13
- package/src/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.tsx +4 -0
- package/src/lib/ui/components/primitives/menus/TldrawUiMenuItem.tsx +9 -9
- package/src/lib/ui/context/actions.tsx +20 -8
- package/src/lib/ui/context/events.tsx +1 -1
- package/src/lib/ui/hooks/useClipboardEvents.ts +1 -2
- package/src/lib/ui/hooks/useExportAs.ts +3 -2
- package/src/lib/ui/hooks/useTools.tsx +1 -1
- package/src/lib/ui/hooks/useTranslation/TLUiTranslationKey.ts +4 -0
- package/src/lib/ui/hooks/useTranslation/defaultTranslation.ts +6 -2
- package/src/lib/ui/kbd-utils.ts +10 -3
- package/src/lib/ui/version.ts +3 -3
- package/src/lib/ui.css +40 -3
- package/src/lib/utils/export/copyAs.ts +1 -24
- package/src/lib/utils/export/export.ts +0 -36
- package/src/lib/utils/export/exportAs.ts +1 -32
- package/src/test/TestEditor.ts +8 -2
- package/src/test/custom-clipping.test.ts +436 -0
- package/src/test/frames.test.ts +15 -0
- package/src/test/getCulledShapes.test.tsx +71 -2
- package/tldraw.css +48 -6
- package/dist-cjs/lib/ui/components/StylePanel/DoubleDropdownPicker.js.map +0 -7
- package/dist-cjs/lib/ui/components/StylePanel/DropdownPicker.js.map +0 -7
- package/dist-cjs/lib/ui/components/primitives/TldrawUiButtonPicker.js +0 -131
- package/dist-cjs/lib/ui/components/primitives/TldrawUiButtonPicker.js.map +0 -7
- package/dist-esm/lib/ui/components/StylePanel/DoubleDropdownPicker.mjs.map +0 -7
- package/dist-esm/lib/ui/components/StylePanel/DropdownPicker.mjs.map +0 -7
- package/dist-esm/lib/ui/components/primitives/TldrawUiButtonPicker.mjs +0 -115
- package/dist-esm/lib/ui/components/primitives/TldrawUiButtonPicker.mjs.map +0 -7
- package/src/lib/ui/components/StylePanel/DropdownPicker.tsx +0 -110
package/dist-cjs/index.d.ts
CHANGED
|
@@ -11,6 +11,7 @@ import { Circle2d } from '@tldraw/editor';
|
|
|
11
11
|
import { ComponentType } from 'react';
|
|
12
12
|
import { CSSProperties } from 'react';
|
|
13
13
|
import { Editor } from '@tldraw/editor';
|
|
14
|
+
import { ElbowArrowSnap } from '@tldraw/editor';
|
|
14
15
|
import { Extension } from '@tiptap/core';
|
|
15
16
|
import { Extensions } from '@tiptap/core';
|
|
16
17
|
import { ForwardRefExoticComponent } from 'react';
|
|
@@ -58,6 +59,7 @@ import { TLArrowBinding } from '@tldraw/editor';
|
|
|
58
59
|
import { TLArrowBindingProps } from '@tldraw/editor';
|
|
59
60
|
import { TLArrowShape } from '@tldraw/editor';
|
|
60
61
|
import { TLArrowShapeArrowheadStyle } from '@tldraw/editor';
|
|
62
|
+
import { TLArrowShapeKind } from '@tldraw/editor';
|
|
61
63
|
import { TLArrowShapeProps } from '@tldraw/editor';
|
|
62
64
|
import { TLAsset } from '@tldraw/editor';
|
|
63
65
|
import { TLAssetId } from '@tldraw/editor';
|
|
@@ -68,7 +70,6 @@ import { TLClickEventInfo } from '@tldraw/editor';
|
|
|
68
70
|
import { TLContent } from '@tldraw/editor';
|
|
69
71
|
import { TLCropInfo } from '@tldraw/editor';
|
|
70
72
|
import { TLDefaultColorStyle } from '@tldraw/editor';
|
|
71
|
-
import { TLDefaultColorTheme } from '@tldraw/editor';
|
|
72
73
|
import { TLDefaultColorThemeColor } from '@tldraw/editor';
|
|
73
74
|
import { TLDefaultDashStyle } from '@tldraw/editor';
|
|
74
75
|
import { TLDefaultFillStyle } from '@tldraw/editor';
|
|
@@ -193,9 +194,6 @@ export declare class ArrowBindingUtil extends BindingUtil<TLArrowBinding> {
|
|
|
193
194
|
/** @public @react */
|
|
194
195
|
export declare function ArrowDownToolbarItem(): JSX_2.Element;
|
|
195
196
|
|
|
196
|
-
/** @public @react */
|
|
197
|
-
export declare function ArrowheadStylePickerSet({ styles }: StylePickerSetProps): JSX_2.Element | null;
|
|
198
|
-
|
|
199
197
|
/** @public @react */
|
|
200
198
|
export declare function ArrowLeftToolbarItem(): JSX_2.Element;
|
|
201
199
|
|
|
@@ -278,7 +276,7 @@ export declare interface ArrowShapeOptions {
|
|
|
278
276
|
*/
|
|
279
277
|
readonly hoverPreciseTimeout: number;
|
|
280
278
|
/**
|
|
281
|
-
* When pointing at a shape using the arrow tool or
|
|
279
|
+
* When pointing at a shape using the arrow tool or dragging an arrow terminal handle, how long
|
|
282
280
|
* should we wait before we assume the user is targeting precisely instead of imprecisely.
|
|
283
281
|
*/
|
|
284
282
|
readonly pointingPreciseTimeout: number;
|
|
@@ -286,11 +284,11 @@ export declare interface ArrowShapeOptions {
|
|
|
286
284
|
* When creating an arrow, should it stop exactly at the pointer, or should
|
|
287
285
|
* it stop at the edge of the target shape.
|
|
288
286
|
*/
|
|
289
|
-
|
|
287
|
+
shouldBeExact(editor: Editor, isPrecise: boolean): boolean;
|
|
290
288
|
/**
|
|
291
289
|
* When creating an arrow, should it bind to the target shape.
|
|
292
290
|
*/
|
|
293
|
-
|
|
291
|
+
shouldIgnoreTargets(editor: Editor): boolean;
|
|
294
292
|
}
|
|
295
293
|
|
|
296
294
|
/** @public */
|
|
@@ -365,6 +363,42 @@ export declare class ArrowShapeUtil extends ShapeUtil<TLArrowShape> {
|
|
|
365
363
|
getInterpolatedProps(startShape: TLArrowShape, endShape: TLArrowShape, progress: number): TLArrowShapeProps;
|
|
366
364
|
}
|
|
367
365
|
|
|
366
|
+
/**
|
|
367
|
+
* State representing what we're pointing to when drawing or updating an arrow. You can get this
|
|
368
|
+
* state using {@link getArrowTargetState}, and update it as part of an arrow interaction with
|
|
369
|
+
* {@link updateArrowTargetState} or {@link clearArrowTargetState}.
|
|
370
|
+
*
|
|
371
|
+
* @public
|
|
372
|
+
*/
|
|
373
|
+
export declare interface ArrowTargetState {
|
|
374
|
+
target: TLShape;
|
|
375
|
+
arrowKind: TLArrowShapeKind;
|
|
376
|
+
handlesInPageSpace: {
|
|
377
|
+
bottom: {
|
|
378
|
+
isEnabled: boolean;
|
|
379
|
+
point: VecLike;
|
|
380
|
+
};
|
|
381
|
+
left: {
|
|
382
|
+
isEnabled: boolean;
|
|
383
|
+
point: VecLike;
|
|
384
|
+
};
|
|
385
|
+
right: {
|
|
386
|
+
isEnabled: boolean;
|
|
387
|
+
point: VecLike;
|
|
388
|
+
};
|
|
389
|
+
top: {
|
|
390
|
+
isEnabled: boolean;
|
|
391
|
+
point: VecLike;
|
|
392
|
+
};
|
|
393
|
+
};
|
|
394
|
+
isExact: boolean;
|
|
395
|
+
isPrecise: boolean;
|
|
396
|
+
centerInPageSpace: VecLike;
|
|
397
|
+
anchorInPageSpace: VecLike;
|
|
398
|
+
snap: ElbowArrowSnap;
|
|
399
|
+
normalizedAnchor: VecLike;
|
|
400
|
+
}
|
|
401
|
+
|
|
368
402
|
/** @public @react */
|
|
369
403
|
export declare function ArrowToolbarItem(): JSX_2.Element;
|
|
370
404
|
|
|
@@ -491,6 +525,14 @@ export declare function centerSelectionAroundPoint(editor: Editor, position: Vec
|
|
|
491
525
|
/** @public @react */
|
|
492
526
|
export declare function CheckBoxToolbarItem(): JSX_2.Element;
|
|
493
527
|
|
|
528
|
+
/**
|
|
529
|
+
* Clear the current arrow target state for an editor. See {@link ArrowTargetState} for more
|
|
530
|
+
* information.
|
|
531
|
+
*
|
|
532
|
+
* @public
|
|
533
|
+
*/
|
|
534
|
+
export declare function clearArrowTargetState(editor: Editor): void;
|
|
535
|
+
|
|
494
536
|
/** @public @react */
|
|
495
537
|
export declare function ClipboardMenuGroup(): JSX_2.Element;
|
|
496
538
|
|
|
@@ -500,9 +542,6 @@ export declare function CloudToolbarItem(): JSX_2.Element;
|
|
|
500
542
|
/** @public @react */
|
|
501
543
|
export declare function ColorSchemeMenu(): JSX_2.Element;
|
|
502
544
|
|
|
503
|
-
/** @public @react */
|
|
504
|
-
export declare function CommonStylePickerSet({ styles, theme }: ThemeStylePickerSetProps): JSX_2.Element;
|
|
505
|
-
|
|
506
545
|
/**
|
|
507
546
|
* Contains the size within the given box size
|
|
508
547
|
*
|
|
@@ -534,14 +573,6 @@ export declare function ConvertToEmbedMenuItem(): JSX_2.Element | null;
|
|
|
534
573
|
*/
|
|
535
574
|
export declare function copyAs(editor: Editor, ids: TLShapeId[], opts: CopyAsOptions): Promise<void>;
|
|
536
575
|
|
|
537
|
-
/**
|
|
538
|
-
* @deprecated The format parameter is now part of the opts object.
|
|
539
|
-
* @public
|
|
540
|
-
*/
|
|
541
|
-
export declare function copyAs(editor: Editor, ids: TLShapeId[], format: TLCopyType, opts?: TLImageExportOptions & {
|
|
542
|
-
format?: undefined;
|
|
543
|
-
}): Promise<void>;
|
|
544
|
-
|
|
545
576
|
/** @public @react */
|
|
546
577
|
export declare function CopyAsMenuGroup(): JSX_2.Element;
|
|
547
578
|
|
|
@@ -999,7 +1030,7 @@ export declare function DefaultSharePanel(): JSX_2.Element;
|
|
|
999
1030
|
export declare const DefaultStylePanel: NamedExoticComponent<TLUiStylePanelProps>;
|
|
1000
1031
|
|
|
1001
1032
|
/** @public @react */
|
|
1002
|
-
export declare function DefaultStylePanelContent(
|
|
1033
|
+
export declare function DefaultStylePanelContent(): JSX_2.Element;
|
|
1003
1034
|
|
|
1004
1035
|
/** @public @react */
|
|
1005
1036
|
export declare const DefaultToasts: NamedExoticComponent<object>;
|
|
@@ -1492,12 +1523,6 @@ export declare interface ExampleDialogProps {
|
|
|
1492
1523
|
*/
|
|
1493
1524
|
export declare function exportAs(editor: Editor, ids: TLShapeId[], opts: ExportAsOptions): Promise<void>;
|
|
1494
1525
|
|
|
1495
|
-
/**
|
|
1496
|
-
* @deprecated The format & name parameters are now part of the opts object.
|
|
1497
|
-
* @public
|
|
1498
|
-
*/
|
|
1499
|
-
export declare function exportAs(editor: Editor, ids: TLShapeId[], format?: TLExportType, name?: string, opts?: TLImageExportOptions): Promise<void>;
|
|
1500
|
-
|
|
1501
1526
|
/** @public */
|
|
1502
1527
|
export declare interface ExportAsOptions extends TLImageExportOptions {
|
|
1503
1528
|
/** {@inheritdoc @tldraw/editor#TLImageExportOptions.format} */
|
|
@@ -1509,23 +1534,6 @@ export declare interface ExportAsOptions extends TLImageExportOptions {
|
|
|
1509
1534
|
/** @public @react */
|
|
1510
1535
|
export declare function ExportFileContentSubMenu(): JSX_2.Element;
|
|
1511
1536
|
|
|
1512
|
-
/**
|
|
1513
|
-
* Export the given shapes as a blob.
|
|
1514
|
-
* @param editor - The editor instance.
|
|
1515
|
-
* @param ids - The ids of the shapes to export.
|
|
1516
|
-
* @param format - The format to export as.
|
|
1517
|
-
* @param opts - Rendering options.
|
|
1518
|
-
* @returns A promise that resolves to a blob.
|
|
1519
|
-
* @deprecated Use {@link @tldraw/editor#Editor.toImage} instead.
|
|
1520
|
-
* @public
|
|
1521
|
-
*/
|
|
1522
|
-
export declare function exportToBlob({ editor, ids, format, opts, }: {
|
|
1523
|
-
editor: Editor;
|
|
1524
|
-
format: TLExportType;
|
|
1525
|
-
ids: TLShapeId[];
|
|
1526
|
-
opts?: TLImageExportOptions;
|
|
1527
|
-
}): Promise<Blob>;
|
|
1528
|
-
|
|
1529
1537
|
/** @public @react */
|
|
1530
1538
|
export declare function ExtrasGroup(): JSX_2.Element;
|
|
1531
1539
|
|
|
@@ -1582,6 +1590,7 @@ export declare class FrameShapeUtil extends BaseBoxShapeUtil<TLFrameShape> {
|
|
|
1582
1590
|
canEdit(): boolean;
|
|
1583
1591
|
canResize(): boolean;
|
|
1584
1592
|
canResizeChildren(): boolean;
|
|
1593
|
+
isExportBoundsContainer(): boolean;
|
|
1585
1594
|
getDefaultProps(): TLFrameShape['props'];
|
|
1586
1595
|
getAriaDescriptor(shape: TLFrameShape): string;
|
|
1587
1596
|
getGeometry(shape: TLFrameShape): Geometry2d;
|
|
@@ -1590,6 +1599,7 @@ export declare class FrameShapeUtil extends BaseBoxShapeUtil<TLFrameShape> {
|
|
|
1590
1599
|
toSvg(shape: TLFrameShape, ctx: SvgExportContext): JSX_2.Element;
|
|
1591
1600
|
indicator(shape: TLFrameShape): JSX_2.Element;
|
|
1592
1601
|
providesBackgroundForChildren(): boolean;
|
|
1602
|
+
getClipPath(shape: TLFrameShape): Vec[];
|
|
1593
1603
|
canReceiveNewChildrenOfType(shape: TLShape): boolean;
|
|
1594
1604
|
onResize(shape: any, info: TLResizeInfo<any>): any;
|
|
1595
1605
|
getInterpolatedProps(startShape: TLFrameShape, endShape: TLFrameShape, t: number): TLFrameShapeProps;
|
|
@@ -1738,15 +1748,20 @@ export declare class GeoShapeUtil extends BaseBoxShapeUtil<TLGeoShape> {
|
|
|
1738
1748
|
getInterpolatedProps(startShape: TLGeoShape, endShape: TLGeoShape, t: number): TLGeoShapeProps;
|
|
1739
1749
|
}
|
|
1740
1750
|
|
|
1741
|
-
/** @public @react */
|
|
1742
|
-
export declare function GeoStylePickerSet({ styles }: StylePickerSetProps): JSX_2.Element | null;
|
|
1743
|
-
|
|
1744
1751
|
/** @public */
|
|
1745
1752
|
export declare function getArrowBindings(editor: Editor, shape: TLArrowShape): TLArrowBindings;
|
|
1746
1753
|
|
|
1747
1754
|
/** @public */
|
|
1748
1755
|
export declare function getArrowInfo(editor: Editor, shape: TLArrowShape | TLShapeId): TLArrowInfo | undefined;
|
|
1749
1756
|
|
|
1757
|
+
/**
|
|
1758
|
+
* Get the current arrow target state for an editor. See {@link ArrowTargetState} for more
|
|
1759
|
+
* information.
|
|
1760
|
+
*
|
|
1761
|
+
* @public
|
|
1762
|
+
*/
|
|
1763
|
+
export declare function getArrowTargetState(editor: Editor): ArrowTargetState | null;
|
|
1764
|
+
|
|
1750
1765
|
/** @public */
|
|
1751
1766
|
export declare function getArrowTerminalsInArrowSpace(editor: Editor, shape: TLArrowShape, bindings: TLArrowBindings): {
|
|
1752
1767
|
end: Vec;
|
|
@@ -1901,6 +1916,7 @@ export declare class ImageShapeUtil extends BaseBoxShapeUtil<TLImageShape> {
|
|
|
1901
1916
|
static migrations: TLPropsMigrations;
|
|
1902
1917
|
isAspectRatioLocked(): boolean;
|
|
1903
1918
|
canCrop(): boolean;
|
|
1919
|
+
isExportBoundsContainer(): boolean;
|
|
1904
1920
|
getDefaultProps(): TLImageShape['props'];
|
|
1905
1921
|
getGeometry(shape: TLImageShape): Geometry2d;
|
|
1906
1922
|
getAriaDescriptor(shape: TLImageShape): string;
|
|
@@ -2187,9 +2203,6 @@ export declare interface OnDragFromToolbarToCreateShapesOpts {
|
|
|
2187
2203
|
onDragEnd?(id: TLShapeId): void;
|
|
2188
2204
|
}
|
|
2189
2205
|
|
|
2190
|
-
/** @public @react */
|
|
2191
|
-
export declare function OpacitySlider(): JSX_2.Element | null;
|
|
2192
|
-
|
|
2193
2206
|
/** @public @react */
|
|
2194
2207
|
export declare function OvalToolbarItem(): JSX_2.Element;
|
|
2195
2208
|
|
|
@@ -2581,9 +2594,6 @@ export declare interface SolidPathBuilderOpts extends BasePathBuilderOpts {
|
|
|
2581
2594
|
|
|
2582
2595
|
/* Excluded from this release type: Spinner */
|
|
2583
2596
|
|
|
2584
|
-
/** @public @react */
|
|
2585
|
-
export declare function SplineStylePickerSet({ styles }: StylePickerSetProps): JSX_2.Element | null;
|
|
2586
|
-
|
|
2587
2597
|
/** @public @react */
|
|
2588
2598
|
export declare function StackMenuItems(): JSX_2.Element;
|
|
2589
2599
|
|
|
@@ -2641,11 +2651,124 @@ export declare interface StrokePoint {
|
|
|
2641
2651
|
radius: number;
|
|
2642
2652
|
}
|
|
2643
2653
|
|
|
2654
|
+
/** @public @react */
|
|
2655
|
+
export declare function StylePanelArrowheadPicker(): JSX_2.Element | null;
|
|
2656
|
+
|
|
2657
|
+
/** @public @react */
|
|
2658
|
+
export declare function StylePanelArrowKindPicker(): JSX_2.Element | null;
|
|
2659
|
+
|
|
2660
|
+
/** @public */
|
|
2661
|
+
export declare const StylePanelButtonPicker: <T extends string>(props: StylePanelButtonPickerProps<T>) => ReactElement;
|
|
2662
|
+
|
|
2663
|
+
/** @public */
|
|
2664
|
+
export declare interface StylePanelButtonPickerProps<T extends string> {
|
|
2665
|
+
title: string;
|
|
2666
|
+
uiType: string;
|
|
2667
|
+
style: StyleProp<T>;
|
|
2668
|
+
value: SharedStyle<T>;
|
|
2669
|
+
items: StyleValuesForUi<T>;
|
|
2670
|
+
onValueChange?(style: StyleProp<T>, value: T): void;
|
|
2671
|
+
onHistoryMark?(id: string): void;
|
|
2672
|
+
}
|
|
2673
|
+
|
|
2674
|
+
/** @public @react */
|
|
2675
|
+
export declare function StylePanelColorPicker(): JSX_2.Element | null;
|
|
2676
|
+
|
|
2677
|
+
/** @public */
|
|
2678
|
+
export declare interface StylePanelContext {
|
|
2679
|
+
styles: ReadonlySharedStyleMap;
|
|
2680
|
+
showUiLabels: boolean;
|
|
2681
|
+
onHistoryMark(id: string): void;
|
|
2682
|
+
onValueChange<T>(style: StyleProp<T>, value: T): void;
|
|
2683
|
+
}
|
|
2684
|
+
|
|
2685
|
+
/** @public @react */
|
|
2686
|
+
export declare function StylePanelContextProvider({ children, styles }: StylePanelContextProviderProps): JSX_2.Element;
|
|
2687
|
+
|
|
2644
2688
|
/** @public */
|
|
2645
|
-
export declare interface
|
|
2689
|
+
export declare interface StylePanelContextProviderProps {
|
|
2690
|
+
children: React.ReactNode;
|
|
2646
2691
|
styles: ReadonlySharedStyleMap;
|
|
2647
2692
|
}
|
|
2648
2693
|
|
|
2694
|
+
/** @public @react */
|
|
2695
|
+
export declare function StylePanelDashPicker(): JSX_2.Element | null;
|
|
2696
|
+
|
|
2697
|
+
/** @public @react */
|
|
2698
|
+
export declare const StylePanelDoubleDropdownPicker: <T extends string>(props: StylePanelDoubleDropdownPickerProps<T>) => React_2.JSX.Element;
|
|
2699
|
+
|
|
2700
|
+
/** @public */
|
|
2701
|
+
export declare interface StylePanelDoubleDropdownPickerProps<T extends string> {
|
|
2702
|
+
uiTypeA: string;
|
|
2703
|
+
uiTypeB: string;
|
|
2704
|
+
label: Exclude<string, TLUiTranslationKey> | TLUiTranslationKey;
|
|
2705
|
+
labelA: Exclude<string, TLUiTranslationKey> | TLUiTranslationKey;
|
|
2706
|
+
labelB: Exclude<string, TLUiTranslationKey> | TLUiTranslationKey;
|
|
2707
|
+
itemsA: StyleValuesForUi<T>;
|
|
2708
|
+
itemsB: StyleValuesForUi<T>;
|
|
2709
|
+
styleA: StyleProp<T>;
|
|
2710
|
+
styleB: StyleProp<T>;
|
|
2711
|
+
valueA: SharedStyle<T>;
|
|
2712
|
+
valueB: SharedStyle<T>;
|
|
2713
|
+
onValueChange?(style: StyleProp<T>, value: T): void;
|
|
2714
|
+
}
|
|
2715
|
+
|
|
2716
|
+
/** @public @react */
|
|
2717
|
+
export declare const StylePanelDropdownPicker: <T extends string>(props: StylePanelDropdownPickerProps<T>) => React_2.JSX.Element;
|
|
2718
|
+
|
|
2719
|
+
/** @public */
|
|
2720
|
+
export declare interface StylePanelDropdownPickerProps<T extends string> {
|
|
2721
|
+
id: string;
|
|
2722
|
+
label?: Exclude<string, TLUiTranslationKey> | TLUiTranslationKey;
|
|
2723
|
+
uiType: string;
|
|
2724
|
+
stylePanelType: string;
|
|
2725
|
+
style: StyleProp<T>;
|
|
2726
|
+
value: SharedStyle<T>;
|
|
2727
|
+
items: StyleValuesForUi<T>;
|
|
2728
|
+
type: 'icon' | 'menu' | 'tool';
|
|
2729
|
+
onValueChange?(style: StyleProp<T>, value: T): void;
|
|
2730
|
+
}
|
|
2731
|
+
|
|
2732
|
+
/** @public @react */
|
|
2733
|
+
export declare function StylePanelFillPicker(): JSX_2.Element | null;
|
|
2734
|
+
|
|
2735
|
+
/** @public @react */
|
|
2736
|
+
export declare function StylePanelFontPicker(): JSX_2.Element | null;
|
|
2737
|
+
|
|
2738
|
+
/** @public @react */
|
|
2739
|
+
export declare function StylePanelGeoShapePicker(): JSX_2.Element | null;
|
|
2740
|
+
|
|
2741
|
+
/** @public @react */
|
|
2742
|
+
export declare function StylePanelLabelAlignPicker(): JSX_2.Element | null;
|
|
2743
|
+
|
|
2744
|
+
/** @public @react */
|
|
2745
|
+
export declare function StylePanelOpacityPicker(): JSX_2.Element | null;
|
|
2746
|
+
|
|
2747
|
+
/** @public @react */
|
|
2748
|
+
export declare function StylePanelSection({ children }: StylePanelSectionProps): JSX_2.Element;
|
|
2749
|
+
|
|
2750
|
+
/** @public */
|
|
2751
|
+
export declare interface StylePanelSectionProps {
|
|
2752
|
+
children: React_3.ReactNode;
|
|
2753
|
+
}
|
|
2754
|
+
|
|
2755
|
+
/** @public @react */
|
|
2756
|
+
export declare function StylePanelSizePicker(): JSX_2.Element | null;
|
|
2757
|
+
|
|
2758
|
+
/** @public @react */
|
|
2759
|
+
export declare function StylePanelSplinePicker(): JSX_2.Element | null;
|
|
2760
|
+
|
|
2761
|
+
/** @public @react */
|
|
2762
|
+
export declare function StylePanelSubheading({ children }: StylePanelSubheadingProps): JSX_2.Element;
|
|
2763
|
+
|
|
2764
|
+
/** @public */
|
|
2765
|
+
export declare interface StylePanelSubheadingProps {
|
|
2766
|
+
children: React.ReactNode;
|
|
2767
|
+
}
|
|
2768
|
+
|
|
2769
|
+
/** @public @react */
|
|
2770
|
+
export declare function StylePanelTextAlignPicker(): JSX_2.Element | null;
|
|
2771
|
+
|
|
2649
2772
|
/** @public */
|
|
2650
2773
|
export declare type StyleValuesForUi<T> = readonly {
|
|
2651
2774
|
readonly icon: string | TLUiIconJsx;
|
|
@@ -2685,12 +2808,6 @@ export declare interface TextAreaProps {
|
|
|
2685
2808
|
*/
|
|
2686
2809
|
export declare const TextDirection: Extension<any, any>;
|
|
2687
2810
|
|
|
2688
|
-
/**
|
|
2689
|
-
* @deprecated Use `PlainTextLabel` instead.
|
|
2690
|
-
* @public
|
|
2691
|
-
*/
|
|
2692
|
-
export declare const TextLabel: React_3.NamedExoticComponent<PlainTextLabelProps>;
|
|
2693
|
-
|
|
2694
2811
|
/** @public */
|
|
2695
2812
|
export declare interface TextShapeOptions {
|
|
2696
2813
|
/** How much addition padding should be added to the horizontal geometry of the shape when binding to an arrow? */
|
|
@@ -2768,18 +2885,9 @@ export declare class TextShapeUtil extends ShapeUtil<TLTextShape> {
|
|
|
2768
2885
|
} | undefined;
|
|
2769
2886
|
}
|
|
2770
2887
|
|
|
2771
|
-
/** @public @react */
|
|
2772
|
-
export declare function TextStylePickerSet({ theme, styles }: ThemeStylePickerSetProps): JSX_2.Element | null;
|
|
2773
|
-
|
|
2774
2888
|
/** @public @react */
|
|
2775
2889
|
export declare function TextToolbarItem(): JSX_2.Element;
|
|
2776
2890
|
|
|
2777
|
-
/** @public */
|
|
2778
|
-
export declare interface ThemeStylePickerSetProps {
|
|
2779
|
-
styles: ReadonlySharedStyleMap;
|
|
2780
|
-
theme: TLDefaultColorTheme;
|
|
2781
|
-
}
|
|
2782
|
-
|
|
2783
2891
|
/**
|
|
2784
2892
|
* Default extensions for the TipTap editor.
|
|
2785
2893
|
*
|
|
@@ -3036,9 +3144,6 @@ export declare function TldrawUiButtonIcon({ icon, small, invertIcon }: TLUiButt
|
|
|
3036
3144
|
/** @public @react */
|
|
3037
3145
|
export declare function TldrawUiButtonLabel({ children }: TLUiButtonLabelProps): JSX_2.Element;
|
|
3038
3146
|
|
|
3039
|
-
/** @public */
|
|
3040
|
-
export declare const TldrawUiButtonPicker: <T extends string>(props: TLUiButtonPickerProps<T>) => ReactElement;
|
|
3041
|
-
|
|
3042
3147
|
/**
|
|
3043
3148
|
* A column, usually of UI controls like buttons, select dropdown, checkboxes, etc.
|
|
3044
3149
|
*
|
|
@@ -3134,7 +3239,7 @@ export declare function TldrawUiMenuActionCheckboxItem({ actionId, ...rest }: TL
|
|
|
3134
3239
|
export declare function TldrawUiMenuActionItem({ actionId, ...rest }: TLUiMenuActionItemProps): JSX_2.Element | null;
|
|
3135
3240
|
|
|
3136
3241
|
/** @public @react */
|
|
3137
|
-
export declare function TldrawUiMenuCheckboxItem<TranslationKey extends string = string, IconType extends string = string>({ id, kbd, label, readonlyOk, onSelect, toggle, disabled, checked, }: TLUiMenuCheckboxItemProps<TranslationKey, IconType>): JSX_2.Element | null;
|
|
3242
|
+
export declare function TldrawUiMenuCheckboxItem<TranslationKey extends string = string, IconType extends string = string>({ id, kbd, label, lang, readonlyOk, onSelect, toggle, disabled, checked, }: TLUiMenuCheckboxItemProps<TranslationKey, IconType>): JSX_2.Element | null;
|
|
3138
3243
|
|
|
3139
3244
|
/** @public @react */
|
|
3140
3245
|
export declare function TldrawUiMenuContextProvider({ type, sourceId, children, }: TLUiMenuContextProviderProps): JSX_2.Element;
|
|
@@ -3218,7 +3323,7 @@ export declare const TldrawUiToolbar: React_3.ForwardRefExoticComponent<TLUiTool
|
|
|
3218
3323
|
export declare const TldrawUiToolbarButton: React_3.ForwardRefExoticComponent<TLUiToolbarButtonProps & React_3.RefAttributes<HTMLButtonElement>>;
|
|
3219
3324
|
|
|
3220
3325
|
/** @public @react */
|
|
3221
|
-
export declare const TldrawUiToolbarToggleGroup: ({ children, className, type, ...props }: TLUiToolbarToggleGroupProps) => JSX_2.Element;
|
|
3326
|
+
export declare const TldrawUiToolbarToggleGroup: ({ children, className, type, asChild, ...props }: TLUiToolbarToggleGroupProps) => JSX_2.Element;
|
|
3222
3327
|
|
|
3223
3328
|
/** @public @react */
|
|
3224
3329
|
export declare const TldrawUiToolbarToggleItem: ({ children, className, type, value, tooltip, ...props }: TLUiToolbarToggleItemProps) => JSX_2.Element;
|
|
@@ -3405,18 +3510,6 @@ export declare interface TLUiButtonLabelProps {
|
|
|
3405
3510
|
children?: ReactNode;
|
|
3406
3511
|
}
|
|
3407
3512
|
|
|
3408
|
-
/** @public */
|
|
3409
|
-
export declare interface TLUiButtonPickerProps<T extends string> {
|
|
3410
|
-
title: string;
|
|
3411
|
-
uiType: string;
|
|
3412
|
-
style: StyleProp<T>;
|
|
3413
|
-
value: SharedStyle<T>;
|
|
3414
|
-
items: StyleValuesForUi<T>;
|
|
3415
|
-
theme: TLDefaultColorTheme;
|
|
3416
|
-
onValueChange(style: StyleProp<T>, value: T): void;
|
|
3417
|
-
onHistoryMark?(id: string): void;
|
|
3418
|
-
}
|
|
3419
|
-
|
|
3420
3513
|
/** @public */
|
|
3421
3514
|
export declare interface TLUiButtonProps extends React_2.HTMLAttributes<HTMLButtonElement> {
|
|
3422
3515
|
disabled?: boolean;
|
|
@@ -3777,7 +3870,7 @@ export declare interface TLUiEventMap {
|
|
|
3777
3870
|
'flatten-to-image': null;
|
|
3778
3871
|
'a11y-repeat-shape-announce': null;
|
|
3779
3872
|
'open-url': {
|
|
3780
|
-
|
|
3873
|
+
destinationUrl: string;
|
|
3781
3874
|
};
|
|
3782
3875
|
'open-context-menu': null;
|
|
3783
3876
|
'adjust-shape-styles': null;
|
|
@@ -3858,6 +3951,7 @@ export declare interface TLUiInputProps {
|
|
|
3858
3951
|
shouldManuallyMaintainScrollPositionWhenFocused?: boolean;
|
|
3859
3952
|
value?: string;
|
|
3860
3953
|
'data-testid'?: string;
|
|
3954
|
+
'aria-label'?: string;
|
|
3861
3955
|
}
|
|
3862
3956
|
|
|
3863
3957
|
/** @public */
|
|
@@ -3902,6 +3996,7 @@ export declare interface TLUiMenuCheckboxItemProps<TranslationKey extends string
|
|
|
3902
3996
|
label?: {
|
|
3903
3997
|
[key: string]: TranslationKey;
|
|
3904
3998
|
} | TranslationKey;
|
|
3999
|
+
lang?: string;
|
|
3905
4000
|
readonlyOk?: boolean;
|
|
3906
4001
|
onSelect(source: TLUiEventSource): Promise<void> | void;
|
|
3907
4002
|
toggle?: boolean;
|
|
@@ -4052,19 +4147,15 @@ export declare interface TLUiSliderProps {
|
|
|
4052
4147
|
label: string;
|
|
4053
4148
|
title: string;
|
|
4054
4149
|
onValueChange(value: number): void;
|
|
4055
|
-
onHistoryMark(id: string): void;
|
|
4150
|
+
onHistoryMark?(id: string): void;
|
|
4056
4151
|
'data-testid'?: string;
|
|
4057
4152
|
ariaValueModifier?: number;
|
|
4058
4153
|
}
|
|
4059
4154
|
|
|
4060
|
-
/** @public */
|
|
4061
|
-
export declare interface TLUiStylePanelContentProps {
|
|
4062
|
-
styles: ReturnType<typeof useRelevantStyles>;
|
|
4063
|
-
}
|
|
4064
|
-
|
|
4065
4155
|
/** @public */
|
|
4066
4156
|
export declare interface TLUiStylePanelProps {
|
|
4067
4157
|
isMobile?: boolean;
|
|
4158
|
+
styles?: null | ReadonlySharedStyleMap;
|
|
4068
4159
|
children?: ReactNode;
|
|
4069
4160
|
}
|
|
4070
4161
|
|
|
@@ -4133,6 +4224,7 @@ export declare interface TLUiToolbarToggleGroupProps extends React_3.HTMLAttribu
|
|
|
4133
4224
|
value: any;
|
|
4134
4225
|
defaultValue?: any;
|
|
4135
4226
|
type: 'multiple' | 'single';
|
|
4227
|
+
asChild?: boolean;
|
|
4136
4228
|
}
|
|
4137
4229
|
|
|
4138
4230
|
/** @public */
|
|
@@ -4141,7 +4233,7 @@ export declare interface TLUiToolbarToggleItemProps extends React_3.HTMLAttribut
|
|
|
4141
4233
|
className?: string;
|
|
4142
4234
|
type: 'icon' | 'tool';
|
|
4143
4235
|
value: string;
|
|
4144
|
-
tooltip?:
|
|
4236
|
+
tooltip?: React_3.ReactNode;
|
|
4145
4237
|
}
|
|
4146
4238
|
|
|
4147
4239
|
/** @public */
|
|
@@ -4187,7 +4279,7 @@ export declare interface TLUiTranslation {
|
|
|
4187
4279
|
export declare type TLUiTranslationContextType = TLUiTranslation;
|
|
4188
4280
|
|
|
4189
4281
|
/** @public */
|
|
4190
|
-
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-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.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.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-size' | '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-keyboard-shortcuts.menu' | 'action.toggle-keyboard-shortcuts' | 'action.toggle-lock' | '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-transparent.context-menu' | 'action.toggle-transparent.menu' | 'action.toggle-transparent' | 'action.toggle-ui-labels.menu' | 'action.toggle-ui-labels' | 'action.toggle-wrap-mode.menu' | 'action.toggle-wrap-mode' | 'action.undo' | 'action.ungroup' | 'action.unlock-all' | 'action.zoom-in' | 'action.zoom-out' | '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.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.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' | '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.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.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' | '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';
|
|
4282
|
+
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-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.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.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-size' | '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-keyboard-shortcuts.menu' | 'action.toggle-keyboard-shortcuts' | 'action.toggle-lock' | '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-transparent.context-menu' | 'action.toggle-transparent.menu' | 'action.toggle-transparent' | 'action.toggle-ui-labels.menu' | 'action.toggle-ui-labels' | 'action.toggle-wrap-mode.menu' | 'action.toggle-wrap-mode' | 'action.undo' | 'action.ungroup' | 'action.unlock-all' | 'action.zoom-in' | 'action.zoom-out' | '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.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.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';
|
|
4191
4283
|
|
|
4192
4284
|
/** @public */
|
|
4193
4285
|
export declare interface TLUiTranslationProviderProps {
|
|
@@ -4363,18 +4455,34 @@ export declare function UnlockAllMenuItem(): JSX_2.Element;
|
|
|
4363
4455
|
/** @public */
|
|
4364
4456
|
export declare function unwrapLabel(label?: TLUiActionItem['label'], menuType?: string): string | undefined;
|
|
4365
4457
|
|
|
4366
|
-
/**
|
|
4367
|
-
|
|
4368
|
-
|
|
4369
|
-
|
|
4370
|
-
|
|
4458
|
+
/**
|
|
4459
|
+
* Update the current arrow target state for an editor. See {@link ArrowTargetState} for more
|
|
4460
|
+
* information.
|
|
4461
|
+
*
|
|
4462
|
+
* @public
|
|
4463
|
+
*/
|
|
4464
|
+
export declare function updateArrowTargetState({ editor, pointInPageSpace, arrow, isPrecise, currentBinding, oppositeBinding, }: UpdateArrowTargetStateOpts): ArrowTargetState | null;
|
|
4371
4465
|
|
|
4372
4466
|
/**
|
|
4373
|
-
*
|
|
4467
|
+
* Options passed to {@link updateArrowTargetState}.
|
|
4374
4468
|
*
|
|
4375
4469
|
* @public
|
|
4376
4470
|
*/
|
|
4377
|
-
export declare
|
|
4471
|
+
export declare interface UpdateArrowTargetStateOpts {
|
|
4472
|
+
editor: Editor;
|
|
4473
|
+
pointInPageSpace: VecLike;
|
|
4474
|
+
arrow: TLArrowShape | undefined;
|
|
4475
|
+
isPrecise: boolean;
|
|
4476
|
+
currentBinding: TLArrowBinding | undefined;
|
|
4477
|
+
/** The binding from the opposite end of the arrow, if one exists. */
|
|
4478
|
+
oppositeBinding: TLArrowBinding | undefined;
|
|
4479
|
+
}
|
|
4480
|
+
|
|
4481
|
+
/** @public */
|
|
4482
|
+
export declare function useA11y(): TLUiA11yContextType;
|
|
4483
|
+
|
|
4484
|
+
/** @public */
|
|
4485
|
+
export declare function useActions(): TLUiActionsContextType;
|
|
4378
4486
|
|
|
4379
4487
|
/* Excluded from this release type: useAssetUrls */
|
|
4380
4488
|
|
|
@@ -4430,7 +4538,11 @@ export declare function useDefaultHelpers(): {
|
|
|
4430
4538
|
copy: (source: TLUiEventSource) => Promise<void>;
|
|
4431
4539
|
copyAs: (ids: TLShapeId[], format?: TLCopyType) => void;
|
|
4432
4540
|
cut: (source: TLUiEventSource) => Promise<void>;
|
|
4433
|
-
exportAs: (ids: TLShapeId[],
|
|
4541
|
+
exportAs: (ids: TLShapeId[], opts?: {
|
|
4542
|
+
format?: TLExportType;
|
|
4543
|
+
name?: string;
|
|
4544
|
+
scale?: number;
|
|
4545
|
+
}) => void;
|
|
4434
4546
|
getEmbedDefinition: (url: string) => TLEmbedResult;
|
|
4435
4547
|
insertMedia: () => Promise<void>;
|
|
4436
4548
|
isMobile: boolean;
|
|
@@ -4452,7 +4564,9 @@ export declare function useEditablePlainText(shapeId: TLShapeId, type: string, t
|
|
|
4452
4564
|
handleChange: ({ plaintext }: {
|
|
4453
4565
|
plaintext: string;
|
|
4454
4566
|
}) => void;
|
|
4455
|
-
handleDoubleClick: (e:
|
|
4567
|
+
handleDoubleClick: (e: {
|
|
4568
|
+
nativeEvent: Event;
|
|
4569
|
+
} | Event) => void;
|
|
4456
4570
|
handleFocus: () => void;
|
|
4457
4571
|
handleInputPointerDown: (e: React_3.PointerEvent) => void;
|
|
4458
4572
|
handleKeyDown: (e: KeyboardEvent) => void;
|
|
@@ -4469,7 +4583,9 @@ export declare function useEditableRichText(shapeId: TLShapeId, type: string, ri
|
|
|
4469
4583
|
handleChange: ({ richText }: {
|
|
4470
4584
|
richText: TLRichText;
|
|
4471
4585
|
}) => void;
|
|
4472
|
-
handleDoubleClick: (e:
|
|
4586
|
+
handleDoubleClick: (e: {
|
|
4587
|
+
nativeEvent: Event;
|
|
4588
|
+
} | Event) => void;
|
|
4473
4589
|
handleFocus: () => void;
|
|
4474
4590
|
handleInputPointerDown: (e: React.PointerEvent) => void;
|
|
4475
4591
|
handleKeyDown: (e: KeyboardEvent) => void;
|
|
@@ -4480,14 +4596,12 @@ export declare function useEditableRichText(shapeId: TLShapeId, type: string, ri
|
|
|
4480
4596
|
rInput: RefObject<HTMLDivElement>;
|
|
4481
4597
|
};
|
|
4482
4598
|
|
|
4483
|
-
/**
|
|
4484
|
-
* @deprecated Use `useEditablePlainText` instead.
|
|
4485
|
-
* @public
|
|
4486
|
-
*/
|
|
4487
|
-
export declare const useEditableText: typeof useEditablePlainText;
|
|
4488
|
-
|
|
4489
4599
|
/** @public */
|
|
4490
|
-
export declare function useExportAs(): (ids: TLShapeId[],
|
|
4600
|
+
export declare function useExportAs(): (ids: TLShapeId[], opts?: {
|
|
4601
|
+
format?: TLExportType;
|
|
4602
|
+
name?: string;
|
|
4603
|
+
scale?: number;
|
|
4604
|
+
}) => void;
|
|
4491
4605
|
|
|
4492
4606
|
/**
|
|
4493
4607
|
* This is a handy helper hook that resolves an asset to an optimized URL for a given shape, or its
|
|
@@ -4561,6 +4675,9 @@ export declare const useSelectedShapesAnnouncer: () => void;
|
|
|
4561
4675
|
/** @public */
|
|
4562
4676
|
export declare function useShowCollaborationUi(): boolean;
|
|
4563
4677
|
|
|
4678
|
+
/** @public */
|
|
4679
|
+
export declare function useStylePanelContext(): StylePanelContext;
|
|
4680
|
+
|
|
4564
4681
|
/** @public */
|
|
4565
4682
|
export declare function useTldrawUiComponents(): TLUiComponents;
|
|
4566
4683
|
|