tldraw 4.2.0-next.d70e0650108f → 4.2.0-next.e824a30c434e

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "tldraw",
   "description": "A tiny little drawing editor.",
-  "version": "4.2.0-next.d70e0650108f",
+  "version": "4.2.0-next.e824a30c434e",
   "author": {
     "name": "tldraw Inc.",
     "email": "hello@tldraw.com"
@@ -55,15 +55,15 @@
     "src"
   ],
   "dependencies": {
-    "@tiptap/core": "^2.9.1",
-    "@tiptap/extension-code": "^2.9.1",
-    "@tiptap/extension-highlight": "^2.9.1",
-    "@tiptap/extension-link": "^2.9.1",
-    "@tiptap/pm": "^2.9.1",
-    "@tiptap/react": "^2.9.1",
-    "@tiptap/starter-kit": "^2.9.1",
-    "@tldraw/editor": "4.2.0-next.d70e0650108f",
-    "@tldraw/store": "4.2.0-next.d70e0650108f",
+    "@tiptap/core": "3.6.2",
+    "@tiptap/extension-code": "3.6.2",
+    "@tiptap/extension-highlight": "3.6.2",
+    "@tiptap/extension-list": "3.6.2",
+    "@tiptap/pm": "3.6.2",
+    "@tiptap/react": "3.6.2",
+    "@tiptap/starter-kit": "3.6.2",
+    "@tldraw/editor": "4.2.0-next.e824a30c434e",
+    "@tldraw/store": "4.2.0-next.e824a30c434e",
     "classnames": "^2.5.1",
     "hotkeys-js": "^3.13.9",
     "idb": "^7.1.1",

package/src/index.ts

@@ -241,7 +241,10 @@ export {
 	DefaultDebugMenuContent,
 	ExampleDialog,
 	FeatureFlags,
+	type CustomDebugFlags,
+	type DebugFlagsProps,
 	type ExampleDialogProps,
+	type FeatureFlagsProps,
 } from './lib/ui/components/DebugMenu/DefaultDebugMenuContent'
 export { DefaultMenuPanel } from './lib/ui/components/DefaultMenuPanel'
 export {

package/src/lib/ui/components/DebugMenu/DefaultDebugMenuContent.tsx

@@ -29,8 +29,17 @@ import { TldrawUiMenuGroup } from '../primitives/menus/TldrawUiMenuGroup'
 import { TldrawUiMenuItem } from '../primitives/menus/TldrawUiMenuItem'
 import { TldrawUiMenuSubmenu } from '../primitives/menus/TldrawUiMenuSubmenu'
 
+/** @public */
+export interface CustomDebugFlags {
+	customDebugFlags?: Record<string, DebugFlag<boolean>>
+	customFeatureFlags?: Record<string, DebugFlag<boolean>>
+}
+
 /** @public @react */
-export function DefaultDebugMenuContent() {
+export function DefaultDebugMenuContent({
+	customDebugFlags,
+	customFeatureFlags,
+}: CustomDebugFlags) {
 	const editor = useEditor()
 	const { addToast } = useToasts()
 	const { addDialog } = useDialogs()
@@ -161,15 +170,21 @@ export function DefaultDebugMenuContent() {
 				<TldrawUiMenuItem id="throw-error" onSelect={() => setError(true)} label={'Throw error'} />
 			</TldrawUiMenuGroup>
 			<TldrawUiMenuGroup id="flags">
-				<DebugFlags />
-				<FeatureFlags />
+				<DebugFlags customDebugFlags={customDebugFlags} />
+				<FeatureFlags customFeatureFlags={customFeatureFlags} />
 			</TldrawUiMenuGroup>
 		</>
 	)
 }
+
+/** @public */
+export interface DebugFlagsProps {
+	customDebugFlags?: Record<string, DebugFlag<boolean>> | undefined
+}
+
 /** @public @react */
-export function DebugFlags() {
-	const items = Object.values(debugFlags)
+export function DebugFlags(props: DebugFlagsProps) {
+	const items = Object.values(props.customDebugFlags ?? debugFlags)
 	if (!items.length) return null
 	return (
 		<TldrawUiMenuSubmenu id="debug flags" label="Debug flags">
@@ -181,9 +196,14 @@ export function DebugFlags() {
 		</TldrawUiMenuSubmenu>
 	)
 }
+/** @public */
+export interface FeatureFlagsProps {
+	customFeatureFlags?: Record<string, DebugFlag<boolean>> | undefined
+}
+
 /** @public @react */
-export function FeatureFlags() {
-	const items = Object.values(featureFlags)
+export function FeatureFlags(props: FeatureFlagsProps) {
+	const items = Object.values(props.customFeatureFlags ?? featureFlags)
 	if (!items.length) return null
 	return (
 		<TldrawUiMenuSubmenu id="feature flags" label="Feature flags">

package/src/lib/ui/components/Toolbar/DefaultRichTextToolbar.tsx

@@ -117,7 +117,9 @@ function useEditingLinkBehavior(textEditor?: TiptapEditor) {
 
 		textEditor.view.dom.addEventListener('click', handleClick)
 		return () => {
-			textEditor.view.dom.removeEventListener('click', handleClick)
+			if (textEditor.isInitialized) {
+				textEditor.view.dom.removeEventListener('click', handleClick)
+			}
 		}
 	}, [textEditor, isEditingLink])
 
@@ -193,7 +195,9 @@ function useIsMousingDownOnTextEditor(textEditor: TiptapEditor) {
 		})
 		return () => {
 			touchDownEvents.forEach((eventName: string) => {
-				textEditor.view.dom.removeEventListener(eventName, handlePointingDown)
+				if (textEditor.isInitialized) {
+					textEditor.view.dom.removeEventListener(eventName, handlePointingDown)
+				}
 			})
 			touchUpEvents.forEach((eventName: string) => {
 				document.body.removeEventListener(eventName, handlePointingUp)

package/src/lib/ui/components/Toolbar/LinkEditor.tsx

@@ -31,7 +31,7 @@ export function LinkEditor({ textEditor, value: initialValue, onClose }: LinkEdi
 			link = `https://${link}`
 		}
 
-		textEditor.commands.setLink({ href: link })
+		textEditor.chain().setLink({ href: link }).run()
 		// N.B. We shouldn't focus() on mobile because it causes the
 		// Return key to replace the link with a newline :facepalm:
 		if (editor.getInstanceState().isCoarsePointer) {

package/src/lib/ui/version.ts

@@ -1,9 +1,9 @@
 // This file is automatically generated by internal/scripts/refresh-assets.ts.
 // Do not edit manually. Or do, I'm a comment, not a cop.
 
-export const version = '4.2.0-next.d70e0650108f'
+export const version = '4.2.0-next.e824a30c434e'
 export const publishDates = {
 	major: '2025-09-18T14:39:22.803Z',
-	minor: '2025-10-20T16:15:04.746Z',
-	patch: '2025-10-20T16:15:04.746Z',
+	minor: '2025-10-27T15:34:35.912Z',
+	patch: '2025-10-27T15:34:35.912Z',
 }

package/src/lib/utils/text/richText.ts

@@ -8,7 +8,6 @@ import {
 } from '@tiptap/core'
 import Code from '@tiptap/extension-code'
 import Highlight from '@tiptap/extension-highlight'
-import Link from '@tiptap/extension-link'
 import { Node } from '@tiptap/pm/model'
 import StarterKit from '@tiptap/starter-kit'
 import {
@@ -35,6 +34,7 @@ export const KeyboardShiftEnterTweakExtension = Extension.create({
 
 // We change the default Code to override what's in the StarterKit.
 // It allows for other attributes/extensions.
+// @ts-ignore this is fine.
 Code.config.excludes = undefined
 
 // We want the highlighting to take precedence over bolding/italics/links
@@ -52,10 +52,10 @@ export const tipTapDefaultExtensions: Extensions = [
 		blockquote: false,
 		codeBlock: false,
 		horizontalRule: false,
-	}),
-	Link.configure({
-		openOnClick: false,
-		autolink: true,
+		link: {
+			openOnClick: false,
+			autolink: true,
+		},
 	}),
 	Highlight,
 	KeyboardShiftEnterTweakExtension,