tldraw Release Notes

What's new

This release adds a consolidated options prop, quick zoom navigation, a fill styles dropdown, a new TldrawUiSelect component, and shape-aware binding checks. It also includes 2D canvas rendering for shape indicators, R-tree spatial indexing, telestrator-style laser behavior, significant performance improvements for large canvases, and various bug fixes.

• 2D canvas rendering for shape indicators (#7708)
• Shape indicators (selection outlines, hover states) now render using a 2D canvas instead of SVG elements. This significantly improves performance when selecting or hovering over many shapes, with up to 25x faster rendering in some scenarios.
• Custom shapes can opt into canvas indicators by implementing the new getIndicatorPath() method on their ShapeUtil, and marking useLegactIndicator to return false:
  • class MyShapeUtil extends ShapeUtil {
    getIndicatorPath(shape: MyShape): TLIndicatorPath | undefined {
    return {
    path: new Path2D(),
    // optional clip path for complex shapes like arrows with labels
    }
    }
    }
    // Return false to use the new canvas indicators (default is true for backwards compatibility)
    useLegacyIndicator(): boolean {
    return false
    }
    }
• Quick zoom navigation (#7801, #7836)
• Press z then hold Shift to zoom out and see the whole canvas ("eagle eye" view). A viewport brush appears showing where you'll zoom to. Move the cursor to pick a location and release Shift to zoom there. Press Escape to cancel and return to the original view.
• Fill styles dropdown (#7885)
• The style panel now exposes additional fill styles (pattern, fill, lined-fill) through a dropdown picker after the solid button. The first three fill options (none, semi, solid) remain as inline buttons.
• User preference: Invert mouse wheel zoom direction (#7732)
• Added a new user preference to invert mouse wheel zoom direction. Some users prefer "natural" scrolling behavior where scrolling down zooms out, which this option now enables.
• Access it via Menu → Preferences → Input device → Invert mouse zoom.
• Performance improvements (#7676, #7826, #7840, #7657)
• This release includes several performance improvements for large canvases:
• R-tree spatial indexing: Shape queries now use an R-tree (RBush) for O(log n) lookups instead of O(n) iteration, significantly improving brushing, scribble selection, and erasing with many shapes on the canvas. The spatial index is maintained internally and accessed through existing methods like editor.getShapesAtPoint() and editor.getShapeAtPoint().
• Faster panning: Hover hit-testing is now skipped during camera movement, reducing work while panning through large documents.
• Reduced allocations: Optimized Set comparisons, reduced memory allocations, and added string hash caching for better performance in large canvases and multiplayer rooms.
• Smarter network scheduling: Solo-mode network traffic is reduced by throttling to 1 FPS when no collaborators are present.
• Re-designed laser pointer (#7681)
• The laser pointer now behaves like a telestrator: all strokes remain visible while you're drawing and fade together when you stop. Previously, each stroke segment would fade independently, creating a trailing effect.
• This is powered by a new generic session system on ScribbleManager. Sessions group multiple scribbles together and control how they fade:

  // Start a grouped session (used internally by the laser tool)
  const sessionId = editor.scribbles.startSession({
    fadeMode: 'grouped',
    idleTimeoutMs: 1200,
    fadeDurationMs: 500,
  })
  // Add scribbles and points to a session
  editor.scribbles.addScribbleToSession(sessionId, { color: 'laser' })
  editor.scribbles.addPointToSession(sessionId, scribbleId, x, y)
  // Stop or clear a session
  editor.scribbles.stopSession(sessionId)
  editor.scribbles.clearSession(sessionId)
  

• New option in TldrawOptions:
  • laserFadeoutMs (default: 500ms) - How long to fade all laser scribbles after the session ends
• Image pipeline starter template (#7863)
• A new "Image pipeline" starter template is available via npx create-tldraw. It provides a visual node-based canvas for building AI image generation workflows, with custom node shapes, typed port connections, pipeline regions with play/stop controls, and a DAG-based execution engine backed by a Cloudflare Worker API.
• Agent starter template improvements (#7640)
• The agent starter template has been restructured around a manager-based architecture for better modularity and extensibility. It now includes a mode system for controlling agent capabilities per mode, action schema registries, prompt part definitions, canvas linting, and user action tracking. The template also renames "SimpleShape" to "FocusedShape" for clarity.
• TldrawUiSelect component (#7566)
• New select dropdown primitive wrapping Radix UI's Select, following existing tldraw UI patterns.
• 🔜 Consolidated options prop (#7888)
• The cameraOptions, textOptions, and deepLinks props on Tldraw, TldrawEditor, and TldrawImage are now consolidated into the options prop. The standalone props are deprecated but still work for backward compatibility.
• // Before
  • <Tldraw cameraOptions={{ isLocked: true }} deepLinks textOptions={{ ... }} />
• // After
  • <Tldraw options={{ camera: { isLocked: true }, deepLinks: true, text: { ... } }} />
• Migration guide
• Replace standalone props with equivalent options fields:
• cameraOptions={...} → options={{ camera: { ... } }}
• textOptions={...} → options={{ text: { ... } }}
• deepLinks or deepLinks={...} → options={{ deepLinks: true }} or options={{ deepLinks: { ... } }}
• The deprecated props still work. When both the deprecated prop and the options field are provided, the options value takes precedence.

API changes

• 🔜 TldrawEditorBaseProps.cameraOptions, TldrawEditorBaseProps.textOptions, TldrawEditorBaseProps.deepLinks deprecated in favor of options.camera, options.text, options.deepLinks. (#7888)
• 🔜 TLShapeUtilCanBindOpts.fromShapeType and toShapeType replaced with fromShape and toShape accepting TLShape | { type }. (#7821)
• Remove editor.spatialIndex from public API. The spatial index is now internal; use editor.getShapesAtPoint() and editor.getShapeAtPoint() for shape queries. (#7699)
• Add TldrawOptions.camera, TldrawOptions.text, and TldrawOptions.deepLinks fields to the options prop. (#7888)
• Add TldrawUiSelect, TldrawUiSelectTrigger, TldrawUiSelectValue, TldrawUiSelectContent, TldrawUiSelectItem components and associated prop types. Add iconTypes export for enumerating available icons. (#7566)
• Add useCanApplySelectionAction() hook for checking if selection actions should be enabled. (#7811)
• Add TLInstance.cameraState: 'idle' | 'moving' for tracking camera movement state. (#7826)
• Add quickZoomPreservesScreenBounds to TldrawOptions. (#7836)
• Add fillExtra to STYLES object for additional fill style options. (#7885)
• Make Editor.getShapeIdsInsideBounds() public. (#7863)
• Add ShapeUtil.getIndicatorPath() method and TLIndicatorPath type for canvas-based indicator rendering. Add ShapeUtil.useLegacyIndicator() to control whether shapes use SVG or canvas indicators. (#7708)
• Add isZoomDirectionInverted to TLUserPreferences interface and UserPreferencesManager.getIsZoomDirectionInverted() method. Add ToggleInvertZoomItem component export and toggle-invert-zoom action. (#7732)
• Add complete to TL_SCRIBBLE_STATES enum and ScribbleManager.complete(id) method for marking scribbles as complete before fading. (#7760)
• Add scribble session system: ScribbleManager.startSession(), stopSession(), clearSession(), extendSession(), isSessionActive(), addScribbleToSession(), addPointToSession(), and ScribbleSessionOptions type. Add LaserTool.getSessionId(). Add laserFadeoutMs to TldrawOptions. (#7681)
• Add FpsScheduler class to create FPS-throttled function queues with configurable target rates. (#7418)

Improvements

• Improve performance in large canvases and multiplayer rooms by optimizing Set comparisons, reducing memory allocations, and caching string hashes. (#7840)
• Improve panning performance in large documents by skipping hover hit-testing during camera movement. (#7826)
• Improve performance when translating arrows together with bound shapes by skipping unnecessary reparenting. (#7733)
• Add R-tree spatial indexing for O(log n) shape queries, improving performance of brushing, selection, and erasing with many shapes. (#7676)
• Improve laser pointer to keep all strokes visible during a session (telestrator pattern), with strokes fading together when drawing stops. (#7681)
• Improve laser pointer strokes with proper taper when lifting the pointer by adding a 'complete' state to the scribble lifecycle. (#7760)
• Improve quick zoom to use zoom-to-fit instead of fixed 5%, add "quick peek" behavior, and add edge scrolling. (#7836)
• Remove core-js polyfill dependency from @tldraw/editor. (#7769)
• Reduce network traffic by squashing pending push requests before sending, so rapid edits result in fewer network calls. (#7724)
• Reduce solo-mode network traffic by using a dedicated FPS-based scheduler that throttles to 1 FPS when no collaborators are present. (#7657)
• Improve performance by separating UI and network scheduling into independent queues with configurable target FPS. (#7418)
• Improve frame label sizing on smaller viewports and when zoomed out. (#7746)
• Add image pipeline starter template with visual node-based AI image generation workflows. (#7863)
• Restructure agent starter template with manager-based architecture and mode system. (#7640)

Bug fixes

• Fix geo shapes with text not being resizable to a smaller size. (#7878)
• Fix shapes exploding when resizing unaligned arrows. (#7855)
• Fix Safari pinch zoom resetting selection to previous shapes. (#7777)
• Fix toggle-lock action firing when no shapes are selected. (#7815)
• Fix menu items (zoom to selection, cut, copy, delete) being enabled when not in select tool. (#7811)
• Fix excessive tab indentation in text shapes (now 2 spaces instead of 8). (#7796)
• Fix canvas-in-front elements (cursors, following indicators) appearing in front of UI panels instead of behind them. (#7865)
• Fix license console message colors for warnings and errors. (#7850)
• Fix asset resolution being delayed by 500ms when updating an image shape's asset. (#7612)
• Fix Durable Object SQLite migration in the multiplayer Cloudflare template. (#7829, #7832, #7834, #7835)
• Fix zoomToFit and getCurrentPageBounds to ignore hidden shapes when computing bounds. (#7770)
• Fix collaborator shape indicators not rendering after the canvas indicator change. (#7759)
• Fix rich text content not updating correctly with message squashing due to reference comparison. (#7758)
• Fix keyboard shortcut menu item labels to use consistent ellipsis formatting. (#7757)
• Fix spatial index not removing shapes when moved to a different page. (#7700)
• Fix tldraw failing to load in CJS environments (tsx, ts-node, Jest) due to ESM-only rbush dependency. (#7905)

Original source Report a problem

Release Notes

Note

Low Risk

Cosmetic logging-only changes in license diagnostics; no impact on license validation, state, or data handling.

Overview

Fixes LicenseManager verbose console output so warning vs error messages are visually distinct and consistent.
outputDelimiter now takes the message type to match delimiter background color, and message text styling is standardized to white text with an orange/crimson background instead of varying foreground colors.
Written by Cursor Bugbot for commit faf3005. This will update automatically on new commits. Configure here.
Describe what your pull request does. If you can, add GIFs or images showing the before and after of your change.

improvement(editor): make license flags message a warning (#6843)

license: make the flags msg a warning

docs: improve code snippets, safe areas, and case study images (#6697)

Improved documentation site with copy buttons, optimized images, and layout fixes.

fix(editor): resolve expired internal license logic (#6665)

Fix a bug with expired internal license check.

docs: update license page language (#6668)

Updated the license page with current language.

fix(sync-core): resolve potential race condition in TLSyncClient (#6652)

Fixed a potential issue in TLSyncClient.

feat(editor): add missing shapeutil callbacks (#6634)

Add missing shapeutil callbacks.

fix(ui): memoize asset urls merging (#6605)

Fixed a bug where the editor would remount in a loop if given custom assetUrls.

fix(analytics): remove redundant initial page view tracking (#6601)

Improved analytics tracking by removing redundant page view events

docs: clarify third-party backend documentation (#6570)

Clarified documentation regarding third-party backends.

fix(sync-core): room change listeners (#6552)

Fixed an issue with room change listeners in sync-core

🐛 Bug Fix

docs: update license page language #6668 (@sylwiavargas)
docs: clarify third-party backend documentation #6570 (@sylwiavargas @steveruizok)
@tldraw/editor
license: fix console message colors for warnings/errors (#7850) #7884 (@mimecuvalo)
docs: improve code snippets, safe areas, and case study images #6697 (@SomeHats)
⚠️ Pushed to v3.15.x
@tldraw/ai, @tldraw/assets, create-tldraw, @tldraw/editor, @tldraw/tldraw, @tldraw/state-react, @tldraw/state, @tldraw/store, @tldraw/sync-core, @tldraw/sync, tldraw, @tldraw/tlschema, @tldraw/utils, @tldraw/validate
v3.15.0 (@huppy-bot[bot])
🐛 Bug Fixes
fix(analytics): remove redundant initial page view tracking #6601 (@MitjaBezensek)
@tldraw/editor
fix(editor): resolve expired internal license logic #6665 (@MitjaBezensek)
@tldraw/sync-core
fix(sync-core): resolve potential race condition in TLSyncClient #6652 (@ds300)
fix(sync-core): room change listeners #6552 (@mootari @ds300)
tldraw
fix(ui): memoize asset urls merging #6605 (@ds300)

💄 Product Improvements

@tldraw/editor
improvement(editor): make license flags message a warning #6843 (@mimecuvalo)

🎉 New Features

@tldraw/editor, tldraw
feat(editor): add missing shapeutil callbacks #6634 (@SomeHats @ds300)

Authors: 8

@huppy-bot[bot]
alex (@SomeHats)
David Sheldrick (@ds300)
Fabian Iwand (@mootari)
Mime Čuvalo (@mimecuvalo)
Mitja Bezenšek (@MitjaBezensek)
Steve Ruiz (@steveruizok)
Sylwia Vargas (@sylwiavargas)

Original source Report a problem

This release

This release introduces several significant changes: a new pattern for defining custom shape/binding typings, pluggable storage for TLSocketRoom with a new SQLite option, reactive editor.inputs, and optimized draw shape encoding. It also adds various other API improvements, performance optimizations, and bug fixes, including better support for React 19.

New pattern for defining custom shape/binding types (breaking change) (#7091)

We've improved the developer experience of working with custom shape and binding types. There's now less boilerplate and fewer gotchas when using tldraw APIs in a type-safe manner.

This is a minor breaking change at the type level—your code will still run, but you'll get TypeScript errors until you migrate.

Migration guide

When declaring types for custom shapes, you can now use TypeScript's module augmentation feature to provide more specific types for the custom shape.

Before:

import { TLBaseShape } from 'tldraw'
// Shapes were defined by using the helper TLBaseShape type
type MyShape = TLBaseShape<'my-shape', { w: number; h: number; text: string }&gt;

After:

import { TLShape } from 'tldraw'
const MY_SHAPE = 'my-shape'
// We now use TypeScript's module augmentation feature to allow
// extending the builtin TLShape type.
declare module 'tldraw' {
  export interface TLGlobalShapePropsMap {
    [MY_SHAPE]: { w: number; h: number; text: string }
  }
}
type MyShape = TLShape<typeof MY_SHAPE>

The benefit of this new system is that Editor APIs such as createShape now know about your custom shapes automatically:
// Just works - TypeScript validates props and provides autocomplete
editor.createShape({ type: 'my-shape', props: { w: 100, h: 100, text: 'Hello' } })
// Will cause a TypeScript error for text
editor.createShape({ type: 'my-shape', props: { w: 100, h: 100, text: 123 } })

The same pattern applies to custom bindings. See the Custom Shapes Guide and the Pin Bindings example for details.
(contributed by @Andarist)

Pluggable storage for TLSocketRoom + SQLite support (#7320, #7123)

We've refactored the TLSocketRoom API to support a pluggable storage layer. We're providing two implementations:

• SQLiteSyncStorage – Automatically persists room state to SQLite. Recommended for production.
• InMemorySyncStorage – Keeps state in memory with manual persistence via callbacks (previous built-in behavior).

We recommend switching to SQLiteSyncStorage if your environment supports SQLite (Cloudflare Durable Objects, Node.js, Bun, Deno). It provides automatic persistence, lower memory usage, and faster startup times.

Why SQLite?

• Automatic persistence: Data survives process restarts without manual snapshot handling
• Lower memory usage: No need to keep entire documents in memory
• Faster startup: No need to load the document into memory before accepting socket connections
• Simpler code: No more onChange callbacks and manual persistence logic

Platform support

• Platform
• Wrapper
• SQLite Library
• Cloudflare Durable Objects
• DurableObjectSqliteSyncWrapper
• Built-in ctx.storage
• Node.js/Deno
• NodeSqliteWrapper
• better-sqlite3 or node:sqlite

See the Cloudflare template and the Node server example respectively. Bun support should be straightforward to add.

Migration guide

Existing code continues to work, however we have deprecated the following TLSocketRoom options:
initialSnapshot
onDataChange

These are replaced by the new storage option. We've also deprecated the TLSocketRoom.updateStore method, which has been supplanted by storage.transaction.

Before:

const existingSnapshot = loadExistingSnapshot()
const room = new TLSocketRoom({
  initialSnapshot: existingSnapshot,
  onDataChange: () => {
    persistSnapshot(room.getCurrentSnapshot())
  },
})

If you want to keep the same behavior with in-memory document storage and manual persistence:

import { InMemorySyncStorage, TLSocketRoom } from '@tldraw/sync-core'
const room = new TLSocketRoom({
  storage: new InMemorySyncStorage({
    snapshot: existingSnapshot,
    onChange() {
      saveToDatabase(storage.getSnapshot())
    },
  }),
})

However, we recommend switching to SQLite. Users of our Cloudflare template should follow the migration guide on the sync docs page.

If you're using TLSocketRoom on Node, creating the room should end up looking something like this:

import Database from 'better-sqlite3'
import { SQLiteSyncStorage, NodeSqliteWrapper, TLSocketRoom, RoomSnapshot } from '@tldraw/sync-core'
async function createRoom(roomId: string) {
  const db = new Database(`path/to/${roomId}.db`)
  const sql = new NodeSqliteWrapper(db)
  let snapshot: RoomSnapshot | undefined = undefined
  if (!SQLiteSyncStorage.hasBeenInitialized(sql)) {
    // This db hasn't been used before, so if it's a pre-existing
    // document, load the legacy room snapshot
    snapshot = await loadExistingSnapshot()
  }
  const storage = new SQLiteSyncStorage({ sql, snapshot })
  return new TLSocketRoom({
    storage,
    onSessionRemoved(room, args) {
      if (args.numSessionsRemaining === 0) {
        room.close()
        db.close()
      }
    },
  })
}

Optimized draw shape encoding (#7364, #7710)

Draw and highlight shape point data is now stored using a compact delta-encoded binary format instead of JSON arrays. This reduces storage size by approximately 80% while preserving stroke fidelity.

Breaking change details

If you were reading or writing draw shape data programatically you might need to update your code to use the new format.

• TLDrawShapeSegment.points renamed to .path and changed from VecModel[] to string (base64-encoded)
• Added scaleX and scaleY properties to draw and highlight shapes
• New exports: b64Vecs encoding utilities, e.g. getPointsFromDrawSegment helper. Use this if you need to manually read/write point data.
• Existing documents are automatically migrated.

Reactive inputs (#7312)

Refactored editor.inputs to use reactive atoms via the new InputsManager class. All input state is now accessed via getter methods (e.g., editor.inputs.getCurrentPagePoint(), editor.inputs.getShiftKey()). Direct property access is deprecated but still supported for backwards compatibility.

API changes

• 💥 DefaultTopPanel export removed from tldraw. The top panel component for displaying the offline indicator is now handled internally by PeopleMenu. (#7568)
• 💥 TextDirection export removed from tldraw. Use TipTap's native TextDirection extension instead. The richTextValidator now includes an optional attrs property - a migration may be necessary for older clients/custom shapes. (#7304)
• Add tlenvReactive atom to @tldraw/editor for reactive environment state tracking, including coarse pointer detection that updates when users switch between mouse and touch input. (#7296)
• Add hideAllTooltips() helper function for programmatically dismissing tooltips. (#7288)
• Add zoomToFitPadding option to TldrawOptions to customize the default padding used by zoom-to-fit operations. (#7602)
• Add snapThreshold option to TldrawOptions for configuring the snap distance, defaulting to 8 screen pixels. (#7543)
• Add resizeChildren configuration option to FrameShapeUtil to allow frame children to be resized proportionally when the frame is resized. (#7526)
• Add Editor.canEditShape() and Editor.canCropShape() methods to centralize shape permission checks. Add ShapeUtil.canEditWhileLocked() for shapes that remain editable when locked. (#7361)
• Add editor.getDebouncedZoomLevel() and editor.getEfficientZoomLevel() methods for improved zoom performance on dense canvases. Add debouncedZoom and debouncedZoomThreshold options. (#7235)
• Add configurable showTextOutline option to TextShapeUtil, ArrowShapeUtil, and GeoShapeUtil via .configure() pattern. (#7314)
• Export freehand stroke utilities: getStroke, getStrokeOutlinePoints, and setStrokePointRadii. (#7400) (contributed by @VimHax)
• Add Box.isValid() method to check for finite coordinates. (#7532)
• Add spacebarPanning option to control whether spacebar activates pan mode. (#7312)
• Introduce pluggable TLSyncStorage API for TLSocketRoom. The initialSnapshot and onDataChange options are now deprecated in favor of the new storage option. (#7123)
• Export DefaultLabelColorStyle which is necessary for rich text in custom shapes. (#7114)

Improvements

• Improve coarse pointer detection by replacing CSS media queries with a reactive data-coarse attribute that updates when users switch between mouse and touch input. (#7404)
• Add CSS containment to main toolbar and text measurement element for improved rendering performance. (#7406) (#7407)
• Improve cross-realm support by scoping canvas event listeners to the editor container's ownerDocument. (#7113)
• Simplify ImmutableMap implementation for better code clarity. (#7431)
• Improve code readability in number validator by using Number.isFinite() instead of arithmetic trick. (#7374)
• Upgrade to React 19 with all necessary type and configuration changes for compatibility. (#7317)
• Improve signal graph traversal performance by eliminating per-recursion closure allocations. (#7430)
• Optimize object utility functions. (#7432)
• Use in-place sorting in parentsToChildren derivation. (#7433)
• Optimize notVisibleShapes derivation with inlined bounds checks. (#7429)
• Cache label size measurements with WeakCache for improved geo shape performance. (#7412)
• Optimize validators with fast paths and production inlining. (#7373)

Bug fixes

• Fix migrations for draw and highlight shapes to be idempotent, preventing errors when migrations run multiple times. (#7389)
• Fix dot detection in draw and highlight shapes after the point compression change. (#7365)
• Fix clicking a shape's text label while editing to re-focus the input and select all text. (#7342)
• Fix pasting at cursor to correctly account for frames and parent containers. (#7277)
• Fix editing mode to exit when dragging causes the text input to blur. (#7291)
• Fix CommonJS build issues with TipTap imports in rich text module. (#7282)
• Fix iOS automatically zooming in on input fields by ensuring 16px minimum font size. (#7118)
• Fix distanceToLineSegment returning squared distance instead of actual distance, causing hit testing (eraser, scribble select) to be too strict. (#7610) (contributed by @arpit-goblins)
• Fix zoomToSelection to toggle between 100% zoom and zoom-to-fit behavior. (#7536)
• Fix export of SVG markers by handling fragment-only URLs correctly. (#7506) (contributed by @PidgeyBE)
• Restore wheel and pinch canvas event emission. (#6834) (contributed by @swdev33)
• Fix context menu submenu flickering when hovered. (#6837) (contributed by @swdev33)
• Fix rotated shape positions not being restored after flipping twice. (#7359)
• Fix keyboard shortcuts and clipboard events not working when hideUi is true. (#7367)
• Fix elbow arrows routing incorrectly when using dynamic sizing at high zoom levels. (#7424)
• Allow fullscreen for embed shapes. (#7417)
• Move mobile rotate handle to bottom for image and video shapes to accommodate the contextual toolbar. (#6727)
• Fix dropdown menu items incorrectly displaying an icon on the right side. (#7533)
• Fix zoom menu showing debounced zoom level for canvases with many shapes. (#7626)
• Fix extra line appearing after bullet and ordered lists in text shapes. (#7643) (contributed by @sahiee-dev)
• Fix "Back to content" button not appearing when selected shapes are off-screen. (#7649)
• Fix dotted freehand lines becoming invisible at minimum zoom on Chrome. (#7650)
• Fix menu bar stretching to full width on mobile viewports instead of fitting content. (#7568)

Original source Report a problem

Welcome to tldraw v4.2.0!

This is a minor maintenance release that includes many bug fixes and small API additions, along with a major version bump of our TipTap rich text editor.

TipTap v3 (#5717)

We've upgraded TipTap from v2 to v3. If you've done any customization to our standard TipTap kit, please refer to TipTap's Guide How to upgrade Tiptap v2 to v3 as to any breaking changes you might experience from a custom homebrew of the rich text editor in tldraw.

API Changes

• Add Editor.setTool/Editor.removeTool for dynamically altering the editor's tool state chart. (#6909) (#7134)
• Allow using custom socket implementations with useSync via a new connect option (#6859) (thanks to @Digital39999 for help on this one)
• Support store queries on nested properties, e.g. props (#6981)
• Add createBookmarkFromUrl helper function for creating bookmark shapes more easily. (#6894)
• Allow handles to specify a custom reference point for shift-modifier angle snapping (#6987) (contributed by @naaa760)
• Add a 'secret' lined-fill style similar to the full-fill style but with visible outlines. Users can select it by pressing Option+Shift+F. (#7034)
• Add option to pass callback to onInteractionEnd (#6919)
• Add allowReferrer option to window opening functions (#7004)
• Remove broken/defunct Excalidraw embed definition. Existing Excalidraw embed shapes will remain but render as bookmarks. (#6897)

Improvements

• Use window.prompt for renaming frames on mobile (#6838)
• Add string append optimization to sync protocol (#7007) (contributed by @quasor)

Bug Fixes

• Fix Replit embed URL handling (#6892)
• Fix accessibility issue that caused a misleading warning in the console (#6904)
• Fix convert-to-bookmark action (#6894)
• Fix pointer handling for dropdown menus in InFrontOfTheCanvas (#7021)
• Fixed a bug with iOS image uploads on Safari (#7037)
• Ignore alt+tab on Windows to avoid conflicting with the window manager (#7005)
• Fix text focus issue (#7043)
• Allow using TldrawEditor without needing TldrawUiContextProvider (#7053)
• Fix clipboard functionality for cross-realm apps (#7026)
• Fix broken ink on iOS by disabling coalesced events (#6917)
• Fix dragging behavior when menu is open (#6918)

Original source Report a problem

Generated from commits between v4.1.1 and v4.1.2

Bug Fixes

• Move InFrontOfTheCanvas back out (#7021)

  In 4.0 we moved the InFrontOfTheCanvas component to be a child of the .tl-canvas element, to help constrain the former's size. Unfortunately this broke some subtle interactions involving menus and scrolling, so we have reverted the change. From now on, if you need to constrain the size to match custom styling applied to the .tl-canvas element, you can apply the same styling to the .tl-canvas__in-front element.

Original source Report a problem