Update readme (#2027)

This PR updates the tldraw readme.

### Change Type

- [x] `patch` — Bug fix

apps/examples/.gitignore

@@ -0,0 +1 @@
+.vercel

apps/examples/src/index.tsx

@@ -55,127 +55,127 @@ type Example = {
 export const allExamples: Example[] = [
 	{
 		title: 'Basic (development)',
-		path: '/develop',
+		path: 'develop',
 		element: <BasicExample />,
 	},
 	{
 		title: 'Collaboration (with Yjs)',
-		path: '/yjs',
+		path: 'yjs',
 		element: <YjsExample />,
 	},
 	{
 		title: 'Editor API',
-		path: '/api',
+		path: 'api',
 		element: <APIExample />,
 	},
 	{
 		title: 'Multiple editors',
-		path: '/multiple',
+		path: 'multiple',
 		element: <MultipleExample />,
 	},
 	{
 		title: 'Readonly Example',
-		path: '/readonly',
+		path: 'readonly',
 		element: <ReadOnlyExample />,
 	},
 	{
 		title: 'Scroll example',
-		path: '/scroll',
+		path: 'scroll',
 		element: <ScrollExample />,
 	},
 	{
 		title: 'Custom shapes / tools',
-		path: '/custom-config',
+		path: 'custom-config',
 		element: <CustomConfigExample />,
 	},
 	{
 		title: 'Sublibraries',
-		path: '/exploded',
+		path: 'exploded',
 		element: <ExplodedExample />,
 	},
 	{
 		title: 'Error boundary',
-		path: '/error-boundary',
+		path: 'error-boundary',
 		element: <ErrorBoundaryExample />,
 	},
 	{
 		title: 'Custom UI',
-		path: '/custom-ui',
+		path: 'custom-ui',
 		element: <CustomUiExample />,
 	},
 	{
 		title: 'Hide UI',
-		path: '/hide-ui',
+		path: 'hide-ui',
 		element: <HideUiExample />,
 	},
 	{
 		title: 'UI components',
-		path: '/custom-components',
+		path: 'custom-components',
 		element: <CustomComponentsExample />,
 	},
 	{
 		title: 'UI events',
-		path: '/ui-events',
+		path: 'ui-events',
 		element: <UiEventsExample />,
 	},
 	{
 		title: 'Canvas events',
-		path: '/canvas-events',
+		path: 'canvas-events',
 		element: <CanvasEventsExample />,
 	},
 	{
 		title: 'Store events',
-		path: '/store-events',
+		path: 'store-events',
 		element: <StoreEventsExample />,
 	},
 	{
 		title: 'User presence',
-		path: '/user-presence',
+		path: 'user-presence',
 		element: <UserPresenceExample />,
 	},
 	{
 		title: 'UI zones',
-		path: '/zones',
+		path: 'zones',
 		element: <ZonesExample />,
 	},
 	{
 		title: 'Persistence',
-		path: '/persistence',
+		path: 'persistence',
 		element: <PersistenceExample />,
 	},
 	{
 		title: 'Snapshots',
-		path: '/snapshots',
+		path: 'snapshots',
 		element: <SnapshotExample />,
 	},
 	{
 		title: 'Custom styles',
-		path: '/custom-styles',
+		path: 'custom-styles',
 		element: <CustomStylesExample />,
 	},
 	{
 		title: 'Shape meta property',
-		path: '/shape-meta',
+		path: 'shape-meta',
 		element: <ShapeMetaExample />,
 	},
 	{
 		title: 'Only editor',
-		path: '/only-editor',
+		path: 'only-editor',
 		element: <OnlyEditorExample />,
 	},
 	{
 		title: 'Asset props',
-		path: '/asset-props',
+		path: 'asset-props',
 		element: <AssetPropsExample />,
 	},
 	{
 		title: 'External content sources',
-		path: '/external-content-sources',
+		path: 'external-content-sources',
 		element: <ExternalContentSourcesExample />,
 	},
 	// not listed
 	{
-		path: '/end-to-end',
+		path: 'end-to-end',
 		element: <EndToEnd />,
 	},
 ]
@@ -201,12 +201,13 @@ function App() {
 }
 
 const router = createBrowserRouter([
-	...allExamples,
 	{
 		path: '/',
 		element: <App />,
 	},
+	...allExamples,
 ])
+
 const rootElement = document.getElementById('root')
 const root = createRoot(rootElement!)
 

packages/tldraw/README.md

@@ -1,24 +1,26 @@
 <div alt style="text-align: center; transform: scale(.5);">
 	<picture>
-		<source media="(prefers-color-scheme: dark)" srcset="https://github.com/tldraw/tldraw-lite/raw/main/assets/github-hero-dark.png" />
+		<source media="(prefers-color-scheme: dark)" srcset="https://github.com/tldraw/tldraw/raw/main/assets/github-hero-dark.png" />
-		<img alt="Signia" src="https://github.com/tldraw/tldraw-lite/raw/main/assets/github-hero-light.png" />
+		<img alt="tldraw" src="https://github.com/tldraw/tldraw/raw/main/assets/github-hero-light.png" />
 	</picture>
 </div>
 
 # @tldraw/tldraw
 
-This is the alpha version of [tldraw](https://beta.tldraw.com). It is very much a work in progress.
+This is the pre-release version of [tldraw](https://github.com/tldraw/tldraw).
+
+See the pre-release docs at [canary.tldraw.dev](https://canary.tldraw.com).
 
 ## Installation
 
-Install the `@tldraw/tldraw` package using `@alpha` for the latest alpha release.
+Install the `@tldraw/tldraw` package using `@canary` for the latest canary release. (Or `@alpha` for the latest alpha release.)
 
 ```bash
-yarn add @tldraw/tldraw@alpha
+yarn add @tldraw/tldraw@canary
 # or
-npm install @tldraw/tldraw@alpha
+npm install @tldraw/tldraw@canary
 # or
-pnpm i @tldraw/tldraw@alpha
+pnpm i @tldraw/tldraw@canary
 ```
 
 Then start the local development server.
@@ -37,15 +39,14 @@ An extremely minimal usage (without our UI) might look like this:
 
 ```tsx
 import { Tldraw } from '@tldraw/tldraw'
-import '@tldraw/tldraw/styles-editor.css'
+import '@tldraw/tldraw/tldraw.css'
-import '@tldraw/tldraw/styles-ui.css'
 
 export default function () {
 	return <Tldraw />
 }
 ```
 
-See the [examples repo](https://github.com/tldraw/tldraw-examples) for more examples.
+See the [examples folder](https://github.com/tldraw/tldraw/tree/main/apps/examples) for more examples.
 
 ## License
 

vercel.json

@@ -13,7 +13,7 @@
 	"rewrites": [
 		{
 			"source": "/(.*)",
-			"destination": "/index.html"
+			"destination": "/"
 		}
 	]
 }