This PR updates exports related to user presence, in order to enable
external sync solutions that use user presence.
### Change Type
- [x] `patch` — Bug fix
[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version
This PR removes the default SVG export for groups.
### Change Type
- [x] `patch` — Bug fix
### Test Plan
1. Create a group
2. Export it to SVG
### Release Notes
- Fix image exports for groups
This PR does a first-pass of adding tsdocs to the methods of the Editor
class.
It's a minimal start — just descriptions of them, and their parameters.
It makes the Editor docs page a lot more fleshed out though, and easier
to quickly scan.
There's still a lot more to do!
### Change Type
- [x] `documentation` — Changes to the documentation only[^2]
### Release Notes
- [dev] Added initial documentation for the Editor class.
---------
Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
This PR adds a generic that we can use with `updateShapes` and
`createShapes` in order to type the partials being passed into those
methods. By default, the partials are typed as `TLUnknownShape`, which
accepts any props.
### Change Type
- [x] `minor` — New feature
### Test Plan
- [x] Unit Tests
### Release Notes
- [editor] adds an optional shape generic to `updateShapes` and
`createShapes`
This PR fixes embeds to remove the `doesResize` prop when creating
embeds / converting between bookmarks and embeds.
### 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. Create an embed
2. Convert between bookmark and embed
This PR does some cleanup around our Embed Shape.
It:
- removes used `doesResize` and `overridePermissions` props
- removes the no-longer-needed `tmpOldUrl` prop
- adds a `canUnmount` property to embed definitions, so that some embeds
can unmount when desired
### Change Type
- [x] `patch` — Bug Fix
### Test Plan
1. Create embed shapes
2. Migrate old data that includes embed shapes?
- [x] Unit Tests
### Release Notes
- [editor] Remove unused props for `TLEditorShape`
- [editor] Adds `canUnmount` property to embed definitions
Move the preloading of assets to `TldrawEditorWithReadyStore` which
makes it sure that all codepaths preload assets. Before that didn't
happen for cases where we passed in an existing store - snapshots.
### Change Type
- [x] `patch` — Bug Fix
### Release notes
- Fix a problem where assets were not loading in some cases (snapshots).
This PR extracts some logic from the EditUrlDialog into the bookmark
shape util, removing the dependency between the two.
### Change Type
- [x] `internal` — Any other changes that don't affect the published
package (will not publish a new version)
### Test Plan
1. Create a bookmark shape
2. Set its URL to an empty string
- [x] Unit Tests
This diff adds a new property to `defineShape`: `tool`.
The tool prop allows shapes to bring a tool along with them as part of
their definition. E.g. the draw shape isn't much use without the draw
tool, so adding the draw shape to your app gives you the draw tool tool.
As part of this, i renamed the `shapeutils` folder to just `shapes`, and
moved a bunch of shape-specific tools from the tools folder into the
shapes folder. This more closely reflects how things will be once we
move our default shapes out of core for tldraw-zero.
### Change Type
- [x] `patch` — Bug fix
### Test Plan
Tested locally
### Release Notes
n/a
In my app, I have a sidebar and noticed that dropped shapes were being
created at an offset by the sidebar's width. This is because the current
point given to `putExternalContent` does not offset by the editor's
client rect.
Based on #1549, but with a lot of code-structure related changes backed
out. Shape schemas are still defined in tlschemas with this diff.
Couple differences between this and #1549:
- This tightens up the relationship between store schemas and editor
schemas a bit
- Reduces the number of places we need to remember to include core
shapes
- Only `<TLdrawEditor />` sets default shapes by default. If you're
doing something funky with lower-level APIs, you need to specify
`defaultShapes` manually
- Replaces `validator` with `props` for shapes
### Change Type
- [x] `major` — Breaking Change
### Test Plan
1. Add a step-by-step description of how to test your PR here.
2.
- [x] Unit Tests
- [ ] Webdriver tests
### Release Notes
[dev-facing, notes to come]
### Change Type
Change the `TLEventHandlers` of `onPointerLeave` to use `onPointerLeave`
- [x] `internal` — Any other changes that don't affect the published
package (will not publish a new version)
### Test Plan
I don't think we need to test something here because it's just a small
change that doesn't affect anything; just a type IMO
Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
This PR adds a yjs example to the examples app.
### Change Type
- [x] `internal` — Any other changes that don't affect the published
package (will not publish a new version)
### Release Notes
- [editor] Adds yjs example project
This PR does the following:
- Add `selfHosted.js`, which is a great option for users that wish to
self host the assets. Works well for both self hosting from the public
folder or via a CDN.
- Updates the docs for assets. We now have a dedicated page for assets
where all the options are more clearly explained. I also removed the
assets explanation from the main docs as the unpkg option should work
out of the box and setting up the assets is no longer necessary.
- Cleaned up the `refresh-assets` script. We now use common `types.d.ts`
file to define our types. All the other options then reuse them.
- Pulled out the `formatAssetUrl` into it's own file. It's now static an
no longer generated.
- `urls.d.ts`, `import.d.ts`, and newly added `selfhosted.d.ts` are now
also no longer generated as we can import the types from `types.d.ts`.
- You can now pass a subset of `assetUrls` to `<Tldraw />` and it will
override the default option with the passed in overrides. This makes it
easy to only customizes certain assets (only change the draw font as an
example).
### Change Type
- [x] `patch` — Bug Fix
Follow-up to #1555, taking care of a few more rare edge cases found
during fuzz testing.
### Change Type
<!-- 💡 Indicate the type of change your pull request is. -->
<!-- 🤷♀️ If you're not sure, don't select anything -->
<!-- ✂️ Feel free to delete unselected options -->
<!-- To select one, put an x in the box: [x] -->
- [x] `patch` — Bug Fix
This PR improves the editor's APIs around creating assets and files.
This allows end user developers to replace behavior that might occur,
for example, when pasting images or dragging files onto the canvas.
Here, we:
- remove `onCreateAssetFromFile` prop
- remove `onCreateBookmarkFromUrl` prop
- introduce `onEditorReady` prop
- introduce `onEditorWillDispose` prop
- introduce `ExternalContentManager`
The `ExternalContentManager` (ECM) is used in circumstances where we're
turning external content (text, images, urls, etc) into assets or
shapes. It is designed to allow certain methods to be overwritten by
other developers as a kind of weakly supported hack.
For example, when a user drags an image onto the canvas, the event
handler passes a `TLExternalContent` object to the editor's
`putExternalContent` method. This method runs the ECM's handler for this
content type. That handler may in turn run other methods, such as
`createAssetFromFile` or `createShapesForAssets`, which will lead to the
image being created on the canvas.
If a developer wanted to change the way that assets are created from
files, then they could overwrite that method at runtime.
```ts
const handleEditorReady = (editor: Editor) => {
editor.externalContentManager.createAssetFromFile = myHandler
}
function Example() {
return <Tldraw onEditorReady={handleEditorReady}/>
}
```
If you wanted to go even deeper, you could override the editor's
`putExternalContent` method.
```ts
const handleEditorReady = (editor: Editor) => {
const handleExternalContent = (info: TLExternalContent): Promise<void> => {
if (info.type === 'files') {
// do something here
} else {
// do the normal thing
editor.externalContentManager.handleContent(info)
}
}
```
### Change Type
- [x] `major`
### Test Plan
1. Drag images, urls, etc. onto the canvas
2. Use copy and paste for single and multiple files
3. Use bookmark / embed shapes and convert between eachother
### Release Notes
- [editor] add `ExternalContentManager` for plopping content onto the
canvas
- [editor] remove `onCreateAssetFromFile` prop
- [editor] remove `onCreateBookmarkFromUrl` prop
- [editor] introduce `onEditorReady` prop
- [editor] introduce `onEditorWillDispose` prop
- [editor] introduce `ExternalContentManager`
I've been doing some fuzz testing for the socket robustness work. This
PR pulls in the bublic fixes. It also fixes#1511
### Change Type
<!-- 💡 Indicate the type of change your pull request is. -->
<!-- 🤷♀️ If you're not sure, don't select anything -->
<!-- ✂️ Feel free to delete unselected options -->
<!-- To select one, put an x in the box: [x] -->
- [x] `patch` — Bug Fix
- [ ] `minor` — New Feature
- [ ] `major` — Breaking Change
- [ ] `dependencies` — Dependency Update (publishes a `patch` release,
for devDependencies use `internal`)
- [ ] `documentation` — Changes to the documentation only (will not
publish a new version)
- [ ] `tests` — Changes to any testing-related code only (will not
publish a new version)
- [ ] `internal` — Any other changes that don't affect the published
package (will not publish a new version)
### Test Plan
1. Create a frame in a multiplayer room
2. create two boxes inside the frame
3. draw an arrow connecting the two boxes
4. delete the frame
5. hit undo
6. the frame and boxes and arrows should reappear as they were before
### Release Notes
- Fixes a handful of state management bugs that manifest in multiplayer
rooms
This PR changes some App properties into methods, to make them
consistent with everything else.
Closes#1544
Is there any reason why we can't change any of these?
eg:
### Change Type
- [x] `documentation` — Changes to the documentation only (will not
publish a new version)
### Release Notes
- [docs] Fixed some methods that were incorrectly marked as properties.
This PR changes some Editor methods from internal to public, so that
they appear on the docs site.
Closes#1545
### Change Type
- [x] `documentation` — Changes to the documentation only (will not
publish a new version)
### Release Notes
- [docs] Changed some Editor methods from internal to public.
Use unpkg to host our assets and use that as a default. This will smooth
out the first run experience.
The way this works for different use cases:
- It doesn't change the asset loading for VS Code extension and
tldraw.com
- When running our examples (and our local development) [we still
override the
urls](4a9ef5044c/apps/examples/src/index.tsx (L32-L34))
to use the assets from the filesystem. This allows the assets to still
update when you change them.
- When you use our `Tldraw` component and when just copying the examples
code we will now serve the assets from unpkg by default.
I guess it's a breaking change since we will now use unpkg by default.
### Change Type
- [x] `major` — Breaking Change
### Release Notes
- Use unpkg asset hosting as a default.
This change hoists opacity out of props and changes it to a number
instead of an enum.
The change to a number is to make tldraw more flexible for library
consumers who might want more expressivity with opacity than our 5
possible values allow. the tldraw editor will now happily respect any
opacity between 0 and 1. The limit to our supported values is enforced
only in the UI. I think this is limited enough that it's a reasonable
tradeoff between in-app simplicity and giving external developers the
flexibility they need.
There's a new `opacityForNextShape` property on the instance. This works
exactly the same way as propsForNextShape does, except... it's just for
opacity. With this, there should be no user-facing changes to how
opacity works in tldraw. There are also new `opacity`/`setOpacity` APIs
in the editor that work with it/selections similar to how props do.
@ds300 do you mind reviewing the migrations here?
### Change Type
- [x] `major` — Breaking Change
### Test Plan
- [x] Unit Tests
- [ ] Webdriver tests
### Release Notes
[internal only for now]
Turns out there was one last terrible renaming PR to make. This PR
renames the `@tldraw.editor`'s `app` folder to `editor`. It should not
effect exports but it will be a gnarly diff.
### Change Type
- [x] `internal` — Any other changes that don't affect the published
package (will not publish a new version)
This PR prevents a crash when you try to curve an arrow that is pointing
a very small distance.
Fixes#1533
### Change Type
- [x] `patch` — Bug Fix
### Test Plan
1. Draw a line.
2. Draw an arrow from one point on the line to another point on the
line.
3. It might look weird or flicker (that's ok - that's a *different*
issue - we can fix it another time).
4. Move the middle handle of the arrow.
5. It should curve the arrow.
---
1. Open this snapshot link:
https://www.tldraw.com/s/v2_c_LtB3kVSYEyWuR-aCCrrUn
2. Copy its contents onto your own tldraw.
3. Click on the frog.
4. Drag the handle that's on the frog's face.
5. It shouldn't crash the app.
- [ ] Unit Tests
- [ ] Webdriver tests
### Release Notes
- Fixed a rare crash that could happen when you try to curve an arrow
with zero distance.
This PR adds vertical align to the note shape.
### Change Type
- [x] `minor` — New Feature
### Test Plan
1. Try the vertical align prop on note shapes
### Release Notes
- Adds vertical align prop to note shapes
Fix key code when pressing Shift, which fixes nudging.
### Change Type
- [x] `patch` — Bug Fix
### Test Plan
1. use the shift key to nudge things
### Release Notes
- Fix shift key nudging
Uses https://github.com/jhildenbiddle/canvas-size to determine the max
supported canvas size of the current browser, then scales exports
accordingly.
### Change Type
<!-- 💡 Indicate the type of change your pull request is. -->
<!-- 🤷♀️ If you're not sure, don't select anything -->
<!-- ✂️ Feel free to delete unselected options -->
<!-- To select one, put an x in the box: [x] -->
- [x] `patch` — Bug Fix
### Test Plan
Tested locally across a few browsers
### Release Notes
- Fix a bug where sometimes exports would fail when they were too big
for your browser. Now, they're scaled down to the max supported size.
This PR fixes control click for right click on Mac.
### Change Type
- [x] `patch` — Bug Fix
### Test Plan
1. On a PC, ensure that control clicking does not select the thing under
your cursor
2. On a mac, ensure that control clicking does select the thing under
your cursor before the context menu opens
### Release Notes
- Fix control click to open menu on Mac
This PR fixes a bug where you could undo following/unfollowing.
Fixes#1532
### Change Type
- [x] `patch` — Bug Fix
### Test Plan
1. In two browser sessions...
2. In a shared project...
3. Follow the other tab's user.
4. Draw something.
5. Unfollow them.
6. Close the people menu!
7. Undo as far as you can go.
8. Check that you don't start following them again at any point.
- [ ] Unit Tests
- [ ] Webdriver tests
### Release Notes
- Fixed a bug where you could undo viewport-following and
viewport-unfollowing.
Fixes https://github.com/tldraw/tldraw/issues/1534
### Change Type
- [x] `patch` — Bug Fix
### Test Plan
1. On a touch device, create a locked shape
2. Long press on the locked shape to select it and open the context menu
### Release Notes
Fixes the following issues with highlighter:
* Exported highlighter has much larger stroke width than in-app
highlighter
* Selecting two highlighter shapes with different sizes would hide the
size option from the styles panel
* Highlighter lines drawn on ipad look noise-y
### Change Type
<!-- 💡 Indicate the type of change your pull request is. -->
<!-- 🤷♀️ If you're not sure, don't select anything -->
<!-- ✂️ Feel free to delete unselected options -->
<!-- To select one, put an x in the box: [x] -->
- [x] `patch` — Bug Fix
- [ ] `minor` — New Feature
- [ ] `major` — Breaking Change
- [ ] `dependencies` — Dependency Update (publishes a `patch` release,
for devDependencies use `internal`)
- [ ] `documentation` — Changes to the documentation only (will not
publish a new version)
- [ ] `tests` — Changes to any testing-related code only (will not
publish a new version)
- [ ] `internal` — Any other changes that don't affect the published
package (will not publish a new version)
### Test Plan
-
### Release Notes
[aq bug fixes]
This PR fixes points on resize as well as on create. This should help
with file size for large resizes.
### Change Type
- [x] `patch` — Bug Fix
### Test Plan
- [ ] Unit Tests
This PR simplifies the static cursors.
### Change Type
- [x] `internal` — Any other changes that don't affect the published
package (will not publish a new version)
### Test Plan
1. Use cursors throughout app.
### Release Notes
- (editor) Simplifies the cursors in our CSS.
This PR
- Removes UserDocumentRecordType
- moving isSnapMode to user preferences
- moving isGridMode and isPenMode to InstanceRecordType
- deleting the other properties which are no longer needed.
- Creates a separate pipeline for persisting instance state.
Previously the instance state records were stored alongside the document
state records, and in order to load the state for a particular instance
(in our case, a particular tab) you needed to pass the 'instanceId'
prop. This prop ended up totally pervading the public API and people ran
into all kinds of issues with it, e.g. using the same instance id in
multiple editor instances.
There was also an issue whereby it was hard for us to clean up old
instance state so the idb table ended up bloating over time.
This PR makes it so that rather than passing an instanceId, you load the
instance state yourself while creating the store. It provides tools to
make that easy.
- Undoes the assumption that we might have more than one instance's
state in the store.
- Like `document`, `instance` now has a singleton id
`instance:instance`.
- Page state ids and camera ids are no longer random, but rather derive
from the page they belong to. This is like having a foreign primary key
in SQL databases. It's something i'd love to support fully as part of
the RecordType/Store api.
Tests to do
- [x] Test Migrations
- [x] Test Store.listen filtering
- [x] Make type sets in Store public and readonly
- [x] Test RecordType.createId
- [x] Test Instance state snapshot loading/exporting
- [x] Manual test File I/O
- [x] Manual test Vscode extension with multiple tabs
- [x] Audit usages of store.query
- [x] Audit usages of changed types: InstanceRecordType, 'instance',
InstancePageStateRecordType, 'instance_page_state', 'user_document',
'camera', CameraRecordType, InstancePresenceRecordType,
'instance_presence'
- [x] Test user preferences
- [x] Manual test isSnapMode and isGridMode and isPenMode
- [ ] Test indexedDb functions
- [x] Add instanceId stuff back
### Change Type
- [x] `major` — Breaking Change
### Test Plan
1. Add a step-by-step description of how to test your PR here.
2.
- [ ] Unit Tests
- [ ] Webdriver tests
### Release Notes
- Add a brief release note for your PR here.
This PR renames all exported types to include the `TL` prefix. It also
removes the `TL` prefix from things that are not types, including:
- shape utils (e.g. `TLArrowUtil` becomes `ArrowShapeUtil`)
- tools (e.g. `TLArrowTool` becomes `ArrowShapeTool`, `TLSelectTool`
becomes `SelectTool`)
### Change Type
- [x] `major` — Breaking Change
### Release Notes
- Renaming of types, shape utils, tools
This PR restores the sets into schema exports so that they can be picked
up by check translations script.
### Change Type
- [x] `internal` — Any other changes that don't affect the published
package (will not publish a new version)
This PR cleans up the file names and imports for @tldraw/tlschema.
It also:
- renames some erroneously named validators / migrators (e.g.
`pageTypeValidator` -> `pageValidator`)
- removes the duplicated `languages.ts` and makes `tlschema` the source
of truth for languages
- renames ID to RecordId
### Change Type
- [x] `major` — Breaking Change
### Release Notes
- [editor] Remove `app.createShapeId`
- [tlschema] Cleans up exports
This PR renames the `@tldraw/tlstore` package to `@tldraw/store`, mainly
to avoid confusion between `TLStore`. Will be doing the same with other
packages.
### Change Type
- [x] `major` — Breaking Change
### Release Notes
- Replace @tldraw/tlstore with @tldraw/store
This PR renames the @tldraw/tlvalidate package to @tldraw/validate.
### Change Type
- [x] `major` — Breaking Change
### Release Notes
- Rename tlvalidate to validate
This PR updates the TLSchema readme to remove reference to scripts which
are no longer present.
### Change Type
- [x] `documentation` — Changes to the documentation only (will not
publish a new version)
Prunes unused assets when exporting to a file.
### Change Type
- [x] `patch` — Bug Fix
### Test Plan
1. Insert an image.
2. Delete the image.
3. Save to file.
4. The saved file should not have the asset record present.
5. The file size should also be quite small (around 2kb for a file with
no shapes).
### Release Notes
- Optimize file size of exported files.
This PR cleans up exports from TldrawUi, unifying types under `TLUi` and
removing many items from exports / marking others as internal.
### Change Type
- [x] `major` — Breaking Change
### Release Notes
- [editor] clean up / unify types
This PR renames `App`, `app` and all appy names to `Editor`, `editor`,
and editorry names.
### Change Type
- [x] `major` — Breaking Change
### Release Notes
- Rename `App` to `Editor` and many other things that reference `app` to
`editor`.
This PR adds some things that we need for the Project Name feature on
tldraw.com.
It should be reviewed alongside
https://github.com/tldraw/tldraw-lite/pull/1814
## Name Property
This PR adds a `name` property to `TLDocument`. We use this to store a
project's name.
<img width="454" alt="Screenshot 2023-05-09 at 15 47 26"
src="https://github.com/tldraw/tldraw/assets/15892272/f3be438e-aa0f-4dec-8f51-8dfd9f9d0ced">
## Top Zone
This PR adds a `topZone` area of the UI that we can add stuff to,
similar to how `shareZone` works.
It also adds an example to show where the `topZone` and `shareZone` are:
<img width="1511" alt="Screenshot 2023-05-12 at 10 57 40"
src="https://github.com/tldraw/tldraw/assets/15892272/f5e1cd33-017e-4aaf-bfee-4d85119e2974">
## Breakpoints
This PR change's the UI's breakpoints a little bit.
It moves the action bar to the bottom a little bit earlier.
(This gives us more space at the top for the project name).
## Input Blur
This PR adds an `onBlur` parameter to `Input`.
This was needed because 'clicking off' the input wasn't firing
`onComplete` or `onCancel`.
<img width="620" alt="Screenshot 2023-05-09 at 16 12 58"
src="https://github.com/tldraw/tldraw/assets/15892272/3b28da74-0a74-4063-8053-e59e47027caf">
## Create Project Name
This PR adds an internal `createProjectName` property to
`TldrawEditorConfig`.
Similar to `derivePresenceState`, you can pass a custom function to it.
It lets you control what gets used as the default project name. We use
it to set different names in our local projects compared to shared
projects.
In the future, when we add more advanced project features, we could
handle this better within the UI.
<img width="454" alt="Screenshot 2023-05-09 at 15 47 26"
src="https://github.com/tldraw/tldraw/assets/15892272/da9a4699-ac32-40d9-a97c-6c682acfac41">
### Test Plan
1. Gradually reduce the width of the browser window.
2. Check that the actions menu jumps to the bottom before the style
panel moves to the bottom.
---
1. In the examples app, open the `/zones` example.
2. Check that there's a 'top zone' at the top.
- [ ] Unit Tests
- [ ] Webdriver tests
### Release Note
- [dev] Added a `topZone` area where you can put stuff.
- [dev] Added a `name` property to `TLDocument` - and `app` methods for
it.
- [dev] Added an internal `createProjectName` config property for
controlling the default project name.
- [dev] Added an `onBlur` parameter to `Input`.
- Moved the actions bar to the bottom on medium-sized screens.
---------
Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
Add support for locking shapes.
How it works right now:
- You can lock / unlock shapes from the context menu.
- You can also lock shapes with `⇧⌘L` keyboard shortcut.
- You cannot select locked shapes: clicking on the shape, double click
to edit, select all, brush select,... should not work.
- You cannot change props of locked shapes.
- You cannot delete locked shapes.
- If a shape is grouped or within the frame the same rules apply.
- If you delete a group, that contains locked shape it will also delete
those shapes. This seems to be what other apps use as well.
Solves #1445
### Change Type
- [x] `minor` — New Feature
### Test Plan
1. Insert a shape
2. Right click on it and lock it.
3. Test that you cannot select it, change its properties, delete it.
4. Do the same with locked groups.
5. Do the same with locked frames.
- [x] Unit Tests
- [ ] Webdriver tests
### Release Notes
- Add support for locking shapes.
---------
Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
This PR replaces our `console.log` with `nicelog` so that I can more
easily grep for errant console.logs.
### Change Type
- [x] `internal` — Any other changes that don't affect the published
package (will not publish a new version)
This PR updates our user-facing APIs for the Tldraw and TldrawEditor
components, as well as the Editor (App). It mainly incorporates surface
changes from #1450 without any changes to validators or migrators,
incorporating feedback / discussion with @SomeHats and @ds300.
Here we:
- remove the TldrawEditorConfig
- bring back a loose version of shape definitions
- make a separation between "core" shapes and "default" shapes
- do not allow custom shapes, migrators or validators to overwrite core
shapes
- but _do_ allow new shapes
## `<Tldraw>` component
In this PR, the `Tldraw` component wraps both the `TldrawEditor`
component and our `TldrawUi` component. It accepts a union of props for
both components. Previously, this component also added local syncing via
a `useLocalSyncClient` hook call, however that has been pushed down to
the `TldrawEditor` component.
## `<TldrawEditor>` component
The `TldrawEditor` component now more neatly wraps up the different ways
that the editor can be configured.
## The store prop (`TldrawEditorProps.store`)
There are three main ways for the `TldrawEditor` component to be run:
1. with an externally defined store
2. with an externally defined syncing store (local or remote)
3. with an internally defined store
4. with an internally defined locally syncing store
The `store` prop allows for these configurations.
If the `store` prop is defined, it may be defined either as a `TLStore`
or as a `SyncedStore`. If the store is a `TLStore`, then the Editor will
assume that the store is ready to go; if it is defined as a SyncedStore,
then the component will display the loading / error screens as needed,
or the final editor once the store's status is "synced".
When the store is left undefined, then the `TldrawEditor` will create
its own internal store using the optional `instanceId`, `initialData`,
or `shapes` props to define the store / store schema.
If the `persistenceKey` prop is left undefined, then the store will not
be synced. If the `persistenceKey` is defined, then the store will be
synced locally. In the future, we may also here accept the API key /
roomId / etc for creating a remotely synced store.
The `SyncedStore` type has been expanded to also include types used for
remote syncing, e.g. with `ConnectionStatus`.
## Tools
By default, the App has two "baked-in" tools: the select tool and the
zoom tool. These cannot (for now) be replaced or removed. The default
tools are used by default, but may be replaced by other tools if
provided.
## Shapes
By default, the App has a set of "core" shapes:
- group
- embed
- bookmark
- image
- video
- text
That cannot by overwritten because they're created by the app at
different moments, such as when double clicking on the canvas or via a
copy and paste event. In follow up PRs, we'll split these out so that
users can replace parts of the code where these shapes are created.
### Change Type
- [x] `major` — Breaking Change
### Test Plan
- [x] Unit Tests
