commit 1a642387de
Author: Mime Čuvalo <mimecuvalo@gmail.com>
Date: Fri Apr 5 10:56:14 2024 +0100
lint
commit c5059f15bb
Author: Mime Čuvalo <mimecuvalo@gmail.com>
Date: Fri Apr 5 10:49:54 2024 +0100
textfields: bring shape into view when editing (#3362)
This actually is a problem in production anyway, for any shape, not
particular to new auto-editing or stickies.
Case in point:
- shape is selected
- move the shape offscreen
- hit Enter
- you'll be editing the shape but it won't be visible to you.
This change consolidates some of the duplicate logic in `Idle.ts` and in
`noteHelpers.ts`.
Two questions
- `Idle.ts` didn't have the `select()` call but `noteHelpers.ts` did -
is this really important?
- `noteHelpers` didn't have the `mark()` call but `Idle.ts` did - seems
like it was missing in noteHelpers, but lemme know if that was intended
to be left out.
### Change Type
<!-- ❗ Please select a 'Scope' label ❗️ -->
- [x] `sdk` — Changes the tldraw SDK
- [ ] `dotcom` — Changes the tldraw.com web app
- [ ] `docs` — Changes to the documentation, examples, or templates.
- [ ] `vs code` — Changes to the vscode plugin
- [ ] `internal` — Does not affect user-facing stuff
<!-- ❗ Please select a 'Type' label ❗️ -->
- [x] `bugfix` — Bug fix
- [ ] `feature` — New feature
- [ ] `improvement` — Improving existing features
- [ ] `chore` — Updating dependencies, other boring stuff
- [ ] `galaxy brain` — Architectural changes
- [ ] `tests` — Changes to any test code
- [ ] `tools` — Changes to infrastructure, CI, internal scripts,
debugging tools, etc.
- [ ] `dunno` — I don't know
### Release Notes
- Textfields: bring shape to view that's being edited.
---------
Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
commit 7671e6291e
Merge: 1df05133a58286db90
Author: Mime Čuvalo <mimecuvalo@gmail.com>
Date: Fri Apr 5 10:29:41 2024 +0100
merge
commit 1df05133af
Author: Mime Čuvalo <mimecuvalo@gmail.com>
Date: Fri Apr 5 09:15:07 2024 +0100
stickies: update geometry to differentiate between shape and text label (#3361)
Separates out the geometry - we want clicking in the negative space to
not have the text editing mechanics. This definitely feels better
without the sticky note textfield assuming it takes up the whole note.
Before:
<img width="614" alt="Screenshot 2024-04-04 at 15 35 58"
src="https://github.com/tldraw/tldraw/assets/469604/f4673fc5-5b9a-4ab9-a169-a91ba7f49d17">
After:
<img width="636" alt="Screenshot 2024-04-04 at 15 35 42"
src="https://github.com/tldraw/tldraw/assets/469604/645c439a-662b-4244-af7f-6c718e5c5fc2">
### Change Type
<!-- ❗ Please select a 'Scope' label ❗️ -->
- [x] `sdk` — Changes the tldraw SDK
- [ ] `dotcom` — Changes the tldraw.com web app
- [ ] `docs` — Changes to the documentation, examples, or templates.
- [ ] `vs code` — Changes to the vscode plugin
- [ ] `internal` — Does not affect user-facing stuff
<!-- ❗ Please select a 'Type' label ❗️ -->
- [ ] `bugfix` — Bug fix
- [ ] `feature` — New feature
- [x] `improvement` — Improving existing features
- [ ] `chore` — Updating dependencies, other boring stuff
- [ ] `galaxy brain` — Architectural changes
- [ ] `tests` — Changes to any test code
- [ ] `tools` — Changes to infrastructure, CI, internal scripts,
debugging tools, etc.
- [ ] `dunno` — I don't know
---------
Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
commit 58286db90c
Author: Steve Ruiz <steveruizok@gmail.com>
Date: Thu Apr 4 22:50:01 2024 +0100
Add long press event (#3275)
This PR adds a "long press" event that fires when pointing for more than
500ms. This event is used in the same way that dragging is used (e.g. to
transition to from pointing_selection to translating) but only on
desktop. On mobile, long presses are used to open the context menu.
![Kapture 2024-03-26 at 18 57
15](https://github.com/tldraw/tldraw/assets/23072548/34a7ee2b-bde6-443b-93e0-082453a1cb61)
## Background
This idea came out of @TodePond's #3208 PR. We use a "dead zone" to
avoid accidentally moving / rotating things when clicking on them, which
is especially common on mobile if a dead zone feature isn't implemented.
However, this makes it difficult to make "fine adjustments" because you
need to drag out of the dead zone (to start translating) and then drag
back to where you want to go.
![Kapture 2024-03-26 at 19 00
38](https://github.com/tldraw/tldraw/assets/23072548/9a15852d-03d0-4b88-b594-27dbd3b68780)
With this change, you can long press on desktop to get to that
translating state. It's a micro UX optimization but especially nice if
apps want to display different UI for "dragging" shapes before the user
leaves the dead zone.
![Kapture 2024-03-26 at 19 02
59](https://github.com/tldraw/tldraw/assets/23072548/f0ff337e-2cbd-4b73-9ef5-9b7deaf0ae91)
### Change Type
<!-- ❗ Please select a 'Scope' label ❗️ -->
- [x] `sdk` — Changes the tldraw SDK
- [ ] `dotcom` — Changes the tldraw.com web app
- [ ] `docs` — Changes to the documentation, examples, or templates.
- [ ] `vs code` — Changes to the vscode plugin
- [ ] `internal` — Does not affect user-facing stuff
<!-- ❗ Please select a 'Type' label ❗️ -->
- [ ] `bugfix` — Bug fix
- [x] `feature` — New feature
- [ ] `improvement` — Improving existing features
- [ ] `chore` — Updating dependencies, other boring stuff
- [ ] `galaxy brain` — Architectural changes
- [ ] `tests` — Changes to any test code
- [ ] `tools` — Changes to infrastructure, CI, internal scripts,
debugging tools, etc.
- [ ] `dunno` — I don't know
### Test Plan
1. Long press shapes, selections, resize handles, rotate handles, crop
handles.
2. You should enter the corresponding states, just as you would have
with a drag.
- [ ] Unit Tests TODO
### Release Notes
- Add support for long pressing on desktop.
commit 4a84b3482c
Author: Steve Ruiz <steveruizok@gmail.com>
Date: Thu Apr 4 22:49:28 2024 +0100
Simplify RTL
commit e3ceb270e7
Merge: 8683c642d43edeb09b
Author: Steve Ruiz <steveruizok@gmail.com>
Date: Thu Apr 4 22:17:27 2024 +0100
Merge branch 'main' into stickies-rc
commit 43edeb09b5
Author: Steve Ruiz <steveruizok@gmail.com>
Date: Thu Apr 4 19:16:17 2024 +0100
Add white migration (#3334)
This PR adds a down migration for #3321.
### Change Type
- [x] `sdk` — Changes the tldraw SDK
- [x] `dunno` — I don't know
commit 8683c642d3
Author: Lu Wilson <l2wilson94@gmail.com>
Date: Thu Apr 4 16:05:24 2024 +0100
Stickies: Kickout occluded shapes after nudge (frames and stickies) (#3360)
This PR kicks out occluded shapes after nudging. This affects frames as
well as stickies.
### Change Type
<!-- ❗ Please select a 'Scope' label ❗️ -->
- [x] `sdk` — Changes the tldraw SDK
- [x] `dotcom` — Changes the tldraw.com web app
- [ ] `docs` — Changes to the documentation, examples, or templates.
- [ ] `vs code` — Changes to the vscode plugin
- [ ] `internal` — Does not affect user-facing stuff
<!-- ❗ Please select a 'Type' label ❗️ -->
- [x] `bugfix` — Bug fix
- [ ] `feature` — New feature
- [ ] `improvement` — Improving existing features
- [ ] `chore` — Updating dependencies, other boring stuff
- [ ] `galaxy brain` — Architectural changes
- [ ] `tests` — Changes to any test code
- [ ] `tools` — Changes to infrastructure, CI, internal scripts,
debugging tools, etc.
- [ ] `dunno` — I don't know
### Test Plan
1. Add a step-by-step description of how to test your PR here.
2.
- [ ] Unit Tests
- [ ] End to end tests
### Release Notes
- Add a brief release note for your PR here.
commit 574724be57
Author: Lu Wilson <l2wilson94@gmail.com>
Date: Thu Apr 4 16:05:03 2024 +0100
Stickies: Bring stickies to front when you move them (#3353)
When you start translating stickies, bring them to front.
https://github.com/tldraw/tldraw/assets/15892272/bdd1bc0c-8e94-435a-98ef-d09f9f93f4cb
### Change Type
<!-- ❗ Please select a 'Scope' label ❗️ -->
- [ ] `sdk` — Changes the tldraw SDK
- [ ] `dotcom` — Changes the tldraw.com web app
- [ ] `docs` — Changes to the documentation, examples, or templates.
- [ ] `vs code` — Changes to the vscode plugin
- [ ] `internal` — Does not affect user-facing stuff
<!-- ❗ Please select a 'Type' label ❗️ -->
- [ ] `bugfix` — Bug fix
- [ ] `feature` — New feature
- [ ] `improvement` — Improving existing features
- [ ] `chore` — Updating dependencies, other boring stuff
- [ ] `galaxy brain` — Architectural changes
- [ ] `tests` — Changes to any test code
- [ ] `tools` — Changes to infrastructure, CI, internal scripts,
debugging tools, etc.
- [ ] `dunno` — I don't know
### Test Plan
1. Add a step-by-step description of how to test your PR here.
2.
- [ ] Unit Tests
- [ ] End to end tests
### Release Notes
- Add a brief release note for your PR here.
commit 2ae2b6516c
Merge: a590e1ddb0161ec796
Author: Mime Čuvalo <mimecuvalo@gmail.com>
Date: Thu Apr 4 15:09:00 2024 +0100
merge
commit a590e1ddb5
Author: Mime Čuvalo <mimecuvalo@gmail.com>
Date: Thu Apr 4 11:39:55 2024 +0100
textfields: fix very long words not causing growY to be calculated correctly
commit 00d5400e15
Author: Lu Wilson <l2wilson94@gmail.com>
Date: Thu Apr 4 10:41:45 2024 +0100
Stickies: Use page space for sticky shadow rotation (#3352)
This PR makes sticky shadows use page space rotation, not shape space
rotation. This brings it in line with what our other shapes do (eg:
bookmarks)
https://github.com/tldraw/tldraw/assets/15892272/6b0ae307-7811-4a11-a29d-2c61cafd3d1d
### Change Type
<!-- ❗ Please select a 'Scope' label ❗️ -->
- [ ] `sdk` — Changes the tldraw SDK
- [ ] `dotcom` — Changes the tldraw.com web app
- [ ] `docs` — Changes to the documentation, examples, or templates.
- [ ] `vs code` — Changes to the vscode plugin
- [ ] `internal` — Does not affect user-facing stuff
<!-- ❗ Please select a 'Type' label ❗️ -->
- [ ] `bugfix` — Bug fix
- [ ] `feature` — New feature
- [ ] `improvement` — Improving existing features
- [ ] `chore` — Updating dependencies, other boring stuff
- [ ] `galaxy brain` — Architectural changes
- [ ] `tests` — Changes to any test code
- [ ] `tools` — Changes to infrastructure, CI, internal scripts,
debugging tools, etc.
- [ ] `dunno` — I don't know
### Test Plan
1. Add a step-by-step description of how to test your PR here.
2.
- [ ] Unit Tests
- [ ] End to end tests
### Release Notes
- Add a brief release note for your PR here.
commit 3c91ed78da
Author: Mime Čuvalo <mimecuvalo@gmail.com>
Date: Thu Apr 4 10:21:05 2024 +0100
textareas: place cursor at intended position (#3328)
This is take 2 on this original PR:
https://github.com/tldraw/tldraw/pull/3132
It goes further to try to address these issues that came up:
- [x] fixes up problem with being able to click "through" an occluded
shape because of z-layer issues. This is done by only "raising" the
textareas when a shape is selected, priming them for easy selection.
- [x] add a `data-isediting` property which lets us stay in editing mode
and keep the z-indices of the textareas raised when in editing mode.
- [x] Initiating a drag from within a textarea was losing pointer events
when going over the UI. Would love feedback on this piece - had to
disable pointer events to the UI while dragging which I think is the
right move anyway. But wiring that up properly could use work since it
relies on cursor changes, heh.
Btw, @MitjaBezensek I had to undo your PR
https://github.com/tldraw/tldraw/pull/3283 because that would conflict
with this sticky work where we want text editing to be more fluid.
### Change Type
<!-- ❗ Please select a 'Scope' label ❗️ -->
- [x] `sdk` — Changes the tldraw SDK
- [ ] `dotcom` — Changes the tldraw.com web app
- [ ] `docs` — Changes to the documentation, examples, or templates.
- [ ] `vs code` — Changes to the vscode plugin
- [ ] `internal` — Does not affect user-facing stuff
<!-- ❗ Please select a 'Type' label ❗️ -->
- [x] `bugfix` — Bug fix
- [ ] `feature` — New feature
- [ ] `improvement` — Improving existing features
- [ ] `chore` — Updating dependencies, other boring stuff
- [ ] `galaxy brain` — Architectural changes
- [ ] `tests` — Changes to any test code
- [ ] `tools` — Changes to infrastructure, CI, internal scripts,
debugging tools, etc.
- [ ] `dunno` — I don't know
---------
Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
commit 0161ec796e
Author: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Date: Thu Apr 4 09:34:07 2024 +0200
Bump the npm_and_yarn group across 1 directory with 1 update (#3348)
Bumps the npm_and_yarn group with 1 update in the / directory:
[vite](https://github.com/vitejs/vite/tree/HEAD/packages/vite).
Updates `vite` from 5.2.7 to 5.2.8
<details>
<summary>Changelog</summary>
<p><em>Sourced from <a
href="https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md">vite's
changelog</a>.</em></p>
<blockquote>
<h2><!-- raw HTML omitted -->5.2.8 (2024-04-03)<!-- raw HTML omitted
--></h2>
<ul>
<li>fix: csp nonce injection when no closing tag (<a
href="https://github.com/vitejs/vite/tree/HEAD/packages/vite/issues/16281">#16281</a>)
(<a
href="https://github.com/vitejs/vite/tree/HEAD/packages/vite/issues/16282">#16282</a>)
(<a href="https://github.com/vitejs/vite/commit/3c85c6b">3c85c6b</a>),
closes <a
href="https://redirect.github.com/vitejs/vite/issues/16281">#16281</a>
<a
href="https://redirect.github.com/vitejs/vite/issues/16282">#16282</a></li>
<li>fix: do not access document in <code>/@vite/client</code> when not
defined (<a
href="https://github.com/vitejs/vite/tree/HEAD/packages/vite/issues/16318">#16318</a>)
(<a href="https://github.com/vitejs/vite/commit/646319c">646319c</a>),
closes <a
href="https://redirect.github.com/vitejs/vite/issues/16318">#16318</a></li>
<li>fix: fix sourcemap when using object as <code>define</code> value
(<a
href="https://github.com/vitejs/vite/tree/HEAD/packages/vite/issues/15805">#15805</a>)
(<a href="https://github.com/vitejs/vite/commit/445c4f2">445c4f2</a>),
closes <a
href="https://redirect.github.com/vitejs/vite/issues/15805">#15805</a></li>
<li>fix(css): unknown file error happened with lightningcss (<a
href="https://github.com/vitejs/vite/tree/HEAD/packages/vite/issues/16306">#16306</a>)
(<a href="https://github.com/vitejs/vite/commit/01af308">01af308</a>),
closes <a
href="https://redirect.github.com/vitejs/vite/issues/16306">#16306</a></li>
<li>fix(hmr): multiple updates happened when invalidate is called while
multiple tabs open (<a
href="https://github.com/vitejs/vite/tree/HEAD/packages/vite/issues/16307">#16307</a>)
(<a href="https://github.com/vitejs/vite/commit/21cc10b">21cc10b</a>),
closes <a
href="https://redirect.github.com/vitejs/vite/issues/16307">#16307</a></li>
<li>fix(scanner): duplicate modules for same id if glob is used in
html-like types (<a
href="https://github.com/vitejs/vite/tree/HEAD/packages/vite/issues/16305">#16305</a>)
(<a href="https://github.com/vitejs/vite/commit/eca68fa">eca68fa</a>),
closes <a
href="https://redirect.github.com/vitejs/vite/issues/16305">#16305</a></li>
<li>chore(deps): update all non-major dependencies (<a
href="https://github.com/vitejs/vite/tree/HEAD/packages/vite/issues/16325">#16325</a>)
(<a href="https://github.com/vitejs/vite/commit/a78e265">a78e265</a>),
closes <a
href="https://redirect.github.com/vitejs/vite/issues/16325">#16325</a></li>
<li>refactor: use types from sass instead of <code>@types/sass</code>
(<a
href="https://github.com/vitejs/vite/tree/HEAD/packages/vite/issues/16340">#16340</a>)
(<a href="https://github.com/vitejs/vite/commit/4581e83">4581e83</a>),
closes <a
href="https://redirect.github.com/vitejs/vite/issues/16340">#16340</a></li>
</ul>
</blockquote>
</details>
<details>
<summary>Commits</summary>
<ul>
<li><a
href="8b8d4024fb"><code>8b8d402</code></a>
release: v5.2.8</li>
<li><a
href="646319cc84"><code>646319c</code></a>
fix: do not access document in <code>/@vite/client</code> when not
defined (<a
href="https://github.com/vitejs/vite/tree/HEAD/packages/vite/issues/16318">#16318</a>)</li>
<li><a
href="445c4f2158"><code>445c4f2</code></a>
fix: fix sourcemap when using object as <code>define</code> value (<a
href="https://github.com/vitejs/vite/tree/HEAD/packages/vite/issues/15805">#15805</a>)</li>
<li><a
href="a78e265822"><code>a78e265</code></a>
chore(deps): update all non-major dependencies (<a
href="https://github.com/vitejs/vite/tree/HEAD/packages/vite/issues/16325">#16325</a>)</li>
<li><a
href="4581e8371d"><code>4581e83</code></a>
refactor: use types from sass instead of <code>@types/sass</code> (<a
href="https://github.com/vitejs/vite/tree/HEAD/packages/vite/issues/16340">#16340</a>)</li>
<li><a
href="3c85c6b52e"><code>3c85c6b</code></a>
fix: csp nonce injection when no closing tag (<a
href="https://github.com/vitejs/vite/tree/HEAD/packages/vite/issues/16281">#16281</a>)
(<a
href="https://github.com/vitejs/vite/tree/HEAD/packages/vite/issues/16282">#16282</a>)</li>
<li><a
href="21cc10bfda"><code>21cc10b</code></a>
fix(hmr): multiple updates happened when invalidate is called while
multiple ...</li>
<li><a
href="01af308dfd"><code>01af308</code></a>
fix(css): unknown file error happened with lightningcss (<a
href="https://github.com/vitejs/vite/tree/HEAD/packages/vite/issues/16306">#16306</a>)</li>
<li><a
href="eca68fa942"><code>eca68fa</code></a>
fix(scanner): duplicate modules for same id if glob is used in html-like
type...</li>
<li>See full diff in <a
href="https://github.com/vitejs/vite/commits/v5.2.8/packages/vite">compare
view</a></li>
</ul>
</details>
<br />
[![Dependabot compatibility
score](https://dependabot-badges.githubapp.com/badges/compatibility_score?dependency-name=vite&package-manager=npm_and_yarn&previous-version=5.2.7&new-version=5.2.8)](https://docs.github.com/en/github/managing-security-vulnerabilities/about-dependabot-security-updates#about-compatibility-scores)
Dependabot will resolve any conflicts with this PR as long as you don't
alter it yourself. You can also trigger a rebase manually by commenting
`@dependabot rebase`.
[//]: # (dependabot-automerge-start)
[//]: # (dependabot-automerge-end)
---
<details>
<summary>Dependabot commands and options</summary>
<br />
You can trigger Dependabot actions by commenting on this PR:
- `@dependabot rebase` will rebase this PR
- `@dependabot recreate` will recreate this PR, overwriting any edits
that have been made to it
- `@dependabot merge` will merge this PR after your CI passes on it
- `@dependabot squash and merge` will squash and merge this PR after
your CI passes on it
- `@dependabot cancel merge` will cancel a previously requested merge
and block automerging
- `@dependabot reopen` will reopen this PR if it is closed
- `@dependabot close` will close this PR and stop Dependabot recreating
it. You can achieve the same result by closing it manually
- `@dependabot show <dependency name> ignore conditions` will show all
of the ignore conditions of the specified dependency
- `@dependabot ignore <dependency name> major version` will close this
group update PR and stop Dependabot creating any more for the specific
dependency's major version (unless you unignore this specific
dependency's major version or upgrade to it yourself)
- `@dependabot ignore <dependency name> minor version` will close this
group update PR and stop Dependabot creating any more for the specific
dependency's minor version (unless you unignore this specific
dependency's minor version or upgrade to it yourself)
- `@dependabot ignore <dependency name>` will close this group update PR
and stop Dependabot creating any more for the specific dependency
(unless you unignore this specific dependency or upgrade to it yourself)
- `@dependabot unignore <dependency name>` will remove all of the ignore
conditions of the specified dependency
- `@dependabot unignore <dependency name> <ignore condition>` will
remove the ignore condition of the specified dependency and ignore
conditions
You can disable automated security fix PRs for this repo from the
[Security Alerts page](https://github.com/tldraw/tldraw/network/alerts).
</details>
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
commit 3f6b385880
Author: Lu Wilson <l2wilson94@gmail.com>
Date: Wed Apr 3 17:15:19 2024 +0100
Stickies: parenting (of frames and stickies) (#3297)
This PR adds parenting behaviour to stickies, and also changes how
parenting works on the whole.
- Rescaled timings for drag and drop manager. It should feel tighter,
closer to figma.
https://github.com/tldraw/tldraw/assets/15892272/c36c5bba-9964-403e-a5cd-6dcb35e1fe27
- We now 'kick out' any occluded children from their parents. We
manually do this after many interactions and actions.
- We now only parent shapes if their geometry overlaps *as well* as your
cursor dragging over.
- We now hint parents when translating a child inside it.
- We hide the hint if your selected shape will be kicked out of a
frame/note when you let go.
- We now *only* hint if a child will successfully drop inside a parent.
- Removed `shouldHint` option from `onDragShapesOver`. The editor
handles that now.
I will add more gifs demonstrating all these cases.
### Change Type
<!-- ❗ Please select a 'Scope' label ❗️ -->
- [x] `sdk` — Changes the tldraw SDK
- [x] `dotcom` — Changes the tldraw.com web app
- [ ] `docs` — Changes to the documentation, examples, or templates.
- [ ] `vs code` — Changes to the vscode plugin
- [ ] `internal` — Does not affect user-facing stuff
<!-- ❗ Please select a 'Type' label ❗️ -->
- [ ] `bugfix` — Bug fix
- [x] `feature` — New feature
- [x] `improvement` — Improving existing features
- [ ] `chore` — Updating dependencies, other boring stuff
- [ ] `galaxy brain` — Architectural changes
- [ ] `tests` — Changes to any test code
- [ ] `tools` — Changes to infrastructure, CI, internal scripts,
debugging tools, etc.
- [ ] `dunno` — I don't know
### Test Plan
1. Add a step-by-step description of how to test your PR here.
2.
- [ ] Unit Tests
- [ ] End to end tests
### Release Notes
- Add a brief release note for your PR here.
---------
Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
commit df7e3c4d31
Author: Steve Ruiz <steveruizok@gmail.com>
Date: Wed Apr 3 17:05:58 2024 +0100
Stickies: fix sticky shadows (#3345)
This PR tweaks sticky shadows.
### Change Type
- [x] `sdk` — Changes the tldraw SDK
- [x] `bugfix` — Bug fix
commit 1ba9cbfa2a
Author: Steve Ruiz <steveruizok@gmail.com>
Date: Wed Apr 3 16:42:52 2024 +0100
only buffer pointer events (#3337)
This PR changes our input buffering to only buffer pointer events. We
were already moving in this direction with the complete / cancel
flushes, now it's just more explicit. If we want to add other events
into here, then we can.
### Change Type
- [x] `sdk` — Changes the tldraw SDK
- [x] `bugfix` — Bug fix
commit 3f4a170968
Author: Steve Ruiz <steveruizok@gmail.com>
Date: Wed Apr 3 16:41:56 2024 +0100
Fix blur bug in editable text (#3343)
This PR fixes a bug that was introduced by #3223. There was a code path
that normally used to never run (a blur event running when the shape was
no longer editing) but which was being run now that shapes aren't
immediately removed on pointer down.
### Change Type
- [x] `sdk` — Changes the tldraw SDK
- [x] `bugfix` — Bug fix
### Test Plan
1. Create a sticky note
2. Begin editing the note
3. click on the canvas
4. You should be in pointing_canvas
commit 5d7e38a7ed
Author: Steve Ruiz <steveruizok@gmail.com>
Date: Wed Apr 3 16:32:47 2024 +0100
Update noteHelpers.ts
commit e60f8d56a0
Author: Steve Ruiz <steveruizok@gmail.com>
Date: Wed Apr 3 16:17:40 2024 +0100
Fix weird text complete (#3342)
This PR fixes a weird issue where editing text notes would call blur /
complete, preventing certain interactions.
Before:
1. Select a sticky note
2. Start editing the note
3. pointer down on the canvas
4. Instead of being in pointing_canvas, you'll be in idle
After:
4. You'll be in pointing_canvas
### Change Type
- [x] `sdk` — Changes the tldraw SDK
- [x] `bugfix` — Bug fix
commit 30e605ef7e
Author: Steve Ruiz <steveruizok@gmail.com>
Date: Wed Apr 3 15:56:56 2024 +0100
Font size adjustment migration (#3338)
This PR adds migrations for font size adjustment.
### Change Type
- [x] `sdk` — Changes the tldraw SDK
- [x] `improvement` — Improving existing features
commit 139ea35171
Author: Mime Čuvalo <mimecuvalo@gmail.com>
Date: Wed Apr 3 15:53:15 2024 +0100
fix colors
commit 4ef1fb3c70
Author: Mime Čuvalo <mimecuvalo@gmail.com>
Date: Wed Apr 3 15:16:26 2024 +0100
fix up long growY on some notes, we dont have a border anymore
commit cf51f5c2f4
Merge: d4a162d1a4f2cf3dee
Author: Steve Ruiz <steveruizok@gmail.com>
Date: Wed Apr 3 15:14:50 2024 +0100
Merge branch 'main' into stickies-rc
commit 4f2cf3dee0
Author: Taha <98838967+Taha-Hassan-Git@users.noreply.github.com>
Date: Wed Apr 3 12:25:07 2024 +0100
Tool with child states (#3074)
Adds an example of a tool with child states. I'm going over the
annotations at the moment, just wanted to validate the idea in the
meantime.
Closes tld-2114
- [x] `documentation` — Changes to the documentation only[^2]
### Release Notes
- Add an example of a tool with child states
---------
Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
commit d4a162d1ad
Author: Mime Čuvalo <mimecuvalo@gmail.com>
Date: Wed Apr 3 12:00:22 2024 +0100
some nit cleanup
commit 7ae03ca32b
Author: Mime Čuvalo <mimecuvalo@gmail.com>
Date: Wed Apr 3 11:52:42 2024 +0100
textfields: pull out change where textareas are present all the time
commit ded85e4ebf
Merge: 16b84ef3803e4c8575
Author: Mime Čuvalo <mimecuvalo@gmail.com>
Date: Wed Apr 3 11:12:13 2024 +0100
Merge branch 'main' into stickies-rc
commit 03e4c8575c
Author: Mime Čuvalo <mimecuvalo@gmail.com>
Date: Wed Apr 3 11:01:04 2024 +0100
textfields: fix regression with Text shape and resizing (#3333)
The refactor of the textfields in this PR
https://github.com/tldraw/tldraw/pull/3050 caused a regression in
resizing Text shapes. (as demonstrated in this PR's video:
https://github.com/tldraw/tldraw/pull/3327)
We reverted that PR and now this PR updates the CSS to fix the gap that
was introduced when it was refactored.
### Change Type
<!-- ❗ Please select a 'Scope' label ❗️ -->
- [x] `sdk` — Changes the tldraw SDK
- [ ] `dotcom` — Changes the tldraw.com web app
- [ ] `docs` — Changes to the documentation, examples, or templates.
- [ ] `vs code` — Changes to the vscode plugin
- [ ] `internal` — Does not affect user-facing stuff
<!-- ❗ Please select a 'Type' label ❗️ -->
- [x] `bugfix` — Bug fix
- [ ] `feature` — New feature
- [ ] `improvement` — Improving existing features
- [ ] `chore` — Updating dependencies, other boring stuff
- [ ] `galaxy brain` — Architectural changes
- [ ] `tests` — Changes to any test code
- [ ] `tools` — Changes to infrastructure, CI, internal scripts,
debugging tools, etc.
- [ ] `dunno` — I don't know
commit 843347bde1
Author: Mime Čuvalo <mimecuvalo@gmail.com>
Date: Wed Apr 3 10:59:11 2024 +0100
Revert "Fix text resizing bug (#3327)" (#3332)
This reverts commit 0e912fe0f2.
(The fix is more to do with a CSS regression instead of a JS fix.)
### Change Type
<!-- ❗ Please select a 'Scope' label ❗️ -->
- [x] `sdk` — Changes the tldraw SDK
- [ ] `dotcom` — Changes the tldraw.com web app
- [ ] `docs` — Changes to the documentation, examples, or templates.
- [ ] `vs code` — Changes to the vscode plugin
- [ ] `internal` — Does not affect user-facing stuff
<!-- ❗ Please select a 'Type' label ❗️ -->
- [x] `bugfix` — Bug fix
- [ ] `feature` — New feature
- [ ] `improvement` — Improving existing features
- [ ] `chore` — Updating dependencies, other boring stuff
- [ ] `galaxy brain` — Architectural changes
- [ ] `tests` — Changes to any test code
- [ ] `tools` — Changes to infrastructure, CI, internal scripts,
debugging tools, etc.
- [ ] `dunno` — I don't know
commit 16b84ef38e
Merge: 4c854f4cb5557f6be5
Author: Steve Ruiz <steveruizok@gmail.com>
Date: Wed Apr 3 10:53:20 2024 +0100
Merge branch 'main' into stickies-rc
commit 5557f6be5b
Author: David Sheldrick <d.j.sheldrick@gmail.com>
Date: Wed Apr 3 10:31:28 2024 +0100
Revert "squish sync data events before sending them out" (#3331)
Reverts tldraw/tldraw#3118
commit 4c854f4cb8
Author: Lu[ke] Wilson <l2wilson94@gmail.com>
Date: Wed Apr 3 09:45:09 2024 +0100
fix api
commit 0e912fe0f2
Author: Taha <98838967+Taha-Hassan-Git@users.noreply.github.com>
Date: Tue Apr 2 17:22:58 2024 +0100
Fix text resizing bug (#3327)
Fixes a bug with text resizing on text shapes, now the transform origin
is set depending on the alignment.
![2024-04-02 at 16 50 49 - Aqua
Snail](https://github.com/tldraw/tldraw/assets/98838967/86b59691-e950-4367-8632-03ae6dfef7f6)
![2024-04-02 at 16 49 37 - Teal
Tuna](https://github.com/tldraw/tldraw/assets/98838967/6b6c97a8-fc53-45a0-8282-6bd63e77507b)
### Change Type
<!-- ❗ Please select a 'Scope' label ❗️ -->
- [x] `sdk` — Changes the tldraw SDK
- [ ] `dotcom` — Changes the tldraw.com web app
- [ ] `docs` — Changes to the documentation, examples, or templates.
- [ ] `vs code` — Changes to the vscode plugin
- [ ] `internal` — Does not affect user-facing stuff
<!-- ❗ Please select a 'Type' label ❗️ -->
- [x] `bugfix` — Bug fix
- [ ] `feature` — New feature
- [ ] `improvement` — Improving existing features
- [ ] `chore` — Updating dependencies, other boring stuff
- [ ] `galaxy brain` — Architectural changes
- [ ] `tests` — Changes to any test code
- [ ] `tools` — Changes to infrastructure, CI, internal scripts,
debugging tools, etc.
- [ ] `dunno` — I don't know
### Test Plan
1. Make a text shape
2. resize it
3. It should stay within the bounds
### Release Notes
- Fixes an issue with text shapes overflowing their bounds when resized.
commit 584380ba8b
Author: Mitja Bezenšek <mitja.bezensek@gmail.com>
Date: Tue Apr 2 16:29:14 2024 +0200
Input buffering (#3223)
This PR buffs input events.
## The story so far
In the olde days, we throttled events from the canvas events hook so
that a pointer event would only be sent every 1/60th of a second. This
was fine but made drawing on the iPad / 120FPS displays a little sad.
Then we removed this throttle. It seemed fine! Drawing at 120FPS was
great. We improved some rendering speeds and tightened some loops so
that the engine could keep up with 2x the number of points in a line.
Then we started noticing that iPads and other screens could start
choking on events as it received new inputs and tried to process and
render inputs while still recovering from a previous dropped frame. Even
worse, on iPad the work of rendering at 120FPS was causing the browser
to throttle the app after some sustained drawing. Yikes!
### Batching
I did an experimental PR (#3180) to bring back batching but do it in the
editor instead. What we would do is: rather than immediately processing
an event when we get it, we would instead put the event into a buffer.
On the next 60FPS tick, we would flush the buffer and process all of the
events. We'd have them all in the same transaction so that the app would
only render once.
### Render batching?
We then tried batching the renders, so that the app would only ever
render once per (next) frame. This added a bunch of complexity around
events that needed to happen synchronously, such as writing text in a
text field. Some inputs could "lag" in a way familiar to anyone who's
tried to update an input's state asynchronously. So we backed out of
this.
### Coalescing?
Another idea from @ds300 was to "coalesce" the events. This would be
useful because, while some interactions like drawing would require the
in-between frames in order to avoid data loss, most interactions (like
resizing) didn't actually need the in-between frames, they could just
use the last input of a given type.
Coalescing turned out to be trickier than we thought, though. Often a
state node required information from elsewhere in the app when
processing an event (such as camera position or page point, which is
derived from the camera position), and so the coalesced events would
need to also include this information or else the handlers wouldn't work
the way they should when processing the "final" event during a tick.
So we backed out of the coalescing strategy for now. Here's the [PR that
removes](937469d69d)
it.
### Let's just buffer the fuckers
So this PR now should only include input buffering.
I think there are ways to achieve the same coalescing-like results
through the state nodes, which could gather information during the
`onPointerMove` handler and then actually make changes during the
`onTick` handler, so that the changes are only done as many time as
necessary. This should help with e.g. resizing lots of shapes at once.
But first let's land the buffering!
---
Mitja's original text:
This PR builds on top of Steve's [experiment
PR](https://github.com/tldraw/tldraw/pull/3180) here. It also adds event
coalescing for [`pointerMove`
events](https://github.com/tldraw/tldraw/blob/mitja/input-buffering/packages/editor/src/lib/editor/Editor.ts#L8364-L8368).
The API is [somewhat similar
](https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent/getCoalescedEvents)
to `getCoalescedEvent`. In `StateNodes` we register an `onPointerMove`
handler. When the event happens it gets called with the event `info`.
There's now an additional field on `TLMovePointerEvent` called
`coalescedInfo` which includes all the events. It's then on the user to
process all of these.
I decided on this API since it allows us to only expose one event
handler, but it still gives the users access to all events if they need
them.
We would otherwise either need to:
- Expose two events (coalesced and non-coalesced one and complicate the
api) so that state nodes like Resizing would not be triggered for each
pointer move.
- Offer some methods on the editor that would allow use to get the
coalesced information. Then the nodes that need that info could request
it. I [tried
this](9ad973da3a (diff-32f1de9a5a9ec72aa49a8d18a237fbfff301610f4689a4af6b37f47af435aafcR67)),
but it didn't feel good.
This also complicated the editor inputs. The events need to store
information about the event (like the mouse position when the event
happened for `onPointerMove`). But we cannot immediately update inputs
when the event happens. To make this work for `pointerMove` events I've
added `pagePoint`. It's
[calculated](https://github.com/tldraw/tldraw/pull/3223/files#diff-980beb0aa0ee9aa6d1cd386cef3dc05a500c030638ffb58d45fd11b79126103fR71)
when the event triggers and then consumers can get it straight from the
event (like
[Drawing](https://github.com/tldraw/tldraw/pull/3223/files#diff-32f1de9a5a9ec72aa49a8d18a237fbfff301610f4689a4af6b37f47af435aafcR104)).
### Change Type
<!-- ❗ Please select a 'Scope' label ❗️ -->
- [x] `sdk` — Changes the tldraw SDK
- [ ] `dotcom` — Changes the tldraw.com web app
- [ ] `docs` — Changes to the documentation, examples, or templates.
- [ ] `vs code` — Changes to the vscode plugin
- [ ] `internal` — Does not affect user-facing stuff
<!-- ❗ Please select a 'Type' label ❗️ -->
- [ ] `bugfix` — Bug fix
- [ ] `feature` — New feature
- [x] `improvement` — Improving existing features
- [ ] `chore` — Updating dependencies, other boring stuff
- [ ] `galaxy brain` — Architectural changes
- [ ] `tests` — Changes to any test code
- [ ] `tools` — Changes to infrastructure, CI, internal scripts,
debugging tools, etc.
- [ ] `dunno` — I don't know
### Test Plan
1. Add a step-by-step description of how to test your PR here.
4.
- [ ] Unit Tests
- [ ] End to end tests
### Release Notes
- Add a brief release note for your PR here.
---------
Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
commit b87f007df4
Merge: 5ee01f1c0d96b69394
Author: Steve Ruiz <steveruizok@gmail.com>
Date: Tue Apr 2 14:45:46 2024 +0100
Merge branch 'stickies-rc' of https://github.com/tldraw/tldraw into stickies-rc
commit 5ee01f1c07
Author: Steve Ruiz <steveruizok@gmail.com>
Date: Tue Apr 2 14:45:38 2024 +0100
highest one first