Releases
How tldraw is versioned
Unlike many JavaScript packages distributed on NPM, the tldraw SDK does not follow semantic versioning in its release versions. Here's what we do instead:
- Major version bumps are very rare and we reserve them for special changes that signify a paradigm shift of some kind.
- Minor version bumps are released on a regular cadence - approximately monthly. They may contain breaking changes. We aim to make breaking changes as minimally disruptive as possible, but tldraw is actively evolving as we add new features. We recommend updating tldraw at a similar pace to our release cadence, and be sure to check the release notes.
- Patch version bumps are for bugfixes and hotfixes that can't wait for the next cadence release.
Current release: v3.12.0
Release Notes
v3.12.0 of the tldraw SDK includes several bug fixes and API improvements. The main feature development focus was on accessibility, building on initial work in v3.11.0 which added a focus ring.
Accessibility features
- You can now move your selection between shapes using the keyboard (using
Tab
andCmd/Ctrl
+Arrow
) (#5761) - Screen reader support for tool changes (#5634)
- Screen reader support for shape selection changes (#5773)
- Shapes can now be resized using the keyboard (using
Cmd
/Ctrl
+Alt
+Shift
with the+
/-
keys) (#5826) - More of our UI elements have the correct
role
applied, and use the correct semantic html5 tags (#5847)
Accessibility is something we’ve been researching internally for a while now, investing in some R&D projects to see what’s possible on a 2D canvas. We’re continuing to mature our processes around accessibility with an eye on achieving WCAG in the near future.
API additions
-
Frames can now have color. Set the
showColors
option on theFrameShapeUtil
class to display colorful borders and labels for frames. (#5283)import { FrameShapeUtil, Tldraw } from 'tldraw' import 'tldraw/tldraw.css' const shapeUtils = [FrameShapeUtil.configure({ showColors: true })] export default function App() { return ( `<div className="tldraw__editor">` <Tldraw shapeUtils={shapeUtils}>`</Tldraw>` `</div>` ) }
-
There’s a new
getShapeVisibility
prop to replaceisShapeHidden
, which is now deprecated.getShapeVisibility
allows a child of a hidden parent to override its parent and become visible. See the Layer Panel Example. (#5762) -
The
Geometry2d
class has a couple of new helper methods for calculating intersection points (intersectLineSegment
andintersectCircle
), a new helper method for applying a transformation matrix (transform
), and new filtering options to allow excluding certain parts of geometry from calculations. (#5754) -
We now individually export two of our default Tiptap extensions (for rich text) (#5874)
KeyboardShiftEnterTweakExtension
which inserts a normal line break when pressing shift+enter (tldraw doesn’t support soft breaks).TextDirection
which ensures the text directionality is saved and reinstated correctly.
Other improvements
- The syntax for defining keyboard shortcuts is now more intuitive (#5605)
- e.g.
'?!l’
becomes'alt+shift+l'
and'$s'
becomes'ctrl+s,cmd+s'
- See https://tldraw.dev/reference/tldraw/TLUiToolItem#kbd
- The old syntax is still supported for now, but may be deprecated in the future.
- e.g.
Store.mergeRemoteChanges
is now atomic, and side effects are triggered in the correct scopes. (#5801)- Drawing is now smoother on slower CPUs by using getCoalescedEvents. (#5898)
- We now allow overriding the asset urls for the icons used by the Embed shape to be null/empty in cases where the Embed shape is not needed. This prevents tldraw downloading a handful of icon assets that would never be used. (#5736)
- YouTube embeds now support the t/start/loop parameters. (#5726)
Bug fixes
- SVGs can now be pasted in Firefox. (#5789)
- Text exports from pages that include TailwindCSS no longer have unexpected borders. (#5792)
- Pasting images now triggers just one ‘create’ effect per image shape, before it would trigger a ‘create’ and then immediately an ‘update’. (#5800)
- Pasting shapes from Miro no longer crashes tldraw. (#5790)
- Setting
zoomSpeed
in camera options no longer breaks zooming on safari trackpads and multitouch pinch to zoom. (#5771) - Fix a minor style issue in the PeopleMenu component. (#5753)
- Resolve some performance regressions related to rich text. (#5743) (#5735) (#5734)
Group2D.getSvgPathData()
now sets the starting points of its children correctly. (#5580)- Resolve a performance regression related to drawing on an iPad (#5888)
- Prevent a crash when trying to render UI for tools that have been removed (#5849)
Breaking changes
No breaking changes!
Authors
- @budatl
- alex (@SomeHats)
- David Sheldrick (@ds300)
- Fabian Iwand (@mootari)
- Lorenzo Lewis (@lorenzolewis)
- Lu Wilson (@TodePond)
- Mime Čuvalo (@mimecuvalo)
- Mitja Bezenšek (@MitjaBezensek)
- Slava Khanilo (@khanilov)
- Steve Ruiz (@steveruizok)
- Trivikram Kamat (@trivikr)
- Trygve Aaberge (@trygve-aaberge-adsk)