Commit graph

2042 commits

Author SHA1 Message Date
Steve Ruiz
0323ee1f6b
[fix] dark mode (#1754)
This PR fixes a bug where dark mode would not immediately cause shapes
to update their colors. Previously, we got the current theme during
render but not in a way that hooked into the change. In this update, we
hook into the change. We also pass the change down to shape fills as
props rather than getting the theme from deeper down.

### Change Type

- [x] `patch`

### Test Plan

1. Use dark mode.
2. Switch colors

### Release Notes

- [fix] dark mode colors not updating
2023-07-20 11:38:55 +00:00
Steve Ruiz
b22ea7cd4e
More cleanup, focus bug fixes (#1749)
This PR is another grab bag:
- renames `readOnly` to `readonly` throughout editor
- fixes a regression related to focus and keyboard shortcuts
- adds a small outline for focused editors

### Change Type

- [x] `major`

### Test Plan

- [x] End to end tests
2023-07-19 10:52:21 +00:00
Steve Ruiz
6309cbe6a5
move some utils into tldraw/utils (#1750)
This PR moves certain shared utilities (for images, etc.) to
@tldraw/utils.

### Change Type

- [x] `major` — Breaking change
2023-07-19 10:50:40 +00:00
Ricardo Crespo
f1f706f0b6
[fix]: Fix typo in shapeType declaration (#1747)
Fix minor typo error in shapeType declaration

**Change Type**

- [x] `patch`

**Test Plan**

- [x]  Unit Tests
- [ ]  End to end tests

**Release Notes**

Fix typo

Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
2023-07-18 22:36:20 +00:00
Steve Ruiz
789b1d1ac6
Fix e2e test (#1748)
This PR fixes a failing end to end test that snuck in.

### Change Type

- [x] `tests` — Changes to any test code only[^2]

### Test Plan

- [x] End to end tests
2023-07-18 22:13:11 +00:00
Steve Ruiz
3e31ef2a7d
Remove helpers / extraneous API methods. (#1745)
This PR removes several extraneous computed values from the editor. It
adds some silly instance state onto the instance state record and
unifies a few methods which were inconsistent. This is fit and finish
work 🧽

## Computed Values

In general, where once we had a getter and setter for `isBlahMode`,
which really masked either an `_isBlahMode` atom on the editor or
`instanceState.isBlahMode`, these are merged into `instanceState`; they
can be accessed / updated via `editor.instanceState` /
`editor.updateInstanceState`.

## tldraw select tool specific things

This PR also removes some tldraw specific state checks and creates new
component overrides to allow us to include them in tldraw/tldraw.

### Change Type

- [x] `major` — Breaking change

### Test Plan

- [x] Unit Tests
- [x] End to end tests

### Release Notes

- [tldraw] rename `useReadonly` to `useReadOnly`
- [editor] remove `Editor.isDarkMode`
- [editor] remove `Editor.isChangingStyle`
- [editor] remove `Editor.isCoarsePointer`
- [editor] remove `Editor.isDarkMode`
- [editor] remove `Editor.isFocused`
- [editor] remove `Editor.isGridMode`
- [editor] remove `Editor.isPenMode`
- [editor] remove `Editor.isReadOnly`
- [editor] remove `Editor.isSnapMode`
- [editor] remove `Editor.isToolLocked`
- [editor] remove `Editor.locale`
- [editor] rename `Editor.pageState` to `Editor.currentPageState`
- [editor] add `Editor.pageStates`
- [editor] add `Editor.setErasingIds`
- [editor] add `Editor.setEditingId`
- [editor] add several new component overrides
2023-07-18 21:50:23 +00:00
Steve Ruiz
a7d3a77cb0
(chore) bump (#1744)
Bump deps to fix build

### Change Type

- [x] `dependencies`
2023-07-18 10:19:28 +00:00
Lu Wilson
5c095e0b7e
add shapes docs content (#1705)
This PR adds a bunch of brain-dump content onto the Shapes docs page.
There's more to add, but I'm submitting what I've done so far.

The main addition is explaining the concept of 'shapes' outside of the
context of creating a custom shape. I think it's good to do the basics
before getting into the world of custom stuff.

Note: I've also moved the Meta section from the Editor page to the
Shapes page.
 
### Change Type

- [x] `documentation` — Changes to the documentation only[^2]

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### Release Notes

- Documentation: Added more info about shapes.

---------

Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
2023-07-17 22:06:20 +00:00
Gabriel Lee
e276937df8
fix: escape eraser tool on escape (#1732)
Escape the eraser tool on pressing the escape key.

(note that the same bug exists for the laser tool, i'm not sure if the
escape key behaviour should be the same for it too)


![licecap-output](https://github.com/tldraw/tldraw/assets/5616556/14bcb1f3-325c-4d28-ad39-a6a7205bd011)

Fixes #1731 

### Change Type

- [x] `patch` — Bug fix
- [ ] `minor` — New feature
- [ ] `major` — Breaking change
- [ ] `dependencies` — Changes to package dependencies[^1]
- [ ] `documentation` — Changes to the documentation only[^2]
- [ ] `tests` — Changes to any test code only[^2]
- [ ] `internal` — Any other changes that don't affect the published
package[^2]
- [ ] I don't know

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### Test Plan

1. Select eraser tool
2. Press [escape], you should be back in the select tool
3. Select eraser tool, and start dragging around and press [escape], the
behaviour should be same as before

- [ ] Unit Tests
- [ ] End to end tests

### Release Notes

- escape eraser tool on escape

---------

Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
2023-07-17 21:59:27 +00:00
Gabriel Lee
f63ddc7ecc
fix: arrow label dark mode color (#1733)
This PR fixes the issue where the arrow label was black in dark mode
instead of white.

light mode (normal):
<img width="600" alt="Screenshot 2023-07-12 at 00 21 35"
src="https://github.com/tldraw/tldraw/assets/5616556/2ac5e951-7777-4e96-9dde-a410a754aa01">

dark mode (before):
<img width="600" alt="Screenshot 2023-07-12 at 00 21 52"
src="https://github.com/tldraw/tldraw/assets/5616556/c67c3309-2847-4499-b4ef-6ba686e1382e">

dark mode (after):
<img width="600" alt="Screenshot 2023-07-12 at 00 21 44"
src="https://github.com/tldraw/tldraw/assets/5616556/244987c0-4570-410b-8975-43db47b786fa">

Fixes #1716 

### Change Type

- [x] `patch` — Bug fix
- [ ] `minor` — New feature
- [ ] `major` — Breaking change
- [ ] `dependencies` — Changes to package dependencies[^1]
- [ ] `documentation` — Changes to the documentation only[^2]
- [ ] `tests` — Changes to any test code only[^2]
- [ ] `internal` — Any other changes that don't affect the published
package[^2]
- [ ] I don't know

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### Test Plan

1. Add an arrow with label
2. Switch between dark and light mode and notice that the label color
adapts correctly

- [ ] Unit Tests
- [ ] End to end tests

### Release Notes

- fixed arrow label dark mode color

Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
2023-07-17 21:58:05 +00:00
Steve Ruiz
b7d9c8684c
tldraw zero - package shuffle (#1710)
This PR moves code between our packages so that:
- @tldraw/editor is a “core” library with the engine and canvas but no
shapes, tools, or other things
- @tldraw/tldraw contains everything particular to the experience we’ve
built for tldraw

At first look, this might seem like a step away from customization and
configuration, however I believe it greatly increases the configuration
potential of the @tldraw/editor while also providing a more accurate
reflection of what configuration options actually exist for
@tldraw/tldraw.

## Library changes

@tldraw/editor re-exports its dependencies and @tldraw/tldraw re-exports
@tldraw/editor.

- users of @tldraw/editor WITHOUT @tldraw/tldraw should almost always
only import things from @tldraw/editor.
- users of @tldraw/tldraw should almost always only import things from
@tldraw/tldraw.

- @tldraw/polyfills is merged into @tldraw/editor
- @tldraw/indices is merged into @tldraw/editor
- @tldraw/primitives is merged mostly into @tldraw/editor, partially
into @tldraw/tldraw
- @tldraw/file-format is merged into @tldraw/tldraw
- @tldraw/ui is merged into @tldraw/tldraw

Many (many) utils and other code is moved from the editor to tldraw. For
example, embeds now are entirely an feature of @tldraw/tldraw. The only
big chunk of code left in core is related to arrow handling.

## API Changes

The editor can now be used without tldraw's assets. We load them in
@tldraw/tldraw instead, so feel free to use whatever fonts or images or
whatever that you like with the editor.

All tools and shapes (except for the `Group` shape) are moved to
@tldraw/tldraw. This includes the `select` tool.

You should use the editor with at least one tool, however, so you now
also need to send in an `initialState` prop to the Editor /
<TldrawEditor> component indicating which state the editor should begin
in.

The `components` prop now also accepts `SelectionForeground`.

The complex selection component that we use for tldraw is moved to
@tldraw/tldraw. The default component is quite basic but can easily be
replaced via the `components` prop. We pass down our tldraw-flavored
SelectionFg via `components`.

Likewise with the `Scribble` component: the `DefaultScribble` no longer
uses our freehand tech and is a simple path instead. We pass down the
tldraw-flavored scribble via `components`.

The `ExternalContentManager` (`Editor.externalContentManager`) is
removed and replaced with a mapping of types to handlers.

- Register new content handlers with
`Editor.registerExternalContentHandler`.
- Register new asset creation handlers (for files and URLs) with
`Editor.registerExternalAssetHandler`

### Change Type

- [x] `major` — Breaking change

### Test Plan

- [x] Unit Tests
- [x] End to end tests

### Release Notes

- [@tldraw/editor] lots, wip
- [@tldraw/ui] gone, merged to tldraw/tldraw
- [@tldraw/polyfills] gone, merged to tldraw/editor
- [@tldraw/primitives] gone, merged to tldraw/editor / tldraw/tldraw
- [@tldraw/indices] gone, merged to tldraw/editor
- [@tldraw/file-format] gone, merged to tldraw/tldraw

---------

Co-authored-by: alex <alex@dytry.ch>
2023-07-17 21:22:34 +00:00
Steve Ruiz
43a0dd83f8
support custom shapes in yjs example (#1737)
This PR adds support for custom shapes (`shapes`) to the y.js example. A
user should pass the same data to the `useYjsStore` hook as they pass to
the `<Tldraw>` component.

### Change Type

- [x] `internal`
2023-07-14 20:33:57 +00:00
Mitja Bezenšek
1e07ae51dc
Bump vs code version. (#1735)
Bumps the VS Code version.

### Change Type

- [x] `patch` — Bug fix
- [ ] `minor` — New feature
- [ ] `major` — Breaking change
- [ ] `dependencies` — Changes to package dependencies[^1]
- [ ] `documentation` — Changes to the documentation only[^2]
- [ ] `tests` — Changes to any test code only[^2]
- [ ] `internal` — Any other changes that don't affect the published
package[^2]
- [ ] I don't know

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version
2023-07-12 08:37:04 +00:00
David Sheldrick
b7884c6d67
[fix] add cloud tooltip (#1728)
Fix cloud tool tooltip

### Change Type

- [x] `patch` — Bug fix
- [ ] `minor` — New feature
- [ ] `major` — Breaking change
- [ ] `dependencies` — Changes to package dependencies[^1]
- [ ] `documentation` — Changes to the documentation only[^2]
- [ ] `tests` — Changes to any test code only[^2]
- [ ] `internal` — Any other changes that don't affect the published
package[^2]
- [ ] I don't know

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### 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.
2023-07-11 10:01:53 +00:00
Lu Wilson
30b0a4d736
(2/2) Add content to Tools docs page. (#1721)
This PR adds some tools docs. There's more to come (eventually), but
this is what's finished so far.

This PR relies on this brivate one landing first:
https://github.com/tldraw/brivate/pull/2223

### Change Type

- [x] `documentation` — Changes to the documentation only[^2]

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### Release Notes

- Tools docs.
2023-07-10 08:43:58 +00:00
David Sheldrick
eeb41d4e69
tweaks for cloud shape (#1723)
This makes the bumps on the curvy parts more bumpy, and improves the way
inky clouds are drawn to make it less likely to produce double lines
that do not fully overlap.

<img width="1066" alt="image"
src="https://github.com/tldraw/tldraw/assets/1242537/6119c6e8-ceee-4cf6-b393-70efbbdd6373">


### Change Type

- [x] `patch` — Bug fix
- [ ] `minor` — New feature
- [ ] `major` — Breaking change
- [ ] `dependencies` — Changes to package dependencies[^1]
- [ ] `documentation` — Changes to the documentation only[^2]
- [ ] `tests` — Changes to any test code only[^2]
- [ ] `internal` — Any other changes that don't affect the published
package[^2]
- [ ] I don't know

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### 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.
2023-07-10 07:55:28 +00:00
David Sheldrick
83a391b46b
Add cloud shape (#1708)
![Kapture 2023-07-04 at 16 36
31](https://github.com/tldraw/tldraw/assets/1242537/bcb19959-ac66-46fa-92ea-50fe4692a96c)


### Change Type

- [x] `minor` — New feature


[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### Test Plan

1. Make some cloud shapes, try different sizes, colors, fills.
2. Export cloud shapes to images.

- [ ] Unit Tests
- [ ] End to end tests

### Release Notes

- Adds a cloud shape.
2023-07-07 15:32:08 +00:00
Steve Ruiz
910be6073f
[refactor] reduce dependencies on shape utils in editor (#1693)
We'd like to make the @tldraw/editor layer more independent of specific
shapes. Unfortunately there are many places where shape types and
certain shape behavior is deeply embedded in the Editor. This PR begins
to refactor out dependencies between the editor library and shape utils.

It does this in two ways:
- removing shape utils from the arguments of `isShapeOfType`, replacing
with a generic
- removing shape utils from the arguments of `getShapeUtil`, replacing
with a generic
- moving custom arrow info cache out of the util and into the editor
class
- changing the a tool's `shapeType` to be a string instead of a shape
util

We're here trading type safety based on inferred types—"hey editor, give
me your instance of this shape util class"—for knowledge at the point of
call—"hey editor, give me a shape util class of this type; and trust me
it'll be an instance this shape util class". Likewise for shapes.

### A note on style 

We haven't really established our conventions or style when it comes to
types, but I'm increasingly of the opinion that we should defer to the
point of call to narrow a type based on generics (keeping the types in
typescript land) rather than using arguments, which blur into JavaScript
land.

### Change Type

- [x] `major` — Breaking change

### Test Plan

- [x] Unit Tests

### Release Notes

- removes shape utils from the arguments of `isShapeOfType`, replacing
with a generic
- removes shape utils from the arguments of `getShapeUtil`, replacing
with a generic
- moves custom arrow info cache out of the util and into the editor
class
- changes the a tool's `shapeType` to be a string instead of a shape
util
2023-07-07 13:56:31 +00:00
Lu Wilson
d99c4a0e9c
Make some missing tsdocs appear on the docs site (#1706)
🚨 Note 🚨
This PR has changed! See my [newer
comment](https://github.com/tldraw/tldraw/pull/1706#issuecomment-1623451709)
for what the PR does now.
This description is kept here to show the original intention of the PR.

---

This PR fixes the tsdocs formatting of `TldrawEditorProps`, so that they
appears on the docs site.

We have docs already written, but they weren't appearing. There are
probably others like this too.


![image](https://github.com/tldraw/tldraw/assets/15892272/8d8940b3-983f-48b3-9804-7ac88116ca9d)

### Change Type

- [x] `documentation` — Changes to the documentation only[^2]

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### Test Plan

1. Navigate to `/gen/editor/TldrawEditorProps`
2. Make sure that that the parameters are listed out with descriptions.

- [ ] Unit Tests
- [ ] End to end tests

### Release Notes

- Docs: Fixed some missing docs for the TldrawEditor component.
2023-07-07 11:50:47 +00:00
Lu Wilson
f745781056
[hot take] remove tool from shape definition (#1691)
This PR removes the `tool` parameter from the `defineShape` function.
It's an opinionated change that I think we should at the very least
consider.

## What's the context?

Currently, you can add **tools** (aka state nodes) to your state chart
in two different ways:

1. Passing them to the `<Tldraw>` component with the `tools` attribute.
2. As part of a shape definition's `tool` property, which you then pass
to the `<Tldraw>` component with the `shapes` attribute.

This is what (1) looks like:

```jsx
import { MyTool } from "./MyTool"

function Example() {
  return <Tldraw tools={[MyTool]} />
}
```

This is what (2) looks like:

```jsx
import { MyTool } from "./MyTool"
import { MyShapeUtil, myShapeProps } from "./MyShape"

const MyShapeDefinition = defineShape("my-shape", {
  util: MyShapeUtil,
  props: myShapeProps,
  tool: MyTool,
})

function Example() {
  return <Tldraw shapes={[MyShapeDefinition]} />
}
```

Clearly, (1) is better for when you want to add *just a tool*, that
doesn't have an associated shape.
And (2) is better for when you want to add *both* a tool and an
associated shape.

## Why change it?

I think we should remove method (2). Because I think that it adds a few
complications.


#### Does it help?

I don't think that it helps to streamline the process of coupling shapes
and tools. You still need to remember to add your tool.

Seeing as `tool` is optional on the shape definition (rightly so), it
doesn't prompt you to do it.

#### What's easier to explain?

I think it's easier to just have to explain _one method_. It would take
longer to explain two methods, and it complicates the concepts involved.

Seeing as there's not a big benefit to one method over the other, the
added explanation wouldn't be a good trade-off.

#### What happens if I use both?

It's unclear to the user what would happen if they use both methods. Do
we know what the intended behaviour of this would be? I think this will
happen often.

```jsx
import { MyTool } from "./MyTool"
import { MyShapeUtil, myShapeProps } from "./MyShape"

const MyShapeDefinition = defineShape("my-shape", {
  util: MyShapeUtil,
  props: myShapeProps,
  tool: MyTool,
})

function Example() {
  return <Tldraw tools={[MyTool]} shapes={[MyShapeDefinition]} />
}
```

#### Does it fit my shape/tool?

Many shapes are coupled closely with one tool. But some shapes would
involve multiple tools. And some tools would involve multiple shapes.

For example, you might first add a tool and a shape that go nicely
together, so you use method (2). But two months later, you decide that
you want another tool to be able to make this shape too. Now you've
inserted your related tools in two different places, unless you
refactor.

Alternatively, you might want to add some more functionality to your
tool, so that it can make multiple types of shapes. Instead of
refactoring the existing shape, you want to create an entirely new
shape, to keep your new code separate. Should you add the `tool`
property to the new shape as well? What would happen if you did/didn't?
What happens if you later disable the original shape? Would you need to
move the `tool` property from there to the newer shape?

It would be a lot simpler to just have the tool in your list of tools,
instead of having them tangled up with shapes.

#### Plugins?

We've been considering moving towards some sort of 'plugins' system in
the future, that could collect together shapes, tools, and other stuff.

I think that a more complete concept of a 'plugin' would be the best
place to collect together shapes, and tools — not on the shape itself.

### Change Type

- [x] `major` — Breaking change

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### Test Plan

1. Try using all of the app's tools, making sure they still work.

- [ ] Unit Tests
- [ ] End to end tests

### Release Notes

- [dev] Removed the `tool` property from `defineShape`
2023-07-07 11:44:57 +00:00
Steve Ruiz
103809b83e
[refactor] reordering shapes (#1718)
This PR:
- adds tests for shape reordering
- removes `Editor.getParentsMappedToChildren`
- removes `Editor.reorderShapes`
- moves reordering shapes code into its own file, outside of the editor

### Change Type

- [x] `major` — Breaking change (if you were using those APIs)

### Release Notes

- [api] removes `Editor.getParentsMappedToChildren`
- [api] removes `Editor.reorderShapes`
- [api] moves reordering shapes code into its own file, outside of the
editor
2023-07-07 11:29:31 +00:00
Mitja Bezenšek
85db9ba469
Bump vs code version. (#1719)
Bump vs code version for a new version release.

### Change Type

- [x] `patch` — Bug fix
2023-07-07 10:47:15 +00:00
Steve Ruiz
7fe43bb2ef
remove state checks for brush and zoom brush (#1717)
This PR removes the strict state checks for the brush and zoom brush. We
should consider making the canvas more controlled by what exists (e.g.
whether a `brush` exists) rather than depending on particular statechart
states.

### Change Type

- [x] `minor`

### Test Plan

1. Create a brush manually in the API.
2. The brush should be visible on the canvas.

### Release Notes

- [editor] remove `editor.isIn` state checks for displaying brush and
zoom brush.
2023-07-07 09:38:16 +00:00
Lu Wilson
a316fd2ab4
Add API links to all docs pages (#1661)
This PR adds links to the API reference from within the docs pages.
I think we should continue with this as we move forwards with more
content.

We could tweak the threshold of what we link or don't link. I tried to
strike a good balance (maybe linked too much though). We'd want lots of
stuff to be clickable, so that users can dive into the API. But we don't
want the screen to be a splattering of blue, distracting away from more
important stuff.

### Change Type

- [x] `documentation` — Changes to the documentation only[^2]

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### Test Plan

1. Try out some of the newly added links on the docs site.

- [ ] Unit Tests
- [ ] End to end tests

### Release Notes

- Documentation: Added links to API reference in guides.
2023-07-06 14:01:11 +00:00
Steve Ruiz
80595232d2
[internal] Add basic list to examples (#1688)
This PR adds a basic list of all examples to the examples site

### Change Type

- [x] `internal`
2023-07-05 14:07:28 +00:00
Mitja Bezenšek
090e148552
Go back to default cursor when done resizing. (#1700)
Once we are done resizing (when inserting text) we now show the default
cursor.

Fixes #1699 

### Change Type

- [x] `patch` — Bug fix


### Test Plan

1. Select text tool
2. Insert a text shape by dragging to select it's size.
3. After you are done dragging the cursor should go back to the default
cursor.

### Release Notes

- Switch back to the default cursor after you are done inserting a new
text shape.
2023-07-05 14:06:46 +00:00
alex
eba7b8c6a6
cleanup (#1711)
I accidentally checked in a bunch of stuff i shouldn't. oops.

### Change Type

- [ ] `patch` — Bug fix
- [ ] `minor` — New feature
- [ ] `major` — Breaking change
- [ ] `dependencies` — Changes to package dependencies[^1]
- [ ] `documentation` — Changes to the documentation only[^2]
- [ ] `tests` — Changes to any test code only[^2]
- [x] `internal` — Any other changes that don't affect the published
package[^2]
- [ ] I don't know

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version
2023-07-05 08:55:56 +00:00
Lu Wilson
d965c9f6c9
Firefox: Fix coarse pointer issue (#1701)
This PR fixes the editor sometimes incorrectly assuming that you're
using a coarse pointer in firefox. It's not a complete fix — it just
avoids some of the bigger issues with it. ie: It disables cursor chat.

To avoid the issue, we just assume that you have a fine pointer if
you're using firefox on desktop.

Eventually, we should do a more complete fix for this.

I QA'd this change on:
* Mac Firefox (no touch screen)
* Windows Firefox (touch screen)
* Android Firefox

### Change Type

- [x] `patch` — Bug fix

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### Test Plan

1. Use firefox on desktop with a touch screen.
2. Check that you can still use cursor chat (when in a shared project).

- [ ] Unit Tests
- [ ] End to end tests

### Release Notes

- Fixed firefox not being able to use cursor chat when using a touch
screen on desktop.
2023-07-04 15:24:20 +00:00
Lu Wilson
d314c1ab01
Fix tsdocs for TldrawUi component (#1707)
This PR fixes the tsdocs formatting on the TldrawUi component so that
they appear on the docs site. Very similar to
https://github.com/tldraw/tldraw/pull/1706

### Change Type

- [x] `documentation` — Changes to the documentation only[^2]

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### Test Plan

1. Go to `/gen/ui/TldrawUiProps`
2. Make sure that there are descriptions for all parameters.

- [ ] Unit Tests
- [ ] End to end tests

### Release Notes

- Docs: Show some docs missing from TldrawUi component.
2023-07-04 15:24:11 +00:00
huppy-bot[bot]
43442070c2 Update CHANGELOG.md [skip ci] 2023-07-04 14:21:37 +00:00
Mitja Bezenšek
f44551104b
Disable styles panel button on mobile when using the laser tool. (#1704)
Disable the style panel button on mobile layouts when using the laser
tool.

Fixes #1702 
### Change Type

- [x] `patch` — Bug fix

### Test Plan

1. Use a mobile layout.
2. Select laser tool
3. Make sure you cannot click the style panel button - it should be
disabled.

### Release Notes

- Disable the styles panel button for laser tool on mobile.
2023-07-04 10:45:01 +00:00
alex
c893a02878
remove lock option from highlighter (#1703)
Highlighter is autolocked, so we shouldn't show the lock icon 

### Change Type

- [x] `patch` — Bug fix


[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### 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

- We no longer show the tool lock option for highlighter - it didn't do
anything anyway
2023-07-04 10:41:14 +00:00
Steve Ruiz
603966486d
[fix] penmode (#1698)
This PR fixes pen mode.

### Change Type

- [x] `patch` — Bug fix

### Test Plan

1. On iPad, use the pencil to enter pen mode
2. Select the draw tool
3. touch the screen

- [x] Unit Tests (sort of)

### Release Notes

- [fix] pen mode
2023-07-04 10:11:57 +00:00
Lu Wilson
2aa6c4cbe3
Lokalise: Translations update (#1694)
This pull request was initiated by Lokalise (user Lu) at 2023-07-04
11:04:05
2023-07-04 10:10:57 +00:00
Lu Wilson
8ebeb72ef0
Update readme (#1686)
This PR updates the repo's readme. Some things were out-of-date. For
example, the 'hello world' example didn't work.

See code comments for more detail!

### Change Type

- [x] `documentation` — Changes to the documentation only[^2]

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### Release Notes

- Documentation: Updated readme to reflect recent library changes.
2023-07-04 10:07:05 +00:00
Steve Ruiz
5174d3f466
[fix] indicator not updating (#1696)
This PR fixes the indicator bug
(https://github.com/orgs/tldraw/projects/16/views/1?pane=issue&itemId=32402403).

### Change Type

- [x] `patch` — Bug fix
2023-07-04 10:06:45 +00:00
David Sheldrick
b5edaeb950
[infra] use huppy token for publish-new (#1687)
This PR sets up our publish-new script to use Huppy's GH token. At the
same time I added huppy to a list of actors who are allowed to override
the branch protection rules for `main` so hopefully next time we run the
release script the push will succeed and the release will therefore also
succeed. I will create a test repo to see if that works and if it does
I'll merge this.

### Change Type

- [ ] `patch` — Bug fix
- [ ] `minor` — New feature
- [ ] `major` — Breaking change
- [ ] `dependencies` — Changes to package dependencies[^1]
- [ ] `documentation` — Changes to the documentation only[^2]
- [ ] `tests` — Changes to any test code only[^2]
- [x] `internal` — Any other changes that don't affect the published
package[^2]
- [ ] I don't know

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version
2023-06-30 16:00:04 +00:00
Steve Ruiz
b96d207f5f
[docs] Update multiple test (#1685)
This PR adds a bit of content to the multiple editor test so that we can
also test scrolling.

### Change Type

- [x] `documentation`
2023-06-30 13:30:06 +00:00
Lu Wilson
f07b915716
[docs] Fix the types in the Shapes example (#1681)
This PR fixes some incorrect types in the example on the Shapes page of
the docs.

### Change Type

- [x] `documentation` — Changes to the documentation only[^2]

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### Release Notes

- Documentation: Fix some incorrect types on the Shapes page.
2023-06-30 12:46:32 +00:00
Steve Ruiz
eb6aa9bbe4
[improvement] More nuanced cursor state (#1682)
This PR adds some more nuance to collaborator cursors.

Rather than being timed out or not timed out, a collaborator can now be
`active`, `idle` or `inactive`.

We calculate this based on the difference between the time that has
elapsed since the user's last activity timestamp.

After 3 seconds of inactivity, they go `idle`.
After sixty seconds of inactivity, they are `inactive`.
After any activity, they become `active` again.

When a user is `active`, we always show their cursor.
When a user is `idle`, we hide their cursor if they're following us,
unless they're highlighted
When a user is `inactive`, we hide their cursor unless they're
highlighted.

### Change Type

- [x] `minor`

### Test Plan

1. Find a friend and experiment with inactive times
2. Join a room that includes an inactive cursors; they should be hidden
on load
3. Have people follow you; do their timeouts feel natural?

### Release Notes

- Improve cursor timeouts and hiding logic.
2023-06-30 12:46:07 +00:00
Lu Wilson
0e7af29085
Fix VS Code commits failing on bublic? (#1680)
This PR should fix commits failing with the VS Code / Github Desktop ui
~~and help steve to stop using "ok" as a commit message~~

### Change Type

- [x] `internal` — Any other changes that don't affect the published
package[^2]

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### Release Notes

- [internal] fixed commits failing from bublic when using UI
2023-06-30 12:25:16 +00:00
Steve Ruiz
91dfdecc93
[fix] Lock shortcut (#1677)
This PR fixes the shortcut for lock shapes, which may be blocked by
browser defaults. We now use Shift+L instead of Cmd+Shift+L. Closes
https://github.com/tldraw/tldraw/issues/1676.

### Change Type

- [x] `patch` 

### Test Plan

1. Try the lock tool shortcuts.

- [x] End to end tests

### Release Notes

- [@tldraw/editor] Fix lock tool shortcut
2023-06-29 21:43:28 +00:00
Steve Ruiz
c524cac3f7
[fix] comma keyboard shortcuts (#1675)
This PR fixes some issues in our `useDocumentEvents`. It closes
https://github.com/tldraw/tldraw/issues/1667 (I think).

### Change Type

- [x] `patch`

### Release Notes

- [@tldraw/editor] Bug fixes on document events.
2023-06-29 20:30:33 +00:00
Steve Ruiz
cf2cc8c970
[improvement] add box sizing border box (#1674)
This PR adds `box-sizing: border-box` to the editor and its children.

### Change Type

- [x] `patch`

### Release Notes

- [@tldraw/editor] Add `box-sizing: border-box` to `tl-container`
2023-06-29 14:23:18 +00:00
Steve Ruiz
f1f584df94
[improvemnet] drop crc, Buffer dependency (#1673)
This PR incorporates a crc method from
https://github.com/alexgorbatchev/crc into the library, removing a peer
dependency on `buffer`. This was causing build errors in apps that did
not include the buffer library. (Our codebase included buffer because of
vsce.)

### Change Type

- [x] `patch`

### Release Notes

- [@tldraw/editor] Remove peer dependency on buffer.
2023-06-29 14:14:43 +00:00
Steve Ruiz
6faef733b6
[improvement] export scribble manager (#1671)
This PR adds the `ScribbleManager` to the exports from `@tldraw/editor`.

### Change Type

- [x] `minor` — New feature


### Release Notes

- [@tldraw/tldraw] Export `ScribbleManager`
2023-06-29 14:10:54 +00:00
Steve Ruiz
352c19fcac
[fix] rename global in @tldraw/state to avoid collissions (#1672)
We saw an issue on stackblitz where the `global` constant was causing a
conflict (possibly because that environment was injecting its own
`global`). Either way, perhaps `global` is a bit of a risky name—this PR
renames `global` to `tldrawStateGlobal`.

### Change Type

- [x] `patch`
2023-06-29 12:57:55 +00:00
Steve Ruiz
81ee3381bf
[fix] Shape rendering (#1670)
This PR fixes shape rendering logic. Remember! memo's 2nd argument
returns "when should we NOT render" not "when should we render"

### Change Type

- [x] `patch`

### Test Plan

1. Use the draw tool
2023-06-29 10:13:50 +00:00
Steve Ruiz
fd29006538
[feature] add meta property to records (#1627)
This PR adds a `meta` property to shapes and other records.

It adds it to:
- asset
- camera
- document
- instance
- instancePageState
- instancePresence
- page
- pointer
- rootShape

## Setting meta

This data can generally be added wherever you would normally update the
corresponding record.

An exception exists for shapes, which can be updated using a partial of
the `meta` in the same way that we update shapes with a partial of
`props`.

```ts
this.updateShapes([{
    id: myShape.id,
    type: "geo",
    meta: { 
      nemesis: "steve",
      special: true
    }
])
```

## `Editor.getInitialMetaForShape`

The `Editor.getInitialMetaForShape` method is kind of a hack to set the
initial meta property for newly created shapes. You can set it
externally. Escape hatch!

### Change Type

- [x] `minor` — New feature

### Test Plan

todo

- [ ] Unit Tests (todo)

### Release Notes

- todo
2023-06-28 14:24:05 +00:00
Steve Ruiz
3e07f70440
[fix] mutating snapshot in migrateStoreSnapshot (#1663)
This PR fixes an issue that I introduced where the `snapshot` argument
would be mutated by the `Store.migrateStoreSnapshot` method.

### Change Type

- [x] `patch`

### Release Notes

- [@tldraw/store] Fixed a bug that would cause
`Store.migrateStoreSnapshot` to mutate its `snapshot` argument.
2023-06-28 14:23:56 +00:00