tldraw Release Notes

This release is a broad reliability pass over the SDK. Shapes keep changes made by other commands while they are being dragged, resized, rotated, or cropped; touch gestures no longer stick when the browser cancels a pointer; selection, draw, line, note, frame, and arrow interactions survive shapes being deleted or locked mid-interaction; SVG exports embed every resource they reference; and there are fixes across the store, signals, sync, and local persistence. Rich text gets smart typography and wraps a selection in the bracket or quote you type, pasting a link onto a selected shape sets its link, and the note shape's attribution badge can be hidden or replaced. tldraw now re-exports TipTap's extension API, so custom rich text extensions no longer need their own @tiptap/* install, and Editor.setCamera rejects non-finite values instead of quietly coercing them.

What's new

Smart typography in rich text (#10767)

Text typed on the canvas now reads like typeset text. Straight quotes curl, -- becomes an em dash, ... an ellipsis, and -> an arrow. Pressing Backspace straight after a rewrite restores what you typed. The rules are TipTap's Typography extension, added as a standalone entry in getTipTapDefaultExtensions(), so filter it out to keep literal punctuation. …

This release adds a center operation to Editor.alignShapes, a tleditors registry of mounted editors, iterateGraphemes to @tldraw/utils, and two new reactive methods on AtomMap. It also deprecates useViewportHeight, speeds up the signals and store layers, and lands a broad reliability pass across the SDK, with over a hundred fixes to undo history, selection and tool interactions, cropping, arrows, the signals and store layers, sync, and local persistence.

API changes

• 🔜 useViewportHeight() is deprecated. Read window.visualViewport directly instead. The hook returns only the visible viewport's bottom edge, and keeping a panel clear of the software keyboard generally needs the whole visible rectangle. (#9826)

• Add 'center' as an Editor.alignShapes operation. It applies the existing 'center-horizontal' and 'center-vertical' operations together, so shapes center on both axes in one command. (#9074)

• Add tleditors, a reactive global registry of currently mounted editors. Use it to reach live editors from outside the React tree, for example from sidebar chrome or a keyboard shortcut handler. (#9904)

  import { tleditors, useValue } from 'tldraw'
  
  const mounted = useValue('mounted editors', () => tleditors.getMounted(), [])
  ``` …
  

Generated from commits between v5.3.1 and HEAD

Bug Fixes

License fixes and product metadata (#10062)

• Added product metadata to all our package.json files to make licensing clearer between packages.
• Fixed default UI components (such as DefaultToolbar and DefaultQuickActionsContent) crashing when mounted outside the Tldraw component.
• Fixed license validation treating native apps served from custom protocols as development environments.
• Fixed wildcard license host matching so *.example.com matches only that domain's subdomains.
• Added internal useMaybeLicenseManager(): the license manager from context, falling back to the nearest editor's, or null.
• Added internal Editor.licenseManager, assigned by <TldrawEditor /> when it creates the editor.
• Changed internal useLicenseFeatureFlag to accept LicenseManager | null and return false for null.

This release adds commenting: a set of new packages for anchored comment threads on the canvas, backed by comment records in the schema and sync support for non-document data. Commenting is the first piece of our new collaboration package, a separately licensed section of the SDK for premium collaboration features. The release also adds flipping for geo shapes, snapping and symmetric resizing while cropping images, an assets prop for TldrawImage, and a reactive Editor.getIsMounted() with a new unmount event. Viewport culling is faster on large pages, and there's a batch of fixes for crashes and interaction bugs across arrows, groups, and text.

What's new

Commenting (#9471, #9782, #9850)

Comments are now a first-class primitive in the SDK. @tldraw/commenting ships a batteries-included canvas comments layer: threads anchor to a point, a shape (precisely or imprecisely), a text range, a region, or the page. You can reply, edit, react, resolve, and delete comments. The pins drag to re-anchor, and ?comment=<id> deep links open a thread and bring the camera to its pin. Comment pins cluster together as you zoom out and separate back out as you zoom in. …