tldraw 3.16.0-next.fe14f1b4181f → 4.0.0

package/dist-cjs/lib/shapes/text/RichTextArea.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/shapes/text/RichTextArea.tsx"],
-  "sourcesContent": ["import { EditorView } from '@tiptap/pm/view'\nimport {\n\tEditorEvents,\n\tJSONContent,\n\tEditor as TextEditor,\n\ttype Editor as TTEditor,\n} from '@tiptap/react'\nimport {\n\tEditor,\n\tTLRichText,\n\tTLShapeId,\n\tpreventDefault,\n\tstopEventPropagation,\n\tuseEditor,\n\tuseEvent,\n\tuseUniqueSafeId,\n} from '@tldraw/editor'\nimport React, { useLayoutEffect, useRef } from 'react'\n\n/** @public */\nexport interface TextAreaProps {\n\tisEditing: boolean\n\ttext?: string\n\tshapeId: TLShapeId\n\trichText?: TLRichText\n\thandleFocus(): void\n\thandleBlur(): void\n\thandleKeyDown(e: KeyboardEvent): void\n\thandleChange(changeInfo: { plaintext?: string; richText?: TLRichText }): void\n\thandleInputPointerDown(e: React.PointerEvent<HTMLElement>): void\n\thandleDoubleClick(e: any): any\n\thandlePaste(e: ClipboardEvent | React.ClipboardEvent<HTMLTextAreaElement>): void\n\thasCustomTabBehavior?: boolean\n}\n\n/**\n * N.B. In Development mode you need to ensure you're testing this without StrictMode on.\n * Otherwise it's not gonna work as expected on iOS.\n * Specifically, it means that the virtual keyboard won't pop open sometimes\n * (iOS starts flipping out when you render multiple times when trying to focus something) .\n */\n\n/**\n * A rich text area that can be used for editing text with rich text formatting.\n * This component uses the TipTap editor under the hood.\n *\n * @public @react\n */\nexport const RichTextArea = React.forwardRef<HTMLDivElement, TextAreaProps>(function RichTextArea(\n\t{\n\t\tshapeId,\n\t\tisEditing,\n\t\trichText,\n\t\thandleFocus,\n\t\thandleChange,\n\t\thandleBlur,\n\t\thandleKeyDown,\n\t\thandleDoubleClick,\n\t\thasCustomTabBehavior,\n\t\thandlePaste,\n\t},\n\tref\n) {\n\tconst editor = useEditor()\n\tconst tipTapId = useUniqueSafeId('tip-tap-editor')\n\tconst tipTapConfig = editor.getTextOptions().tipTapConfig\n\n\tconst rInitialRichText = useRef(richText)\n\tconst rTextEditor = useRef<TTEditor | null>(null)\n\tconst rTextEditorEl = useRef<HTMLDivElement>(null)\n\n\tuseLayoutEffect(() => {\n\t\tif (!rTextEditor.current) {\n\t\t\trInitialRichText.current = richText\n\t\t} else if (rInitialRichText.current !== richText) {\n\t\t\trTextEditor.current.commands.setContent(richText as JSONContent)\n\t\t}\n\t}, [richText])\n\n\t// The order of events is:\n\t// - editor begins editing any shape\n\t// - we set listeners for select all / place caret events\n\t// - if the user is editing this shape, this component is rendered\n\t// - editor emits the select all event / place caret event\n\t// - the text editor is onCreate callback is called\n\tconst rCreateInfo = useRef({\n\t\tselectAll: false,\n\t\tcaretPosition: null as { x: number; y: number } | null,\n\t})\n\n\tuseLayoutEffect(() => {\n\t\tfunction selectAllIfEditing(event: { shapeId: TLShapeId }) {\n\t\t\tif (event.shapeId === editor.getEditingShapeId()) {\n\t\t\t\trCreateInfo.current.selectAll = true\n\t\t\t}\n\t\t}\n\n\t\tfunction placeCaret(event: { shapeId: TLShapeId; point: { x: number; y: number } }) {\n\t\t\tif (event.shapeId === editor.getEditingShapeId()) {\n\t\t\t\trCreateInfo.current.caretPosition = event.point\n\t\t\t}\n\t\t}\n\n\t\teditor.on('select-all-text', selectAllIfEditing)\n\t\teditor.on('place-caret', placeCaret)\n\t\treturn () => {\n\t\t\teditor.off('select-all-text', selectAllIfEditing)\n\t\t\teditor.off('place-caret', placeCaret)\n\t\t}\n\t}, [editor, isEditing])\n\n\tconst onChange = useEvent(handleChange)\n\tconst onKeyDown = useEvent(handleKeyDown)\n\tconst onFocus = useEvent(handleFocus)\n\tconst onBlur = useEvent(handleBlur)\n\tconst onDoubleClick = useEvent(handleDoubleClick)\n\tconst onPaste = useEvent(handlePaste)\n\tuseLayoutEffect(() => {\n\t\tif (!isEditing || !tipTapConfig || !rTextEditorEl.current) return\n\n\t\tconst { editorProps, ...restOfTipTapConfig } = tipTapConfig\n\n\t\t// Because React can double-render in Strict Mode, we need to make sure we're not setting\n\t\t// the text editor twice. This became more much more prevalent in React 19, but also it\n\t\t// started manifesting in some cases in Next 14.2 (which maybe patches React 18.3 in weird\n\t\t// ways). So we used to use EditorProvider but we into weird rendering issues.\n\t\tconst textEditorInstance = new TextEditor({\n\t\t\telement: rTextEditorEl.current,\n\t\t\tautofocus: true,\n\t\t\teditable: isEditing,\n\t\t\tonUpdate: (props: EditorEvents['update']) => {\n\t\t\t\tconst content: TLRichText = props.editor.state.doc.toJSON()\n\t\t\t\trInitialRichText.current = content\n\t\t\t\tonChange({ richText: content })\n\t\t\t},\n\t\t\tonFocus,\n\t\t\tonBlur,\n\t\t\t// onCreate is called after a `setTimeout(0)`\n\t\t\tonCreate: (props) => {\n\t\t\t\t// If we're not still editing the original shape, then don't do anything.\n\t\t\t\tif (editor.getEditingShapeId() !== shapeId) return\n\n\t\t\t\tconst textEditor = props.editor\n\t\t\t\teditor.setRichTextEditor(textEditor)\n\n\t\t\t\tconst { selectAll, caretPosition } = rCreateInfo.current\n\n\t\t\t\tif (selectAll) {\n\t\t\t\t\t// Select all of the text\n\t\t\t\t\ttextEditor.chain().focus().selectAll().run()\n\t\t\t\t} else if (caretPosition) {\n\t\t\t\t\t// Set the initial caret screen position\n\t\t\t\t\tconst pos = textEditor.view.posAtCoords({\n\t\t\t\t\t\tleft: caretPosition.x,\n\t\t\t\t\t\ttop: caretPosition.y,\n\t\t\t\t\t})?.pos\n\n\t\t\t\t\tif (pos) {\n\t\t\t\t\t\t// Focus to that position.\n\t\t\t\t\t\ttextEditor.chain().focus().setTextSelection(pos).run()\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// If no position, default to select all.\n\t\t\t\t\t\ttextEditor.chain().focus().selectAll().run()\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t\teditorProps: {\n\t\t\t\thandleKeyDown: (view: EditorView, event: KeyboardEvent) => {\n\t\t\t\t\tif (!hasCustomTabBehavior && event.key === 'Tab') {\n\t\t\t\t\t\thandleTab(editor, view, event)\n\t\t\t\t\t}\n\n\t\t\t\t\tonKeyDown(event)\n\t\t\t\t},\n\t\t\t\thandlePaste: (view: EditorView, event: ClipboardEvent) => {\n\t\t\t\t\tonPaste(event)\n\t\t\t\t\tif (event.defaultPrevented) return true\n\t\t\t\t},\n\t\t\t\thandleDoubleClick: (_view, _pos, event) => onDoubleClick(event),\n\t\t\t\t...editorProps,\n\t\t\t},\n\t\t\tcoreExtensionOptions: {\n\t\t\t\tclipboardTextSerializer: {\n\t\t\t\t\tblockSeparator: '\\n',\n\t\t\t\t},\n\t\t\t},\n\t\t\t...restOfTipTapConfig,\n\t\t\tcontent: rInitialRichText.current as JSONContent,\n\t\t})\n\n\t\t// XXX: When creating a brand new shape and double-clicking into it quickly to edit it,\n\t\t// there's some kind of race condition happening where the editor doesn't focus properly.\n\t\tconst timeout = editor.timers.setTimeout(() => {\n\t\t\tif (rCreateInfo.current.caretPosition || rCreateInfo.current.selectAll) {\n\t\t\t\ttextEditorInstance.commands.focus()\n\t\t\t} else {\n\t\t\t\ttextEditorInstance.commands.focus('end')\n\t\t\t}\n\n\t\t\trCreateInfo.current.selectAll = false\n\t\t\trCreateInfo.current.caretPosition = null\n\t\t}, 100)\n\n\t\trTextEditor.current = textEditorInstance\n\n\t\treturn () => {\n\t\t\trTextEditor.current = null\n\t\t\tclearTimeout(timeout)\n\t\t\ttextEditorInstance.destroy()\n\t\t}\n\t}, [\n\t\tisEditing,\n\t\ttipTapConfig,\n\t\tonFocus,\n\t\tonBlur,\n\t\tonDoubleClick,\n\t\tonChange,\n\t\tonPaste,\n\t\tonKeyDown,\n\t\teditor,\n\t\tshapeId,\n\t\thasCustomTabBehavior,\n\t])\n\n\tif (!isEditing || !tipTapConfig) {\n\t\treturn null\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tid={tipTapId}\n\t\t\tref={ref}\n\t\t\ttabIndex={-1}\n\t\t\tdata-testid=\"rich-text-area\"\n\t\t\tclassName=\"tl-rich-text tl-text tl-text-input\"\n\t\t\tonContextMenu={isEditing ? stopEventPropagation : undefined}\n\t\t\t// N.B. When PointerStateExtension was introduced, this was moved there.\n\t\t\t// However, that caused selecting over list items to break.\n\t\t\t// The handleDOMEvents in TipTap don't seem to support the pointerDownCapture event.\n\t\t\tonPointerDownCapture={stopEventPropagation}\n\t\t\t// This onTouchEnd is important for Android to be able to change selection on text.\n\t\t\tonTouchEnd={stopEventPropagation}\n\t\t\t// On FF, there's a behavior where dragging a selection will grab that selection into\n\t\t\t// the drag event. However, once the drag is over, and you select away from the textarea,\n\t\t\t// starting a drag over the textarea will restart a selection drag instead of a shape drag.\n\t\t\t// This prevents that default behavior in FF.\n\t\t\tonDragStart={preventDefault}\n\t\t>\n\t\t\t<div className=\"tl-rich-text\" ref={rTextEditorEl} />\n\t\t</div>\n\t)\n})\n\n// Prevent exiting the editor when hitting Tab.\n// Also, insert a tab character at the front of the line if the shift key isn't pressed,\n// otherwise if shift is pressed, remove a tab character from the front of the line.\nfunction handleTab(editor: Editor, view: EditorView, event: KeyboardEvent) {\n\t// Don't exit the editor.\n\tevent.preventDefault()\n\n\tconst textEditor = editor.getRichTextEditor()\n\tif (textEditor?.isActive('bulletList') || textEditor?.isActive('orderedList')) return\n\n\tconst { state, dispatch } = view\n\tconst { $from, $to } = state.selection\n\tconst isShift = event.shiftKey\n\n\t// Create a new transaction\n\tlet tr = state.tr\n\n\t// Iterate over each line in the selection in reverse so that the positions\n\t// are stable as we modify the document.\n\tlet pos = $to.end()\n\twhile (pos >= $from.start()) {\n\t\tconst line = state.doc.resolve(pos).blockRange()\n\t\tif (!line) break\n\n\t\tconst lineStart = line.start\n\t\tconst lineEnd = line.end\n\t\tconst lineText = state.doc.textBetween(lineStart, lineEnd, '\\n')\n\n\t\t// Check if the current line or any of its parent nodes are part of a list\n\t\tlet isInList = false\n\t\tstate.doc.nodesBetween(lineStart, lineEnd, (node) => {\n\t\t\tif (node.type.name === 'bulletList' || node.type.name === 'orderedList') {\n\t\t\t\tisInList = true\n\t\t\t\treturn false // Stop iteration\n\t\t\t}\n\t\t})\n\n\t\t// TODO: for now skip over lists. Later, we might consider handling them using\n\t\t// sinkListItem and liftListItem from @tiptap/pm/schema-list\n\t\tif (!isInList) {\n\t\t\tif (!isShift) {\n\t\t\t\t// Insert a tab character at the start of the line\n\t\t\t\ttr = tr.insertText('\\t', lineStart + 1)\n\t\t\t} else {\n\t\t\t\t// Remove a tab character from the start of the line\n\t\t\t\tif (lineText.startsWith('\\t')) {\n\t\t\t\t\ttr = tr.delete(lineStart + 1, lineStart + 2)\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tpos = lineStart - 1\n\t}\n\n\tconst mappedSelection = state.selection.map(tr.doc, tr.mapping)\n\ttr.setSelection(mappedSelection)\n\n\tif (tr.docChanged) {\n\t\tdispatch(tr)\n\t}\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { EditorView } from '@tiptap/pm/view'\nimport {\n\tEditorEvents,\n\tJSONContent,\n\tEditor as TextEditor,\n\ttype Editor as TTEditor,\n} from '@tiptap/react'\nimport {\n\tEditor,\n\tTLRichText,\n\tTLShapeId,\n\tpreventDefault,\n\tuseEditor,\n\tuseEvent,\n\tuseUniqueSafeId,\n} from '@tldraw/editor'\nimport React, { useLayoutEffect, useRef } from 'react'\n\n/** @public */\nexport interface TextAreaProps {\n\tisEditing: boolean\n\ttext?: string\n\tshapeId: TLShapeId\n\trichText?: TLRichText\n\thandleFocus(): void\n\thandleBlur(): void\n\thandleKeyDown(e: KeyboardEvent): void\n\thandleChange(changeInfo: { plaintext?: string; richText?: TLRichText }): void\n\thandleInputPointerDown(e: React.PointerEvent<HTMLElement>): void\n\thandleDoubleClick(e: any): any\n\thandlePaste(e: ClipboardEvent | React.ClipboardEvent<HTMLTextAreaElement>): void\n\thasCustomTabBehavior?: boolean\n}\n\n/**\n * N.B. In Development mode you need to ensure you're testing this without StrictMode on.\n * Otherwise it's not gonna work as expected on iOS.\n * Specifically, it means that the virtual keyboard won't pop open sometimes\n * (iOS starts flipping out when you render multiple times when trying to focus something) .\n */\n\n/**\n * A rich text area that can be used for editing text with rich text formatting.\n * This component uses the TipTap editor under the hood.\n *\n * @public @react\n */\nexport const RichTextArea = React.forwardRef<HTMLDivElement, TextAreaProps>(function RichTextArea(\n\t{\n\t\tshapeId,\n\t\tisEditing,\n\t\trichText,\n\t\thandleFocus,\n\t\thandleChange,\n\t\thandleBlur,\n\t\thandleKeyDown,\n\t\thandleDoubleClick,\n\t\thasCustomTabBehavior,\n\t\thandlePaste,\n\t},\n\tref\n) {\n\tconst editor = useEditor()\n\tconst tipTapId = useUniqueSafeId('tip-tap-editor')\n\tconst tipTapConfig = editor.getTextOptions().tipTapConfig\n\n\tconst rInitialRichText = useRef(richText)\n\tconst rTextEditor = useRef<TTEditor | null>(null)\n\tconst rTextEditorEl = useRef<HTMLDivElement>(null)\n\n\tuseLayoutEffect(() => {\n\t\tif (!rTextEditor.current) {\n\t\t\trInitialRichText.current = richText\n\t\t} else if (rInitialRichText.current !== richText) {\n\t\t\trTextEditor.current.commands.setContent(richText as JSONContent)\n\t\t}\n\t}, [richText])\n\n\t// The order of events is:\n\t// - editor begins editing any shape\n\t// - we set listeners for select all / place caret events\n\t// - if the user is editing this shape, this component is rendered\n\t// - editor emits the select all event / place caret event\n\t// - the text editor is onCreate callback is called\n\tconst rCreateInfo = useRef({\n\t\tselectAll: false,\n\t\tcaretPosition: null as { x: number; y: number } | null,\n\t})\n\n\tuseLayoutEffect(() => {\n\t\tfunction selectAllIfEditing(event: { shapeId: TLShapeId }) {\n\t\t\tif (event.shapeId === editor.getEditingShapeId()) {\n\t\t\t\trCreateInfo.current.selectAll = true\n\t\t\t}\n\t\t}\n\n\t\tfunction placeCaret(event: { shapeId: TLShapeId; point: { x: number; y: number } }) {\n\t\t\tif (event.shapeId === editor.getEditingShapeId()) {\n\t\t\t\trCreateInfo.current.caretPosition = event.point\n\t\t\t}\n\t\t}\n\n\t\teditor.on('select-all-text', selectAllIfEditing)\n\t\teditor.on('place-caret', placeCaret)\n\t\treturn () => {\n\t\t\teditor.off('select-all-text', selectAllIfEditing)\n\t\t\teditor.off('place-caret', placeCaret)\n\t\t}\n\t}, [editor, isEditing])\n\n\tconst onChange = useEvent(handleChange)\n\tconst onKeyDown = useEvent(handleKeyDown)\n\tconst onFocus = useEvent(handleFocus)\n\tconst onBlur = useEvent(handleBlur)\n\tconst onDoubleClick = useEvent(handleDoubleClick)\n\tconst onPaste = useEvent(handlePaste)\n\tuseLayoutEffect(() => {\n\t\tif (!isEditing || !tipTapConfig || !rTextEditorEl.current) return\n\n\t\tconst { editorProps, ...restOfTipTapConfig } = tipTapConfig\n\n\t\t// Because React can double-render in Strict Mode, we need to make sure we're not setting\n\t\t// the text editor twice. This became more much more prevalent in React 19, but also it\n\t\t// started manifesting in some cases in Next 14.2 (which maybe patches React 18.3 in weird\n\t\t// ways). So we used to use EditorProvider but we into weird rendering issues.\n\t\tconst textEditorInstance = new TextEditor({\n\t\t\telement: rTextEditorEl.current,\n\t\t\tautofocus: true,\n\t\t\teditable: isEditing,\n\t\t\tonUpdate: (props: EditorEvents['update']) => {\n\t\t\t\tconst content: TLRichText = props.editor.state.doc.toJSON()\n\t\t\t\trInitialRichText.current = content\n\t\t\t\tonChange({ richText: content })\n\t\t\t},\n\t\t\tonFocus,\n\t\t\tonBlur,\n\t\t\t// onCreate is called after a `setTimeout(0)`\n\t\t\tonCreate: (props) => {\n\t\t\t\t// If we're not still editing the original shape, then don't do anything.\n\t\t\t\tif (editor.getEditingShapeId() !== shapeId) return\n\n\t\t\t\tconst textEditor = props.editor\n\t\t\t\teditor.setRichTextEditor(textEditor)\n\n\t\t\t\tconst { selectAll, caretPosition } = rCreateInfo.current\n\n\t\t\t\tif (selectAll) {\n\t\t\t\t\t// Select all of the text\n\t\t\t\t\ttextEditor.chain().focus().selectAll().run()\n\t\t\t\t} else if (caretPosition) {\n\t\t\t\t\t// Set the initial caret screen position\n\t\t\t\t\tconst pos = textEditor.view.posAtCoords({\n\t\t\t\t\t\tleft: caretPosition.x,\n\t\t\t\t\t\ttop: caretPosition.y,\n\t\t\t\t\t})?.pos\n\n\t\t\t\t\tif (pos) {\n\t\t\t\t\t\t// Focus to that position.\n\t\t\t\t\t\ttextEditor.chain().focus().setTextSelection(pos).run()\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// If no position, default to select all.\n\t\t\t\t\t\ttextEditor.chain().focus().selectAll().run()\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t\teditorProps: {\n\t\t\t\thandleKeyDown: (view: EditorView, event: KeyboardEvent) => {\n\t\t\t\t\tif (!hasCustomTabBehavior && event.key === 'Tab') {\n\t\t\t\t\t\thandleTab(editor, view, event)\n\t\t\t\t\t}\n\n\t\t\t\t\tonKeyDown(event)\n\t\t\t\t},\n\t\t\t\thandlePaste: (view: EditorView, event: ClipboardEvent) => {\n\t\t\t\t\tonPaste(event)\n\t\t\t\t\tif (event.defaultPrevented) return true\n\t\t\t\t},\n\t\t\t\thandleDoubleClick: (_view, _pos, event) => onDoubleClick(event),\n\t\t\t\t...editorProps,\n\t\t\t},\n\t\t\tcoreExtensionOptions: {\n\t\t\t\tclipboardTextSerializer: {\n\t\t\t\t\tblockSeparator: '\\n',\n\t\t\t\t},\n\t\t\t},\n\t\t\t...restOfTipTapConfig,\n\t\t\tcontent: rInitialRichText.current as JSONContent,\n\t\t})\n\n\t\t// XXX: When creating a brand new shape and double-clicking into it quickly to edit it,\n\t\t// there's some kind of race condition happening where the editor doesn't focus properly.\n\t\tconst timeout = editor.timers.setTimeout(() => {\n\t\t\tif (rCreateInfo.current.caretPosition || rCreateInfo.current.selectAll) {\n\t\t\t\ttextEditorInstance.commands.focus()\n\t\t\t} else {\n\t\t\t\ttextEditorInstance.commands.focus('end')\n\t\t\t}\n\n\t\t\trCreateInfo.current.selectAll = false\n\t\t\trCreateInfo.current.caretPosition = null\n\t\t}, 100)\n\n\t\trTextEditor.current = textEditorInstance\n\n\t\treturn () => {\n\t\t\trTextEditor.current = null\n\t\t\tclearTimeout(timeout)\n\t\t\ttextEditorInstance.destroy()\n\t\t}\n\t}, [\n\t\tisEditing,\n\t\ttipTapConfig,\n\t\tonFocus,\n\t\tonBlur,\n\t\tonDoubleClick,\n\t\tonChange,\n\t\tonPaste,\n\t\tonKeyDown,\n\t\teditor,\n\t\tshapeId,\n\t\thasCustomTabBehavior,\n\t])\n\n\tif (!isEditing || !tipTapConfig) {\n\t\treturn null\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tid={tipTapId}\n\t\t\tref={ref}\n\t\t\ttabIndex={-1}\n\t\t\tdata-testid=\"rich-text-area\"\n\t\t\tclassName=\"tl-rich-text tl-text tl-text-input\"\n\t\t\tonContextMenu={isEditing ? (e) => e.stopPropagation() : undefined}\n\t\t\t// N.B. When PointerStateExtension was introduced, this was moved there.\n\t\t\t// However, that caused selecting over list items to break.\n\t\t\t// The handleDOMEvents in TipTap don't seem to support the pointerDownCapture event.\n\t\t\tonPointerDownCapture={(e) => e.stopPropagation()}\n\t\t\t// This onTouchEnd is important for Android to be able to change selection on text.\n\t\t\tonTouchEnd={(e) => e.stopPropagation()}\n\t\t\t// On FF, there's a behavior where dragging a selection will grab that selection into\n\t\t\t// the drag event. However, once the drag is over, and you select away from the textarea,\n\t\t\t// starting a drag over the textarea will restart a selection drag instead of a shape drag.\n\t\t\t// This prevents that default behavior in FF.\n\t\t\tonDragStart={preventDefault}\n\t\t>\n\t\t\t<div className=\"tl-rich-text\" ref={rTextEditorEl} />\n\t\t</div>\n\t)\n})\n\n// Prevent exiting the editor when hitting Tab.\n// Also, insert a tab character at the front of the line if the shift key isn't pressed,\n// otherwise if shift is pressed, remove a tab character from the front of the line.\nfunction handleTab(editor: Editor, view: EditorView, event: KeyboardEvent) {\n\t// Don't exit the editor.\n\tevent.preventDefault()\n\n\tconst textEditor = editor.getRichTextEditor()\n\tif (textEditor?.isActive('bulletList') || textEditor?.isActive('orderedList')) return\n\n\tconst { state, dispatch } = view\n\tconst { $from, $to } = state.selection\n\tconst isShift = event.shiftKey\n\n\t// Create a new transaction\n\tlet tr = state.tr\n\n\t// Iterate over each line in the selection in reverse so that the positions\n\t// are stable as we modify the document.\n\tlet pos = $to.end()\n\twhile (pos >= $from.start()) {\n\t\tconst line = state.doc.resolve(pos).blockRange()\n\t\tif (!line) break\n\n\t\tconst lineStart = line.start\n\t\tconst lineEnd = line.end\n\t\tconst lineText = state.doc.textBetween(lineStart, lineEnd, '\\n')\n\n\t\t// Check if the current line or any of its parent nodes are part of a list\n\t\tlet isInList = false\n\t\tstate.doc.nodesBetween(lineStart, lineEnd, (node) => {\n\t\t\tif (node.type.name === 'bulletList' || node.type.name === 'orderedList') {\n\t\t\t\tisInList = true\n\t\t\t\treturn false // Stop iteration\n\t\t\t}\n\t\t})\n\n\t\t// TODO: for now skip over lists. Later, we might consider handling them using\n\t\t// sinkListItem and liftListItem from @tiptap/pm/schema-list\n\t\tif (!isInList) {\n\t\t\tif (!isShift) {\n\t\t\t\t// Insert a tab character at the start of the line\n\t\t\t\ttr = tr.insertText('\\t', lineStart + 1)\n\t\t\t} else {\n\t\t\t\t// Remove a tab character from the start of the line\n\t\t\t\tif (lineText.startsWith('\\t')) {\n\t\t\t\t\ttr = tr.delete(lineStart + 1, lineStart + 2)\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tpos = lineStart - 1\n\t}\n\n\tconst mappedSelection = state.selection.map(tr.doc, tr.mapping)\n\ttr.setSelection(mappedSelection)\n\n\tif (tr.docChanged) {\n\t\tdispatch(tr)\n\t}\n}\n"],
+  "mappings": "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",
   "names": ["import_react", "React", "RichTextArea", "TextEditor"]
 }

package/dist-cjs/lib/tools/SelectTool/childStates/DraggingHandle.js

@@ -111,6 +111,8 @@ class DraggingHandle extends import_editor.StateNode {
   exactTimeout = -1;
   // Only relevant to arrows
   resetExactTimeout() {
+    const arrowUtil = this.editor.getShapeUtil("arrow");
+    const timeoutValue = arrowUtil.options.pointingPreciseTimeout;
     if (this.exactTimeout !== -1) {
       this.clearExactTimeout();
     }
@@ -121,7 +123,7 @@ class DraggingHandle extends import_editor.StateNode {
         this.update();
       }
       this.exactTimeout = -1;
-    }, 750);
+    }, timeoutValue);
   }
   // Only relevant to arrows
   clearExactTimeout() {

package/dist-cjs/lib/tools/SelectTool/childStates/DraggingHandle.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/tools/SelectTool/childStates/DraggingHandle.tsx"],
-  "sourcesContent": ["import {\n\tMat,\n\tStateNode,\n\tTLArrowShape,\n\tTLHandle,\n\tTLLineShape,\n\tTLPointerEventInfo,\n\tTLShapeId,\n\tTLShapePartial,\n\tVec,\n\tkickoutOccludedShapes,\n\tsnapAngle,\n\tsortByIndex,\n\tstructuredClone,\n} from '@tldraw/editor'\nimport { clearArrowTargetState } from '../../../shapes/arrow/arrowTargetState'\nimport { getArrowBindings } from '../../../shapes/arrow/shared'\n\nexport type DraggingHandleInfo = TLPointerEventInfo & {\n\tshape: TLArrowShape | TLLineShape\n\ttarget: 'handle'\n\tonInteractionEnd?: string\n\tisCreating?: boolean\n\tcreatingMarkId?: string\n}\n\nexport class DraggingHandle extends StateNode {\n\tstatic override id = 'dragging_handle'\n\n\tshapeId!: TLShapeId\n\tinitialHandle!: TLHandle\n\tinitialAdjacentHandle!: TLHandle | null\n\tinitialPagePoint!: Vec\n\n\tmarkId!: string\n\tinitialPageTransform!: Mat\n\tinitialPageRotation!: number\n\n\tinfo!: DraggingHandleInfo\n\n\tisPrecise = false\n\tisPreciseId: TLShapeId | null = null\n\tpointingId: TLShapeId | null = null\n\n\toverride onEnter(info: DraggingHandleInfo) {\n\t\tconst { shape, isCreating, creatingMarkId, handle } = info\n\t\tthis.info = info\n\t\tthis.parent.setCurrentToolIdMask(info.onInteractionEnd)\n\t\tthis.shapeId = shape.id\n\t\tthis.markId = ''\n\n\t\tif (isCreating) {\n\t\t\tif (creatingMarkId) {\n\t\t\t\tthis.markId = creatingMarkId\n\t\t\t} else {\n\t\t\t\t// handle legacy implicit `creating:{shapeId}` marks\n\t\t\t\tconst markId = this.editor.getMarkIdMatching(\n\t\t\t\t\t`creating:${this.editor.getOnlySelectedShapeId()}`\n\t\t\t\t)\n\t\t\t\tif (markId) {\n\t\t\t\t\tthis.markId = markId\n\t\t\t\t}\n\t\t\t}\n\t\t} else {\n\t\t\tthis.markId = this.editor.markHistoryStoppingPoint('dragging handle')\n\t\t}\n\n\t\tthis.initialHandle = structuredClone(handle)\n\n\t\tthis.initialPageTransform = this.editor.getShapePageTransform(shape)!\n\t\tthis.initialPageRotation = this.initialPageTransform.rotation()\n\t\tthis.initialPagePoint = this.editor.inputs.originPagePoint.clone()\n\n\t\tthis.editor.setCursor({ type: isCreating ? 'cross' : 'grabbing', rotation: 0 })\n\n\t\tconst handles = this.editor.getShapeHandles(shape)!.sort(sortByIndex)\n\t\tconst index = handles.findIndex((h) => h.id === info.handle.id)\n\n\t\t// Find the adjacent handle\n\t\tthis.initialAdjacentHandle = null\n\n\t\t// Start from the handle and work forward\n\t\tfor (let i = index + 1; i < handles.length; i++) {\n\t\t\tconst handle = handles[i]\n\t\t\tif (handle.type === 'vertex' && handle.id !== 'middle' && handle.id !== info.handle.id) {\n\t\t\t\tthis.initialAdjacentHandle = handle\n\t\t\t\tbreak\n\t\t\t}\n\t\t}\n\n\t\t// If still no handle, start from the end and work backward\n\t\tif (!this.initialAdjacentHandle) {\n\t\t\tfor (let i = handles.length - 1; i >= 0; i--) {\n\t\t\t\tconst handle = handles[i]\n\t\t\t\tif (handle.type === 'vertex' && handle.id !== 'middle' && handle.id !== info.handle.id) {\n\t\t\t\t\tthis.initialAdjacentHandle = handle\n\t\t\t\t\tbreak\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// <!-- Only relevant to arrows\n\t\tif (this.editor.isShapeOfType<TLArrowShape>(shape, 'arrow')) {\n\t\t\tconst initialBinding = getArrowBindings(this.editor, shape)[info.handle.id as 'start' | 'end']\n\n\t\t\tthis.isPrecise = false\n\n\t\t\tif (initialBinding) {\n\t\t\t\tthis.isPrecise = initialBinding.props.isPrecise\n\t\t\t\tif (this.isPrecise) {\n\t\t\t\t\tthis.isPreciseId = initialBinding.toId\n\t\t\t\t} else {\n\t\t\t\t\tthis.resetExactTimeout()\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t// -->\n\n\t\t// Call onHandleDragStart callback\n\t\tconst handleDragInfo = {\n\t\t\thandle: this.initialHandle,\n\t\t\tisPrecise: this.isPrecise,\n\t\t\tisCreatingShape: !!this.info.isCreating,\n\t\t\tinitial: shape,\n\t\t}\n\t\tconst util = this.editor.getShapeUtil(shape)\n\t\tconst startChanges = util.onHandleDragStart?.(shape, handleDragInfo)\n\t\tif (startChanges) {\n\t\t\tthis.editor.updateShapes([{ ...startChanges, id: shape.id, type: shape.type }])\n\t\t}\n\n\t\tthis.update()\n\n\t\tthis.editor.select(this.shapeId)\n\t}\n\n\t// Only relevant to arrows\n\tprivate exactTimeout = -1 as any\n\n\t// Only relevant to arrows\n\tprivate resetExactTimeout() {\n\t\tif (this.exactTimeout !== -1) {\n\t\t\tthis.clearExactTimeout()\n\t\t}\n\n\t\tthis.exactTimeout = this.editor.timers.setTimeout(() => {\n\t\t\tif (this.getIsActive() && !this.isPrecise) {\n\t\t\t\tthis.isPrecise = true\n\t\t\t\tthis.isPreciseId = this.pointingId\n\t\t\t\tthis.update()\n\t\t\t}\n\t\t\tthis.exactTimeout = -1\n\t\t}, 750)\n\t}\n\n\t// Only relevant to arrows\n\tprivate clearExactTimeout() {\n\t\tif (this.exactTimeout !== -1) {\n\t\t\tclearTimeout(this.exactTimeout)\n\t\t\tthis.exactTimeout = -1\n\t\t}\n\t}\n\n\toverride onPointerMove() {\n\t\tthis.update()\n\t}\n\n\toverride onKeyDown() {\n\t\tthis.update()\n\t}\n\n\toverride onKeyUp() {\n\t\tthis.update()\n\t}\n\n\toverride onPointerUp() {\n\t\tthis.complete()\n\t}\n\n\toverride onComplete() {\n\t\tthis.update()\n\t\tthis.complete()\n\t}\n\n\toverride onCancel() {\n\t\tthis.cancel()\n\t}\n\n\toverride onExit() {\n\t\tthis.parent.setCurrentToolIdMask(undefined)\n\t\tclearArrowTargetState(this.editor)\n\t\tthis.editor.snaps.clearIndicators()\n\n\t\tthis.editor.setCursor({ type: 'default', rotation: 0 })\n\t}\n\n\tprivate complete() {\n\t\tthis.editor.snaps.clearIndicators()\n\t\tkickoutOccludedShapes(this.editor, [this.shapeId])\n\n\t\t// Call onHandleDragEnd callback before state transitions\n\t\tconst shape = this.editor.getShape(this.shapeId)\n\t\tif (shape) {\n\t\t\tconst util = this.editor.getShapeUtil(shape)\n\t\t\tconst handleDragInfo = {\n\t\t\t\thandle: this.initialHandle,\n\t\t\t\tisPrecise: this.isPrecise,\n\t\t\t\tisCreatingShape: !!this.info.isCreating,\n\t\t\t\tinitial: this.info.shape,\n\t\t\t}\n\t\t\tconst endChanges = util.onHandleDragEnd?.(shape, handleDragInfo)\n\t\t\tif (endChanges) {\n\t\t\t\tthis.editor.updateShapes([{ ...endChanges, id: shape.id, type: shape.type }])\n\t\t\t}\n\t\t}\n\n\t\tconst { onInteractionEnd } = this.info\n\t\tif (this.editor.getInstanceState().isToolLocked && onInteractionEnd) {\n\t\t\t// Return to the tool that was active before this one,\n\t\t\t// but only if tool lock is turned on!\n\t\t\tthis.editor.setCurrentTool(onInteractionEnd, { shapeId: this.shapeId })\n\t\t\treturn\n\t\t}\n\n\t\tthis.parent.transition('idle')\n\t}\n\n\tprivate cancel() {\n\t\t// Call onHandleDragCancel callback before bailing to mark\n\t\tconst shape = this.editor.getShape(this.shapeId)\n\t\tif (shape) {\n\t\t\tconst util = this.editor.getShapeUtil(shape)\n\t\t\tconst handleDragInfo = {\n\t\t\t\thandle: this.initialHandle,\n\t\t\t\tisPrecise: this.isPrecise,\n\t\t\t\tisCreatingShape: !!this.info.isCreating,\n\t\t\t\tinitial: this.info.shape,\n\t\t\t}\n\t\t\tutil.onHandleDragCancel?.(shape, handleDragInfo)\n\t\t}\n\n\t\tthis.editor.bailToMark(this.markId)\n\t\tthis.editor.snaps.clearIndicators()\n\n\t\tconst { onInteractionEnd } = this.info\n\t\tif (onInteractionEnd) {\n\t\t\t// Return to the tool that was active before this one,\n\t\t\t// whether tool lock is turned on or not!\n\t\t\tthis.editor.setCurrentTool(onInteractionEnd, { shapeId: this.shapeId })\n\t\t\treturn\n\t\t}\n\n\t\tthis.parent.transition('idle')\n\t}\n\n\tprivate update() {\n\t\tconst { editor, shapeId, initialPagePoint } = this\n\t\tconst { initialHandle, initialPageRotation, initialAdjacentHandle } = this\n\t\tconst isSnapMode = this.editor.user.getIsSnapMode()\n\t\tconst {\n\t\t\tsnaps,\n\t\t\tinputs: { currentPagePoint, shiftKey, ctrlKey, altKey, pointerVelocity },\n\t\t} = editor\n\n\t\tconst initial = this.info.shape\n\n\t\tconst shape = editor.getShape(shapeId)\n\t\tif (!shape) return\n\t\tconst util = editor.getShapeUtil(shape)\n\n\t\tconst initialBinding = editor.isShapeOfType<TLArrowShape>(shape, 'arrow')\n\t\t\t? getArrowBindings(editor, shape)[initialHandle.id as 'start' | 'end']\n\t\t\t: undefined\n\n\t\tlet point = currentPagePoint\n\t\t\t.clone()\n\t\t\t.sub(initialPagePoint)\n\t\t\t.rot(-initialPageRotation)\n\t\t\t.add(initialHandle)\n\n\t\tif (shiftKey && initialAdjacentHandle && initialHandle.id !== 'middle') {\n\t\t\tconst angle = Vec.Angle(initialAdjacentHandle, point)\n\t\t\tconst snappedAngle = snapAngle(angle, 24)\n\t\t\tconst angleDifference = snappedAngle - angle\n\t\t\tpoint = Vec.RotWith(point, initialAdjacentHandle, angleDifference)\n\t\t}\n\n\t\t// Clear any existing snaps\n\t\teditor.snaps.clearIndicators()\n\n\t\tlet nextHandle = { ...initialHandle, x: point.x, y: point.y }\n\n\t\tif (initialHandle.canSnap && (isSnapMode ? !ctrlKey : ctrlKey)) {\n\t\t\t// We're snapping\n\t\t\tconst pageTransform = editor.getShapePageTransform(shape.id)\n\t\t\tif (!pageTransform) throw Error('Expected a page transform')\n\n\t\t\tconst snap = snaps.handles.snapHandle({ currentShapeId: shapeId, handle: nextHandle })\n\n\t\t\tif (snap) {\n\t\t\t\tsnap.nudge.rot(-editor.getShapeParentTransform(shape)!.rotation())\n\t\t\t\tpoint.add(snap.nudge)\n\t\t\t\tnextHandle = { ...initialHandle, x: point.x, y: point.y }\n\t\t\t}\n\t\t}\n\n\t\tconst changes = util.onHandleDrag?.(shape, {\n\t\t\thandle: nextHandle,\n\t\t\tisPrecise: this.isPrecise || altKey,\n\t\t\tisCreatingShape: !!this.info.isCreating,\n\t\t\tinitial: initial,\n\t\t})\n\n\t\tconst next: TLShapePartial<any> = { id: shape.id, type: shape.type, ...changes }\n\n\t\t// Arrows\n\t\tif (\n\t\t\tinitialHandle.type === 'vertex' &&\n\t\t\tthis.editor.isShapeOfType<TLArrowShape>(shape, 'arrow')\n\t\t) {\n\t\t\tconst bindingAfter = getArrowBindings(editor, shape)[initialHandle.id as 'start' | 'end']\n\n\t\t\tif (bindingAfter) {\n\t\t\t\tif (initialBinding?.toId !== bindingAfter.toId) {\n\t\t\t\t\tthis.pointingId = bindingAfter.toId\n\t\t\t\t\tthis.isPrecise = pointerVelocity.len() < 0.5 || altKey\n\t\t\t\t\tthis.isPreciseId = this.isPrecise ? bindingAfter.toId : null\n\t\t\t\t\tthis.resetExactTimeout()\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tif (initialBinding) {\n\t\t\t\t\tthis.pointingId = null\n\t\t\t\t\tthis.isPrecise = false\n\t\t\t\t\tthis.isPreciseId = null\n\t\t\t\t\tthis.resetExactTimeout()\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tif (changes) {\n\t\t\teditor.updateShapes([next])\n\t\t}\n\t}\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n\tMat,\n\tStateNode,\n\tTLArrowShape,\n\tTLHandle,\n\tTLLineShape,\n\tTLPointerEventInfo,\n\tTLShapeId,\n\tTLShapePartial,\n\tVec,\n\tkickoutOccludedShapes,\n\tsnapAngle,\n\tsortByIndex,\n\tstructuredClone,\n} from '@tldraw/editor'\nimport { ArrowShapeUtil } from '../../../shapes/arrow/ArrowShapeUtil'\nimport { clearArrowTargetState } from '../../../shapes/arrow/arrowTargetState'\nimport { getArrowBindings } from '../../../shapes/arrow/shared'\n\nexport type DraggingHandleInfo = TLPointerEventInfo & {\n\tshape: TLArrowShape | TLLineShape\n\ttarget: 'handle'\n\tonInteractionEnd?: string\n\tisCreating?: boolean\n\tcreatingMarkId?: string\n}\n\nexport class DraggingHandle extends StateNode {\n\tstatic override id = 'dragging_handle'\n\n\tshapeId!: TLShapeId\n\tinitialHandle!: TLHandle\n\tinitialAdjacentHandle!: TLHandle | null\n\tinitialPagePoint!: Vec\n\n\tmarkId!: string\n\tinitialPageTransform!: Mat\n\tinitialPageRotation!: number\n\n\tinfo!: DraggingHandleInfo\n\n\tisPrecise = false\n\tisPreciseId: TLShapeId | null = null\n\tpointingId: TLShapeId | null = null\n\n\toverride onEnter(info: DraggingHandleInfo) {\n\t\tconst { shape, isCreating, creatingMarkId, handle } = info\n\t\tthis.info = info\n\t\tthis.parent.setCurrentToolIdMask(info.onInteractionEnd)\n\t\tthis.shapeId = shape.id\n\t\tthis.markId = ''\n\n\t\tif (isCreating) {\n\t\t\tif (creatingMarkId) {\n\t\t\t\tthis.markId = creatingMarkId\n\t\t\t} else {\n\t\t\t\t// handle legacy implicit `creating:{shapeId}` marks\n\t\t\t\tconst markId = this.editor.getMarkIdMatching(\n\t\t\t\t\t`creating:${this.editor.getOnlySelectedShapeId()}`\n\t\t\t\t)\n\t\t\t\tif (markId) {\n\t\t\t\t\tthis.markId = markId\n\t\t\t\t}\n\t\t\t}\n\t\t} else {\n\t\t\tthis.markId = this.editor.markHistoryStoppingPoint('dragging handle')\n\t\t}\n\n\t\tthis.initialHandle = structuredClone(handle)\n\n\t\tthis.initialPageTransform = this.editor.getShapePageTransform(shape)!\n\t\tthis.initialPageRotation = this.initialPageTransform.rotation()\n\t\tthis.initialPagePoint = this.editor.inputs.originPagePoint.clone()\n\n\t\tthis.editor.setCursor({ type: isCreating ? 'cross' : 'grabbing', rotation: 0 })\n\n\t\tconst handles = this.editor.getShapeHandles(shape)!.sort(sortByIndex)\n\t\tconst index = handles.findIndex((h) => h.id === info.handle.id)\n\n\t\t// Find the adjacent handle\n\t\tthis.initialAdjacentHandle = null\n\n\t\t// Start from the handle and work forward\n\t\tfor (let i = index + 1; i < handles.length; i++) {\n\t\t\tconst handle = handles[i]\n\t\t\tif (handle.type === 'vertex' && handle.id !== 'middle' && handle.id !== info.handle.id) {\n\t\t\t\tthis.initialAdjacentHandle = handle\n\t\t\t\tbreak\n\t\t\t}\n\t\t}\n\n\t\t// If still no handle, start from the end and work backward\n\t\tif (!this.initialAdjacentHandle) {\n\t\t\tfor (let i = handles.length - 1; i >= 0; i--) {\n\t\t\t\tconst handle = handles[i]\n\t\t\t\tif (handle.type === 'vertex' && handle.id !== 'middle' && handle.id !== info.handle.id) {\n\t\t\t\t\tthis.initialAdjacentHandle = handle\n\t\t\t\t\tbreak\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// <!-- Only relevant to arrows\n\t\tif (this.editor.isShapeOfType<TLArrowShape>(shape, 'arrow')) {\n\t\t\tconst initialBinding = getArrowBindings(this.editor, shape)[info.handle.id as 'start' | 'end']\n\n\t\t\tthis.isPrecise = false\n\n\t\t\tif (initialBinding) {\n\t\t\t\tthis.isPrecise = initialBinding.props.isPrecise\n\t\t\t\tif (this.isPrecise) {\n\t\t\t\t\tthis.isPreciseId = initialBinding.toId\n\t\t\t\t} else {\n\t\t\t\t\tthis.resetExactTimeout()\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t// -->\n\n\t\t// Call onHandleDragStart callback\n\t\tconst handleDragInfo = {\n\t\t\thandle: this.initialHandle,\n\t\t\tisPrecise: this.isPrecise,\n\t\t\tisCreatingShape: !!this.info.isCreating,\n\t\t\tinitial: shape,\n\t\t}\n\t\tconst util = this.editor.getShapeUtil(shape)\n\t\tconst startChanges = util.onHandleDragStart?.(shape, handleDragInfo)\n\t\tif (startChanges) {\n\t\t\tthis.editor.updateShapes([{ ...startChanges, id: shape.id, type: shape.type }])\n\t\t}\n\n\t\tthis.update()\n\n\t\tthis.editor.select(this.shapeId)\n\t}\n\n\t// Only relevant to arrows\n\tprivate exactTimeout = -1\n\n\t// Only relevant to arrows\n\tprivate resetExactTimeout() {\n\t\tconst arrowUtil = this.editor.getShapeUtil<ArrowShapeUtil>('arrow')\n\t\tconst timeoutValue = arrowUtil.options.pointingPreciseTimeout\n\n\t\tif (this.exactTimeout !== -1) {\n\t\t\tthis.clearExactTimeout()\n\t\t}\n\n\t\tthis.exactTimeout = this.editor.timers.setTimeout(() => {\n\t\t\tif (this.getIsActive() && !this.isPrecise) {\n\t\t\t\tthis.isPrecise = true\n\t\t\t\tthis.isPreciseId = this.pointingId\n\t\t\t\tthis.update()\n\t\t\t}\n\t\t\tthis.exactTimeout = -1\n\t\t}, timeoutValue)\n\t}\n\n\t// Only relevant to arrows\n\tprivate clearExactTimeout() {\n\t\tif (this.exactTimeout !== -1) {\n\t\t\tclearTimeout(this.exactTimeout)\n\t\t\tthis.exactTimeout = -1\n\t\t}\n\t}\n\n\toverride onPointerMove() {\n\t\tthis.update()\n\t}\n\n\toverride onKeyDown() {\n\t\tthis.update()\n\t}\n\n\toverride onKeyUp() {\n\t\tthis.update()\n\t}\n\n\toverride onPointerUp() {\n\t\tthis.complete()\n\t}\n\n\toverride onComplete() {\n\t\tthis.update()\n\t\tthis.complete()\n\t}\n\n\toverride onCancel() {\n\t\tthis.cancel()\n\t}\n\n\toverride onExit() {\n\t\tthis.parent.setCurrentToolIdMask(undefined)\n\t\tclearArrowTargetState(this.editor)\n\t\tthis.editor.snaps.clearIndicators()\n\n\t\tthis.editor.setCursor({ type: 'default', rotation: 0 })\n\t}\n\n\tprivate complete() {\n\t\tthis.editor.snaps.clearIndicators()\n\t\tkickoutOccludedShapes(this.editor, [this.shapeId])\n\n\t\t// Call onHandleDragEnd callback before state transitions\n\t\tconst shape = this.editor.getShape(this.shapeId)\n\t\tif (shape) {\n\t\t\tconst util = this.editor.getShapeUtil(shape)\n\t\t\tconst handleDragInfo = {\n\t\t\t\thandle: this.initialHandle,\n\t\t\t\tisPrecise: this.isPrecise,\n\t\t\t\tisCreatingShape: !!this.info.isCreating,\n\t\t\t\tinitial: this.info.shape,\n\t\t\t}\n\t\t\tconst endChanges = util.onHandleDragEnd?.(shape, handleDragInfo)\n\t\t\tif (endChanges) {\n\t\t\t\tthis.editor.updateShapes([{ ...endChanges, id: shape.id, type: shape.type }])\n\t\t\t}\n\t\t}\n\n\t\tconst { onInteractionEnd } = this.info\n\t\tif (this.editor.getInstanceState().isToolLocked && onInteractionEnd) {\n\t\t\t// Return to the tool that was active before this one,\n\t\t\t// but only if tool lock is turned on!\n\t\t\tthis.editor.setCurrentTool(onInteractionEnd, { shapeId: this.shapeId })\n\t\t\treturn\n\t\t}\n\n\t\tthis.parent.transition('idle')\n\t}\n\n\tprivate cancel() {\n\t\t// Call onHandleDragCancel callback before bailing to mark\n\t\tconst shape = this.editor.getShape(this.shapeId)\n\t\tif (shape) {\n\t\t\tconst util = this.editor.getShapeUtil(shape)\n\t\t\tconst handleDragInfo = {\n\t\t\t\thandle: this.initialHandle,\n\t\t\t\tisPrecise: this.isPrecise,\n\t\t\t\tisCreatingShape: !!this.info.isCreating,\n\t\t\t\tinitial: this.info.shape,\n\t\t\t}\n\t\t\tutil.onHandleDragCancel?.(shape, handleDragInfo)\n\t\t}\n\n\t\tthis.editor.bailToMark(this.markId)\n\t\tthis.editor.snaps.clearIndicators()\n\n\t\tconst { onInteractionEnd } = this.info\n\t\tif (onInteractionEnd) {\n\t\t\t// Return to the tool that was active before this one,\n\t\t\t// whether tool lock is turned on or not!\n\t\t\tthis.editor.setCurrentTool(onInteractionEnd, { shapeId: this.shapeId })\n\t\t\treturn\n\t\t}\n\n\t\tthis.parent.transition('idle')\n\t}\n\n\tprivate update() {\n\t\tconst { editor, shapeId, initialPagePoint } = this\n\t\tconst { initialHandle, initialPageRotation, initialAdjacentHandle } = this\n\t\tconst isSnapMode = this.editor.user.getIsSnapMode()\n\t\tconst {\n\t\t\tsnaps,\n\t\t\tinputs: { currentPagePoint, shiftKey, ctrlKey, altKey, pointerVelocity },\n\t\t} = editor\n\n\t\tconst initial = this.info.shape\n\n\t\tconst shape = editor.getShape(shapeId)\n\t\tif (!shape) return\n\t\tconst util = editor.getShapeUtil(shape)\n\n\t\tconst initialBinding = editor.isShapeOfType<TLArrowShape>(shape, 'arrow')\n\t\t\t? getArrowBindings(editor, shape)[initialHandle.id as 'start' | 'end']\n\t\t\t: undefined\n\n\t\tlet point = currentPagePoint\n\t\t\t.clone()\n\t\t\t.sub(initialPagePoint)\n\t\t\t.rot(-initialPageRotation)\n\t\t\t.add(initialHandle)\n\n\t\tif (shiftKey && initialAdjacentHandle && initialHandle.id !== 'middle') {\n\t\t\tconst angle = Vec.Angle(initialAdjacentHandle, point)\n\t\t\tconst snappedAngle = snapAngle(angle, 24)\n\t\t\tconst angleDifference = snappedAngle - angle\n\t\t\tpoint = Vec.RotWith(point, initialAdjacentHandle, angleDifference)\n\t\t}\n\n\t\t// Clear any existing snaps\n\t\teditor.snaps.clearIndicators()\n\n\t\tlet nextHandle = { ...initialHandle, x: point.x, y: point.y }\n\n\t\tif (initialHandle.canSnap && (isSnapMode ? !ctrlKey : ctrlKey)) {\n\t\t\t// We're snapping\n\t\t\tconst pageTransform = editor.getShapePageTransform(shape.id)\n\t\t\tif (!pageTransform) throw Error('Expected a page transform')\n\n\t\t\tconst snap = snaps.handles.snapHandle({ currentShapeId: shapeId, handle: nextHandle })\n\n\t\t\tif (snap) {\n\t\t\t\tsnap.nudge.rot(-editor.getShapeParentTransform(shape)!.rotation())\n\t\t\t\tpoint.add(snap.nudge)\n\t\t\t\tnextHandle = { ...initialHandle, x: point.x, y: point.y }\n\t\t\t}\n\t\t}\n\n\t\tconst changes = util.onHandleDrag?.(shape, {\n\t\t\thandle: nextHandle,\n\t\t\tisPrecise: this.isPrecise || altKey,\n\t\t\tisCreatingShape: !!this.info.isCreating,\n\t\t\tinitial: initial,\n\t\t})\n\n\t\tconst next: TLShapePartial<any> = { id: shape.id, type: shape.type, ...changes }\n\n\t\t// Arrows\n\t\tif (\n\t\t\tinitialHandle.type === 'vertex' &&\n\t\t\tthis.editor.isShapeOfType<TLArrowShape>(shape, 'arrow')\n\t\t) {\n\t\t\tconst bindingAfter = getArrowBindings(editor, shape)[initialHandle.id as 'start' | 'end']\n\n\t\t\tif (bindingAfter) {\n\t\t\t\tif (initialBinding?.toId !== bindingAfter.toId) {\n\t\t\t\t\tthis.pointingId = bindingAfter.toId\n\t\t\t\t\tthis.isPrecise = pointerVelocity.len() < 0.5 || altKey\n\t\t\t\t\tthis.isPreciseId = this.isPrecise ? bindingAfter.toId : null\n\t\t\t\t\tthis.resetExactTimeout()\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tif (initialBinding) {\n\t\t\t\t\tthis.pointingId = null\n\t\t\t\t\tthis.isPrecise = false\n\t\t\t\t\tthis.isPreciseId = null\n\t\t\t\t\tthis.resetExactTimeout()\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tif (changes) {\n\t\t\teditor.updateShapes([next])\n\t\t}\n\t}\n}\n"],
+  "mappings": "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",
   "names": ["handle"]
 }

package/dist-cjs/lib/ui/components/A11y.js

@@ -36,7 +36,7 @@ function SkipToMainContent() {
   const button = (0, import_react.useRef)(null);
   const handleNavigateToFirstShape = (0, import_react.useCallback)(
     (e) => {
-      (0, import_editor.stopEventPropagation)(e);
+      editor.markEventAsHandled(e);
       button.current?.blur();
       const shapes = editor.getCurrentPageShapesInReadingOrder();
       if (!shapes.length) return;

package/dist-cjs/lib/ui/components/A11y.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/ui/components/A11y.tsx"],
-  "sourcesContent": ["import {\n\tdebugFlags,\n\tEditor,\n\tstopEventPropagation,\n\tTLGeoShape,\n\tTLShapeId,\n\tunsafe__withoutCapture,\n\tuseContainer,\n\tuseEditor,\n\tuseMaybeEditor,\n\tuseReactor,\n\tuseValue,\n} from '@tldraw/editor'\nimport { memo, MouseEvent, useCallback, useEffect, useRef } from 'react'\nimport { useA11y } from '../context/a11y'\nimport { useTranslation } from '../hooks/useTranslation/useTranslation'\nimport { TldrawUiButton } from './primitives/Button/TldrawUiButton'\n\nexport function SkipToMainContent() {\n\tconst editor = useEditor()\n\tconst msg = useTranslation()\n\tconst button = useRef<HTMLButtonElement>(null)\n\n\tconst handleNavigateToFirstShape = useCallback(\n\t\t(e: MouseEvent | KeyboardEvent) => {\n\t\t\tstopEventPropagation(e)\n\t\t\tbutton.current?.blur()\n\t\t\tconst shapes = editor.getCurrentPageShapesInReadingOrder()\n\t\t\tif (!shapes.length) return\n\t\t\teditor.setSelectedShapes([shapes[0].id])\n\t\t\teditor.zoomToSelectionIfOffscreen(256, {\n\t\t\t\tanimation: {\n\t\t\t\t\tduration: editor.options.animationMediumMs,\n\t\t\t\t},\n\t\t\t\tinset: 0,\n\t\t\t})\n\n\t\t\t// N.B. If we don't do this, then we go into editing mode for some reason...\n\t\t\t// Not sure of a better solution at the moment...\n\t\t\teditor.timers.setTimeout(() => editor.getContainer().focus(), 100)\n\t\t},\n\t\t[editor]\n\t)\n\n\treturn (\n\t\t<TldrawUiButton\n\t\t\tref={button}\n\t\t\ttype=\"low\"\n\t\t\ttabIndex={0}\n\t\t\tclassName=\"tl-skip-to-main-content\"\n\t\t\tonClick={handleNavigateToFirstShape}\n\t\t>\n\t\t\t{msg('a11y.skip-to-main-content')}\n\t\t</TldrawUiButton>\n\t)\n}\n\n/** @public @react */\nexport const DefaultA11yAnnouncer = memo(function TldrawUiA11yAnnouncer() {\n\tconst a11y = useA11y()\n\tconst translation = useTranslation()\n\tconst msg = useValue('a11y-msg', () => a11y.currentMsg.get(), [])\n\tuseA11yDebug(msg.msg)\n\n\tuseSelectedShapesAnnouncer()\n\n\treturn (\n\t\tmsg.msg && (\n\t\t\t<div\n\t\t\t\taria-label={translation('a11y.status')}\n\t\t\t\taria-live={msg.priority || 'assertive'}\n\t\t\t\trole=\"status\"\n\t\t\t\taria-hidden=\"false\"\n\t\t\t\tstyle={{\n\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\ttop: '-10000px',\n\t\t\t\t\tleft: '-10000px',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{msg.msg}\n\t\t\t</div>\n\t\t)\n\t)\n})\n\n/**\n * Core function to generate accessibility announcements for selected shapes\n * @public\n */\nexport function generateShapeAnnouncementMessage(args: {\n\teditor: Editor\n\tselectedShapeIds: TLShapeId[]\n\tmsg(id: string, values?: Record<string, any>): string\n}) {\n\tconst { editor, selectedShapeIds, msg } = args\n\tlet a11yLive = ''\n\tconst numShapes = selectedShapeIds.length\n\n\tif (numShapes > 1) {\n\t\ta11yLive = msg('a11y.multiple-shapes').replace('{num}', numShapes.toString())\n\t} else if (numShapes === 1) {\n\t\tconst shapeId = selectedShapeIds[0]\n\t\tconst shape = editor.getShape(shapeId)\n\t\tif (!shape) return ''\n\n\t\tconst shapeUtil = editor.getShapeUtil(shape.type)\n\n\t\tconst isMedia = ['image', 'video'].includes(shape.type)\n\t\t// Yeah, yeah this is a bit of a hack, we should get better translations.\n\t\tlet shapeType = ''\n\t\tif (shape.type === 'geo') {\n\t\t\tshapeType = msg(`geo-style.${(shape as TLGeoShape).props.geo}`)\n\t\t} else if (isMedia) {\n\t\t\tshapeType = msg(`a11y.shape-${shape.type}`)\n\t\t} else {\n\t\t\tshapeType = msg(`tool.${shape.type}`)\n\t\t}\n\n\t\t// Get shape index in reading order\n\t\tconst readingOrderShapes = editor.getCurrentPageShapesInReadingOrder()\n\t\tconst currentShapeIndex = (readingOrderShapes.findIndex((s) => s.id === shapeId) + 1).toString()\n\t\tconst totalShapes = readingOrderShapes.length.toString()\n\t\tconst shapeIndex = msg('a11y.shape-index')\n\t\t\t.replace('{num}', currentShapeIndex)\n\t\t\t.replace('{total}', totalShapes)\n\n\t\t// Get describing text (alt text or shape text)\n\t\tconst describingText = shapeUtil.getAriaDescriptor(shape) || shapeUtil.getText(shape) || ''\n\n\t\t// Build the full announcement\n\t\ta11yLive = (describingText ? `${describingText}, ` : '') + `${shapeType}. ${shapeIndex}`\n\t}\n\n\treturn a11yLive\n}\n\n/** @public */\nexport const useSelectedShapesAnnouncer = () => {\n\tconst editor = useMaybeEditor()\n\tconst a11y = useA11y()\n\tconst msg = useTranslation()\n\n\tconst rPrevSelectedShapeIds = useRef<string[]>([])\n\n\tuseReactor(\n\t\t'announce selection',\n\t\t() => {\n\t\t\tif (!editor) return\n\n\t\t\tconst isInSelecting = editor.isIn('select.idle')\n\t\t\tif (isInSelecting) {\n\t\t\t\tconst selectedShapeIds = editor.getSelectedShapeIds()\n\t\t\t\tif (selectedShapeIds !== rPrevSelectedShapeIds.current) {\n\t\t\t\t\trPrevSelectedShapeIds.current = selectedShapeIds\n\t\t\t\t\tunsafe__withoutCapture(() => {\n\t\t\t\t\t\tconst a11yLive = generateShapeAnnouncementMessage({\n\t\t\t\t\t\t\teditor,\n\t\t\t\t\t\t\tselectedShapeIds,\n\t\t\t\t\t\t\tmsg,\n\t\t\t\t\t\t})\n\n\t\t\t\t\t\tif (a11yLive) {\n\t\t\t\t\t\t\ta11y.announce({ msg: a11yLive })\n\t\t\t\t\t\t}\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[editor, a11y, msg]\n\t)\n}\n\nconst useA11yDebug = (msg: string | undefined) => {\n\tconst container = useContainer()\n\n\tuseEffect(() => {\n\t\tif (debugFlags.a11y.get()) {\n\t\t\tconst log = (msg: string) => {\n\t\t\t\t// eslint-disable-next-line no-console\n\t\t\t\tconsole.debug(\n\t\t\t\t\t`%ca11y%c: ${msg}`,\n\t\t\t\t\t`color: white; background: #40C057; padding: 2px;border-radius: 3px;`,\n\t\t\t\t\t'font-weight: normal'\n\t\t\t\t)\n\t\t\t}\n\t\t\tconst handleKeyUp = (e: KeyboardEvent) => {\n\t\t\t\tconst el = document.activeElement\n\t\t\t\tif (\n\t\t\t\t\te.key === 'Tab' &&\n\t\t\t\t\tel &&\n\t\t\t\t\tel !== document.body &&\n\t\t\t\t\t!el.classList.contains('tl-container')\n\t\t\t\t) {\n\t\t\t\t\tconst label = el.getAttribute('aria-label') || el.getAttribute('title') || el.textContent\n\t\t\t\t\tif (label) {\n\t\t\t\t\t\tlog(label)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif (msg) {\n\t\t\t\tlog(msg)\n\t\t\t}\n\n\t\t\tdocument.addEventListener('keyup', handleKeyUp)\n\t\t\treturn () => document.removeEventListener('keyup', handleKeyUp)\n\t\t}\n\t}, [container, msg])\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n\tdebugFlags,\n\tEditor,\n\tTLGeoShape,\n\tTLShapeId,\n\tunsafe__withoutCapture,\n\tuseContainer,\n\tuseEditor,\n\tuseMaybeEditor,\n\tuseReactor,\n\tuseValue,\n} from '@tldraw/editor'\nimport { memo, MouseEvent, useCallback, useEffect, useRef } from 'react'\nimport { useA11y } from '../context/a11y'\nimport { useTranslation } from '../hooks/useTranslation/useTranslation'\nimport { TldrawUiButton } from './primitives/Button/TldrawUiButton'\n\nexport function SkipToMainContent() {\n\tconst editor = useEditor()\n\tconst msg = useTranslation()\n\tconst button = useRef<HTMLButtonElement>(null)\n\n\tconst handleNavigateToFirstShape = useCallback(\n\t\t(e: MouseEvent | KeyboardEvent) => {\n\t\t\teditor.markEventAsHandled(e)\n\t\t\tbutton.current?.blur()\n\t\t\tconst shapes = editor.getCurrentPageShapesInReadingOrder()\n\t\t\tif (!shapes.length) return\n\t\t\teditor.setSelectedShapes([shapes[0].id])\n\t\t\teditor.zoomToSelectionIfOffscreen(256, {\n\t\t\t\tanimation: {\n\t\t\t\t\tduration: editor.options.animationMediumMs,\n\t\t\t\t},\n\t\t\t\tinset: 0,\n\t\t\t})\n\n\t\t\t// N.B. If we don't do this, then we go into editing mode for some reason...\n\t\t\t// Not sure of a better solution at the moment...\n\t\t\teditor.timers.setTimeout(() => editor.getContainer().focus(), 100)\n\t\t},\n\t\t[editor]\n\t)\n\n\treturn (\n\t\t<TldrawUiButton\n\t\t\tref={button}\n\t\t\ttype=\"low\"\n\t\t\ttabIndex={0}\n\t\t\tclassName=\"tl-skip-to-main-content\"\n\t\t\tonClick={handleNavigateToFirstShape}\n\t\t>\n\t\t\t{msg('a11y.skip-to-main-content')}\n\t\t</TldrawUiButton>\n\t)\n}\n\n/** @public @react */\nexport const DefaultA11yAnnouncer = memo(function TldrawUiA11yAnnouncer() {\n\tconst a11y = useA11y()\n\tconst translation = useTranslation()\n\tconst msg = useValue('a11y-msg', () => a11y.currentMsg.get(), [])\n\tuseA11yDebug(msg.msg)\n\n\tuseSelectedShapesAnnouncer()\n\n\treturn (\n\t\tmsg.msg && (\n\t\t\t<div\n\t\t\t\taria-label={translation('a11y.status')}\n\t\t\t\taria-live={msg.priority || 'assertive'}\n\t\t\t\trole=\"status\"\n\t\t\t\taria-hidden=\"false\"\n\t\t\t\tstyle={{\n\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\ttop: '-10000px',\n\t\t\t\t\tleft: '-10000px',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{msg.msg}\n\t\t\t</div>\n\t\t)\n\t)\n})\n\n/**\n * Core function to generate accessibility announcements for selected shapes\n * @public\n */\nexport function generateShapeAnnouncementMessage(args: {\n\teditor: Editor\n\tselectedShapeIds: TLShapeId[]\n\tmsg(id: string, values?: Record<string, any>): string\n}) {\n\tconst { editor, selectedShapeIds, msg } = args\n\tlet a11yLive = ''\n\tconst numShapes = selectedShapeIds.length\n\n\tif (numShapes > 1) {\n\t\ta11yLive = msg('a11y.multiple-shapes').replace('{num}', numShapes.toString())\n\t} else if (numShapes === 1) {\n\t\tconst shapeId = selectedShapeIds[0]\n\t\tconst shape = editor.getShape(shapeId)\n\t\tif (!shape) return ''\n\n\t\tconst shapeUtil = editor.getShapeUtil(shape.type)\n\n\t\tconst isMedia = ['image', 'video'].includes(shape.type)\n\t\t// Yeah, yeah this is a bit of a hack, we should get better translations.\n\t\tlet shapeType = ''\n\t\tif (shape.type === 'geo') {\n\t\t\tshapeType = msg(`geo-style.${(shape as TLGeoShape).props.geo}`)\n\t\t} else if (isMedia) {\n\t\t\tshapeType = msg(`a11y.shape-${shape.type}`)\n\t\t} else {\n\t\t\tshapeType = msg(`tool.${shape.type}`)\n\t\t}\n\n\t\t// Get shape index in reading order\n\t\tconst readingOrderShapes = editor.getCurrentPageShapesInReadingOrder()\n\t\tconst currentShapeIndex = (readingOrderShapes.findIndex((s) => s.id === shapeId) + 1).toString()\n\t\tconst totalShapes = readingOrderShapes.length.toString()\n\t\tconst shapeIndex = msg('a11y.shape-index')\n\t\t\t.replace('{num}', currentShapeIndex)\n\t\t\t.replace('{total}', totalShapes)\n\n\t\t// Get describing text (alt text or shape text)\n\t\tconst describingText = shapeUtil.getAriaDescriptor(shape) || shapeUtil.getText(shape) || ''\n\n\t\t// Build the full announcement\n\t\ta11yLive = (describingText ? `${describingText}, ` : '') + `${shapeType}. ${shapeIndex}`\n\t}\n\n\treturn a11yLive\n}\n\n/** @public */\nexport const useSelectedShapesAnnouncer = () => {\n\tconst editor = useMaybeEditor()\n\tconst a11y = useA11y()\n\tconst msg = useTranslation()\n\n\tconst rPrevSelectedShapeIds = useRef<string[]>([])\n\n\tuseReactor(\n\t\t'announce selection',\n\t\t() => {\n\t\t\tif (!editor) return\n\n\t\t\tconst isInSelecting = editor.isIn('select.idle')\n\t\t\tif (isInSelecting) {\n\t\t\t\tconst selectedShapeIds = editor.getSelectedShapeIds()\n\t\t\t\tif (selectedShapeIds !== rPrevSelectedShapeIds.current) {\n\t\t\t\t\trPrevSelectedShapeIds.current = selectedShapeIds\n\t\t\t\t\tunsafe__withoutCapture(() => {\n\t\t\t\t\t\tconst a11yLive = generateShapeAnnouncementMessage({\n\t\t\t\t\t\t\teditor,\n\t\t\t\t\t\t\tselectedShapeIds,\n\t\t\t\t\t\t\tmsg,\n\t\t\t\t\t\t})\n\n\t\t\t\t\t\tif (a11yLive) {\n\t\t\t\t\t\t\ta11y.announce({ msg: a11yLive })\n\t\t\t\t\t\t}\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[editor, a11y, msg]\n\t)\n}\n\nconst useA11yDebug = (msg: string | undefined) => {\n\tconst container = useContainer()\n\n\tuseEffect(() => {\n\t\tif (debugFlags.a11y.get()) {\n\t\t\tconst log = (msg: string) => {\n\t\t\t\t// eslint-disable-next-line no-console\n\t\t\t\tconsole.debug(\n\t\t\t\t\t`%ca11y%c: ${msg}`,\n\t\t\t\t\t`color: white; background: #40C057; padding: 2px;border-radius: 3px;`,\n\t\t\t\t\t'font-weight: normal'\n\t\t\t\t)\n\t\t\t}\n\t\t\tconst handleKeyUp = (e: KeyboardEvent) => {\n\t\t\t\tconst el = document.activeElement\n\t\t\t\tif (\n\t\t\t\t\te.key === 'Tab' &&\n\t\t\t\t\tel &&\n\t\t\t\t\tel !== document.body &&\n\t\t\t\t\t!el.classList.contains('tl-container')\n\t\t\t\t) {\n\t\t\t\t\tconst label = el.getAttribute('aria-label') || el.getAttribute('title') || el.textContent\n\t\t\t\t\tif (label) {\n\t\t\t\t\t\tlog(label)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif (msg) {\n\t\t\t\tlog(msg)\n\t\t\t}\n\n\t\t\tdocument.addEventListener('keyup', handleKeyUp)\n\t\t\treturn () => document.removeEventListener('keyup', handleKeyUp)\n\t\t}\n\t}, [container, msg])\n}\n"],
+  "mappings": "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",
   "names": ["msg"]
 }

package/dist-cjs/lib/ui/components/AccessibilityMenu.js

@@ -29,7 +29,7 @@ function AccessibilityMenu() {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TldrawUiMenuSubmenu.TldrawUiMenuSubmenu, { id: "help menu accessibility", label: "menu.accessibility", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_TldrawUiMenuGroup.TldrawUiMenuGroup, { id: "accessibility", children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_menu_items.ToggleReduceMotionItem, {}),
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_menu_items.ToggleKeyboardShortcutsItem, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_menu_items.ToggleUiLabelsItem, {})
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_menu_items.ToggleEnhancedA11yModeItem, {})
   ] }) });
 }
 //# sourceMappingURL=AccessibilityMenu.js.map

package/dist-cjs/lib/ui/components/AccessibilityMenu.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/ui/components/AccessibilityMenu.tsx"],
-  "sourcesContent": ["import {\n\tToggleKeyboardShortcutsItem,\n\tToggleReduceMotionItem,\n\tToggleUiLabelsItem,\n} from './menu-items'\nimport { TldrawUiMenuGroup } from './primitives/menus/TldrawUiMenuGroup'\nimport { TldrawUiMenuSubmenu } from './primitives/menus/TldrawUiMenuSubmenu'\n\n/** @public @react */\nexport function AccessibilityMenu() {\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"help menu accessibility\" label=\"menu.accessibility\">\n\t\t\t<TldrawUiMenuGroup id=\"accessibility\">\n\t\t\t\t<ToggleReduceMotionItem />\n\t\t\t\t<ToggleKeyboardShortcutsItem />\n\t\t\t\t<ToggleUiLabelsItem />\n\t\t\t</TldrawUiMenuGroup>\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAYG;AAZH,wBAIO;AACP,+BAAkC;AAClC,iCAAoC;AAG7B,SAAS,oBAAoB;AACnC,SACC,4CAAC,kDAAoB,IAAG,2BAA0B,OAAM,sBACvD,uDAAC,8CAAkB,IAAG,iBACrB;AAAA,gDAAC,4CAAuB;AAAA,IACxB,4CAAC,iDAA4B;AAAA,IAC7B,4CAAC,wCAAmB;AAAA,KACrB,GACD;AAEF;",
+  "sourcesContent": ["import {\n\tToggleEnhancedA11yModeItem,\n\tToggleKeyboardShortcutsItem,\n\tToggleReduceMotionItem,\n} from './menu-items'\nimport { TldrawUiMenuGroup } from './primitives/menus/TldrawUiMenuGroup'\nimport { TldrawUiMenuSubmenu } from './primitives/menus/TldrawUiMenuSubmenu'\n\n/** @public @react */\nexport function AccessibilityMenu() {\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"help menu accessibility\" label=\"menu.accessibility\">\n\t\t\t<TldrawUiMenuGroup id=\"accessibility\">\n\t\t\t\t<ToggleReduceMotionItem />\n\t\t\t\t<ToggleKeyboardShortcutsItem />\n\t\t\t\t<ToggleEnhancedA11yModeItem />\n\t\t\t</TldrawUiMenuGroup>\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAYG;AAZH,wBAIO;AACP,+BAAkC;AAClC,iCAAoC;AAG7B,SAAS,oBAAoB;AACnC,SACC,4CAAC,kDAAoB,IAAG,2BAA0B,OAAM,sBACvD,uDAAC,8CAAkB,IAAG,iBACrB;AAAA,gDAAC,4CAAuB;AAAA,IACxB,4CAAC,iDAA4B;AAAA,IAC7B,4CAAC,gDAA2B;AAAA,KAC7B,GACD;AAEF;",
   "names": []
 }

package/dist-cjs/lib/ui/components/InputModeMenu.js

@@ -0,0 +1,77 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var InputModeMenu_exports = {};
+__export(InputModeMenu_exports, {
+  InputModeMenu: () => InputModeMenu
+});
+module.exports = __toCommonJS(InputModeMenu_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_editor = require("@tldraw/editor");
+var import_events = require("../context/events");
+var import_TldrawUiMenuCheckboxItem = require("./primitives/menus/TldrawUiMenuCheckboxItem");
+var import_TldrawUiMenuGroup = require("./primitives/menus/TldrawUiMenuGroup");
+var import_TldrawUiMenuSubmenu = require("./primitives/menus/TldrawUiMenuSubmenu");
+const MODES = ["auto", "trackpad", "mouse"];
+function InputModeMenu() {
+  const editor = (0, import_editor.useEditor)();
+  const trackEvent = (0, import_events.useUiEvents)();
+  const inputMode = (0, import_editor.useValue)("inputMode", () => editor.user.getUserPreferences().inputMode, [
+    editor
+  ]);
+  const wheelBehavior = (0, import_editor.useValue)("wheelBehavior", () => editor.getCameraOptions().wheelBehavior, [
+    editor
+  ]);
+  const isModeChecked = (mode) => {
+    if (mode === "auto") {
+      return inputMode === null;
+    }
+    return inputMode === mode;
+  };
+  const getLabel = (mode, wheelBehavior2) => {
+    if (mode === "auto") {
+      return `action.toggle-auto-${wheelBehavior2}`;
+    }
+    return mode === "trackpad" ? "action.toggle-trackpad" : "action.toggle-mouse";
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TldrawUiMenuSubmenu.TldrawUiMenuSubmenu, { id: "help menu input-mode", label: "menu.input-mode", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TldrawUiMenuGroup.TldrawUiMenuGroup, { id: "peripheral-mode", children: MODES.map((mode) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_TldrawUiMenuCheckboxItem.TldrawUiMenuCheckboxItem,
+    {
+      id: `peripheral-mode-${mode}`,
+      label: getLabel(mode, wheelBehavior),
+      checked: isModeChecked(mode),
+      readonlyOk: true,
+      onSelect: () => {
+        trackEvent("input-mode", { source: "menu", value: mode });
+        switch (mode) {
+          case "auto":
+            editor.user.updateUserPreferences({ inputMode: null });
+            break;
+          case "trackpad":
+            editor.user.updateUserPreferences({ inputMode: "trackpad" });
+            break;
+          case "mouse":
+            editor.user.updateUserPreferences({ inputMode: "mouse" });
+            break;
+        }
+      }
+    },
+    mode
+  )) }) });
+}
+//# sourceMappingURL=InputModeMenu.js.map

package/dist-cjs/lib/ui/components/InputModeMenu.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/lib/ui/components/InputModeMenu.tsx"],
+  "sourcesContent": ["import { useEditor, useValue } from '@tldraw/editor'\nimport { useUiEvents } from '../context/events'\nimport { TldrawUiMenuCheckboxItem } from './primitives/menus/TldrawUiMenuCheckboxItem'\nimport { TldrawUiMenuGroup } from './primitives/menus/TldrawUiMenuGroup'\nimport { TldrawUiMenuSubmenu } from './primitives/menus/TldrawUiMenuSubmenu'\n\nconst MODES = ['auto', 'trackpad', 'mouse'] as const\n\n/** @public @react */\nexport function InputModeMenu() {\n\tconst editor = useEditor()\n\tconst trackEvent = useUiEvents()\n\n\tconst inputMode = useValue('inputMode', () => editor.user.getUserPreferences().inputMode, [\n\t\teditor,\n\t])\n\tconst wheelBehavior = useValue('wheelBehavior', () => editor.getCameraOptions().wheelBehavior, [\n\t\teditor,\n\t])\n\n\tconst isModeChecked = (mode: string) => {\n\t\tif (mode === 'auto') {\n\t\t\treturn inputMode === null\n\t\t}\n\t\treturn inputMode === mode\n\t}\n\n\tconst getLabel = (mode: string, wheelBehavior: 'zoom' | 'pan' | 'none') => {\n\t\tif (mode === 'auto') {\n\t\t\treturn `action.toggle-auto-${wheelBehavior}`\n\t\t}\n\n\t\treturn mode === 'trackpad' ? 'action.toggle-trackpad' : 'action.toggle-mouse'\n\t}\n\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"help menu input-mode\" label=\"menu.input-mode\">\n\t\t\t<TldrawUiMenuGroup id=\"peripheral-mode\">\n\t\t\t\t{MODES.map((mode) => (\n\t\t\t\t\t<TldrawUiMenuCheckboxItem\n\t\t\t\t\t\tid={`peripheral-mode-${mode}`}\n\t\t\t\t\t\tkey={mode}\n\t\t\t\t\t\tlabel={getLabel(mode, wheelBehavior)}\n\t\t\t\t\t\tchecked={isModeChecked(mode)}\n\t\t\t\t\t\treadonlyOk\n\t\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t\ttrackEvent('input-mode', { source: 'menu', value: mode })\n\t\t\t\t\t\t\tswitch (mode) {\n\t\t\t\t\t\t\t\tcase 'auto':\n\t\t\t\t\t\t\t\t\teditor.user.updateUserPreferences({ inputMode: null })\n\t\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\t\tcase 'trackpad':\n\t\t\t\t\t\t\t\t\teditor.user.updateUserPreferences({ inputMode: 'trackpad' })\n\t\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\t\tcase 'mouse':\n\t\t\t\t\t\t\t\t\teditor.user.updateUserPreferences({ inputMode: 'mouse' })\n\t\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</TldrawUiMenuGroup>\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAuCK;AAvCL,oBAAoC;AACpC,oBAA4B;AAC5B,sCAAyC;AACzC,+BAAkC;AAClC,iCAAoC;AAEpC,MAAM,QAAQ,CAAC,QAAQ,YAAY,OAAO;AAGnC,SAAS,gBAAgB;AAC/B,QAAM,aAAS,yBAAU;AACzB,QAAM,iBAAa,2BAAY;AAE/B,QAAM,gBAAY,wBAAS,aAAa,MAAM,OAAO,KAAK,mBAAmB,EAAE,WAAW;AAAA,IACzF;AAAA,EACD,CAAC;AACD,QAAM,oBAAgB,wBAAS,iBAAiB,MAAM,OAAO,iBAAiB,EAAE,eAAe;AAAA,IAC9F;AAAA,EACD,CAAC;AAED,QAAM,gBAAgB,CAAC,SAAiB;AACvC,QAAI,SAAS,QAAQ;AACpB,aAAO,cAAc;AAAA,IACtB;AACA,WAAO,cAAc;AAAA,EACtB;AAEA,QAAM,WAAW,CAAC,MAAcA,mBAA2C;AAC1E,QAAI,SAAS,QAAQ;AACpB,aAAO,sBAAsBA,cAAa;AAAA,IAC3C;AAEA,WAAO,SAAS,aAAa,2BAA2B;AAAA,EACzD;AAEA,SACC,4CAAC,kDAAoB,IAAG,wBAAuB,OAAM,mBACpD,sDAAC,8CAAkB,IAAG,mBACpB,gBAAM,IAAI,CAAC,SACX;AAAA,IAAC;AAAA;AAAA,MACA,IAAI,mBAAmB,IAAI;AAAA,MAE3B,OAAO,SAAS,MAAM,aAAa;AAAA,MACnC,SAAS,cAAc,IAAI;AAAA,MAC3B,YAAU;AAAA,MACV,UAAU,MAAM;AACf,mBAAW,cAAc,EAAE,QAAQ,QAAQ,OAAO,KAAK,CAAC;AACxD,gBAAQ,MAAM;AAAA,UACb,KAAK;AACJ,mBAAO,KAAK,sBAAsB,EAAE,WAAW,KAAK,CAAC;AACrD;AAAA,UACD,KAAK;AACJ,mBAAO,KAAK,sBAAsB,EAAE,WAAW,WAAW,CAAC;AAC3D;AAAA,UACD,KAAK;AACJ,mBAAO,KAAK,sBAAsB,EAAE,WAAW,QAAQ,CAAC;AACxD;AAAA,QACF;AAAA,MACD;AAAA;AAAA,IAjBK;AAAA,EAkBN,CACA,GACF,GACD;AAEF;",
+  "names": ["wheelBehavior"]
+}

package/dist-cjs/lib/ui/components/LanguageMenu.js

@@ -36,6 +36,7 @@ function LanguageMenu() {
     import_TldrawUiMenuCheckboxItem.TldrawUiMenuCheckboxItem,
     {
       id: `language-${locale}`,
+      lang: locale,
       title: locale,
       label,
       checked: locale === currentLanguage,

package/dist-cjs/lib/ui/components/LanguageMenu.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/ui/components/LanguageMenu.tsx"],
-  "sourcesContent": ["import { LANGUAGES, useMaybeEditor, useValue } from '@tldraw/editor'\nimport { useUiEvents } from '../context/events'\nimport { TldrawUiMenuCheckboxItem } from './primitives/menus/TldrawUiMenuCheckboxItem'\nimport { TldrawUiMenuGroup } from './primitives/menus/TldrawUiMenuGroup'\nimport { TldrawUiMenuSubmenu } from './primitives/menus/TldrawUiMenuSubmenu'\n\n/** @public @react */\nexport function LanguageMenu() {\n\tconst editor = useMaybeEditor()\n\tconst trackEvent = useUiEvents()\n\tconst currentLanguage = useValue('locale', () => editor?.user.getLocale(), [editor])\n\n\tif (!editor) return null\n\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"help menu language\" label=\"menu.language\">\n\t\t\t<TldrawUiMenuGroup id=\"languages\" className=\"tlui-language-menu\">\n\t\t\t\t{LANGUAGES.map(({ locale, label }) => (\n\t\t\t\t\t<TldrawUiMenuCheckboxItem\n\t\t\t\t\t\tid={`language-${locale}`}\n\t\t\t\t\t\tkey={locale}\n\t\t\t\t\t\ttitle={locale}\n\t\t\t\t\t\tlabel={label}\n\t\t\t\t\t\tchecked={locale === currentLanguage}\n\t\t\t\t\t\treadonlyOk\n\t\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t\teditor.user.updateUserPreferences({ locale })\n\t\t\t\t\t\t\ttrackEvent('change-language', { source: 'menu', locale })\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</TldrawUiMenuGroup>\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAkBK;AAlBL,oBAAoD;AACpD,oBAA4B;AAC5B,sCAAyC;AACzC,+BAAkC;AAClC,iCAAoC;AAG7B,SAAS,eAAe;AAC9B,QAAM,aAAS,8BAAe;AAC9B,QAAM,iBAAa,2BAAY;AAC/B,QAAM,sBAAkB,wBAAS,UAAU,MAAM,QAAQ,KAAK,UAAU,GAAG,CAAC,MAAM,CAAC;AAEnF,MAAI,CAAC,OAAQ,QAAO;AAEpB,SACC,4CAAC,kDAAoB,IAAG,sBAAqB,OAAM,iBAClD,sDAAC,8CAAkB,IAAG,aAAY,WAAU,sBAC1C,kCAAU,IAAI,CAAC,EAAE,QAAQ,MAAM,MAC/B;AAAA,IAAC;AAAA;AAAA,MACA,IAAI,YAAY,MAAM;AAAA,MAEtB,OAAO;AAAA,MACP;AAAA,MACA,SAAS,WAAW;AAAA,MACpB,YAAU;AAAA,MACV,UAAU,MAAM;AACf,eAAO,KAAK,sBAAsB,EAAE,OAAO,CAAC;AAC5C,mBAAW,mBAAmB,EAAE,QAAQ,QAAQ,OAAO,CAAC;AAAA,MACzD;AAAA;AAAA,IARK;AAAA,EASN,CACA,GACF,GACD;AAEF;",
+  "sourcesContent": ["import { LANGUAGES, useMaybeEditor, useValue } from '@tldraw/editor'\nimport { useUiEvents } from '../context/events'\nimport { TldrawUiMenuCheckboxItem } from './primitives/menus/TldrawUiMenuCheckboxItem'\nimport { TldrawUiMenuGroup } from './primitives/menus/TldrawUiMenuGroup'\nimport { TldrawUiMenuSubmenu } from './primitives/menus/TldrawUiMenuSubmenu'\n\n/** @public @react */\nexport function LanguageMenu() {\n\tconst editor = useMaybeEditor()\n\tconst trackEvent = useUiEvents()\n\tconst currentLanguage = useValue('locale', () => editor?.user.getLocale(), [editor])\n\n\tif (!editor) return null\n\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"help menu language\" label=\"menu.language\">\n\t\t\t<TldrawUiMenuGroup id=\"languages\" className=\"tlui-language-menu\">\n\t\t\t\t{LANGUAGES.map(({ locale, label }) => (\n\t\t\t\t\t<TldrawUiMenuCheckboxItem\n\t\t\t\t\t\tid={`language-${locale}`}\n\t\t\t\t\t\tlang={locale}\n\t\t\t\t\t\tkey={locale}\n\t\t\t\t\t\ttitle={locale}\n\t\t\t\t\t\tlabel={label}\n\t\t\t\t\t\tchecked={locale === currentLanguage}\n\t\t\t\t\t\treadonlyOk\n\t\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t\teditor.user.updateUserPreferences({ locale })\n\t\t\t\t\t\t\ttrackEvent('change-language', { source: 'menu', locale })\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</TldrawUiMenuGroup>\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAkBK;AAlBL,oBAAoD;AACpD,oBAA4B;AAC5B,sCAAyC;AACzC,+BAAkC;AAClC,iCAAoC;AAG7B,SAAS,eAAe;AAC9B,QAAM,aAAS,8BAAe;AAC9B,QAAM,iBAAa,2BAAY;AAC/B,QAAM,sBAAkB,wBAAS,UAAU,MAAM,QAAQ,KAAK,UAAU,GAAG,CAAC,MAAM,CAAC;AAEnF,MAAI,CAAC,OAAQ,QAAO;AAEpB,SACC,4CAAC,kDAAoB,IAAG,sBAAqB,OAAM,iBAClD,sDAAC,8CAAkB,IAAG,aAAY,WAAU,sBAC1C,kCAAU,IAAI,CAAC,EAAE,QAAQ,MAAM,MAC/B;AAAA,IAAC;AAAA;AAAA,MACA,IAAI,YAAY,MAAM;AAAA,MACtB,MAAM;AAAA,MAEN,OAAO;AAAA,MACP;AAAA,MACA,SAAS,WAAW;AAAA,MACpB,YAAU;AAAA,MACV,UAAU,MAAM;AACf,eAAO,KAAK,sBAAsB,EAAE,OAAO,CAAC;AAC5C,mBAAW,mBAAmB,EAAE,QAAQ,QAAQ,OAAO,CAAC;AAAA,MACzD;AAAA;AAAA,IARK;AAAA,EASN,CACA,GACF,GACD;AAEF;",
   "names": []
 }

package/dist-cjs/lib/ui/components/MainMenu/DefaultMainMenuContent.js

@@ -34,6 +34,7 @@ var import_menu_hooks = require("../../hooks/menu-hooks");
 var import_AccessibilityMenu = require("../AccessibilityMenu");
 var import_ColorSchemeMenu = require("../ColorSchemeMenu");
 var import_DefaultHelpMenuContent = require("../HelpMenu/DefaultHelpMenuContent");
+var import_InputModeMenu = require("../InputModeMenu");
 var import_LanguageMenu = require("../LanguageMenu");
 var import_menu_items = require("../menu-items");
 var import_TldrawUiMenuActionItem = require("../primitives/menus/TldrawUiMenuActionItem");
@@ -125,6 +126,7 @@ function PreferencesGroup() {
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_menu_items.TogglePasteAtCursorItem, {}),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_menu_items.ToggleDebugModeItem, {})
       ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TldrawUiMenuGroup.TldrawUiMenuGroup, { id: "input-mode", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_InputModeMenu.InputModeMenu, {}) }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TldrawUiMenuGroup.TldrawUiMenuGroup, { id: "color-scheme", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ColorSchemeMenu.ColorSchemeMenu, {}) }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TldrawUiMenuGroup.TldrawUiMenuGroup, { id: "accessibility-menu", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_AccessibilityMenu.AccessibilityMenu, {}) })
     ] }),

package/dist-cjs/lib/ui/components/MainMenu/DefaultMainMenuContent.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/ui/components/MainMenu/DefaultMainMenuContent.tsx"],
-  "sourcesContent": ["import { useCanRedo, useCanUndo } from '../../hooks/menu-hooks'\nimport { AccessibilityMenu } from '../AccessibilityMenu'\nimport { ColorSchemeMenu } from '../ColorSchemeMenu'\nimport { KeyboardShortcutsMenuItem } from '../HelpMenu/DefaultHelpMenuContent'\nimport { LanguageMenu } from '../LanguageMenu'\nimport {\n\tClipboardMenuGroup,\n\tConversionsMenuGroup,\n\tConvertToBookmarkMenuItem,\n\tConvertToEmbedMenuItem,\n\tEditLinkMenuItem,\n\tFitFrameToContentMenuItem,\n\tFlattenMenuItem,\n\tGroupMenuItem,\n\tRemoveFrameMenuItem,\n\tSelectAllMenuItem,\n\tToggleAutoSizeMenuItem,\n\tToggleDebugModeItem,\n\tToggleDynamicSizeModeItem,\n\tToggleEdgeScrollingItem,\n\tToggleFocusModeItem,\n\tToggleGridItem,\n\tToggleLockMenuItem,\n\tTogglePasteAtCursorItem,\n\tToggleSnapModeItem,\n\tToggleToolLockItem,\n\tToggleTransparentBgMenuItem,\n\tToggleWrapModeItem,\n\tUngroupMenuItem,\n\tUnlockAllMenuItem,\n\tZoomTo100MenuItem,\n\tZoomToFitMenuItem,\n\tZoomToSelectionMenuItem,\n} from '../menu-items'\nimport { TldrawUiMenuActionItem } from '../primitives/menus/TldrawUiMenuActionItem'\nimport { TldrawUiMenuGroup } from '../primitives/menus/TldrawUiMenuGroup'\nimport { TldrawUiMenuSubmenu } from '../primitives/menus/TldrawUiMenuSubmenu'\n\n/** @public @react */\nexport function DefaultMainMenuContent() {\n\treturn (\n\t\t<>\n\t\t\t<TldrawUiMenuGroup id=\"basic\">\n\t\t\t\t<EditSubmenu />\n\t\t\t\t<ViewSubmenu />\n\t\t\t\t<ExportFileContentSubMenu />\n\t\t\t\t<ExtrasGroup />\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<PreferencesGroup />\n\t\t</>\n\t)\n}\n\n/** @public @react */\nexport function ExportFileContentSubMenu() {\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"export-all-as\" label=\"context-menu.export-all-as\" size=\"small\">\n\t\t\t<TldrawUiMenuGroup id=\"export-all-as-group\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"export-all-as-svg\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"export-all-as-png\" />\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<TldrawUiMenuGroup id=\"export-all-as-bg\">\n\t\t\t\t<ToggleTransparentBgMenuItem />\n\t\t\t</TldrawUiMenuGroup>\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n\n/** @public @react */\nexport function EditSubmenu() {\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"edit\" label=\"menu.edit\">\n\t\t\t<UndoRedoGroup />\n\t\t\t<ClipboardMenuGroup />\n\t\t\t<ConversionsMenuGroup />\n\t\t\t<MiscMenuGroup />\n\t\t\t<LockGroup />\n\t\t\t<TldrawUiMenuGroup id=\"select-all\">\n\t\t\t\t<SelectAllMenuItem />\n\t\t\t</TldrawUiMenuGroup>\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n\n/** @public @react */\nexport function MiscMenuGroup() {\n\treturn (\n\t\t<TldrawUiMenuGroup id=\"misc\">\n\t\t\t<GroupMenuItem />\n\t\t\t<UngroupMenuItem />\n\t\t\t<EditLinkMenuItem />\n\t\t\t<ToggleAutoSizeMenuItem />\n\t\t\t<RemoveFrameMenuItem />\n\t\t\t<FitFrameToContentMenuItem />\n\t\t\t<ConvertToEmbedMenuItem />\n\t\t\t<ConvertToBookmarkMenuItem />\n\t\t\t<FlattenMenuItem />\n\t\t</TldrawUiMenuGroup>\n\t)\n}\n\n/** @public @react */\nexport function LockGroup() {\n\treturn (\n\t\t<TldrawUiMenuGroup id=\"lock\">\n\t\t\t<ToggleLockMenuItem />\n\t\t\t<UnlockAllMenuItem />\n\t\t</TldrawUiMenuGroup>\n\t)\n}\n\n/** @public @react */\nexport function UndoRedoGroup() {\n\tconst canUndo = useCanUndo()\n\tconst canRedo = useCanRedo()\n\treturn (\n\t\t<TldrawUiMenuGroup id=\"undo-redo\">\n\t\t\t<TldrawUiMenuActionItem actionId=\"undo\" disabled={!canUndo} />\n\t\t\t<TldrawUiMenuActionItem actionId=\"redo\" disabled={!canRedo} />\n\t\t</TldrawUiMenuGroup>\n\t)\n}\n\n/** @public @react */\nexport function ViewSubmenu() {\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"view\" label=\"menu.view\">\n\t\t\t<TldrawUiMenuGroup id=\"view-actions\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"zoom-in\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"zoom-out\" />\n\t\t\t\t<ZoomTo100MenuItem />\n\t\t\t\t<ZoomToFitMenuItem />\n\t\t\t\t<ZoomToSelectionMenuItem />\n\t\t\t</TldrawUiMenuGroup>\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n\n/** @public @react */\nexport function ExtrasGroup() {\n\treturn (\n\t\t<>\n\t\t\t<TldrawUiMenuActionItem actionId=\"insert-embed\" />\n\t\t\t<TldrawUiMenuActionItem actionId=\"insert-media\" />\n\t\t</>\n\t)\n}\n\n/* ------------------- Preferences ------------------ */\n\n/** @public @react */\nexport function PreferencesGroup() {\n\treturn (\n\t\t<TldrawUiMenuGroup id=\"preferences\">\n\t\t\t<TldrawUiMenuSubmenu id=\"preferences\" label=\"menu.preferences\">\n\t\t\t\t<TldrawUiMenuGroup id=\"preferences-actions\">\n\t\t\t\t\t<ToggleSnapModeItem />\n\t\t\t\t\t<ToggleToolLockItem />\n\t\t\t\t\t<ToggleGridItem />\n\t\t\t\t\t<ToggleWrapModeItem />\n\t\t\t\t\t<ToggleFocusModeItem />\n\t\t\t\t\t<ToggleEdgeScrollingItem />\n\t\t\t\t\t<ToggleDynamicSizeModeItem />\n\t\t\t\t\t<TogglePasteAtCursorItem />\n\t\t\t\t\t<ToggleDebugModeItem />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t\t<TldrawUiMenuGroup id=\"color-scheme\">\n\t\t\t\t\t<ColorSchemeMenu />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t\t<TldrawUiMenuGroup id=\"accessibility-menu\">\n\t\t\t\t\t<AccessibilityMenu />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t</TldrawUiMenuSubmenu>\n\t\t\t<LanguageMenu />\n\t\t\t<KeyboardShortcutsMenuItem />\n\t\t</TldrawUiMenuGroup>\n\t)\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { useCanRedo, useCanUndo } from '../../hooks/menu-hooks'\nimport { AccessibilityMenu } from '../AccessibilityMenu'\nimport { ColorSchemeMenu } from '../ColorSchemeMenu'\nimport { KeyboardShortcutsMenuItem } from '../HelpMenu/DefaultHelpMenuContent'\nimport { InputModeMenu } from '../InputModeMenu'\nimport { LanguageMenu } from '../LanguageMenu'\nimport {\n\tClipboardMenuGroup,\n\tConversionsMenuGroup,\n\tConvertToBookmarkMenuItem,\n\tConvertToEmbedMenuItem,\n\tEditLinkMenuItem,\n\tFitFrameToContentMenuItem,\n\tFlattenMenuItem,\n\tGroupMenuItem,\n\tRemoveFrameMenuItem,\n\tSelectAllMenuItem,\n\tToggleAutoSizeMenuItem,\n\tToggleDebugModeItem,\n\tToggleDynamicSizeModeItem,\n\tToggleEdgeScrollingItem,\n\tToggleFocusModeItem,\n\tToggleGridItem,\n\tToggleLockMenuItem,\n\tTogglePasteAtCursorItem,\n\tToggleSnapModeItem,\n\tToggleToolLockItem,\n\tToggleTransparentBgMenuItem,\n\tToggleWrapModeItem,\n\tUngroupMenuItem,\n\tUnlockAllMenuItem,\n\tZoomTo100MenuItem,\n\tZoomToFitMenuItem,\n\tZoomToSelectionMenuItem,\n} from '../menu-items'\nimport { TldrawUiMenuActionItem } from '../primitives/menus/TldrawUiMenuActionItem'\nimport { TldrawUiMenuGroup } from '../primitives/menus/TldrawUiMenuGroup'\nimport { TldrawUiMenuSubmenu } from '../primitives/menus/TldrawUiMenuSubmenu'\n\n/** @public @react */\nexport function DefaultMainMenuContent() {\n\treturn (\n\t\t<>\n\t\t\t<TldrawUiMenuGroup id=\"basic\">\n\t\t\t\t<EditSubmenu />\n\t\t\t\t<ViewSubmenu />\n\t\t\t\t<ExportFileContentSubMenu />\n\t\t\t\t<ExtrasGroup />\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<PreferencesGroup />\n\t\t</>\n\t)\n}\n\n/** @public @react */\nexport function ExportFileContentSubMenu() {\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"export-all-as\" label=\"context-menu.export-all-as\" size=\"small\">\n\t\t\t<TldrawUiMenuGroup id=\"export-all-as-group\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"export-all-as-svg\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"export-all-as-png\" />\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<TldrawUiMenuGroup id=\"export-all-as-bg\">\n\t\t\t\t<ToggleTransparentBgMenuItem />\n\t\t\t</TldrawUiMenuGroup>\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n\n/** @public @react */\nexport function EditSubmenu() {\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"edit\" label=\"menu.edit\">\n\t\t\t<UndoRedoGroup />\n\t\t\t<ClipboardMenuGroup />\n\t\t\t<ConversionsMenuGroup />\n\t\t\t<MiscMenuGroup />\n\t\t\t<LockGroup />\n\t\t\t<TldrawUiMenuGroup id=\"select-all\">\n\t\t\t\t<SelectAllMenuItem />\n\t\t\t</TldrawUiMenuGroup>\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n\n/** @public @react */\nexport function MiscMenuGroup() {\n\treturn (\n\t\t<TldrawUiMenuGroup id=\"misc\">\n\t\t\t<GroupMenuItem />\n\t\t\t<UngroupMenuItem />\n\t\t\t<EditLinkMenuItem />\n\t\t\t<ToggleAutoSizeMenuItem />\n\t\t\t<RemoveFrameMenuItem />\n\t\t\t<FitFrameToContentMenuItem />\n\t\t\t<ConvertToEmbedMenuItem />\n\t\t\t<ConvertToBookmarkMenuItem />\n\t\t\t<FlattenMenuItem />\n\t\t</TldrawUiMenuGroup>\n\t)\n}\n\n/** @public @react */\nexport function LockGroup() {\n\treturn (\n\t\t<TldrawUiMenuGroup id=\"lock\">\n\t\t\t<ToggleLockMenuItem />\n\t\t\t<UnlockAllMenuItem />\n\t\t</TldrawUiMenuGroup>\n\t)\n}\n\n/** @public @react */\nexport function UndoRedoGroup() {\n\tconst canUndo = useCanUndo()\n\tconst canRedo = useCanRedo()\n\treturn (\n\t\t<TldrawUiMenuGroup id=\"undo-redo\">\n\t\t\t<TldrawUiMenuActionItem actionId=\"undo\" disabled={!canUndo} />\n\t\t\t<TldrawUiMenuActionItem actionId=\"redo\" disabled={!canRedo} />\n\t\t</TldrawUiMenuGroup>\n\t)\n}\n\n/** @public @react */\nexport function ViewSubmenu() {\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"view\" label=\"menu.view\">\n\t\t\t<TldrawUiMenuGroup id=\"view-actions\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"zoom-in\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"zoom-out\" />\n\t\t\t\t<ZoomTo100MenuItem />\n\t\t\t\t<ZoomToFitMenuItem />\n\t\t\t\t<ZoomToSelectionMenuItem />\n\t\t\t</TldrawUiMenuGroup>\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n\n/** @public @react */\nexport function ExtrasGroup() {\n\treturn (\n\t\t<>\n\t\t\t<TldrawUiMenuActionItem actionId=\"insert-embed\" />\n\t\t\t<TldrawUiMenuActionItem actionId=\"insert-media\" />\n\t\t</>\n\t)\n}\n\n/* ------------------- Preferences ------------------ */\n\n/** @public @react */\nexport function PreferencesGroup() {\n\treturn (\n\t\t<TldrawUiMenuGroup id=\"preferences\">\n\t\t\t<TldrawUiMenuSubmenu id=\"preferences\" label=\"menu.preferences\">\n\t\t\t\t<TldrawUiMenuGroup id=\"preferences-actions\">\n\t\t\t\t\t<ToggleSnapModeItem />\n\t\t\t\t\t<ToggleToolLockItem />\n\t\t\t\t\t<ToggleGridItem />\n\t\t\t\t\t<ToggleWrapModeItem />\n\t\t\t\t\t<ToggleFocusModeItem />\n\t\t\t\t\t<ToggleEdgeScrollingItem />\n\t\t\t\t\t<ToggleDynamicSizeModeItem />\n\t\t\t\t\t<TogglePasteAtCursorItem />\n\t\t\t\t\t<ToggleDebugModeItem />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t\t<TldrawUiMenuGroup id=\"input-mode\">\n\t\t\t\t\t<InputModeMenu />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t\t<TldrawUiMenuGroup id=\"color-scheme\">\n\t\t\t\t\t<ColorSchemeMenu />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t\t<TldrawUiMenuGroup id=\"accessibility-menu\">\n\t\t\t\t\t<AccessibilityMenu />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t</TldrawUiMenuSubmenu>\n\t\t\t<LanguageMenu />\n\t\t\t<KeyboardShortcutsMenuItem />\n\t\t</TldrawUiMenuGroup>\n\t)\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist-cjs/lib/ui/components/Minimap/DefaultMinimap.js

@@ -154,7 +154,7 @@ function DefaultMinimap() {
         type: "pointer",
         target: "canvas",
         name: "pointer_move",
-        ...(0, import_editor.getPointerInfo)(e),
+        ...(0, import_editor.getPointerInfo)(editor, e),
         point: screenPoint,
         isPen: editor.getInstanceState().isPenMode
       };
@@ -191,6 +191,7 @@ function DefaultMinimap() {
     {
       role: "img",
       "aria-label": msg("navigation-zone.minimap"),
+      "data-testid": "minimap.canvas",
       ref: rCanvas,
       className: "tlui-minimap__canvas",
       onDoubleClick,

package/dist-cjs/lib/ui/components/Minimap/DefaultMinimap.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/ui/components/Minimap/DefaultMinimap.tsx"],
-  "sourcesContent": ["import {\n\tBox,\n\tTLPointerEventInfo,\n\tVec,\n\tgetPointerInfo,\n\tisAccelKey,\n\tnormalizeWheel,\n\treleasePointerCapture,\n\tsetPointerCapture,\n\tuseContainer,\n\tuseEditor,\n\tuseIsDarkMode,\n} from '@tldraw/editor'\nimport * as React from 'react'\nimport { useTranslation } from '../../hooks/useTranslation/useTranslation'\nimport { MinimapManager } from './MinimapManager'\n\n/** @public @react */\nexport function DefaultMinimap() {\n\tconst editor = useEditor()\n\tconst container = useContainer()\n\tconst msg = useTranslation()\n\n\tconst rCanvas = React.useRef<HTMLCanvasElement>(null!)\n\tconst rPointing = React.useRef(false)\n\n\tconst minimapRef = React.useRef<MinimapManager>()\n\n\tReact.useEffect(() => {\n\t\ttry {\n\t\t\tconst minimap = new MinimapManager(editor, rCanvas.current, container)\n\t\t\tminimapRef.current = minimap\n\t\t\treturn minimapRef.current.close\n\t\t} catch (e) {\n\t\t\teditor.annotateError(e, {\n\t\t\t\torigin: 'minimap',\n\t\t\t\twillCrashApp: false,\n\t\t\t})\n\t\t\teditor.timers.setTimeout(() => {\n\t\t\t\tthrow e\n\t\t\t})\n\t\t}\n\t}, [editor, container])\n\n\tconst onDoubleClick = React.useCallback(\n\t\t(e: React.MouseEvent<HTMLCanvasElement>) => {\n\t\t\tif (!editor.getCurrentPageShapeIds().size) return\n\t\t\tif (!minimapRef.current) return\n\n\t\t\tconst point = minimapRef.current.minimapScreenPointToPagePoint(\n\t\t\t\te.clientX,\n\t\t\t\te.clientY,\n\t\t\t\tfalse,\n\t\t\t\tfalse\n\t\t\t)\n\n\t\t\tconst clampedPoint = minimapRef.current.minimapScreenPointToPagePoint(\n\t\t\t\te.clientX,\n\t\t\t\te.clientY,\n\t\t\t\tfalse,\n\t\t\t\ttrue\n\t\t\t)\n\n\t\t\tminimapRef.current.originPagePoint.setTo(clampedPoint)\n\t\t\tminimapRef.current.originPageCenter.setTo(editor.getViewportPageBounds().center)\n\n\t\t\teditor.centerOnPoint(point, { animation: { duration: editor.options.animationMediumMs } })\n\t\t},\n\t\t[editor]\n\t)\n\n\tconst onPointerDown = React.useCallback(\n\t\t(e: React.PointerEvent<HTMLCanvasElement>) => {\n\t\t\tif (!minimapRef.current) return\n\t\t\tconst elm = e.currentTarget\n\t\t\tsetPointerCapture(elm, e)\n\t\t\tif (!editor.getCurrentPageShapeIds().size) return\n\n\t\t\trPointing.current = true\n\n\t\t\tminimapRef.current.isInViewport = false\n\n\t\t\tconst point = minimapRef.current.minimapScreenPointToPagePoint(\n\t\t\t\te.clientX,\n\t\t\t\te.clientY,\n\t\t\t\tfalse,\n\t\t\t\tfalse\n\t\t\t)\n\n\t\t\tconst _vpPageBounds = editor.getViewportPageBounds()\n\t\t\tconst commonBounds = minimapRef.current.getContentPageBounds()\n\t\t\tconst allowedBounds = new Box(\n\t\t\t\tcommonBounds.x - _vpPageBounds.width / 2,\n\t\t\t\tcommonBounds.y - _vpPageBounds.height / 2,\n\t\t\t\tcommonBounds.width + _vpPageBounds.width,\n\t\t\t\tcommonBounds.height + _vpPageBounds.height\n\t\t\t)\n\n\t\t\t// If we clicked inside of the allowed area, but outside of the viewport\n\t\t\tif (allowedBounds.containsPoint(point) && !_vpPageBounds.containsPoint(point)) {\n\t\t\t\tminimapRef.current.isInViewport = _vpPageBounds.containsPoint(point)\n\t\t\t\tconst delta = Vec.Sub(_vpPageBounds.center, _vpPageBounds.point)\n\t\t\t\tconst pagePoint = Vec.Add(point, delta)\n\t\t\t\tminimapRef.current.originPagePoint.setTo(pagePoint)\n\t\t\t\tminimapRef.current.originPageCenter.setTo(point)\n\t\t\t\teditor.centerOnPoint(point, { animation: { duration: editor.options.animationMediumMs } })\n\t\t\t} else {\n\t\t\t\tconst clampedPoint = minimapRef.current.minimapScreenPointToPagePoint(\n\t\t\t\t\te.clientX,\n\t\t\t\t\te.clientY,\n\t\t\t\t\tfalse,\n\t\t\t\t\ttrue\n\t\t\t\t)\n\t\t\t\tminimapRef.current.isInViewport = _vpPageBounds.containsPoint(clampedPoint)\n\t\t\t\tminimapRef.current.originPagePoint.setTo(clampedPoint)\n\t\t\t\tminimapRef.current.originPageCenter.setTo(_vpPageBounds.center)\n\t\t\t}\n\n\t\t\tfunction release(e: PointerEvent) {\n\t\t\t\tif (elm) {\n\t\t\t\t\treleasePointerCapture(elm, e)\n\t\t\t\t}\n\t\t\t\trPointing.current = false\n\t\t\t\tdocument.body.removeEventListener('pointerup', release)\n\t\t\t}\n\n\t\t\tdocument.body.addEventListener('pointerup', release)\n\t\t},\n\t\t[editor]\n\t)\n\n\tconst onPointerMove = React.useCallback(\n\t\t(e: React.PointerEvent<HTMLCanvasElement>) => {\n\t\t\tif (!minimapRef.current) return\n\t\t\tconst point = minimapRef.current.minimapScreenPointToPagePoint(\n\t\t\t\te.clientX,\n\t\t\t\te.clientY,\n\t\t\t\te.shiftKey,\n\t\t\t\ttrue\n\t\t\t)\n\n\t\t\tif (rPointing.current) {\n\t\t\t\tif (minimapRef.current.isInViewport) {\n\t\t\t\t\tconst delta = minimapRef.current.originPagePoint\n\t\t\t\t\t\t.clone()\n\t\t\t\t\t\t.sub(minimapRef.current.originPageCenter)\n\t\t\t\t\teditor.centerOnPoint(Vec.Sub(point, delta))\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\teditor.centerOnPoint(point)\n\t\t\t}\n\n\t\t\tconst pagePoint = minimapRef.current.getMinimapPagePoint(e.clientX, e.clientY)\n\n\t\t\tconst screenPoint = editor.pageToScreen(pagePoint)\n\n\t\t\tconst info: TLPointerEventInfo = {\n\t\t\t\ttype: 'pointer',\n\t\t\t\ttarget: 'canvas',\n\t\t\t\tname: 'pointer_move',\n\t\t\t\t...getPointerInfo(e),\n\t\t\t\tpoint: screenPoint,\n\t\t\t\tisPen: editor.getInstanceState().isPenMode,\n\t\t\t}\n\n\t\t\teditor.dispatch(info)\n\t\t},\n\t\t[editor]\n\t)\n\n\tconst onWheel = React.useCallback(\n\t\t(e: React.WheelEvent<HTMLCanvasElement>) => {\n\t\t\tconst offset = normalizeWheel(e)\n\n\t\t\teditor.dispatch({\n\t\t\t\ttype: 'wheel',\n\t\t\t\tname: 'wheel',\n\t\t\t\tdelta: offset,\n\t\t\t\tpoint: new Vec(e.clientX, e.clientY),\n\t\t\t\tshiftKey: e.shiftKey,\n\t\t\t\taltKey: e.altKey,\n\t\t\t\tctrlKey: e.metaKey || e.ctrlKey,\n\t\t\t\tmetaKey: e.metaKey,\n\t\t\t\taccelKey: isAccelKey(e),\n\t\t\t})\n\t\t},\n\t\t[editor]\n\t)\n\n\tconst isDarkMode = useIsDarkMode()\n\n\tReact.useEffect(() => {\n\t\t// need to wait a tick for next theme css to be applied\n\t\t// otherwise the minimap will render with the wrong colors\n\t\teditor.timers.setTimeout(() => {\n\t\t\tminimapRef.current?.updateColors()\n\t\t\tminimapRef.current?.render()\n\t\t})\n\t}, [isDarkMode, editor])\n\n\treturn (\n\t\t<div className=\"tlui-minimap\">\n\t\t\t<canvas\n\t\t\t\trole=\"img\"\n\t\t\t\taria-label={msg('navigation-zone.minimap')}\n\t\t\t\tref={rCanvas}\n\t\t\t\tclassName=\"tlui-minimap__canvas\"\n\t\t\t\tonDoubleClick={onDoubleClick}\n\t\t\t\tonPointerMove={onPointerMove}\n\t\t\t\tonPointerDown={onPointerDown}\n\t\t\t\tonWheelCapture={onWheel}\n\t\t\t/>\n\t\t</div>\n\t)\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n\tBox,\n\tTLPointerEventInfo,\n\tVec,\n\tgetPointerInfo,\n\tisAccelKey,\n\tnormalizeWheel,\n\treleasePointerCapture,\n\tsetPointerCapture,\n\tuseContainer,\n\tuseEditor,\n\tuseIsDarkMode,\n} from '@tldraw/editor'\nimport * as React from 'react'\nimport { useTranslation } from '../../hooks/useTranslation/useTranslation'\nimport { MinimapManager } from './MinimapManager'\n\n/** @public @react */\nexport function DefaultMinimap() {\n\tconst editor = useEditor()\n\tconst container = useContainer()\n\tconst msg = useTranslation()\n\n\tconst rCanvas = React.useRef<HTMLCanvasElement>(null!)\n\tconst rPointing = React.useRef(false)\n\n\tconst minimapRef = React.useRef<MinimapManager>()\n\n\tReact.useEffect(() => {\n\t\ttry {\n\t\t\tconst minimap = new MinimapManager(editor, rCanvas.current, container)\n\t\t\tminimapRef.current = minimap\n\t\t\treturn minimapRef.current.close\n\t\t} catch (e) {\n\t\t\teditor.annotateError(e, {\n\t\t\t\torigin: 'minimap',\n\t\t\t\twillCrashApp: false,\n\t\t\t})\n\t\t\teditor.timers.setTimeout(() => {\n\t\t\t\tthrow e\n\t\t\t})\n\t\t}\n\t}, [editor, container])\n\n\tconst onDoubleClick = React.useCallback(\n\t\t(e: React.MouseEvent<HTMLCanvasElement>) => {\n\t\t\tif (!editor.getCurrentPageShapeIds().size) return\n\t\t\tif (!minimapRef.current) return\n\n\t\t\tconst point = minimapRef.current.minimapScreenPointToPagePoint(\n\t\t\t\te.clientX,\n\t\t\t\te.clientY,\n\t\t\t\tfalse,\n\t\t\t\tfalse\n\t\t\t)\n\n\t\t\tconst clampedPoint = minimapRef.current.minimapScreenPointToPagePoint(\n\t\t\t\te.clientX,\n\t\t\t\te.clientY,\n\t\t\t\tfalse,\n\t\t\t\ttrue\n\t\t\t)\n\n\t\t\tminimapRef.current.originPagePoint.setTo(clampedPoint)\n\t\t\tminimapRef.current.originPageCenter.setTo(editor.getViewportPageBounds().center)\n\n\t\t\teditor.centerOnPoint(point, { animation: { duration: editor.options.animationMediumMs } })\n\t\t},\n\t\t[editor]\n\t)\n\n\tconst onPointerDown = React.useCallback(\n\t\t(e: React.PointerEvent<HTMLCanvasElement>) => {\n\t\t\tif (!minimapRef.current) return\n\t\t\tconst elm = e.currentTarget\n\t\t\tsetPointerCapture(elm, e)\n\t\t\tif (!editor.getCurrentPageShapeIds().size) return\n\n\t\t\trPointing.current = true\n\n\t\t\tminimapRef.current.isInViewport = false\n\n\t\t\tconst point = minimapRef.current.minimapScreenPointToPagePoint(\n\t\t\t\te.clientX,\n\t\t\t\te.clientY,\n\t\t\t\tfalse,\n\t\t\t\tfalse\n\t\t\t)\n\n\t\t\tconst _vpPageBounds = editor.getViewportPageBounds()\n\t\t\tconst commonBounds = minimapRef.current.getContentPageBounds()\n\t\t\tconst allowedBounds = new Box(\n\t\t\t\tcommonBounds.x - _vpPageBounds.width / 2,\n\t\t\t\tcommonBounds.y - _vpPageBounds.height / 2,\n\t\t\t\tcommonBounds.width + _vpPageBounds.width,\n\t\t\t\tcommonBounds.height + _vpPageBounds.height\n\t\t\t)\n\n\t\t\t// If we clicked inside of the allowed area, but outside of the viewport\n\t\t\tif (allowedBounds.containsPoint(point) && !_vpPageBounds.containsPoint(point)) {\n\t\t\t\tminimapRef.current.isInViewport = _vpPageBounds.containsPoint(point)\n\t\t\t\tconst delta = Vec.Sub(_vpPageBounds.center, _vpPageBounds.point)\n\t\t\t\tconst pagePoint = Vec.Add(point, delta)\n\t\t\t\tminimapRef.current.originPagePoint.setTo(pagePoint)\n\t\t\t\tminimapRef.current.originPageCenter.setTo(point)\n\t\t\t\teditor.centerOnPoint(point, { animation: { duration: editor.options.animationMediumMs } })\n\t\t\t} else {\n\t\t\t\tconst clampedPoint = minimapRef.current.minimapScreenPointToPagePoint(\n\t\t\t\t\te.clientX,\n\t\t\t\t\te.clientY,\n\t\t\t\t\tfalse,\n\t\t\t\t\ttrue\n\t\t\t\t)\n\t\t\t\tminimapRef.current.isInViewport = _vpPageBounds.containsPoint(clampedPoint)\n\t\t\t\tminimapRef.current.originPagePoint.setTo(clampedPoint)\n\t\t\t\tminimapRef.current.originPageCenter.setTo(_vpPageBounds.center)\n\t\t\t}\n\n\t\t\tfunction release(e: PointerEvent) {\n\t\t\t\tif (elm) {\n\t\t\t\t\treleasePointerCapture(elm, e)\n\t\t\t\t}\n\t\t\t\trPointing.current = false\n\t\t\t\tdocument.body.removeEventListener('pointerup', release)\n\t\t\t}\n\n\t\t\tdocument.body.addEventListener('pointerup', release)\n\t\t},\n\t\t[editor]\n\t)\n\n\tconst onPointerMove = React.useCallback(\n\t\t(e: React.PointerEvent<HTMLCanvasElement>) => {\n\t\t\tif (!minimapRef.current) return\n\t\t\tconst point = minimapRef.current.minimapScreenPointToPagePoint(\n\t\t\t\te.clientX,\n\t\t\t\te.clientY,\n\t\t\t\te.shiftKey,\n\t\t\t\ttrue\n\t\t\t)\n\n\t\t\tif (rPointing.current) {\n\t\t\t\tif (minimapRef.current.isInViewport) {\n\t\t\t\t\tconst delta = minimapRef.current.originPagePoint\n\t\t\t\t\t\t.clone()\n\t\t\t\t\t\t.sub(minimapRef.current.originPageCenter)\n\t\t\t\t\teditor.centerOnPoint(Vec.Sub(point, delta))\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\teditor.centerOnPoint(point)\n\t\t\t}\n\n\t\t\tconst pagePoint = minimapRef.current.getMinimapPagePoint(e.clientX, e.clientY)\n\n\t\t\tconst screenPoint = editor.pageToScreen(pagePoint)\n\n\t\t\tconst info: TLPointerEventInfo = {\n\t\t\t\ttype: 'pointer',\n\t\t\t\ttarget: 'canvas',\n\t\t\t\tname: 'pointer_move',\n\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t\tpoint: screenPoint,\n\t\t\t\tisPen: editor.getInstanceState().isPenMode,\n\t\t\t}\n\n\t\t\teditor.dispatch(info)\n\t\t},\n\t\t[editor]\n\t)\n\n\tconst onWheel = React.useCallback(\n\t\t(e: React.WheelEvent<HTMLCanvasElement>) => {\n\t\t\tconst offset = normalizeWheel(e)\n\n\t\t\teditor.dispatch({\n\t\t\t\ttype: 'wheel',\n\t\t\t\tname: 'wheel',\n\t\t\t\tdelta: offset,\n\t\t\t\tpoint: new Vec(e.clientX, e.clientY),\n\t\t\t\tshiftKey: e.shiftKey,\n\t\t\t\taltKey: e.altKey,\n\t\t\t\tctrlKey: e.metaKey || e.ctrlKey,\n\t\t\t\tmetaKey: e.metaKey,\n\t\t\t\taccelKey: isAccelKey(e),\n\t\t\t})\n\t\t},\n\t\t[editor]\n\t)\n\n\tconst isDarkMode = useIsDarkMode()\n\n\tReact.useEffect(() => {\n\t\t// need to wait a tick for next theme css to be applied\n\t\t// otherwise the minimap will render with the wrong colors\n\t\teditor.timers.setTimeout(() => {\n\t\t\tminimapRef.current?.updateColors()\n\t\t\tminimapRef.current?.render()\n\t\t})\n\t}, [isDarkMode, editor])\n\n\treturn (\n\t\t<div className=\"tlui-minimap\">\n\t\t\t<canvas\n\t\t\t\trole=\"img\"\n\t\t\t\taria-label={msg('navigation-zone.minimap')}\n\t\t\t\tdata-testid=\"minimap.canvas\"\n\t\t\t\tref={rCanvas}\n\t\t\t\tclassName=\"tlui-minimap__canvas\"\n\t\t\t\tonDoubleClick={onDoubleClick}\n\t\t\t\tonPointerMove={onPointerMove}\n\t\t\t\tonPointerDown={onPointerDown}\n\t\t\t\tonWheelCapture={onWheel}\n\t\t\t/>\n\t\t</div>\n\t)\n}\n"],
+  "mappings": "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",
   "names": ["e"]
 }

package/dist-cjs/lib/ui/components/PageMenu/DefaultPageMenu.js

@@ -414,7 +414,7 @@ const DefaultPageMenu = (0, import_react.memo)(function DefaultPageMenu2() {
                             if (e.key === "Enter") {
                               if (page.id === currentPage.id) {
                                 toggleEditing();
-                                (0, import_editor.stopEventPropagation)(e);
+                                editor.markEventAsHandled(e);
                               }
                             }
                           },