tldraw 5.3.0 → 5.3.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/DOCS.md CHANGED
@@ -1,6 +1,6 @@
1
1
  # tldraw Documentation
2
2
 
3
- Version: `5.3.0`
3
+ Version: `5.3.2`
4
4
 
5
5
  This file is generated during package publishing from the tldraw docs content for this exact package version.
6
6
 
@@ -383,6 +383,7 @@ We ship an experimental `tldraw-migrate` agent skill that helps a coding agent u
383
383
 
384
384
  #### v5.x
385
385
 
386
+ - [v5.3](https://tldraw.dev/releases/v5.3.0) - Commenting with anchored threads on the canvas, new collaboration packages, geo shape flipping, crop snapping, and faster viewport culling
386
387
  - [v5.2](https://tldraw.dev/releases/v5.2.0) - Faster freehand ink, a frame selection action, SDK-wide performance improvements, and breaking changes to the collaborator user-id types and Node support
387
388
  - [v5.1](https://tldraw.dev/releases/v5.1.0) - Page menu redesign, copy-styles shortcut, selectable locked shapes, public translation APIs, and performance improvements
388
389
  - [v5.0](https://tldraw.dev/releases/v5.0.0) - Custom themes, overlays, performance, extensiblity, and attribution
@@ -16960,11 +16961,14 @@ Ungrouping reverses this process by moving the group's children back to the grou
16960
16961
 
16961
16962
  ##### Alignment
16962
16963
 
16963
- Alignment moves shapes so they share a common edge or center line. The editor supports six alignment operations: left, right, top, bottom, center-horizontal, and center-vertical. When aligning shapes, the editor first calculates the common bounding box of all selected shapes, then moves each shape to align with the appropriate edge or center of that common box.
16964
+ Alignment moves shapes so they share a common edge or center line. The six single-axis operations are `left`, `right`, `top`, `bottom`, `center-horizontal`, and `center-vertical`. Use `center` to align shapes by both their horizontal and vertical centers in one call.
16965
+
16966
+ When aligning shapes, the editor first calculates the common bounding box of all selected shapes. It then moves each shape to the appropriate edge or center of that common box.
16964
16967
 
16965
16968
  ```typescript
16966
16969
  editor.alignShapes(editor.getSelectedShapeIds(), 'left')
16967
16970
  editor.alignShapes([box1, box2], 'center-vertical')
16971
+ editor.alignShapes([box1, box2], 'center')
16968
16972
  ```
16969
16973
 
16970
16974
  Selected shapes connected by arrow bindings move together as a cluster during alignment. If shapes A and B are connected by an arrow and you align them with shape C, A and B move together as a single unit.
package/RELEASE_NOTES.md CHANGED
@@ -1,27 +1,107 @@
1
1
  # Releases
2
2
 
3
- Version: `5.3.0`
3
+ Version: `5.3.2`
4
4
 
5
5
  This file is generated during package publishing from the tldraw release notes content for this exact package version.
6
6
 
7
+ ## v5.3.2
8
+
9
+ This release adds a `center` operation to `Editor.alignShapes`, `iterateGraphemes` to `@tldraw/utils`, and two new reactive methods on `AtomMap`. It also deprecates `useViewportHeight`, speeds up the signals and store layers, and fixes a batch of crashes and interaction bugs across dialogs, sync reconnection, undo, and keyboard shortcut tooltips.
10
+
11
+ ### API changes
12
+
13
+ - 🔜 **`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](https://github.com/tldraw/tldraw/pull/9826))
14
+ - 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](https://github.com/tldraw/tldraw/pull/9074))
15
+ - Add `getOrInsert(key, defaultValue)` and `getOrInsertComputed(key, callback)` to `AtomMap`, matching the `Map` methods added in newer JavaScript runtimes. Both are reactive, and the callback only runs when the key is absent. ([#9752](https://github.com/tldraw/tldraw/pull/9752))
16
+ - Add `isPage(record)` to `@tldraw/tlschema`, a type guard that narrows an unknown record to `TLPage`. ([#9774](https://github.com/tldraw/tldraw/pull/9774))
17
+ - Add `iterateGraphemes(str)` to `@tldraw/utils`. It iterates a string's grapheme clusters, using `Intl.Segmenter` when it's available and falling back to code-point iteration when it isn't. ([#9896](https://github.com/tldraw/tldraw/pull/9896))
18
+ - Add `isPage(record)` to `@tldraw/tlschema`, a type guard for page records that matches the guards already exported for the other record types. ([#9774](https://github.com/tldraw/tldraw/pull/9774))
19
+
20
+ ### Improvements
21
+
22
+ - Reduce per-pointer-event allocations in `Group2d` and `Editor` hit-testing. ([#8600](https://github.com/tldraw/tldraw/pull/8600))
23
+ - Speed up signal reads in `@tldraw/state`. Capturing a parent used to scan the capturing signal's parent set twice, once to check for the parent and again to add it. ([#9690](https://github.com/tldraw/tldraw/pull/9690))
24
+ - Reduce the work and allocations in `@tldraw/store` history bookkeeping, so squashing record diffs and filtering query history no longer build intermediate copies on every tick. ([#9689](https://github.com/tldraw/tldraw/pull/9689), [#9869](https://github.com/tldraw/tldraw/pull/9869))
25
+
26
+ ### Bug fixes
27
+
28
+ - Fix the editor failing to load on older browsers that lack `Intl.Segmenter`, such as Firefox before 125. ([#9896](https://github.com/tldraw/tldraw/pull/9896))
29
+ - Fix a crash when computing a frame's geometry if its heading text couldn't be measured yet. ([#9496](https://github.com/tldraw/tldraw/pull/9496))
30
+ - Fix undo after a cut also reverting the change made before it. ([#9920](https://github.com/tldraw/tldraw/pull/9920))
31
+ - Fix modifier keys (Shift, Alt, Ctrl, Cmd) briefly being treated as held at the start of a new click or drag right after being released, which could momentarily affect snapping and other modifier-dependent behavior. ([#9523](https://github.com/tldraw/tldraw/pull/9523))
32
+ - Fix **Flatten to image** producing different groupings depending on selection order, and not merging clusters that were only connected through a bridging shape. ([#8661](https://github.com/tldraw/tldraw/pull/8661))
33
+ - Fix pasted links showing a broken preview image when the linked page has no Open Graph image. ([#9909](https://github.com/tldraw/tldraw/pull/9909))
34
+ - Fix video shapes showing a floating spinner with no bounding box while their asset uploads or loads. They now show the same loading plate as image shapes. ([#9994](https://github.com/tldraw/tldraw/pull/9994))
35
+ - Fix closing a stacked dialog by touch also closing the dialog beneath it. ([#10002](https://github.com/tldraw/tldraw/pull/10002))
36
+ - Fix wheel event normalization passing through non-finite delta values. ([#9586](https://github.com/tldraw/tldraw/pull/9586))
37
+ - Fix the counterclockwise rotation tooltip not showing its comma key. ([#9772](https://github.com/tldraw/tldraw/pull/9772))
38
+ - Fix the spacing around the cursor chat item in the context menu. ([#9921](https://github.com/tldraw/tldraw/pull/9921))
39
+ - Fix the people menu's collaborator rows not lining up with your own row above them: the follow icon sat too close to the right edge, and collaborator names sat slightly left of your own. ([#9900](https://github.com/tldraw/tldraw/pull/9900))
40
+ - Fix the comment thread popover briefly rendering with a doubled shadow the first time a thread is opened. ([#9886](https://github.com/tldraw/tldraw/pull/9886))
41
+ - Fix background tabs repeatedly dropping and re-establishing their sync connection when the browser throttles timers. ([#9964](https://github.com/tldraw/tldraw/pull/9964))
42
+ - Fix video shapes showing a floating spinner with no bounding box while the video asset uploads or loads. They now show the same loading plate as image shapes. ([#9994](https://github.com/tldraw/tldraw/pull/9994))
43
+
7
44
  ## v5.3.0
8
45
 
9
- This release adds snapping and symmetric resizing while cropping images, a reactive `Editor.getIsMounted()` with a new `unmount` event, and faster viewport culling on large pages. It also fixes a batch of crashes and interaction bugs across arrows, groups, and text.
46
+ [View on GitHub](https://github.com/tldraw/tldraw/releases/tag/v5.3.0)
47
+
48
+ 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.
10
49
 
11
50
  ### What's new
12
51
 
13
- #### Snapping and symmetric resize while cropping ([#9424](https://github.com/tldraw/tldraw/pull/9424))
52
+ #### Commenting ([#9471](https://github.com/tldraw/tldraw/pull/9471), [#9782](https://github.com/tldraw/tldraw/pull/9782), [#9850](https://github.com/tldraw/tldraw/pull/9850))
53
+
54
+ 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.
55
+
56
+ Comment records live in `@tldraw/tlschema` as `TLCommentThread`, `TLComment`, and `TLCommentReaction`, and sync over a new generic object store in `@tldraw/sync-core`, so they ride alongside the document rather than inside it. On the server, `@tldraw/sync-collaboration` enforces write authorization, with a `canModifyComment` rule that lets a host widen the default owner-only permission. That way a workspace admin can moderate comments they don't own without granting anything beyond edit, delete, and resolve.
57
+
58
+ One rollout note: the comment record types ship with guard migrations, so once your server registers them, clients on an older SDK are rejected as too old and prompted to refresh. Roll out the upgraded client before or alongside the server change.
59
+
60
+ The layer is built to be taken apart. `ThreadRow` and `ThreadActions` are component slots, `CommentListItem` and `sortSidebarRows` are exported so a hand-built list can match the built-in one, and a host that supplies `getThreadHref` gets copy-link in the thread menu. On phones, the composer and the open thread stay above the software keyboard.
14
61
 
15
- When cropping an image, crop edges now snap to other shapes and the grid, with the usual snapping guidelines. Holding option resizes the crop region symmetrically from its center.
62
+ <details>
63
+ <summary>New packages</summary>
64
+
65
+ | Package | What it provides |
66
+ | ---------------------------- | ------------------------------------------------------------------------ |
67
+ | `@tldraw/commenting` | Canvas comments layer, comment UI components, and the comment tool |
68
+ | `@tldraw/mentions` | @-mention picker and TipTap node, shared by comments and shape rich text |
69
+ | `@tldraw/collaboration` | Umbrella package for the collaboration pieces |
70
+ | `@tldraw/sync-collaboration` | Server-side write authorization for collaboration features |
71
+
72
+ </details>
73
+
74
+ See the [commenting docs](https://tldraw.dev/docs/commenting) for setup.
16
75
 
17
76
  ### API changes
18
77
 
78
+ - 💥 Remove `usePassThroughMouseOverEvents` from `@tldraw/editor`. It re-dispatched `mouseover` at `.tl-canvas` so shapes under a floating panel stayed hovered, but the canvas only wires `onPointerEnter`, so the re-dispatched event arrived at an element with no listener for it. ([#9782](https://github.com/tldraw/tldraw/pull/9782))
79
+ - Add `TLCommentThread`, `TLComment`, and `TLCommentReaction` records to `@tldraw/tlschema`, with `createCommentThread` and `createComment` helpers, id helpers, validators, and `commentSchemaRecords` for registering them. ([#9471](https://github.com/tldraw/tldraw/pull/9471), [#9782](https://github.com/tldraw/tldraw/pull/9782))
80
+ - Add a generic object store to `@tldraw/sync-core` for syncing non-document records: `objectTypes` on the room and storage constructors, per-session `TLObjectStoreAccess`, `getObjectsSnapshot()`, `onCommittedChanges`, and an optional `TLSyncStorage.getObjectsByIds(ids)` for callers that need a few object-lane records rather than the whole lane. ([#9471](https://github.com/tldraw/tldraw/pull/9471), [#9782](https://github.com/tldraw/tldraw/pull/9782))
81
+ - Add `objectAccess` to the `synced-remote` member of `RemoteTLStoreWithStatus`, so a store from `useSync` reports whether the session can write object-lane records such as comments. If you construct that type yourself, in test mocks for example, you now need to supply `objectAccess`. ([#9471](https://github.com/tldraw/tldraw/pull/9471))
82
+ - Add `EditorPortal`, `EditorPortalProps`, and `useEditorPortalHost` to `@tldraw/editor`, for portalling canvas-anchored content into a host the editor renders last so its DOM order doesn't depend on mount timing. ([#9782](https://github.com/tldraw/tldraw/pull/9782))
83
+ - Add `renderHtmlFromRichTextWithExtensions(richText, extensions)` for rendering rich text outside a shape's editor config. `renderHtmlFromRichText` now fills _every_ empty paragraph with a `<br />` and keeps the paragraph's attributes, so an empty paragraph renders as `<p dir="auto"><br /></p>` — worth knowing if you snapshot that output. ([#9782](https://github.com/tldraw/tldraw/pull/9782))
84
+ - Add `flipX` and `flipY` to `TLGeoShapeProps`, with an `AddFlipProps` migration defaulting both to `false`, and add `PathBuilder.transform(mat)` for producing a transformed copy of a path. ([#9530](https://github.com/tldraw/tldraw/pull/9530))
85
+ - Add an optional `sizeToContentAspectRatio` to `EmbedDefinition` and a public `EmbedShapeUtil.resolveAspectRatio(shape)`. When set, an embed corrects its size after creation to its content's real aspect ratio, resolved from the URL's OpenGraph metadata via the editor's url asset handler. Existing custom embed definitions are unaffected. ([#9613](https://github.com/tldraw/tldraw/pull/9613))
86
+ - Add `ExportAsMenuGroup`, mirroring `CopyAsMenuGroup`, for the "Export as" submenu. ([#9589](https://github.com/tldraw/tldraw/pull/9589))
87
+ - Add `EditorManager`, a public abstract base class for editor managers that own a subscription or resource, so they share one teardown contract. `InputsManager`, `TickManager`, `FocusManager`, and `TextManager` now extend it. ([#9204](https://github.com/tldraw/tldraw/pull/9204))
88
+ - Populate `TLBaseExternalContent.sources` for file pastes, where it was previously always undefined, so custom `files` handlers and `onBeforePasteFromClipboard` can inspect the text, HTML, and url content that came alongside the files. ([#9763](https://github.com/tldraw/tldraw/pull/9763))
89
+ - Add an `assets` prop to `TldrawImage`, so a snapshot's images render from a custom asset store the same way they do in `Tldraw`. Previously `TldrawImage` always used the inline base64 asset store, so images kept anywhere else were missing. ([#9697](https://github.com/tldraw/tldraw/pull/9697)) (based on an implementation by [@jon-dez](https://github.com/jon-dez))
90
+
91
+ ```tsx
92
+ <TldrawImage snapshot={snapshot} assets={assetStore} />
93
+ ```
94
+
19
95
  - Add an `unmount` event to `TLEventMap` and make `Editor.getIsMounted()` a reactive value that tracks whether the editor's component is currently mounted. ([#9472](https://github.com/tldraw/tldraw/pull/9472), [#9483](https://github.com/tldraw/tldraw/pull/9483))
20
96
  - Make the shape hit-test margin pointer-aware and add a `coarseHitTestMargin` option: fine pointers (mouse and trackpad) use a tighter 3px default, coarse pointers (touch and pen) use 4px. ([#9492](https://github.com/tldraw/tldraw/pull/9492))
21
- - Add a `ShapeUtil.onDuplicate(source, duplicate)` callback, invoked by `Editor.duplicateShapes` and `Editor.putContentOntoCurrentPage`, letting a shape adjust its props when it is copied. Sticky notes now use it to attribute duplicated or pasted text to the current user instead of carrying over the original author. ([#9566](https://github.com/tldraw/tldraw/pull/9566))
97
+ - Add a `ShapeUtil.onDuplicate(source, duplicate)` callback, invoked by `Editor.duplicateShapes` and `Editor.putContentOntoCurrentPage`, so a shape can adjust its props when it is copied. Sticky notes now use it to attribute duplicated or pasted text to the current user instead of carrying over the original author. ([#9566](https://github.com/tldraw/tldraw/pull/9566))
22
98
 
23
99
  ### Improvements
24
100
 
101
+ - Geo shapes now flip. Previously flipping a selection left directional shapes such as the rhombus, trapezoid, and arrow geo shapes looking exactly the same on the other side of the mirror. `TLGeoShape` gains `flipX` and `flipY` props, matching the image shape, and a flip mirrors the shape's generated path. Geometry, hit-testing, the selection indicator, the canvas render, and SVG export all read from that path, so they stay in agreement. ([#9530](https://github.com/tldraw/tldraw/pull/9530))
102
+ - When cropping an image, crop edges now snap to other shapes and the grid, with the usual snapping guidelines. Holding Alt resizes the crop region symmetrically from its center. ([#9424](https://github.com/tldraw/tldraw/pull/9424))
103
+ - Size embeds from providers that report their content's dimensions (currently Vimeo) to that content's real aspect ratio, so a video is no longer letterboxed inside a 16:9 box. The corrected embed keeps the area of the original box, so a portrait video doesn't balloon over whatever sits above and below it. ([#9613](https://github.com/tldraw/tldraw/pull/9613), [#9756](https://github.com/tldraw/tldraw/pull/9756))
104
+ - Hide the "Copy as", "Export as", and "Export file" submenus, and the main menu's export group, when a consumer has removed all of their actions through `overrides`, instead of leaving an empty submenu trigger behind. ([#9589](https://github.com/tldraw/tldraw/pull/9589))
25
105
  - Improve viewport culling performance on large pages: the spatial index now rechecks only the shapes affected by a change instead of every shape on the page. Custom shapes whose geometry depends on unrelated shapes (outside parent/child and binding relationships) are no longer automatically rechecked for culling when those shapes change; built-in shapes and standard patterns are unaffected. ([#9093](https://github.com/tldraw/tldraw/pull/9093))
26
106
  - Improve performance when deleting many shapes at once by batching page state cleanup. ([#9456](https://github.com/tldraw/tldraw/pull/9456))
27
107
  - Make long toast and dialog content wrap instead of overflowing, so long strings like URLs stay within the toast or dialog. ([#9546](https://github.com/tldraw/tldraw/pull/9546))
@@ -30,8 +110,11 @@ When cropping an image, crop edges now snap to other shapes and the grid, with t
30
110
 
31
111
  ### Bug fixes
32
112
 
113
+ - Fix zooming and panning not working while the cursor is over a non-scrollable UI overlay. The wheel pass-through guard treated any element whose content overflowed as scrollable, and a hover transform on a small overlay was enough to trigger that. Overlays now count as scrollable only when their computed `overflow` says so. ([#9698](https://github.com/tldraw/tldraw/pull/9698))
114
+ - Fix a crash when dragging content from another browser tab whose URL isn't a valid link, which happens when an ad blocker rewrites the dragged URL to something like `about:blank#blocked`. Dropping one now shows an error toast instead of failing validation on the bookmark shape. ([#9598](https://github.com/tldraw/tldraw/pull/9598))
115
+ - Fix the "URL" label wrapping onto two lines in the edit link and embed dialogs. ([#9663](https://github.com/tldraw/tldraw/pull/9663))
33
116
  - Fix rich text headings (H1–H6) rendering with their line-height too tight, causing overlapping lines. ([#9543](https://github.com/tldraw/tldraw/pull/9543))
34
- - Fix the style panel not highlighting the active fill correctly when the current fill lives in the overflow dropdown. ([#9509](https://github.com/tldraw/tldraw/pull/9509)) (contributed by [@meg-an31](https://github.com/meg-an31))
117
+ - Fix the style panel not highlighting the active fill correctly when the current fill lives in the overflow dropdown. ([#9509](https://github.com/tldraw/tldraw/pull/9509))
35
118
  - Fix the style panel Shape, Line, and spline dropdown popovers so they open with the same gap as the other dropdowns. ([#9491](https://github.com/tldraw/tldraw/pull/9491))
36
119
  - Fix double-clicking a shape inside an unfocused group immediately editing it; a double-click now drills one level into the group. ([#9488](https://github.com/tldraw/tldraw/pull/9488))
37
120
  - Fix selected clipped arrows so they can be dragged when their geometry extends outside a clipping parent. ([#9479](https://github.com/tldraw/tldraw/pull/9479))
@@ -48,6 +131,16 @@ When cropping an image, crop edges now snap to other shapes and the grid, with t
48
131
  - Fix a crash when a custom font failed to load after its editor had been disposed. ([#9494](https://github.com/tldraw/tldraw/pull/9494))
49
132
  - Fix license expiry being evaluated in local time, which could deactivate a license a calendar day early for users west of UTC; the expiry date is now treated as the last fully usable day in UTC. ([#9475](https://github.com/tldraw/tldraw/pull/9475))
50
133
 
134
+ ---
135
+
136
+ ### Patch releases
137
+
138
+ #### v5.3.1
139
+
140
+ - Fix touches in part of the canvas being ignored on iOS when the editor was inset from the edge of the page, such as beside a sidebar. ([#9989](https://github.com/tldraw/tldraw/pull/9989))
141
+
142
+ [View release on GitHub](https://github.com/tldraw/tldraw/releases/tag/v5.3.1)
143
+
51
144
  ## v5.2.0
52
145
 
53
146
  [View on GitHub](https://github.com/tldraw/tldraw/releases/tag/v5.2.0)
package/dist-cjs/index.js CHANGED
@@ -653,7 +653,7 @@ var import_buildFromV1Document = require("./lib/utils/tldr/buildFromV1Document")
653
653
  var import_file = require("./lib/utils/tldr/file");
654
654
  (0, import_editor.registerTldrawLibraryVersion)(
655
655
  "tldraw",
656
- "5.3.0",
656
+ "5.3.2",
657
657
  "cjs"
658
658
  );
659
659
  //# sourceMappingURL=index.js.map
@@ -23,6 +23,6 @@ __export(useCommentingEnabled_exports, {
23
23
  module.exports = __toCommonJS(useCommentingEnabled_exports);
24
24
  var import_editor = require("@tldraw/editor");
25
25
  function useCommentingEnabled() {
26
- return (0, import_editor.useLicenseFeatureFlag)((0, import_editor.useLicenseContext)(), "commenting");
26
+ return (0, import_editor.useLicenseFeatureFlag)((0, import_editor.useMaybeLicenseManager)(), "commenting");
27
27
  }
28
28
  //# sourceMappingURL=useCommentingEnabled.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/lib/ui/hooks/useCommentingEnabled.ts"],
4
- "sourcesContent": ["import { useLicenseContext, useLicenseFeatureFlag } from '@tldraw/editor'\n\n/**\n * Whether the commenting feature is licensed for this editor. The default comment quick action and\n * its keyboard shortcut are hidden/disabled unless this is true. Enabled in development; in\n * production it requires a license that includes the commenting feature (or the collaboration\n * umbrella that grants it). Reactive: re-reads when license validation resolves.\n *\n * @internal\n */\nexport function useCommentingEnabled(): boolean {\n\treturn useLicenseFeatureFlag(useLicenseContext(), 'commenting')\n}\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAAyD;AAUlD,SAAS,uBAAgC;AAC/C,aAAO,yCAAsB,iCAAkB,GAAG,YAAY;AAC/D;",
4
+ "sourcesContent": ["import { useLicenseFeatureFlag, useMaybeLicenseManager } from '@tldraw/editor'\n\n/**\n * Whether the commenting feature is licensed for this editor. The default comment quick action and\n * its keyboard shortcut are hidden/disabled unless this is true. Enabled in development; in\n * production it requires a license that includes the commenting feature (or the collaboration\n * umbrella that grants it). Reactive: re-reads when license validation resolves. Works outside\n * `<Tldraw />` too: UI mounted via `EditorProvider` resolves the license through the editor, and\n * with no editor at all this is `false`.\n *\n * @internal\n */\nexport function useCommentingEnabled(): boolean {\n\treturn useLicenseFeatureFlag(useMaybeLicenseManager(), 'commenting')\n}\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAA8D;AAYvD,SAAS,uBAAgC;AAC/C,aAAO,yCAAsB,sCAAuB,GAAG,YAAY;AACpE;",
6
6
  "names": []
7
7
  }
@@ -22,10 +22,10 @@ __export(version_exports, {
22
22
  version: () => version
23
23
  });
24
24
  module.exports = __toCommonJS(version_exports);
25
- const version = "5.3.0";
25
+ const version = "5.3.2";
26
26
  const publishDates = {
27
27
  major: "2026-05-06T16:28:18.473Z",
28
28
  minor: "2026-08-05T11:39:54.978Z",
29
- patch: "2026-08-05T11:39:54.978Z"
29
+ patch: "2026-08-18T09:59:40.172Z"
30
30
  };
31
31
  //# sourceMappingURL=version.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/lib/ui/version.ts"],
4
- "sourcesContent": ["// This file is automatically generated by internal/scripts/refresh-assets.ts.\n// Do not edit manually. Or do, I'm a comment, not a cop.\n\nexport const version = '5.3.0'\nexport const publishDates = {\n\tmajor: '2026-05-06T16:28:18.473Z',\n\tminor: '2026-08-05T11:39:54.978Z',\n\tpatch: '2026-08-05T11:39:54.978Z',\n}\n"],
4
+ "sourcesContent": ["// This file is automatically generated by internal/scripts/refresh-assets.ts.\n// Do not edit manually. Or do, I'm a comment, not a cop.\n\nexport const version = '5.3.2'\nexport const publishDates = {\n\tmajor: '2026-05-06T16:28:18.473Z',\n\tminor: '2026-08-05T11:39:54.978Z',\n\tpatch: '2026-08-18T09:59:40.172Z',\n}\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGO,MAAM,UAAU;AAChB,MAAM,eAAe;AAAA,EAC3B,OAAO;AAAA,EACP,OAAO;AAAA,EACP,OAAO;AACR;",
6
6
  "names": []
7
7
  }
@@ -637,7 +637,7 @@ import {
637
637
  } from "./lib/utils/tldr/file.mjs";
638
638
  registerTldrawLibraryVersion(
639
639
  "tldraw",
640
- "5.3.0",
640
+ "5.3.2",
641
641
  "esm"
642
642
  );
643
643
  export {
@@ -1,6 +1,6 @@
1
- import { useLicenseContext, useLicenseFeatureFlag } from "@tldraw/editor";
1
+ import { useLicenseFeatureFlag, useMaybeLicenseManager } from "@tldraw/editor";
2
2
  function useCommentingEnabled() {
3
- return useLicenseFeatureFlag(useLicenseContext(), "commenting");
3
+ return useLicenseFeatureFlag(useMaybeLicenseManager(), "commenting");
4
4
  }
5
5
  export {
6
6
  useCommentingEnabled
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/lib/ui/hooks/useCommentingEnabled.ts"],
4
- "sourcesContent": ["import { useLicenseContext, useLicenseFeatureFlag } from '@tldraw/editor'\n\n/**\n * Whether the commenting feature is licensed for this editor. The default comment quick action and\n * its keyboard shortcut are hidden/disabled unless this is true. Enabled in development; in\n * production it requires a license that includes the commenting feature (or the collaboration\n * umbrella that grants it). Reactive: re-reads when license validation resolves.\n *\n * @internal\n */\nexport function useCommentingEnabled(): boolean {\n\treturn useLicenseFeatureFlag(useLicenseContext(), 'commenting')\n}\n"],
5
- "mappings": "AAAA,SAAS,mBAAmB,6BAA6B;AAUlD,SAAS,uBAAgC;AAC/C,SAAO,sBAAsB,kBAAkB,GAAG,YAAY;AAC/D;",
4
+ "sourcesContent": ["import { useLicenseFeatureFlag, useMaybeLicenseManager } from '@tldraw/editor'\n\n/**\n * Whether the commenting feature is licensed for this editor. The default comment quick action and\n * its keyboard shortcut are hidden/disabled unless this is true. Enabled in development; in\n * production it requires a license that includes the commenting feature (or the collaboration\n * umbrella that grants it). Reactive: re-reads when license validation resolves. Works outside\n * `<Tldraw />` too: UI mounted via `EditorProvider` resolves the license through the editor, and\n * with no editor at all this is `false`.\n *\n * @internal\n */\nexport function useCommentingEnabled(): boolean {\n\treturn useLicenseFeatureFlag(useMaybeLicenseManager(), 'commenting')\n}\n"],
5
+ "mappings": "AAAA,SAAS,uBAAuB,8BAA8B;AAYvD,SAAS,uBAAgC;AAC/C,SAAO,sBAAsB,uBAAuB,GAAG,YAAY;AACpE;",
6
6
  "names": []
7
7
  }
@@ -1,8 +1,8 @@
1
- const version = "5.3.0";
1
+ const version = "5.3.2";
2
2
  const publishDates = {
3
3
  major: "2026-05-06T16:28:18.473Z",
4
4
  minor: "2026-08-05T11:39:54.978Z",
5
- patch: "2026-08-05T11:39:54.978Z"
5
+ patch: "2026-08-18T09:59:40.172Z"
6
6
  };
7
7
  export {
8
8
  publishDates,
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/lib/ui/version.ts"],
4
- "sourcesContent": ["// This file is automatically generated by internal/scripts/refresh-assets.ts.\n// Do not edit manually. Or do, I'm a comment, not a cop.\n\nexport const version = '5.3.0'\nexport const publishDates = {\n\tmajor: '2026-05-06T16:28:18.473Z',\n\tminor: '2026-08-05T11:39:54.978Z',\n\tpatch: '2026-08-05T11:39:54.978Z',\n}\n"],
4
+ "sourcesContent": ["// This file is automatically generated by internal/scripts/refresh-assets.ts.\n// Do not edit manually. Or do, I'm a comment, not a cop.\n\nexport const version = '5.3.2'\nexport const publishDates = {\n\tmajor: '2026-05-06T16:28:18.473Z',\n\tminor: '2026-08-05T11:39:54.978Z',\n\tpatch: '2026-08-18T09:59:40.172Z',\n}\n"],
5
5
  "mappings": "AAGO,MAAM,UAAU;AAChB,MAAM,eAAe;AAAA,EAC3B,OAAO;AAAA,EACP,OAAO;AAAA,EACP,OAAO;AACR;",
6
6
  "names": []
7
7
  }
package/package.json CHANGED
@@ -1,13 +1,19 @@
1
1
  {
2
2
  "name": "tldraw",
3
3
  "description": "A tiny little drawing editor.",
4
- "version": "5.3.0",
4
+ "version": "5.3.2",
5
5
  "author": {
6
6
  "name": "tldraw Inc.",
7
7
  "email": "hello@tldraw.com"
8
8
  },
9
9
  "homepage": "https://tldraw.dev",
10
10
  "license": "SEE LICENSE IN LICENSE.md",
11
+ "tldraw_product": {
12
+ "stableId": "tldraw:sdk-core",
13
+ "name": "SDK",
14
+ "type": "product",
15
+ "premium": false
16
+ },
11
17
  "repository": {
12
18
  "type": "git",
13
19
  "url": "https://github.com/tldraw/tldraw"
@@ -63,11 +69,11 @@
63
69
  "@tiptap/pm": "^3.12.1",
64
70
  "@tiptap/react": "^3.12.1",
65
71
  "@tiptap/starter-kit": "^3.12.1",
66
- "@tldraw/driver": "5.3.0",
67
- "@tldraw/editor": "5.3.0",
68
- "@tldraw/state": "5.3.0",
69
- "@tldraw/store": "5.3.0",
70
- "@tldraw/tlschema": "5.3.0",
72
+ "@tldraw/driver": "5.3.2",
73
+ "@tldraw/editor": "5.3.2",
74
+ "@tldraw/state": "5.3.2",
75
+ "@tldraw/store": "5.3.2",
76
+ "@tldraw/tlschema": "5.3.2",
71
77
  "classnames": "^2.5.1",
72
78
  "idb": "^7.1.1",
73
79
  "lz-string": "^1.5.0",
@@ -1,13 +1,15 @@
1
- import { useLicenseContext, useLicenseFeatureFlag } from '@tldraw/editor'
1
+ import { useLicenseFeatureFlag, useMaybeLicenseManager } from '@tldraw/editor'
2
2
 
3
3
  /**
4
4
  * Whether the commenting feature is licensed for this editor. The default comment quick action and
5
5
  * its keyboard shortcut are hidden/disabled unless this is true. Enabled in development; in
6
6
  * production it requires a license that includes the commenting feature (or the collaboration
7
- * umbrella that grants it). Reactive: re-reads when license validation resolves.
7
+ * umbrella that grants it). Reactive: re-reads when license validation resolves. Works outside
8
+ * `<Tldraw />` too: UI mounted via `EditorProvider` resolves the license through the editor, and
9
+ * with no editor at all this is `false`.
8
10
  *
9
11
  * @internal
10
12
  */
11
13
  export function useCommentingEnabled(): boolean {
12
- return useLicenseFeatureFlag(useLicenseContext(), 'commenting')
14
+ return useLicenseFeatureFlag(useMaybeLicenseManager(), 'commenting')
13
15
  }
@@ -1,9 +1,9 @@
1
1
  // This file is automatically generated by internal/scripts/refresh-assets.ts.
2
2
  // Do not edit manually. Or do, I'm a comment, not a cop.
3
3
 
4
- export const version = '5.3.0'
4
+ export const version = '5.3.2'
5
5
  export const publishDates = {
6
6
  major: '2026-05-06T16:28:18.473Z',
7
7
  minor: '2026-08-05T11:39:54.978Z',
8
- patch: '2026-08-05T11:39:54.978Z',
8
+ patch: '2026-08-18T09:59:40.172Z',
9
9
  }
@@ -0,0 +1,74 @@
1
+ import { render } from '@testing-library/react'
2
+ import { ContainerProvider, EditorProvider, useLicenseContext } from '@tldraw/editor'
3
+ import { vi } from 'vitest'
4
+ import { Tldraw } from '../lib/Tldraw'
5
+ import { DefaultToolbar } from '../lib/ui/components/Toolbar/DefaultToolbar'
6
+ import { TldrawUiContextProvider } from '../lib/ui/context/TldrawUiContextProvider'
7
+ import { useCommentingEnabled } from '../lib/ui/hooks/useCommentingEnabled'
8
+ import { renderTldrawComponentWithEditor } from './testutils/renderTldrawComponent'
9
+
10
+ // Default UI components can be mounted beside <Tldraw /> rather than inside it, wrapped in the
11
+ // providers the caller recreates (container, editor, ui context). The license provider is not
12
+ // among them — it only exists inside <TldrawEditor />.
13
+ describe('default UI mounted outside <Tldraw />', () => {
14
+ it('renders the default toolbar and resolves license feature flags through the editor', async () => {
15
+ const { editor } = await renderTldrawComponentWithEditor(
16
+ (onMount) => <Tldraw onMount={onMount} components={{ Toolbar: null }} />,
17
+ { waitForPatterns: true }
18
+ )
19
+
20
+ expect(editor.licenseManager).toBeDefined()
21
+
22
+ let commentingEnabled: boolean | undefined
23
+ function CommentingProbe() {
24
+ commentingEnabled = useCommentingEnabled()
25
+ return null
26
+ }
27
+
28
+ const result = render(
29
+ <ContainerProvider container={editor.getContainer()}>
30
+ <EditorProvider editor={editor}>
31
+ <TldrawUiContextProvider>
32
+ <DefaultToolbar />
33
+ <CommentingProbe />
34
+ </TldrawUiContextProvider>
35
+ </EditorProvider>
36
+ </ContainerProvider>
37
+ )
38
+
39
+ expect(await result.findByTestId('tools.select')).toBeTruthy()
40
+ // In tests the environment counts as development, where every feature is licensed — so a
41
+ // `true` here proves the flag resolved via the editor's license manager, not the
42
+ // fail-closed `false` of having no license manager at all.
43
+ expect(commentingEnabled).toBe(true)
44
+ })
45
+
46
+ it('license feature flags fail closed with no editor and no license context', () => {
47
+ let commentingEnabled: boolean | undefined
48
+ function CommentingProbe() {
49
+ commentingEnabled = useCommentingEnabled()
50
+ return null
51
+ }
52
+
53
+ render(<CommentingProbe />)
54
+
55
+ expect(commentingEnabled).toBe(false)
56
+ })
57
+
58
+ it('useLicenseContext throws when there is no license provider and no editor', () => {
59
+ function LicenseProbe() {
60
+ useLicenseContext()
61
+ return null
62
+ }
63
+
64
+ // silence React's error boundary logging for the expected throw
65
+ const consoleError = vi.spyOn(console, 'error').mockImplementation(() => {})
66
+ try {
67
+ expect(() => render(<LicenseProbe />)).toThrow(
68
+ 'useLicenseContext must be used inside of the <Tldraw /> or <TldrawEditor /> components'
69
+ )
70
+ } finally {
71
+ consoleError.mockRestore()
72
+ }
73
+ })
74
+ })