chore: faster tldraw build

tldraw/apps/tldraw-logseq/src/app.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-non-null-assertion */
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import { deepEqual, TLApp, TLAsset, TLDocumentModel } from '@tldraw/core'
+import { deepEqual, TLDocumentModel } from '@tldraw/core'
 import {
   AppCanvas,
   AppProvider,
@@ -9,16 +9,13 @@ import {
   TLReactToolConstructor,
 } from '@tldraw/react'
 import * as React from 'react'
-import { AppUI } from '~components/AppUI'
-import { ContextBar } from '~components/ContextBar/ContextBar'
-import { useFileDrop } from '~hooks/useFileDrop'
-import { usePaste } from '~hooks/usePaste'
-import { useQuickAdd } from '~hooks/useQuickAdd'
-import { LogseqContext, LogseqContextValue } from '~lib/logseq-context'
-import { Shape, shapes } from '~lib/shapes'
+import { AppUI } from './components/AppUI'
+import { ContextBar } from './components/ContextBar'
+import { useFileDrop } from './hooks/useFileDrop'
+import { usePaste } from './hooks/usePaste'
+import { useQuickAdd } from './hooks/useQuickAdd'
 import {
   BoxTool,
-  // DotTool,
   EllipseTool,
   HighlighterTool,
   HTMLTool,
@@ -27,9 +24,12 @@ import {
   NuEraseTool,
   PencilTool,
   PolygonTool,
+  shapes,
   TextTool,
   YouTubeTool,
-} from '~lib/tools'
+  type Shape,
+} from './lib'
+import { LogseqContext, type LogseqContextValue } from './lib/logseq-context'
 
 const components: TLReactComponents<Shape> = {
   ContextBar: ContextBar,

tldraw/apps/tldraw-logseq/src/components/ActionBar/ActionBar.tsx

@@ -3,9 +3,9 @@
 import { useApp } from '@tldraw/react'
 import { observer } from 'mobx-react-lite'
 import * as React from 'react'
-import { TablerIcon } from '~components/icons'
-import { ZoomMenu } from '~components/ZoomMenu'
-import type { Shape } from '~lib'
+import type { Shape } from '../../lib'
+import { TablerIcon } from '../icons'
+import { ZoomMenu } from '../ZoomMenu'
 
 export const ActionBar = observer(function ActionBar(): JSX.Element {
   const app = useApp<Shape>()

tldraw/apps/tldraw-logseq/src/components/Button/Button.tsx

@@ -1,5 +1,3 @@
-import * as React from 'react'
-
 export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
   children: React.ReactNode
 }

tldraw/apps/tldraw-logseq/src/components/ContextBar/contextBarActionFactory.tsx

@@ -2,29 +2,29 @@ import { debounce, Decoration, isNonNullable } from '@tldraw/core'
 import { useApp } from '@tldraw/react'
 import { observer } from 'mobx-react-lite'
 import React from 'react'
-import { TablerIcon } from '~components/icons'
-import { ColorInput } from '~components/inputs/ColorInput'
-import { SelectInput, SelectOption } from '~components/inputs/SelectInput'
-import { TextInput } from '~components/inputs/TextInput'
-import {
-  ToggleGroupInput,
-  ToggleGroupInputOption,
-  ToggleGroupMultipleInput,
-} from '~components/inputs/ToggleGroupInput'
-import { ToggleInput } from '~components/inputs/ToggleInput'
 import type {
+  Shape,
+  LogseqPortalShape,
+  TextShape,
+  HTMLShape,
+  YouTubeShape,
   BoxShape,
+  PolygonShape,
   EllipseShape,
-  HTMLShape,
   LineShape,
-  LogseqPortalShape,
   PencilShape,
-  PolygonShape,
-  Shape,
-  TextShape,
-  YouTubeShape,
-} from '~lib'
-import { LogseqContext } from '~lib/logseq-context'
+} from '../../lib'
+import { LogseqContext } from '../../lib/logseq-context'
+import { TablerIcon } from '../icons'
+import { ColorInput } from '../inputs/ColorInput'
+import { type SelectOption, SelectInput } from '../inputs/SelectInput'
+import { TextInput } from '../inputs/TextInput'
+import {
+  type ToggleGroupInputOption,
+  ToggleGroupInput,
+  ToggleGroupMultipleInput,
+} from '../inputs/ToggleGroupInput'
+import { ToggleInput } from '../inputs/ToggleInput'
 
 export const contextBarActionTypes = [
   // Order matters

tldraw/apps/tldraw-logseq/src/components/ContextBar/index.ts

@@ -1 +1,2 @@
 export * from './ContextBar'
+export * from './contextBarActionFactory'

tldraw/apps/tldraw-logseq/src/components/Minimap/Minimap.tsx

@@ -3,8 +3,8 @@ import { useApp, useMinimapEvents } from '@tldraw/react'
 import { reaction } from 'mobx'
 import { observer } from 'mobx-react-lite'
 import React from 'react'
-import { TablerIcon } from '~components/icons'
-import { PreviewManager } from '~lib'
+import { PreviewManager } from '../../lib'
+import { TablerIcon } from '../icons'
 
 export const Minimap = observer(function Minimap() {
   const app = useApp()

tldraw/apps/tldraw-logseq/src/components/PrimaryTools/PrimaryTools.tsx

@@ -2,8 +2,8 @@ import { TLMoveTool, TLSelectTool } from '@tldraw/core'
 import { useApp } from '@tldraw/react'
 import { observer } from 'mobx-react-lite'
 import * as React from 'react'
-import { Button } from '~components/Button'
-import { LogseqIcon, TablerIcon } from '~components/icons'
+import { Button } from '../Button'
+import { TablerIcon, LogseqIcon } from '../icons'
 
 interface ToolButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
   id: string
@@ -97,7 +97,11 @@ export const PrimaryTools = observer(function PrimaryTools() {
     <div className="tl-primary-tools">
       <div className="tl-tools-floating-panel" data-tool-locked={app.settings.isToolLocked}>
         <ToolButton title="Select" id="select" icon="select-cursor" />
-        <ToolButton title="Move" id="move" icon={app.isIn('move.panning') ? "hand-grab" : "hand-stop" } />
+        <ToolButton
+          title="Move"
+          id="move"
+          icon={app.isIn('move.panning') ? 'hand-grab' : 'hand-stop'}
+        />
         <ToolButton title="Draw" id="pencil" icon="ballpen" />
         <ToolButton title="Highlight" id="highlighter" icon="highlight" />
         <ToolButton title="Eraser" id="erase" icon="eraser" />

tldraw/apps/tldraw-logseq/src/components/StatusBar/StatusBar.tsx

@@ -3,7 +3,7 @@
 import * as React from 'react'
 import { observer } from 'mobx-react-lite'
 import { useApp } from '@tldraw/react'
-import type { Shape } from '~lib'
+import type { Shape } from '../../lib'
 
 export const StatusBar = observer(function StatusBar() {
   const app = useApp<Shape>()

tldraw/apps/tldraw-logseq/src/components/Toolbar/ToolBar.tsx

@@ -2,8 +2,8 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import * as React from 'react'
 import { observer } from 'mobx-react-lite'
-import type { Shape } from '~lib'
 import { useApp } from '@tldraw/react'
+import type { Shape } from '../../lib'
 
 export const ToolBar = observer(function ToolBar(): JSX.Element {
   const app = useApp<Shape>()

tldraw/apps/tldraw-logseq/src/components/ZoomMenu/ZoomMenu.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu'
 import { useApp } from '@tldraw/react'
 import { observer } from 'mobx-react-lite'

tldraw/apps/tldraw-logseq/src/components/inputs/NumberInput.tsx

@@ -1,5 +1,3 @@
-import * as React from 'react'
-
 interface NumberInputProps extends React.InputHTMLAttributes<HTMLInputElement> {
   label: string
 }

tldraw/apps/tldraw-logseq/src/components/inputs/SelectInput.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react'
 import * as Select from '@radix-ui/react-select'
-import { TablerIcon } from '~components/icons'
+import { TablerIcon } from '../icons'
 
 export interface SelectOption {
   value: string

tldraw/apps/tldraw-logseq/src/components/inputs/ToggleGroupInput.tsx

@@ -1,5 +1,5 @@
 import * as ToggleGroup from '@radix-ui/react-toggle-group'
-import { TablerIcon } from '~components/icons'
+import { TablerIcon } from '../icons'
 
 export interface ToggleGroupInputOption {
   value: string

tldraw/apps/tldraw-logseq/src/hooks/useFileDrop.ts

@@ -1,8 +1,7 @@
-import { fileToBase64, getSizeFromSrc, TLAsset, uniqueId } from '@tldraw/core'
 import type { TLReactCallbacks } from '@tldraw/react'
 import * as React from 'react'
-import type { Shape } from '~lib'
-import type { LogseqContextValue } from '~lib/logseq-context'
+import type { Shape } from '../lib'
+import type { LogseqContextValue } from '../lib/logseq-context'
 import { usePaste } from './usePaste'
 
 export function useFileDrop(context: LogseqContextValue) {

tldraw/apps/tldraw-logseq/src/hooks/usePaste.ts

@@ -11,8 +11,15 @@ import type { TLReactCallbacks } from '@tldraw/react'
 import Vec from '@tldraw/vec'
 import * as React from 'react'
 import { NIL as NIL_UUID } from 'uuid'
-import { HTMLShape, LogseqPortalShape, Shape, YouTubeShape, ImageShape, VideoShape } from '~lib'
-import type { LogseqContextValue } from '~lib/logseq-context'
+import {
+  type Shape,
+  HTMLShape,
+  YouTubeShape,
+  LogseqPortalShape,
+  VideoShape,
+  ImageShape,
+} from '../lib'
+import type { LogseqContextValue } from '../lib/logseq-context'
 
 const isValidURL = (url: string) => {
   try {
@@ -200,7 +207,8 @@ export function usePaste(context: LogseqContextValue) {
       function handleURL(rawText: string) {
         if (isValidURL(rawText)) {
           const isYoutubeUrl = (url: string) => {
-            const youtubeRegex = /^(?:https?:\/\/)?(?:www\.)?(?:youtu\.be\/|youtube\.com\/(?:embed\/|v\/|watch\?v=|watch\?.+&v=))((\w|-){11})(?:\S+)?$/
+            const youtubeRegex =
+              /^(?:https?:\/\/)?(?:www\.)?(?:youtu\.be\/|youtube\.com\/(?:embed\/|v\/|watch\?v=|watch\?.+&v=))((\w|-){11})(?:\S+)?$/
             return youtubeRegex.test(url)
           }
           if (isYoutubeUrl(rawText)) {

tldraw/apps/tldraw-logseq/src/hooks/useQuickAdd.ts

@@ -1,6 +1,6 @@
 import type { TLReactCallbacks } from '@tldraw/react'
 import React from 'react'
-import type { Shape } from '~lib'
+import type { Shape } from '../lib'
 
 export function useQuickAdd() {
   return React.useCallback<TLReactCallbacks<Shape>['onCanvasDBClick']>(async app => {

tldraw/apps/tldraw-logseq/src/lib/shapes/BindingIndicator.tsx

@@ -1,5 +1,3 @@
-import * as React from 'react'
-
 interface BindingIndicatorProps {
   strokeWidth: number
   size: number[]

tldraw/apps/tldraw-logseq/src/lib/shapes/DotShape.tsx

@@ -1,4 +1,3 @@
-import * as React from 'react'
 import { TLDotShape, TLDotShapeProps } from '@tldraw/core'
 import { SVGContainer, TLComponentProps } from '@tldraw/react'
 import { observer } from 'mobx-react-lite'

tldraw/apps/tldraw-logseq/src/lib/shapes/EllipseShape.tsx

@@ -1,5 +1,4 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import * as React from 'react'
 import { TLEllipseShapeProps, TLEllipseShape } from '@tldraw/core'
 import { SVGContainer, TLComponentProps } from '@tldraw/react'
 import { observer } from 'mobx-react-lite'

tldraw/apps/tldraw-logseq/src/lib/shapes/HTMLShape.tsx

@@ -5,8 +5,8 @@ import Vec from '@tldraw/vec'
 import { action, computed } from 'mobx'
 import { observer } from 'mobx-react-lite'
 import * as React from 'react'
-import { useCameraMovingRef } from '~hooks/useCameraMoving'
-import type { Shape, SizeLevel } from '~lib'
+import type { SizeLevel, Shape } from '.'
+import { useCameraMovingRef } from '../../hooks/useCameraMoving'
 import { withClampedStyles } from './style-props'
 
 export interface HTMLShapeProps extends TLBoxShapeProps {

tldraw/apps/tldraw-logseq/src/lib/shapes/HighlighterShape.tsx

@@ -1,5 +1,4 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import * as React from 'react'
 import { SvgPathUtils, TLDrawShape, TLDrawShapeProps } from '@tldraw/core'
 import { SVGContainer, TLComponentProps } from '@tldraw/react'
 import { observer } from 'mobx-react-lite'

tldraw/apps/tldraw-logseq/src/lib/shapes/ImageShape.tsx

@@ -3,7 +3,7 @@ import * as React from 'react'
 import { HTMLContainer, TLComponentProps } from '@tldraw/react'
 import { TLAsset, TLImageShape, TLImageShapeProps } from '@tldraw/core'
 import { observer } from 'mobx-react-lite'
-import { LogseqContext } from '~lib/logseq-context'
+import { LogseqContext } from '../logseq-context'
 
 export interface ImageShapeProps extends TLImageShapeProps {
   type: 'image'

tldraw/apps/tldraw-logseq/src/lib/shapes/LogseqPortalShape.tsx

@@ -12,11 +12,11 @@ import Vec from '@tldraw/vec'
 import { action, computed, makeObservable } from 'mobx'
 import { observer } from 'mobx-react-lite'
 import * as React from 'react'
-import { TablerIcon } from '~components/icons'
-import { TextInput } from '~components/inputs/TextInput'
-import { useCameraMovingRef } from '~hooks/useCameraMoving'
-import type { Shape, SizeLevel } from '~lib'
-import { LogseqContext, SearchResult } from '~lib/logseq-context'
+import type { SizeLevel, Shape } from '.'
+import { TablerIcon } from '../../components/icons'
+import { TextInput } from '../../components/inputs/TextInput'
+import { useCameraMovingRef } from '../../hooks/useCameraMoving'
+import { LogseqContext, type SearchResult } from '../logseq-context'
 import { CustomStyleProps, withClampedStyles } from './style-props'
 
 const HEADER_HEIGHT = 40

tldraw/apps/tldraw-logseq/src/lib/shapes/PolygonShape.tsx

@@ -1,5 +1,4 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import * as React from 'react'
 import { TLPolygonShape, TLPolygonShapeProps } from '@tldraw/core'
 import { SVGContainer, TLComponentProps } from '@tldraw/react'
 import { observer } from 'mobx-react-lite'

tldraw/apps/tldraw-logseq/src/lib/shapes/TextShape.tsx

@@ -4,7 +4,7 @@ import { HTMLContainer, TLComponentProps, TLTextMeasure } from '@tldraw/react'
 import { action, computed } from 'mobx'
 import { observer } from 'mobx-react-lite'
 import * as React from 'react'
-import type { SizeLevel } from '~lib'
+import type { SizeLevel } from '.'
 import { CustomStyleProps, withClampedStyles } from './style-props'
 import { TextAreaUtils } from './text/TextAreaUtils'
 

tldraw/apps/tldraw-logseq/src/lib/shapes/VideoShape.tsx

@@ -3,9 +3,9 @@ import { TLBoxShape, TLBoxShapeProps } from '@tldraw/core'
 import { HTMLContainer, TLComponentProps, useApp } from '@tldraw/react'
 import { observer } from 'mobx-react-lite'
 import * as React from 'react'
-import { useCameraMovingRef } from '~hooks/useCameraMoving'
-import type { Shape } from '~lib'
-import { LogseqContext } from '~lib/logseq-context'
+import type { Shape } from '.'
+import { useCameraMovingRef } from '../../hooks/useCameraMoving'
+import { LogseqContext } from '../logseq-context'
 
 export interface VideoShapeProps extends TLBoxShapeProps {
   type: 'video'

tldraw/apps/tldraw-logseq/src/lib/shapes/arrow/ArrowHead.tsx

@@ -1,5 +1,3 @@
-import * as React from 'react'
-
 export interface ArrowheadProps {
   left: number[]
   middle: number[]

tldraw/apps/tldraw-logseq/src/lib/shapes/style-props.tsx

@@ -1,7 +1,7 @@
 import { darken } from 'polished'
-import { withFillShapes } from '~components/ContextBar/contextBarActionFactory'
-import type { Shape } from '~lib'
-import { getComputedColor } from '~lib/color'
+import type { Shape } from '.'
+import { withFillShapes } from '../../components/ContextBar/contextBarActionFactory'
+import { getComputedColor } from '../color'
 
 export interface CustomStyleProps {
   stroke: string

tldraw/apps/tldraw-logseq/src/lib/shapes/text/LabelMask.tsx

@@ -1,5 +1,4 @@
 import type { TLBounds } from '@tldraw/core'
-import * as React from 'react'
 
 interface WithLabelMaskProps {
   id: string

tldraw/apps/tldraw-logseq/src/lib/tools/BoxTool.tsx

@@ -1,6 +1,6 @@
 import { TLBoxTool } from '@tldraw/core'
 import type { TLReactEventMap } from '@tldraw/react'
-import { Shape, BoxShape } from '~lib'
+import { BoxShape, type Shape } from '../shapes'
 
 export class BoxTool extends TLBoxTool<BoxShape, Shape, TLReactEventMap> {
   static id = 'box'

tldraw/apps/tldraw-logseq/src/lib/tools/DotTool.tsx

@@ -1,6 +1,6 @@
 import { TLDotTool } from '@tldraw/core'
 import type { TLReactEventMap } from '@tldraw/react'
-import { Shape, DotShape } from '~lib/shapes'
+import { DotShape, type Shape } from '../shapes'
 
 export class DotTool extends TLDotTool<DotShape, Shape, TLReactEventMap> {
   static id = 'dot'

tldraw/apps/tldraw-logseq/src/lib/tools/EllipseTool.tsx

@@ -1,6 +1,6 @@
 import { TLBoxTool } from '@tldraw/core'
 import type { TLReactEventMap } from '@tldraw/react'
-import { EllipseShape, Shape } from '~lib'
+import { EllipseShape, type Shape } from '../shapes'
 
 export class EllipseTool extends TLBoxTool<EllipseShape, Shape, TLReactEventMap> {
   static id = 'ellipse'

tldraw/apps/tldraw-logseq/src/lib/tools/EraseTool.tsx

@@ -1,6 +1,6 @@
 import { TLEraseTool } from '@tldraw/core'
 import type { TLReactEventMap } from '@tldraw/react'
-import type { Shape } from '~lib'
+import type { Shape } from '../shapes'
 
 export class NuEraseTool extends TLEraseTool<Shape, TLReactEventMap> {
   static id = 'erase'

tldraw/apps/tldraw-logseq/src/lib/tools/HTMLTool.tsx

@@ -1,6 +1,6 @@
 import { TLBoxTool } from '@tldraw/core'
 import type { TLReactEventMap } from '@tldraw/react'
-import { HTMLShape, Shape } from '~lib/shapes'
+import { HTMLShape, type Shape } from '../shapes'
 
 export class HTMLTool extends TLBoxTool<HTMLShape, Shape, TLReactEventMap> {
   static id = 'youtube'

tldraw/apps/tldraw-logseq/src/lib/tools/HighlighterTool.tsx

@@ -1,6 +1,6 @@
 import { TLDrawTool } from '@tldraw/core'
 import type { TLReactEventMap } from '@tldraw/react'
-import { HighlighterShape, Shape } from '~lib'
+import { HighlighterShape, type Shape } from '../shapes'
 
 export class HighlighterTool extends TLDrawTool<HighlighterShape, Shape, TLReactEventMap> {
   static id = 'highlighter'

tldraw/apps/tldraw-logseq/src/lib/tools/LineTool.tsx

@@ -1,6 +1,6 @@
 import { TLLineTool } from '@tldraw/core'
 import type { TLReactEventMap } from '@tldraw/react'
-import { Shape, LineShape } from '~lib'
+import { LineShape, type Shape } from '../shapes'
 
 // @ts-expect-error maybe later
 export class LineTool extends TLLineTool<LineShape, Shape, TLReactEventMap> {

tldraw/apps/tldraw-logseq/src/lib/tools/LogseqPortalTool/LogseqPortalTool.tsx

@@ -1,7 +1,7 @@
 import { TLApp, TLEvents, TLTool } from '@tldraw/core'
 import type { TLReactEventMap } from '@tldraw/react'
 import Vec from '@tldraw/vec'
-import { LogseqPortalShape, Shape } from '~lib/shapes'
+import { type Shape, LogseqPortalShape } from '../../shapes'
 import { CreatingState, IdleState } from './states'
 
 export class LogseqPortalTool extends TLTool<

tldraw/apps/tldraw-logseq/src/lib/tools/LogseqPortalTool/states/CreatingState.tsx

@@ -2,7 +2,7 @@ import { TLApp, TLTargetType, TLToolState, uniqueId } from '@tldraw/core'
 import type { TLReactEventMap, TLReactEvents } from '@tldraw/react'
 import Vec from '@tldraw/vec'
 import { transaction } from 'mobx'
-import { LogseqPortalShape, Shape } from '~lib/shapes'
+import { type Shape, LogseqPortalShape } from '../../../shapes'
 import type { LogseqPortalTool } from '../LogseqPortalTool'
 
 export class CreatingState extends TLToolState<

tldraw/apps/tldraw-logseq/src/lib/tools/LogseqPortalTool/states/IdleState.tsx

@@ -1,6 +1,6 @@
-import { TLApp, TLCursor, TLStateEvents, TLToolState } from '@tldraw/core'
+import { TLApp, TLCursor, TLToolState } from '@tldraw/core'
 import type { TLReactEventMap, TLReactEvents } from '@tldraw/react'
-import type { Shape } from '~lib/shapes'
+import type { Shape } from '../../../shapes'
 import type { LogseqPortalTool } from '../LogseqPortalTool'
 
 export class IdleState extends TLToolState<

tldraw/apps/tldraw-logseq/src/lib/tools/PencilTool.tsx

@@ -1,6 +1,6 @@
 import { TLDrawTool } from '@tldraw/core'
 import type { TLReactEventMap } from '@tldraw/react'
-import { PencilShape, Shape } from '~lib'
+import { PencilShape, type Shape } from '../shapes'
 
 export class PencilTool extends TLDrawTool<PencilShape, Shape, TLReactEventMap> {
   static id = 'pencil'

tldraw/apps/tldraw-logseq/src/lib/tools/PolygonTool.tsx

@@ -1,6 +1,6 @@
 import { TLBoxTool } from '@tldraw/core'
 import type { TLReactEventMap } from '@tldraw/react'
-import { PolygonShape, Shape } from '~lib'
+import { PolygonShape, type Shape } from '../shapes'
 
 export class PolygonTool extends TLBoxTool<PolygonShape, Shape, TLReactEventMap> {
   static id = 'polygon'

tldraw/apps/tldraw-logseq/src/lib/tools/TextTool.tsx

@@ -1,6 +1,6 @@
 import { TLTextTool } from '@tldraw/core'
 import type { TLReactEventMap } from '@tldraw/react'
-import { Shape, TextShape } from '~lib'
+import { TextShape, type Shape } from '../shapes'
 
 export class TextTool extends TLTextTool<TextShape, Shape, TLReactEventMap> {
   static id = 'text'

tldraw/apps/tldraw-logseq/src/lib/tools/YouTubeTool.tsx

@@ -1,6 +1,6 @@
 import { TLBoxTool } from '@tldraw/core'
 import type { TLReactEventMap } from '@tldraw/react'
-import { Shape, YouTubeShape } from '~lib/shapes'
+import { YouTubeShape, type Shape } from '../shapes'
 
 export class YouTubeTool extends TLBoxTool<YouTubeShape, Shape, TLReactEventMap> {
   static id = 'youtube'

tldraw/apps/tldraw-logseq/src/styles.css

@@ -16,6 +16,10 @@
 
 .logseq-tldraw-wrapper {
   @apply flex flex-col w-full h-full relative;
+
+  img {
+    -webkit-user-drag: none;
+  }
 }
 
 .tl-toolbar {

tldraw/apps/tldraw-logseq/tsconfig.json

@@ -3,10 +3,11 @@
   "exclude": ["node_modules", "dist", "docs", "tsup.config.ts"],
   "compilerOptions": {
     "outDir": "./dist/types",
-    "rootDir": "src",
-    "baseUrl": ".",
     "paths": {
-      "~*": ["src/*"]
+      "@tldraw/core": ["../../../core/src/*"],
+      "@tldraw/react": ["../../../react/src/*"],
+      "@tldraw/vec": ["../../../utils/vec/src/*"], 
+      "@tldraw/intersect": ["../../../utils/intersect/src/*"]
     }
   },
   "references": [

tldraw/apps/tldraw-logseq/tsup.config.ts

@@ -5,7 +5,7 @@ export default defineConfig({
   platform: 'browser',
   format: ['cjs'],
   entry: ['src/index.ts'],
-  clean: false,
+  clean: true,
   loader: {
     '.png': 'base64',
   },

tldraw/package.json

@@ -17,30 +17,15 @@
     "demo"
   ],
   "scripts": {
-    "build": "lerna run build --stream",
-    "build:shapes": "lerna run build:shapes --stream",
-    "build:tools": "lerna run build:tools --stream",
-    "build:packages": "lerna run build:packages --stream",
-    "start:shapes": "lerna run start:shapes --stream",
-    "start:tools": "lerna run start:tools --stream",
-    "start": "lerna run start --stream --parallel",
-    "start:packages": "lerna run start:packages --parallel",
+    "build": "cd apps/tldraw-logseq && yarn build",
+    "build:watch": "cd apps/tldraw-logseq && yarn dev",
+    "postinstall": "yarn build",
     "dev": "cd demo && yarn dev",
     "fix:style": "yarn run pretty-quick",
-    "lerna": "lerna",
-    "test": "lerna run test --stream",
-    "test:ci": "lerna run test:ci --stream",
-    "test:watch": "lerna run test:watch --stream",
-    "docs": "lerna run typedoc",
-    "docs:watch": "lerna run typedoc --watch",
-    "postinstall": "yarn build:packages",
     "pretty-quick": "pretty-quick"
   },
   "devDependencies": {
     "@swc-node/jest": "^1.5.2",
-    "@testing-library/jest-dom": "^5.16.4",
-    "@testing-library/react": "^13.3.0",
-    "@types/jest": "^28.1.1",
     "@types/node": "^17.0.42",
     "@types/react": "^17.0.0",
     "@types/react-dom": "^17.0.0",
@@ -49,7 +34,6 @@
     "eslint": "^8.17.0",
     "fake-indexeddb": "^3.1.8",
     "init-package-json": "^3.0.2",
-    "jest": "^28.1.1",
     "lerna": "^5.1.1",
     "lint-staged": "^13.0.1",
     "prettier": "^2.6.2",

tldraw/packages/core/architecture.tldr

@@ -1,459 +0,0 @@
-{
-  "document": {
-    "id": "doc",
-    "name": "New Document",
-    "version": 14,
-    "pages": {
-      "page": {
-        "id": "page",
-        "name": "Page 1",
-        "childIndex": 1,
-        "shapes": {
-          "ae6376d5-72ef-4973-0b26-9be1e92e8633": {
-            "id": "ae6376d5-72ef-4973-0b26-9be1e92e8633",
-            "type": "text",
-            "name": "Text",
-            "parentId": "page",
-            "childIndex": 1,
-            "point": [
-              105.76,
-              169.98
-            ],
-            "rotation": 0,
-            "text": "App",
-            "style": {
-              "color": "black",
-              "size": "small",
-              "isFilled": false,
-              "dash": "draw",
-              "scale": 1,
-              "font": "script",
-              "textAlign": "middle"
-            }
-          },
-          "0eb29f9f-f5ab-4478-1af6-2de8f9248423": {
-            "id": "0eb29f9f-f5ab-4478-1af6-2de8f9248423",
-            "type": "text",
-            "name": "Text",
-            "parentId": "page",
-            "childIndex": 2,
-            "point": [
-              115.25,
-              236.13
-            ],
-            "rotation": 0,
-            "text": "Tool",
-            "style": {
-              "color": "black",
-              "size": "small",
-              "isFilled": false,
-              "dash": "draw",
-              "scale": 1,
-              "font": "script",
-              "textAlign": "middle"
-            }
-          },
-          "db073a1b-6cfb-4eaf-2742-46fc81e48aee": {
-            "id": "db073a1b-6cfb-4eaf-2742-46fc81e48aee",
-            "type": "text",
-            "name": "Text",
-            "parentId": "page",
-            "childIndex": 3,
-            "point": [
-              150.56,
-              318.81
-            ],
-            "rotation": 0,
-            "text": "State",
-            "style": {
-              "color": "black",
-              "size": "small",
-              "isFilled": false,
-              "dash": "draw",
-              "scale": 1,
-              "font": "script",
-              "textAlign": "middle"
-            }
-          },
-          "be3325cf-a4f1-4012-0842-1321de9f473b": {
-            "id": "be3325cf-a4f1-4012-0842-1321de9f473b",
-            "type": "rectangle",
-            "name": "Rectangle",
-            "parentId": "page",
-            "childIndex": 0.5625,
-            "point": [
-              126.56,
-              308.09
-            ],
-            "size": [
-              104.99,
-              67.45
-            ],
-            "rotation": 0,
-            "style": {
-              "color": "black",
-              "size": "small",
-              "isFilled": false,
-              "dash": "draw",
-              "scale": 1,
-              "textAlign": "middle"
-            }
-          },
-          "fca5189a-078f-4212-02d5-ee491c56dedb": {
-            "id": "fca5189a-078f-4212-02d5-ee491c56dedb",
-            "type": "rectangle",
-            "name": "Rectangle",
-            "parentId": "page",
-            "childIndex": 0.0625,
-            "point": [
-              106.53,
-              228.98
-            ],
-            "size": [
-              268.64,
-              165.02
-            ],
-            "rotation": 0,
-            "style": {
-              "color": "black",
-              "size": "small",
-              "isFilled": false,
-              "dash": "draw",
-              "scale": 1,
-              "textAlign": "middle"
-            }
-          },
-          "c2ea2ed5-8c4f-47d5-37c7-2c5b7a60bf5d": {
-            "id": "c2ea2ed5-8c4f-47d5-37c7-2c5b7a60bf5d",
-            "type": "rectangle",
-            "name": "Rectangle",
-            "parentId": "page",
-            "childIndex": 0.03125,
-            "point": [
-              79.97,
-              165.72
-            ],
-            "size": [
-              604.49,
-              243.84
-            ],
-            "rotation": 0,
-            "style": {
-              "color": "black",
-              "size": "small",
-              "isFilled": false,
-              "dash": "draw",
-              "scale": 1,
-              "textAlign": "middle"
-            }
-          },
-          "7160c909-b728-4cc4-32c8-a2c254d0c0b4": {
-            "id": "7160c909-b728-4cc4-32c8-a2c254d0c0b4",
-            "type": "rectangle",
-            "name": "Rectangle",
-            "parentId": "page",
-            "childIndex": 0.5625,
-            "point": [
-              393.05,
-              228.98
-            ],
-            "size": [
-              268.64,
-              165.02
-            ],
-            "rotation": 0,
-            "style": {
-              "color": "gray",
-              "size": "small",
-              "isFilled": false,
-              "dash": "draw",
-              "scale": 1,
-              "textAlign": "middle"
-            }
-          },
-          "ea5de193-8d92-47d6-283c-3de5805e4c75": {
-            "id": "ea5de193-8d92-47d6-283c-3de5805e4c75",
-            "type": "text",
-            "name": "Text",
-            "parentId": "page",
-            "childIndex": 3,
-            "point": [
-              401.77,
-              236.13
-            ],
-            "rotation": 0,
-            "text": "Tool",
-            "style": {
-              "color": "gray",
-              "size": "small",
-              "isFilled": false,
-              "dash": "draw",
-              "scale": 1,
-              "font": "script",
-              "textAlign": "middle"
-            }
-          },
-          "f79712d8-d342-4127-39ee-272904e440fd": {
-            "id": "f79712d8-d342-4127-39ee-272904e440fd",
-            "type": "text",
-            "name": "Text",
-            "parentId": "page",
-            "childIndex": 3,
-            "point": [
-              268.08,
-              318.81
-            ],
-            "rotation": 0,
-            "text": "State",
-            "style": {
-              "color": "gray",
-              "size": "small",
-              "isFilled": false,
-              "dash": "draw",
-              "scale": 1,
-              "font": "script",
-              "textAlign": "middle"
-            }
-          },
-          "c3944938-9d11-476f-02e6-eb80086d2642": {
-            "id": "c3944938-9d11-476f-02e6-eb80086d2642",
-            "type": "rectangle",
-            "name": "Rectangle",
-            "parentId": "page",
-            "childIndex": 0.5625,
-            "point": [
-              239.83,
-              308.09
-            ],
-            "size": [
-              103.74,
-              67.45
-            ],
-            "rotation": 0,
-            "style": {
-              "color": "gray",
-              "size": "small",
-              "isFilled": false,
-              "dash": "draw",
-              "scale": 1,
-              "textAlign": "middle"
-            }
-          },
-          "11b741b9-ec58-4b0c-33fe-69fd1cce889b": {
-            "id": "11b741b9-ec58-4b0c-33fe-69fd1cce889b",
-            "type": "text",
-            "name": "Text",
-            "parentId": "page",
-            "childIndex": 3,
-            "point": [
-              437.35,
-              318.81
-            ],
-            "rotation": 0,
-            "text": "State",
-            "style": {
-              "color": "gray",
-              "size": "small",
-              "isFilled": false,
-              "dash": "draw",
-              "scale": 1,
-              "font": "script",
-              "textAlign": "middle"
-            }
-          },
-          "8512a2c1-3913-483f-0496-0b88c2b98b3a": {
-            "id": "8512a2c1-3913-483f-0496-0b88c2b98b3a",
-            "type": "rectangle",
-            "name": "Rectangle",
-            "parentId": "page",
-            "childIndex": 0.5625,
-            "point": [
-              413.35,
-              308.09
-            ],
-            "size": [
-              104.99,
-              67.45
-            ],
-            "rotation": 0,
-            "style": {
-              "color": "gray",
-              "size": "small",
-              "isFilled": false,
-              "dash": "draw",
-              "scale": 1,
-              "textAlign": "middle"
-            }
-          },
-          "04995c47-7a34-4513-071c-62d8330627d3": {
-            "id": "04995c47-7a34-4513-071c-62d8330627d3",
-            "type": "text",
-            "name": "Text",
-            "parentId": "page",
-            "childIndex": 4,
-            "point": [
-              554.87,
-              318.81
-            ],
-            "rotation": 0,
-            "text": "State",
-            "style": {
-              "color": "gray",
-              "size": "small",
-              "isFilled": false,
-              "dash": "draw",
-              "scale": 1,
-              "font": "script",
-              "textAlign": "middle"
-            }
-          },
-          "4c68dd3f-0956-4429-29eb-203cc85efb50": {
-            "id": "4c68dd3f-0956-4429-29eb-203cc85efb50",
-            "type": "rectangle",
-            "name": "Rectangle",
-            "parentId": "page",
-            "childIndex": 1,
-            "point": [
-              526.62,
-              308.09
-            ],
-            "size": [
-              103.74,
-              67.45
-            ],
-            "rotation": 0,
-            "style": {
-              "color": "gray",
-              "size": "small",
-              "isFilled": false,
-              "dash": "draw",
-              "scale": 1,
-              "textAlign": "middle"
-            }
-          },
-          "9268086e-d5a6-42b2-3a33-2d9670505d3e": {
-            "id": "9268086e-d5a6-42b2-3a33-2d9670505d3e",
-            "type": "arrow",
-            "name": "Arrow",
-            "parentId": "page",
-            "childIndex": 5,
-            "point": [
-              194.91,
-              215.71
-            ],
-            "rotation": 0,
-            "bend": 0,
-            "handles": {
-              "start": {
-                "id": "start",
-                "index": 0,
-                "point": [
-                  1.1,
-                  0
-                ],
-                "canBind": true
-              },
-              "end": {
-                "id": "end",
-                "index": 1,
-                "point": [
-                  0,
-                  36.46
-                ],
-                "canBind": true
-              },
-              "bend": {
-                "id": "bend",
-                "index": 2,
-                "point": [
-                  0.55,
-                  18.23
-                ]
-              }
-            },
-            "decorations": {
-              "end": "arrow"
-            },
-            "style": {
-              "color": "white",
-              "size": "small",
-              "isFilled": false,
-              "dash": "draw",
-              "scale": 1,
-              "textAlign": "middle"
-            }
-          },
-          "e84d07ea-09ae-49b3-2bf0-7055b74c325f": {
-            "id": "e84d07ea-09ae-49b3-2bf0-7055b74c325f",
-            "type": "arrow",
-            "name": "Arrow",
-            "parentId": "page",
-            "childIndex": 6,
-            "point": [
-              193.99,
-              294.36
-            ],
-            "rotation": 0,
-            "bend": 0,
-            "handles": {
-              "start": {
-                "id": "start",
-                "index": 0,
-                "point": [
-                  0.51,
-                  0
-                ],
-                "canBind": true
-              },
-              "end": {
-                "id": "end",
-                "index": 1,
-                "point": [
-                  0,
-                  30.96
-                ],
-                "canBind": true
-              },
-              "bend": {
-                "id": "bend",
-                "index": 2,
-                "point": [
-                  0.26,
-                  15.48
-                ]
-              }
-            },
-            "decorations": {
-              "end": "arrow"
-            },
-            "style": {
-              "color": "white",
-              "size": "small",
-              "isFilled": false,
-              "dash": "draw",
-              "scale": 1,
-              "textAlign": "middle"
-            }
-          }
-        },
-        "bindings": {}
-      }
-    },
-    "pageStates": {
-      "page": {
-        "id": "page",
-        "selectedIds": [
-          "ae6376d5-72ef-4973-0b26-9be1e92e8633"
-        ],
-        "camera": {
-          "point": [
-            0,
-            0
-          ],
-          "zoom": 1
-        }
-      }
-    }
-  },
-  "assets": {}
-}

tldraw/packages/core/package.json

@@ -18,9 +18,7 @@
   "files": [
     "dist/**/*"
   ],
-  "main": "./dist/cjs/index.js",
-  "module": "./dist/esm/index.js",
-  "types": "./dist/types/index.d.ts",
+  "main": "./src/index.ts",
   "scripts": {
     "start:next": "yarn start",
     "start:packages": "yarn start",
@@ -51,11 +49,7 @@
     "rbush": "^3.0.1"
   },
   "devDependencies": {
-    "@swc-node/jest": "^1.3.3",
-    "@testing-library/jest-dom": "^5.14.1",
-    "@testing-library/react": "^12.0.0",
     "@types/is-plain-object": "^2.0.4",
-    "@types/jest": "^27.0.2",
     "@types/mousetrap": "^1.6.8",
     "@types/node": "^16.11.6",
     "@types/rbush": "^3.0.0",
@@ -63,38 +57,5 @@
     "@types/react-dom": "^17.0.0",
     "tsconfig-replace-paths": "^0.0.11"
   },
-  "jest": {
-    "setupFilesAfterEnv": [
-      "<rootDir>/../../setupTests.ts"
-    ],
-    "transform": {
-      "^.+\\.(tsx|jsx|ts|js|mjs)?$": [
-        "@swc-node/jest",
-        {
-          "dynamicImport": true,
-          "experimentalDecorators": true,
-          "emitDecoratorMetadata": true
-        }
-      ]
-    },
-    "testRegex": "(/__tests__/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$",
-    "moduleFileExtensions": [
-      "ts",
-      "tsx",
-      "js",
-      "jsx",
-      "json",
-      "node"
-    ],
-    "testEnvironment": "jsdom",
-    "modulePathIgnorePatterns": [
-      "<rootDir>/dist/",
-      "<rootDir>/src/test/"
-    ],
-    "moduleNameMapper": {
-      "@tldraw/core": "<rootDir>/src",
-      "\\~(.*)": "<rootDir>/src/$1"
-    }
-  },
   "gitHead": "3ab5db27b9e83736fdae934474e80e90c854922c"
 }

tldraw/packages/core/src/constants.ts

@@ -1,5 +1,12 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import { TLResizeCorner, TLResizeEdge, TLSelectionHandle, TLCursor, TLRotateCorner } from '~types'
+
+import {
+  type TLSelectionHandle,
+  TLCursor,
+  TLResizeEdge,
+  TLResizeCorner,
+  TLRotateCorner,
+} from './types'
 
 export const PI = Math.PI
 

tldraw/packages/core/src/lib/TLApi/TLApi.ts

@@ -1,7 +1,8 @@
 import Vec from '@tldraw/vec'
-import type { TLApp, TLPage, TLShapeModel, TLShape } from '~lib'
-import type { TLEventMap } from '~types'
-import { BoundsUtils } from '~utils'
+import type { TLEventMap } from '../../types'
+import { BoundsUtils } from '../../utils'
+import type { TLShape, TLShapeModel } from '../shapes'
+import type { TLApp } from '../TLApp'
 
 export class TLApi<S extends TLShape = TLShape, K extends TLEventMap = TLEventMap> {
   private app: TLApp<S, K>

tldraw/packages/core/src/lib/TLApp/TLApp.ts

@@ -1,40 +1,34 @@
 /* eslint-disable @typescript-eslint/no-extra-semi */
 /* eslint-disable @typescript-eslint/no-non-null-assertion */
 /* eslint-disable @typescript-eslint/no-explicit-any */
+import type { TLBounds } from '@tldraw/intersect'
 import { Vec } from '@tldraw/vec'
 import { action, computed, makeObservable, observable, transaction } from 'mobx'
-import { GRID_SIZE } from '~constants'
-
-import {
-  TLInputs,
-  TLMoveTool,
-  TLPage,
-  TLPageModel,
-  TLSelectTool,
-  TLShape,
-  TLShapeConstructor,
-  TLShapeModel,
-  TLToolConstructor,
-  TLViewport,
-} from '~lib'
-import { TLApi } from '~lib/TLApi'
-import { TLCursors } from '~lib/TLCursors'
+import { GRID_SIZE } from '../../constants'
 import type {
   TLAsset,
-  TLBounds,
-  TLCallback,
   TLEventMap,
-  TLEvents,
   TLShortcut,
-  TLStateEvents,
   TLSubscription,
-  TLSubscriptionEventInfo,
   TLSubscriptionEventName,
-} from '~types'
-import { BoundsUtils, KeyUtils } from '~utils'
+  TLCallback,
+  TLSubscriptionEventInfo,
+  TLStateEvents,
+  TLEvents,
+} from '../../types'
+import { KeyUtils, BoundsUtils } from '../../utils'
+import type { TLShape, TLShapeConstructor, TLShapeModel } from '../shapes'
+import { TLApi } from '../TLApi'
+import { TLCursors } from '../TLCursors'
+
 import { TLHistory } from '../TLHistory'
+import { TLInputs } from '../TLInputs'
+import { type TLPageModel, TLPage } from '../TLPage'
 import { TLSettings } from '../TLSettings'
 import { TLRootState } from '../TLState'
+import type { TLToolConstructor } from '../TLTool'
+import { TLViewport } from '../TLViewport'
+import { TLSelectTool, TLMoveTool } from '../tools'
 
 export interface TLDocumentModel<S extends TLShape = TLShape, A extends TLAsset = TLAsset> {
   currentPageId: string

tldraw/packages/core/src/lib/TLBaseLineBindingState.ts

@@ -1,8 +1,11 @@
 import Vec from '@tldraw/vec'
-import { toJS, transaction } from 'mobx'
-import { TLApp, TLLineShape, TLLineShapeProps, TLShape, TLTool, TLToolState } from '~lib'
-import type { TLBinding, TLEventMap, TLHandle, TLStateEvents } from '~types'
-import { deepMerge, GeomUtils } from '~utils'
+import { transaction } from 'mobx'
+import type { TLBinding, TLEventMap, TLHandle, TLStateEvents } from '../types'
+import { deepMerge, GeomUtils } from '../utils'
+import type { TLLineShape, TLLineShapeProps, TLShape } from './shapes'
+import type { TLApp } from './TLApp'
+import type { TLTool } from './TLTool'
+import { TLToolState } from './TLToolState'
 
 export class TLBaseLineBindingState<
   S extends TLShape,
@@ -49,7 +52,6 @@ export class TLBaseLineBindingState<
 
     const nextPoint = Vec.add(handles[handleId].point, delta)
 
-
     const handleChanges = {
       [handleId]: {
         ...handles[handleId],

tldraw/packages/core/src/lib/TLBush.ts

@@ -1,5 +1,5 @@
 import RBush from 'rbush'
-import type { TLShape } from '~lib'
+import type { TLShape } from './shapes'
 
 export class TLBush<S extends TLShape = TLShape> extends RBush<S> {
   toBBox = (shape: S) => shape.rotatedBounds

tldraw/packages/core/src/lib/TLCursors.ts

@@ -1,5 +1,5 @@
 import { action, makeObservable, observable } from 'mobx'
-import { TLCursor } from '~types/TLCursor'
+import { TLCursor } from '../types'
 
 export class TLCursors {
   constructor() {

tldraw/packages/core/src/lib/TLHistory.ts

@@ -1,7 +1,9 @@
 import { computed, makeObservable, transaction } from 'mobx'
-import { TLApp, TLDocumentModel, TLPage, TLShape } from '~lib'
-import type { TLEventMap } from '~types'
-import { deepEqual } from '~utils'
+import type { TLEventMap } from '../types'
+import { deepEqual } from '../utils'
+import type { TLShape } from './shapes'
+import type { TLApp, TLDocumentModel } from './TLApp'
+import { TLPage } from './TLPage'
 
 export class TLHistory<S extends TLShape = TLShape, K extends TLEventMap = TLEventMap> {
   constructor(app: TLApp<S, K>) {

tldraw/packages/core/src/lib/TLInputs.ts

@@ -1,7 +1,7 @@
 import Vec from '@tldraw/vec'
 import { action, makeObservable, observable } from 'mobx'
-import type { TLEventMap } from '~types'
-import { modKey } from '~utils'
+import type { TLEventMap } from '../types'
+import { modKey } from '../utils'
 
 export class TLInputs<K extends TLEventMap> {
   constructor() {

tldraw/packages/core/src/lib/TLPage/TLPage.test.ts

@@ -1,282 +0,0 @@
-import { TLTestApp } from '~test/TLTestApp'
-import type { TLDocumentModel } from '~lib'
-
-const documentModel: TLDocumentModel = {
-  currentPageId: 'page1',
-  selectedIds: ['box1'],
-  pages: [
-    {
-      name: 'Page',
-      id: 'page1',
-      shapes: [
-        {
-          id: 'A',
-          type: 'box',
-          parentId: 'page1',
-          point: [0, 0],
-        },
-        {
-          id: 'B',
-          type: 'box',
-          parentId: 'page1',
-          point: [0, 0],
-        },
-        {
-          id: 'C',
-          type: 'box',
-          parentId: 'page1',
-          point: [0, 0],
-        },
-        {
-          id: 'D',
-          type: 'box',
-          parentId: 'page1',
-          point: [0, 0],
-        },
-        {
-          id: 'E',
-          type: 'box',
-          parentId: 'page1',
-          point: [0, 0],
-        },
-        {
-          id: 'F',
-          type: 'box',
-          parentId: 'page1',
-          point: [0, 0],
-        },
-        {
-          id: 'G',
-          type: 'box',
-          parentId: 'page1',
-          point: [0, 0],
-        },
-      ],
-      bindings: {},
-    },
-  ],
-}
-
-describe('Creates a page from a serialized page model', () => {
-  it.todo('Creates page')
-})
-
-describe('When creating shapes', () => {
-  it.todo('Creates shapes')
-})
-
-describe('When removing shapes', () => {
-  it.todo('Removes shapes')
-})
-
-describe('When running zindex tests', () => {
-  it('Correctly identifies shapes in order', () => {
-    new TLTestApp(documentModel).expectShapesInOrder('A', 'B', 'C', 'D')
-  })
-})
-
-describe('When sending to back', () => {
-  it('Moves one shape to back', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['D'])
-      .sendToBack()
-      .expectShapesInOrder('D', 'A', 'B', 'C')
-      .sendToBack() // noop
-      .expectShapesInOrder('D', 'A', 'B', 'C')
-  })
-
-  it('Moves no shapes when selecting shapes at the back', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['A', 'B', 'C'])
-      .sendToBack()
-      .expectShapesInOrder('A', 'B', 'C')
-      .sendToBack()
-      .expectShapesInOrder('A', 'B', 'C')
-  })
-
-  it('Moves two adjacent shapes to back', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['D', 'E'])
-      .sendToBack()
-      .expectShapesInOrder('D', 'E', 'A', 'B', 'C', 'F', 'G')
-      .sendToBack()
-      .expectShapesInOrder('D', 'E', 'A', 'B', 'C', 'F', 'G')
-  })
-
-  it('Moves non-adjacent shapes to back', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['E', 'G'])
-      .sendToBack()
-      .expectShapesInOrder('E', 'G', 'A', 'B', 'C', 'D', 'F')
-      .sendToBack()
-      .expectShapesInOrder('E', 'G', 'A', 'B', 'C', 'D', 'F')
-  })
-
-  it('Moves non-adjacent shapes to back when one is at the back', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['A', 'G'])
-      .sendToBack()
-      .expectShapesInOrder('A', 'G', 'B', 'C', 'D', 'E', 'F')
-      .sendToBack()
-      .expectShapesInOrder('A', 'G', 'B', 'C', 'D', 'E', 'F')
-  })
-})
-
-describe('When sending to front', () => {
-  it('Moves one shape to front', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['A'])
-      .bringToFront()
-      .expectShapesInOrder('B', 'C', 'D', 'E', 'F', 'G', 'A')
-      .bringToFront() // noop
-      .expectShapesInOrder('B', 'C', 'D', 'E', 'F', 'G', 'A')
-  })
-
-  it('Moves no shapes when selecting shapes at the front', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['G'])
-      .bringToFront()
-      .expectShapesInOrder('A', 'B', 'C', 'D', 'E', 'F', 'G')
-      .bringToFront() // noop
-      .expectShapesInOrder('A', 'B', 'C', 'D', 'E', 'F', 'G')
-  })
-
-  it('Moves two adjacent shapes to front', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['D', 'E'])
-      .bringToFront()
-      .expectShapesInOrder('A', 'B', 'C', 'F', 'G', 'D', 'E')
-      .bringToFront() // noop
-      .expectShapesInOrder('A', 'B', 'C', 'F', 'G', 'D', 'E')
-  })
-
-  it('Moves non-adjacent shapes to front', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['A', 'C'])
-      .bringToFront()
-      .expectShapesInOrder('B', 'D', 'E', 'F', 'G', 'A', 'C')
-      .bringToFront() // noop
-      .expectShapesInOrder('B', 'D', 'E', 'F', 'G', 'A', 'C')
-  })
-
-  it('Moves non-adjacent shapes to front when one is at the front', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['E', 'G'])
-      .bringToFront()
-      .expectShapesInOrder('A', 'B', 'C', 'D', 'F', 'E', 'G')
-      .bringToFront()
-      .expectShapesInOrder('A', 'B', 'C', 'D', 'F', 'E', 'G')
-  })
-})
-
-describe('When sending backward', () => {
-  it('Moves one shape backward', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['C'])
-      .sendBackward()
-      .expectShapesInOrder('A', 'C', 'B')
-      .sendBackward() // noop
-      .expectShapesInOrder('C', 'A', 'B')
-  })
-
-  it('Moves no shapes when sending shapes at the back', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['A', 'B', 'C'])
-      .sendBackward()
-      .expectShapesInOrder('A', 'B', 'C')
-      .sendBackward()
-      .expectShapesInOrder('A', 'B', 'C')
-  })
-
-  it('Moves two adjacent shapes backward', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['A', 'E'])
-      .sendBackward()
-      .expectShapesInOrder('A', 'B', 'C', 'E', 'D', 'F', 'G')
-      .sendBackward()
-      .expectShapesInOrder('A', 'B', 'E', 'C', 'D', 'F', 'G')
-  })
-
-  it('Moves non-adjacent shapes backward', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['E', 'G'])
-      .sendBackward()
-      .expectShapesInOrder('A', 'B', 'C', 'E', 'D', 'G', 'F')
-      .sendBackward()
-      .expectShapesInOrder('A', 'B', 'E', 'C', 'G', 'D', 'F')
-  })
-
-  it('Moves non-adjacent shapes backward when one is at the back', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['A', 'G'])
-      .sendBackward()
-      .expectShapesInOrder('A', 'B', 'C', 'D', 'E', 'G', 'F')
-      .sendBackward()
-      .expectShapesInOrder('A', 'B', 'C', 'D', 'G', 'E', 'F')
-  })
-
-  it('Moves non-adjacent shapes to backward when both are at the back', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['A', 'B'])
-      .sendBackward()
-      .expectShapesInOrder('A', 'B', 'C', 'D', 'E', 'F', 'G')
-      .sendBackward()
-      .expectShapesInOrder('A', 'B', 'C', 'D', 'E', 'F', 'G')
-  })
-})
-
-describe('When moving forward', () => {
-  it('Moves one shape forward', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['A'])
-      .bringForward()
-      .expectShapesInOrder('B', 'A', 'C', 'D', 'E', 'F', 'G')
-      .bringForward()
-      .expectShapesInOrder('B', 'C', 'A', 'D', 'E', 'F', 'G')
-  })
-
-  it('Moves no shapes when sending shapes at the front', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['E', 'F', 'G'])
-      .bringForward()
-      .expectShapesInOrder('A', 'B', 'C', 'D', 'E', 'F', 'G')
-      .bringForward() // noop
-      .expectShapesInOrder('A', 'B', 'C', 'D', 'E', 'F', 'G')
-  })
-
-  it('Moves two adjacent shapes forward', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['C', 'D'])
-      .bringForward()
-      .expectShapesInOrder('A', 'B', 'E', 'C', 'D', 'F', 'G')
-      .bringForward()
-      .expectShapesInOrder('A', 'B', 'E', 'F', 'C', 'D', 'G')
-  })
-
-  it('Moves non-adjacent shapes forward', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['A', 'C'])
-      .bringForward()
-      .expectShapesInOrder('B', 'A', 'D', 'C', 'E', 'F', 'G')
-      .bringForward()
-      .expectShapesInOrder('B', 'D', 'A', 'E', 'C', 'F', 'G')
-  })
-
-  it('Moves non-adjacent shapes to forward when one is at the front', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['C', 'G'])
-      .bringForward()
-      .expectShapesInOrder('A', 'B', 'D', 'C', 'E', 'F', 'G')
-      .bringForward()
-      .expectShapesInOrder('A', 'B', 'D', 'E', 'C', 'F', 'G')
-  })
-
-  it('Moves non-adjacent shapes to forward when both are at the front', () => {
-    new TLTestApp(documentModel)
-      .setSelectedShapes(['F', 'G'])
-      .bringForward()
-      .expectShapesInOrder('A', 'B', 'C', 'D', 'E', 'F', 'G')
-      .bringForward()
-      .expectShapesInOrder('A', 'B', 'C', 'D', 'E', 'F', 'G')
-  })
-})

tldraw/packages/core/src/lib/TLPage/TLPage.ts

@@ -1,12 +1,12 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import { intersectRayBounds } from '@tldraw/intersect'
+import { intersectRayBounds, TLBounds } from '@tldraw/intersect'
 import Vec from '@tldraw/vec'
 import { action, computed, makeObservable, observable, reaction, toJS } from 'mobx'
-import { BINDING_DISTANCE } from '~constants'
-import type { TLApp, TLShape, TLShapeModel } from '~lib'
-import type { TLLineShape } from '~lib/shapes'
-import { TLBinding, TLBounds, TLEventMap, TLHandle, TLResizeCorner } from '~types'
-import { BoundsUtils, deepCopy, deepEqual, PointUtils } from '~utils'
+import { BINDING_DISTANCE } from '../../constants'
+import { type TLBinding, type TLEventMap, TLResizeCorner, type TLHandle } from '../../types'
+import { deepCopy, BoundsUtils, deepEqual, PointUtils } from '../../utils'
+import type { TLShape, TLShapeModel, TLLineShape } from '../shapes'
+import type { TLApp } from '../TLApp'
 
 export interface TLPageModel<S extends TLShape = TLShape> {
   id: string

tldraw/packages/core/src/lib/TLState.ts

@@ -1,16 +1,16 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import { action, makeObservable, observable, transaction } from 'mobx'
 import type {
+  TLEventMap,
   TLEventHandlers,
+  TLCursor,
+  AnyObject,
+  TLStateEvents,
   TLShortcut,
   TLEvents,
-  TLStateEvents,
-  AnyObject,
-  TLCursor,
-} from '~types'
-import type { TLShape } from '~lib'
-import { KeyUtils } from '~utils'
-import type { TLEventMap } from '~types/TLEventMap'
+} from '../types'
+import { KeyUtils } from '../utils'
+import type { TLShape } from './shapes'
 
 export interface TLStateClass<
   S extends TLShape,

tldraw/packages/core/src/lib/TLTool.tsx

@@ -1,6 +1,7 @@
 /* eslint-disable @typescript-eslint/no-non-null-assertion */
-import type { TLApp, TLShape } from '~lib'
-import type { TLEventMap, TLStateEvents } from '~types'
+import type { TLEventMap, TLStateEvents } from '../types'
+import type { TLShape } from './shapes'
+import type { TLApp } from './TLApp'
 import { TLState } from './TLState'
 
 export interface TLToolConstructor<

tldraw/packages/core/src/lib/TLToolState.ts

@@ -1,7 +1,9 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import type { TLApp, TLShape, TLTool } from '~lib'
-import type { TLEventMap } from '~types'
+import type { TLEventMap } from '../types'
+import type { TLShape } from './shapes'
+import type { TLApp } from './TLApp'
 import { TLState } from './TLState'
+import type { TLTool } from './TLTool'
 
 export interface TLToolStateClass<
   S extends TLShape = TLShape,

tldraw/packages/core/src/lib/TLViewport.ts

@@ -1,7 +1,7 @@
 import { Vec } from '@tldraw/vec'
 import { action, computed, makeObservable, observable } from 'mobx'
-import type { TLBounds } from '~types'
-import { FIT_TO_SCREEN_PADDING } from '~constants'
+import { FIT_TO_SCREEN_PADDING } from '../constants'
+import type { TLBounds } from '../types'
 
 export class TLViewport {
   constructor() {

tldraw/packages/core/src/lib/shapes/TLBoxShape/TLBoxShape.tsx

@@ -1,6 +1,6 @@
 import type { TLBounds } from '@tldraw/intersect'
 import { makeObservable } from 'mobx'
-import { BoundsUtils } from '~utils'
+import { BoundsUtils } from '../../../utils'
 import { TLResizeInfo, TLShape, TLShapeProps } from '../TLShape'
 
 export interface TLBoxShapeProps extends TLShapeProps {

tldraw/packages/core/src/lib/shapes/TLDotShape/TLDotShape.tsx

@@ -1,7 +1,7 @@
 import type { TLBounds } from '@tldraw/intersect'
 import { makeObservable } from 'mobx'
+import { BoundsUtils } from '../../../utils'
 import { TLShape, TLResizeInfo, TLShapeProps } from '../TLShape'
-import { BoundsUtils } from '~utils'
 
 export interface TLDotShapeProps extends TLShapeProps {
   radius?: number

tldraw/packages/core/src/lib/shapes/TLDrawShape/TLDrawShape.tsx

@@ -7,7 +7,7 @@ import {
   intersectPolylineBounds,
   TLBounds,
 } from '@tldraw/intersect'
-import { BoundsUtils, PointUtils } from '~utils'
+import { BoundsUtils, PointUtils } from '../../../utils'
 
 export interface TLDrawShapeProps extends TLShapeProps {
   points: number[][]

tldraw/packages/core/src/lib/shapes/TLEllipseShape/TLEllipseShape.test.ts

@@ -1,25 +0,0 @@
-import type { TLEllipseShapeProps } from '.'
-import { TLEllipseShape } from './TLEllipseShape'
-
-describe('A minimal test', () => {
-  it('Creates the shape', () => {
-    interface EllipseShapeProps extends TLEllipseShapeProps {
-      stroke: string
-    }
-
-    class Shape extends TLEllipseShape<EllipseShapeProps> {
-      static defaultProps: EllipseShapeProps = {
-        id: 'ellipse',
-        type: 'ellipse',
-        parentId: 'page',
-        point: [0, 0],
-        size: [100, 100],
-        stroke: 'black',
-      }
-    }
-
-    const shape = new Shape()
-    expect(shape).toBeDefined()
-    expect(shape.props.stroke).toBe('black')
-  })
-})

tldraw/packages/core/src/lib/shapes/TLEllipseShape/TLEllipseShape.ts

@@ -1,7 +1,7 @@
 import { makeObservable } from 'mobx'
 import { intersectLineSegmentEllipse, intersectEllipseBounds, TLBounds } from '@tldraw/intersect'
-import { BoundsUtils, PointUtils } from '~utils'
 import { TLBoxShape, TLBoxShapeProps } from '../TLBoxShape'
+import { BoundsUtils, PointUtils } from '../../../utils'
 
 export interface TLEllipseShapeProps extends TLBoxShapeProps {
   point: number[]

tldraw/packages/core/src/lib/shapes/TLImageShape/TLImageShape.test.ts

@@ -1,28 +0,0 @@
-import type { TLImageShapeProps } from '.'
-import { TLImageShape } from './TLImageShape'
-
-describe('A minimal test', () => {
-  it('Creates the shape', () => {
-    interface ImageShapeProps extends TLImageShapeProps {
-      stroke: string
-    }
-
-    class Shape extends TLImageShape<ImageShapeProps> {
-      static defaultProps: ImageShapeProps = {
-        id: 'image',
-        type: 'image',
-        parentId: 'page',
-        point: [0, 0],
-        size: [100, 100],
-        stroke: 'black',
-        clipping: 0,
-        objectFit: 'none',
-        assetId: '',
-      }
-    }
-
-    const shape = new Shape()
-    expect(shape).toBeDefined()
-    expect(shape.props.stroke).toBe('black')
-  })
-})

tldraw/packages/core/src/lib/shapes/TLImageShape/TLImageShape.ts

@@ -1,8 +1,7 @@
 import { makeObservable } from 'mobx'
-import type { TLResizeInfo } from '~lib'
-import type { TLAsset, TLBounds } from '~types'
-import type { TLResetBoundsInfo } from '..'
+import type { TLAsset } from '../../../types'
 import { TLBoxShape, TLBoxShapeProps } from '../TLBoxShape'
+import type { TLResetBoundsInfo, TLResizeInfo } from '../TLShape'
 
 export interface TLImageAsset extends TLAsset {
   type: 'image'

tldraw/packages/core/src/lib/shapes/TLLineShape/TLLineShape.test.ts

@@ -1,28 +0,0 @@
-import type { TLLineShapeProps } from '.'
-import { TLLineShape } from './TLLineShape'
-
-describe('A minimal test', () => {
-  it('Creates the shape', () => {
-    interface LineShapeProps extends TLLineShapeProps {
-      stroke: string
-    }
-
-    class Shape extends TLLineShape<LineShapeProps> {
-      static defaultProps: LineShapeProps = {
-        id: 'dot',
-        type: 'dot',
-        parentId: 'page',
-        point: [0, 0],
-        handles: {
-          start: { id: 'start', canBind: true, point: [0, 0] },
-          end: { id: 'end', canBind: true, point: [1, 1] },
-        },
-        stroke: 'black',
-      }
-    }
-
-    const shape = new Shape()
-    expect(shape).toBeDefined()
-    expect(shape.props.stroke).toBe('black')
-  })
-})

tldraw/packages/core/src/lib/shapes/TLLineShape/TLLineShape.tsx

@@ -1,7 +1,7 @@
 import Vec from '@tldraw/vec'
 import { makeObservable } from 'mobx'
-import type { Decoration, TLHandle } from '~types'
-import { BoundsUtils, deepCopy, deepMerge } from '~utils'
+import type { TLHandle, Decoration } from '../../../types'
+import { deepMerge, deepCopy, BoundsUtils } from '../../../utils'
 import { TLPolylineShape, TLPolylineShapeProps } from '../TLPolylineShape'
 
 export interface TLLineShapeProps extends TLPolylineShapeProps {

tldraw/packages/core/src/lib/shapes/TLPolygonShape/TLPolygonShape.test.ts

@@ -1,28 +0,0 @@
-import type { TLPolygonShapeProps } from '.'
-import { TLPolygonShape } from './TLPolygonShape'
-
-describe('A minimal test', () => {
-  it('Creates the shape', () => {
-    interface PolygonShapeProps extends TLPolygonShapeProps {
-      stroke: string
-    }
-
-    class Shape extends TLPolygonShape<PolygonShapeProps> {
-      static defaultProps: PolygonShapeProps = {
-        id: 'dot',
-        type: 'dot',
-        parentId: 'page',
-        point: [0, 0],
-        size: [100, 100],
-        sides: 3,
-        ratio: 0.5,
-        isFlippedY: false,
-        stroke: 'black',
-      }
-    }
-
-    const shape = new Shape()
-    expect(shape).toBeDefined()
-    expect(shape.props.stroke).toBe('black')
-  })
-})

tldraw/packages/core/src/lib/shapes/TLPolygonShape/TLPolygonShape.tsx

@@ -1,9 +1,8 @@
 import { Vec } from '@tldraw/vec'
 import { computed, makeObservable } from 'mobx'
-import type { TLResizeInfo } from '~lib'
 import { intersectLineSegmentPolyline, intersectPolygonBounds, TLBounds } from '@tldraw/intersect'
-import { BoundsUtils, PointUtils, PolygonUtils } from '~utils'
 import { TLBoxShape, TLBoxShapeProps } from '../TLBoxShape'
+import { PolygonUtils, BoundsUtils, PointUtils } from '../../../utils'
 
 export interface TLPolygonShapeProps extends TLBoxShapeProps {
   sides: number

tldraw/packages/core/src/lib/shapes/TLPolylineShape/TLPolylineShape.test.ts

@@ -1,27 +0,0 @@
-import { TLPolylineShapeProps, TLPolylineShape } from './TLPolylineShape'
-
-describe('A minimal test', () => {
-  it('Creates the shape', () => {
-    interface PolylineShapeProps extends TLPolylineShapeProps {
-      stroke: string
-    }
-
-    class Shape extends TLPolylineShape<PolylineShapeProps> {
-      static defaultProps: PolylineShapeProps = {
-        id: 'dot',
-        type: 'dot',
-        parentId: 'page',
-        point: [0, 0],
-        handles: {
-          start: { id: 'start', canBind: true, point: [0, 0] },
-          end: { id: 'end', canBind: true, point: [1, 1] },
-        },
-        stroke: 'black',
-      }
-    }
-
-    const shape = new Shape()
-    expect(shape).toBeDefined()
-    expect(shape.props.stroke).toBe('black')
-  })
-})

tldraw/packages/core/src/lib/shapes/TLPolylineShape/TLPolylineShape.tsx

@@ -6,9 +6,9 @@ import {
   intersectPolylineBounds,
   TLBounds,
 } from '@tldraw/intersect'
-import type { TLHandle } from '~types'
-import { BoundsUtils, PointUtils, PolygonUtils } from '~utils'
 import { TLShapeProps, TLResizeInfo, TLShape } from '../TLShape'
+import type { TLHandle } from '../../../types'
+import { PolygonUtils, BoundsUtils, PointUtils } from '../../../utils'
 
 export interface TLPolylineShapeProps extends TLShapeProps {
   handles: Record<string, TLHandle>

tldraw/packages/core/src/lib/shapes/TLShape/TLShape.tsx

@@ -4,12 +4,13 @@ import {
   intersectLineSegmentPolyline,
   intersectPolygonBounds,
   intersectRayBounds,
+  TLBounds,
 } from '@tldraw/intersect'
 import Vec from '@tldraw/vec'
 import { action, computed, makeObservable, observable, toJS, transaction } from 'mobx'
-import { BINDING_DISTANCE } from '~constants'
-import type { TLAsset, TLBounds, TLHandle, TLResizeCorner, TLResizeEdge } from '~types'
-import { BoundsUtils, deepCopy, PointUtils } from '~utils'
+import { BINDING_DISTANCE } from '../../../constants'
+import type { TLHandle, TLResizeEdge, TLResizeCorner, TLAsset } from '../../../types'
+import { BoundsUtils, PointUtils, deepCopy } from '../../../utils'
 
 export type TLShapeModel<P extends TLShapeProps = TLShapeProps> = {
   nonce?: number

tldraw/packages/core/src/lib/shapes/TLStarShape/TLStarShape.test.ts

@@ -1,8 +0,0 @@
-import { TLStarShape } from './TLStarShape'
-
-describe('A minimal test', () => {
-  it('Creates the shape', () => {
-    const shape = new TLStarShape()
-    expect(shape).toBeDefined()
-  })
-})

tldraw/packages/core/src/lib/shapes/TLStarShape/TLStarShape.tsx

@@ -1,7 +1,7 @@
 import { makeObservable } from 'mobx'
 import { Vec } from '@tldraw/vec'
 import { TLPolygonShape, TLPolygonShapeProps } from '../TLPolygonShape'
-import { PolygonUtils } from '~utils'
+import { PolygonUtils } from '../../../utils'
 
 export interface TLStarShapeProps extends TLPolygonShapeProps {
   sides: number

tldraw/packages/core/src/lib/shapes/TLTextShape/TLTextShape.test.ts

@@ -1,25 +0,0 @@
-import type { TLTextShapeProps } from '.'
-import { TLTextShape } from './TLTextShape'
-
-export interface TextShapeProps extends TLTextShapeProps {
-  stroke: string
-}
-
-export class TextShape extends TLTextShape<TextShapeProps> {
-  static defaultProps: TextShapeProps = {
-    id: 'text',
-    type: 'text',
-    parentId: 'page',
-    point: [0, 0],
-    text: 'hello world',
-    stroke: 'black',
-  }
-}
-
-describe('A minimal test', () => {
-  it('Creates the shape', () => {
-    const shape = new TextShape()
-    expect(shape).toBeDefined()
-    expect(shape.props.stroke).toBe('black')
-  })
-})

tldraw/packages/core/src/lib/tools/TLBoxTool/TLBoxTool.test.ts

@@ -1,63 +0,0 @@
-import { TLTestApp } from '~test'
-
-describe('When using the box tool', () => {
-  it('Starts in idle', () => {
-    const app = new TLTestApp().selectTool('box')
-    expect(app.isIn('box.idle')).toBe(true)
-  })
-  it('Transitions to pointing on pointerdown', () => {
-    const app = new TLTestApp().selectTool('box').pointerDown([100, 100])
-    expect(app.isIn('box.pointing')).toBe(true)
-  })
-  it('Transitions to creating only after leaving the dead zone', () => {
-    const app = new TLTestApp().selectTool('box').pointerDown([100, 100]).pointerMove([100, 105])
-    expect(app.isIn('box.pointing')).toBe(true)
-    app.pointerMove([100, 106])
-    expect(app.isIn('box.creating')).toBe(true)
-  })
-  it('Creates a shape and transitions to select.idle after pointer up', () => {
-    const app = new TLTestApp()
-    app.deleteShapes(app.shapes)
-    expect(app.shapes.length).toBe(0)
-    app.selectTool('box').pointerDown([100, 100]).pointerMove([100, 150]).pointerUp()
-    expect(app.isIn('select.idle')).toBe(true)
-    expect(app.shapes.length).toBe(1)
-    app.shapes[0].update({ id: 'test_box' })
-    expect(app.shapes[0]).toMatchSnapshot('created box')
-  })
-  it('Cancels creating a shape when escape is pressed', () => {
-    const app = new TLTestApp()
-    app.deleteShapes(app.shapes)
-    expect(app.shapes.length).toBe(0)
-    app
-      .selectTool('box')
-      .pointerDown([100, 100])
-      .pointerMove([100, 150])
-      .keyDown('Escape')
-      .pointerUp()
-    expect(app.isIn('box.idle')).toBe(true)
-    expect(app.shapes.length).toBe(0)
-  })
-  it('Transitions from idle to select.idle on Escape', () => {
-    const app = new TLTestApp().selectTool('box')
-    expect(app.isIn('box.idle')).toBe(true)
-    app.keyDown('Escape')
-    expect(app.isIn('select.idle')).toBe(true)
-  })
-})
-
-describe('When creating a box shape', () => {
-  const app = new TLTestApp()
-  app.deleteShapes(app.shapes)
-  expect(app.shapes.length).toBe(0)
-  app.selectTool('box').pointerDown([100, 100]).pointerMove([200, 150])
-  const shape = app.shapes[0]
-  expect(shape.bounds).toMatchObject({
-    minX: 100,
-    minY: 100,
-    maxX: 200,
-    maxY: 150,
-    width: 100,
-    height: 50,
-  })
-})

tldraw/packages/core/src/lib/tools/TLBoxTool/TLBoxTool.ts

@@ -1,5 +1,7 @@
-import { TLApp, TLBoxShape, TLShape, TLTool } from '~lib'
-import { TLCursor, TLEventMap } from '~types'
+import { type TLEventMap, TLCursor } from '../../../types'
+import type { TLBoxShape, TLShape } from '../../shapes'
+import type { TLApp } from '../../TLApp'
+import { TLTool } from '../../TLTool'
 import { IdleState, PointingState, CreatingState } from './states'
 
 export abstract class TLBoxTool<

tldraw/packages/core/src/lib/tools/TLBoxTool/__snapshots__/TLBoxTool.test.ts.snap

@@ -1,47 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`When using the box tool Creates a shape and transitions to select.idle after pointer up: created box 1`] = `
-TLBoxShape {
-  "clone": [Function],
-  "getBounds": [Function],
-  "getCachedSerialized": [Function],
-  "getCenter": [Function],
-  "getRotatedBounds": [Function],
-  "getSerialized": [Function],
-  "hideContextBar": false,
-  "hideResizeHandles": false,
-  "hideRotateHandle": false,
-  "hideSelection": false,
-  "hideSelectionDetail": false,
-  "hitTestBounds": [Function],
-  "hitTestLineSegment": [Function],
-  "hitTestPoint": [Function],
-  "isAspectRatioLocked": false,
-  "isDirty": true,
-  "canEdit": false,
-  "isStateful": false,
-  "lastSerialized": Object {},
-  "nonce": 0,
-  "onHandleChange": [Function],
-  "onResize": [Function],
-  "props": Object {
-    "id": "test_box",
-    "parentId": "page1",
-    "point": Array [
-      100,
-      100,
-      0.5,
-    ],
-    "size": Array [
-      0,
-      50,
-    ],
-    "type": "box",
-  },
-  "showCloneHandles": false,
-  "canUnmount": false,
-  "type": "box",
-  "validateProps": [Function],
-  "version": 1,
-}
-`;

tldraw/packages/core/src/lib/tools/TLBoxTool/states/CreatingState.tsx

@@ -1,9 +1,11 @@
 import type { TLBoxTool } from '../TLBoxTool'
-import { TLShape, TLApp, TLToolState, TLBoxShape } from '~lib'
 import Vec from '@tldraw/vec'
-import { TLCursor, TLEventMap, TLResizeCorner, TLStateEvents } from '~types'
 import type { TLBounds } from '@tldraw/intersect'
-import { BoundsUtils, uniqueId } from '~utils'
+import { type TLEventMap, TLCursor, type TLStateEvents, TLResizeCorner } from '../../../../types'
+import { uniqueId, BoundsUtils } from '../../../../utils'
+import type { TLBoxShape, TLShape } from '../../../shapes'
+import type { TLApp } from '../../../TLApp'
+import { TLToolState } from '../../../TLToolState'
 
 export class CreatingState<
   T extends TLBoxShape,

tldraw/packages/core/src/lib/tools/TLBoxTool/states/IdleState.tsx

@@ -1,6 +1,8 @@
+import type { TLEventMap, TLStateEvents } from '../../../../types'
+import type { TLShape, TLBoxShape } from '../../../shapes'
+import type { TLApp } from '../../../TLApp'
+import { TLToolState } from '../../../TLToolState'
 import type { TLBoxTool } from '../TLBoxTool'
-import { TLShape, TLApp, TLToolState, TLBoxShape } from '~lib'
-import type { TLEventMap, TLStateEvents } from '~types'
 
 export class IdleState<
   S extends TLShape,

tldraw/packages/core/src/lib/tools/TLBoxTool/states/PointingState.tsx

@@ -1,7 +1,9 @@
 import { Vec } from '@tldraw/vec'
+import type { TLEventMap, TLStateEvents } from '../../../../types'
+import type { TLShape, TLBoxShape } from '../../../shapes'
+import type { TLApp } from '../../../TLApp'
+import { TLToolState } from '../../../TLToolState'
 import type { TLBoxTool } from '../TLBoxTool'
-import { TLShape, TLApp, TLToolState, TLBoxShape } from '~lib'
-import type { TLEventMap, TLStateEvents } from '~types'
 
 export class PointingState<
   S extends TLShape,

tldraw/packages/core/src/lib/tools/TLDotTool/TLDotTool.test.ts

@@ -1,36 +0,0 @@
-import { TLTestApp } from '~test'
-
-describe('When using the tool', () => {
-  it('Starts in idle', () => {
-    const app = new TLTestApp().selectTool('dot')
-    expect(app.isIn('dot.idle')).toBe(true)
-  })
-  it('Transitions to creating and creates a dot shape on pointer down', () => {
-    const app = new TLTestApp()
-    app.deleteShapes(app.shapes).selectTool('dot')
-    expect(app.shapes.length).toBe(0)
-    app.pointerDown([100, 100])
-    expect(app.shapes.length).toBe(1)
-    app.shapes[0].update({ id: 'test_dot' })
-    expect(app.shapes[0]).toMatchSnapshot('created dot')
-  })
-  it('Cancels creating a shape when escape is pressed', () => {
-    const app = new TLTestApp()
-    app.deleteShapes(app.shapes)
-    expect(app.shapes.length).toBe(0)
-    app
-      .selectTool('dot')
-      .pointerDown([100, 100])
-      .pointerMove([100, 150])
-      .keyDown('Escape')
-      .pointerUp()
-    expect(app.isIn('dot.idle')).toBe(true)
-    expect(app.shapes.length).toBe(0)
-  })
-  it('Transitions from idle to select.idle on Escape', () => {
-    const app = new TLTestApp().selectTool('dot')
-    expect(app.isIn('dot.idle')).toBe(true)
-    app.keyDown('Escape')
-    expect(app.isIn('select.idle')).toBe(true)
-  })
-})

tldraw/packages/core/src/lib/tools/TLDotTool/TLDotTool.ts

@@ -1,5 +1,7 @@
-import { TLApp, TLDotShape, TLShape, TLTool } from '~lib'
-import { TLCursor, TLEventMap } from '~types'
+import { type TLEventMap, TLCursor } from '../../../types'
+import type { TLDotShape, TLShape } from '../../shapes'
+import type { TLApp } from '../../TLApp'
+import { TLTool } from '../../TLTool'
 import { CreatingState, IdleState } from './states'
 
 export abstract class TLDotTool<

tldraw/packages/core/src/lib/tools/TLDotTool/__snapshots__/TLDotTool.test.ts.snap

@@ -1,43 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`When using the tool Transitions to creating and creates a dot shape on pointer down: created dot 1`] = `
-TLDotShape {
-  "clone": [Function],
-  "getBounds": [Function],
-  "getCachedSerialized": [Function],
-  "getCenter": [Function],
-  "getRotatedBounds": [Function],
-  "getSerialized": [Function],
-  "hideContextBar": false,
-  "hideResizeHandles": true,
-  "hideRotateHandle": true,
-  "hideSelection": true,
-  "hideSelectionDetail": true,
-  "hitTestBounds": [Function],
-  "hitTestLineSegment": [Function],
-  "hitTestPoint": [Function],
-  "isAspectRatioLocked": false,
-  "isDirty": true,
-  "canEdit": false,
-  "isStateful": false,
-  "lastSerialized": Object {},
-  "nonce": 0,
-  "onHandleChange": [Function],
-  "onResize": [Function],
-  "props": Object {
-    "id": "test_dot",
-    "parentId": "page1",
-    "point": Array [
-      94,
-      94,
-    ],
-    "radius": 6,
-    "type": "dot",
-  },
-  "showCloneHandles": false,
-  "canUnmount": false,
-  "type": "dot",
-  "validateProps": [Function],
-  "version": 1,
-}
-`;

tldraw/packages/core/src/lib/tools/TLDotTool/states/CreatingState.tsx

@@ -1,9 +1,11 @@
 import Vec from '@tldraw/vec'
-import { TLApp, TLShape, TLToolState, TLDotShape } from '~lib'
-import { uniqueId } from '~utils'
-import type { TLEventMap, TLStateEvents } from '~types'
 import type { TLDotTool } from '../TLDotTool'
 import { transaction } from 'mobx'
+import type { TLEventMap, TLStateEvents } from '../../../../types'
+import { uniqueId } from '../../../../utils'
+import type { TLDotShape, TLShape } from '../../../shapes'
+import type { TLApp } from '../../../TLApp'
+import { TLToolState } from '../../../TLToolState'
 
 export class CreatingState<
   S extends TLDotShape,

tldraw/packages/core/src/lib/tools/TLDotTool/states/IdleState.tsx

@@ -1,5 +1,7 @@
-import { TLDotShape, TLApp, TLShape, TLToolState } from '~lib'
-import type { TLEventMap, TLStateEvents } from '~types'
+import type { TLEventMap, TLStateEvents } from '../../../../types'
+import type { TLShape, TLDotShape } from '../../../shapes'
+import type { TLApp } from '../../../TLApp'
+import { TLToolState } from '../../../TLToolState'
 import type { TLDotTool } from '../TLDotTool'
 
 export class IdleState<

tldraw/packages/core/src/lib/tools/TLDrawTool/TLDrawTool.test.ts

@@ -1,177 +0,0 @@
-import { TLTestApp } from '~test'
-
-describe('When using the draw tool', () => {
-  it('Starts in idle', () => {
-    const app = new TLTestApp().selectTool('draw')
-    expect(app.isIn('draw.idle')).toBe(true)
-  })
-  it('Transitions to creating and creates a shape on pointer down', () => {
-    const app = new TLTestApp()
-    app.deleteShapes(app.shapes).selectTool('draw')
-    expect(app.shapes.length).toBe(0)
-    app.pointerDown([100, 100])
-    expect(app.shapes.length).toBe(1)
-    const shape = app.shapes[0]
-    shape.update({ id: 'test_draw' })
-    expect(shape).toMatchSnapshot('created draw')
-  })
-  it('Extends the shapes points while moving in the creating state', () => {
-    const app = new TLTestApp()
-    app
-      .deleteShapes(app.shapes)
-      .selectTool('draw')
-      .pointerDown([100, 100])
-      .pointerMove([110, 110])
-      .pointerMove([120, 120])
-    const shape = app.shapes[0]
-    expect(app.shapes.length).toBe(1)
-    expect(shape.props.points.length).toBe(3)
-  })
-  it('Creates multiple shapes', () => {
-    const app = new TLTestApp()
-    app
-      .deleteShapes(app.shapes)
-      .selectTool('draw')
-      .pointerDown([100, 100])
-      .pointerMove([110, 110])
-      .pointerMove([120, 120])
-      .pointerUp()
-    expect(app.shapes.length).toBe(1)
-    app.pointerDown([200, 200]).pointerMove([210, 210]).pointerMove([220, 220]).pointerUp()
-    expect(app.shapes.length).toBe(2)
-  })
-  it("Extends the previous shape's points if pressing shift moving in the creating state", () => {
-    const app = new TLTestApp()
-    app
-      .deleteShapes(app.shapes)
-      .selectTool('draw')
-      .pointerDown([100, 100])
-      .pointerMove([110, 110])
-      .pointerMove([120, 120])
-      .pointerUp()
-      .pointerDown([220, 220], undefined, { shiftKey: true })
-      .pointerMove([300, 300])
-    expect(app.shapes.length).toBe(1)
-    const shape = app.shapes[0]
-    expect(shape.props.point).toMatchObject([100, 100])
-  })
-  it('Cancels creating a shape when escape is pressed', () => {
-    const app = new TLTestApp()
-    app.deleteShapes(app.shapes)
-    expect(app.shapes.length).toBe(0)
-    app
-      .selectTool('draw')
-      .pointerDown([100, 100])
-      .pointerMove([100, 150])
-      .keyDown('Escape')
-      .pointerUp()
-    expect(app.isIn('draw.idle')).toBe(true)
-    expect(app.shapes.length).toBe(0)
-  })
-  it('Transitions from idle to select.idle on Escape', () => {
-    const app = new TLTestApp().selectTool('draw')
-    expect(app.isIn('draw.idle')).toBe(true)
-    app.keyDown('Escape')
-    expect(app.isIn('select.idle')).toBe(true)
-  })
-})
-
-describe('When creating the draw shape', () => {
-  it("Offsets the points when the shape's point changes", () => {
-    const app = new TLTestApp()
-    app.deleteShapes(app.shapes).selectTool('draw').pointerDown([100, 100])
-    const shape = app.shapes[0]
-    expect(shape.props.point).toMatchObject([100, 100])
-    app.pointerMove([200, 200])
-    expect(shape.props.point).toMatchObject([100, 100])
-    expect(shape.props.points[shape.props.points.length - 1]).toMatchObject([100, 100, 0.5])
-    app.pointerMove([-50, 200])
-    expect(shape.props.point).toMatchObject([-50, 100])
-    expect(shape.props.points[shape.props.points.length - 1]).toMatchObject([0, 100, 0.5])
-  })
-})
-
-describe('When extending the draw shape', () => {
-  it("Offsets the points when the shape's point changes", () => {
-    const app = new TLTestApp()
-    app.deleteShapes(app.shapes).selectTool('draw').pointerDown([0, 0])
-    const shape = app.shapes[0]
-    app.pointerMove([100, 100]).pointerUp()
-    expect(shape.props.points).toMatchObject([
-      [0, 0, 0.5],
-      [100, 100, 0.5],
-    ])
-    app.pointerMove([-100, 100]).pointerDown([-100, 100], undefined, { shiftKey: true })
-    expect(shape.props.points[shape.props.points.length - 1]).toMatchObject([0, 100, 0.5])
-    expect(shape.props.point).toMatchObject([-100, 0])
-    expect(shape.props.points.slice(0, 2)).toMatchObject([
-      [100, 0, 0.5],
-      [200, 100, 0.5],
-    ])
-    expect(shape.props.points[shape.props.points.length - 1]).toMatchObject([0, 100, 0.5])
-    app.pointerMove([-110, 110])
-    expect(shape.props.points.slice(0, 2)).toMatchObject([
-      [110, 0, 0.5],
-      [210, 100, 0.5],
-    ])
-    expect(shape.props.points[shape.props.points.length - 1]).toMatchObject([0, 110, 0.5])
-  })
-  it('Extends down and left without changing the point', () => {
-    const app = new TLTestApp()
-    app
-      .deleteShapes(app.shapes)
-      .selectTool('draw')
-      .pointerDown([100, 100])
-      .pointerMove([200, 200])
-      .pointerUp()
-      .pointerDown([300, 300], undefined, { shiftKey: true })
-      .pointerMove([400, 400])
-    const shape = app.shapes[0]
-    expect(shape.props.point).toMatchObject([100, 100])
-  })
-  it('Repositions when dragging past initial x and y', () => {
-    const app = new TLTestApp()
-    app
-      .deleteShapes(app.shapes)
-      .selectTool('draw')
-      .pointerDown([100, 100])
-      .pointerMove([200, 200])
-      .pointerUp()
-      .pointerDown([300, 300], undefined, { shiftKey: true })
-      .pointerMove([400, 400])
-      .pointerMove([50, 400])
-    const shape = app.shapes[0]
-    expect(shape.props.point).toMatchObject([50, 100])
-  })
-  it('Extends up or left and shifts points', () => {
-    const app = new TLTestApp()
-    app
-      .deleteShapes(app.shapes)
-      .selectTool('draw')
-      .pointerDown([0, 0])
-      .pointerMove([50, 50])
-      .pointerUp()
-      .pointerDown([-50, 100], undefined, { shiftKey: true })
-    const shape = app.shapes[0]
-    expect(shape.props.point).toMatchObject([-50, 0])
-    // expect(shape.props.points).toMatchObject([
-    //   [50, 50],
-    //   [100, 100],
-    //   [0, 0],
-    // ])
-  })
-  it('Repositions when dragging past initial x and y after shifting points', () => {
-    const app = new TLTestApp()
-    app
-      .deleteShapes(app.shapes)
-      .selectTool('draw')
-      .pointerDown([100, 100])
-      .pointerMove([200, 200])
-      .pointerUp()
-      .pointerDown([300, 300], undefined, { shiftKey: true })
-      .pointerMove([400, 400])
-      .pointerMove([50, 400])
-    const shape = app.shapes[0]
-    expect(shape.props.point).toMatchObject([50, 100])
-  })
-})

tldraw/packages/core/src/lib/tools/TLDrawTool/TLDrawTool.tsx

@@ -1,6 +1,8 @@
+import { type TLEventMap, TLCursor } from '../../../types'
+import type { TLDrawShape, TLShape, TLDrawShapeProps } from '../../shapes'
+import type { TLApp } from '../../TLApp'
+import { TLTool } from '../../TLTool'
 import { IdleState, CreatingState } from './states'
-import { TLTool, TLApp, TLShape, TLDrawShape, TLDrawShapeProps } from '~lib'
-import { TLCursor, TLEventMap } from '~types'
 
 export abstract class TLDrawTool<
   T extends TLDrawShape = TLDrawShape,

tldraw/packages/core/src/lib/tools/TLDrawTool/__snapshots__/TLDrawTool.test.ts.snap

@@ -1,54 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`When using the draw tool Transitions to creating and creates a shape on pointer down: created draw 1`] = `
-TLDrawShape {
-  "clone": [Function],
-  "getBounds": [Function],
-  "getCachedSerialized": [Function],
-  "getCenter": [Function],
-  "getRotatedBounds": [Function],
-  "getSerialized": [Function],
-  "hideContextBar": false,
-  "hideResizeHandles": false,
-  "hideRotateHandle": false,
-  "hideSelection": false,
-  "hideSelectionDetail": false,
-  "hitTestBounds": [Function],
-  "hitTestLineSegment": [Function],
-  "hitTestPoint": [Function],
-  "isAspectRatioLocked": false,
-  "isDirty": true,
-  "canEdit": false,
-  "isResizeFlippedX": false,
-  "isResizeFlippedY": false,
-  "isStateful": false,
-  "lastSerialized": Object {},
-  "nonce": 0,
-  "normalizedPoints": Array [],
-  "onHandleChange": [Function],
-  "onResize": [Function],
-  "onResizeStart": [Function],
-  "props": Object {
-    "id": "test_draw",
-    "isComplete": false,
-    "parentId": "page1",
-    "point": Array [
-      100,
-      100,
-    ],
-    "points": Array [
-      Array [
-        0,
-        0,
-        0.5,
-      ],
-    ],
-    "type": "draw",
-  },
-  "showCloneHandles": false,
-  "canUnmount": false,
-  "type": "draw",
-  "validateProps": [Function],
-  "version": 1,
-}
-`;

tldraw/packages/core/src/lib/tools/TLDrawTool/states/CreatingState.tsx

@@ -1,7 +1,9 @@
 import { Vec } from '@tldraw/vec'
-import { TLDrawShape, TLToolState, TLShape, TLApp } from '~lib'
-import type { TLStateEvents, TLEventMap } from '~types'
-import { lerp, PointUtils, uniqueId } from '~utils'
+import type { TLEventMap, TLStateEvents } from '../../../../types'
+import { lerp, uniqueId, PointUtils } from '../../../../utils'
+import type { TLShape, TLDrawShape } from '../../../shapes'
+import type { TLApp } from '../../../TLApp'
+import { TLToolState } from '../../../TLToolState'
 import type { TLDrawTool } from '../TLDrawTool'
 
 export class CreatingState<

tldraw/packages/core/src/lib/tools/TLDrawTool/states/IdleState.tsx

@@ -1,5 +1,7 @@
-import { TLToolState, TLShape, TLApp, TLDrawShape } from '~lib'
-import type { TLEventMap, TLStateEvents } from '~types'
+import type { TLEventMap, TLStateEvents } from '../../../../types'
+import type { TLShape, TLDrawShape } from '../../../shapes'
+import type { TLApp } from '../../../TLApp'
+import { TLToolState } from '../../../TLToolState'
 import type { TLDrawTool } from '../TLDrawTool'
 
 export class IdleState<

tldraw/packages/core/src/lib/tools/TLEraseTool/TLEraseTool.test.ts

@@ -1,28 +0,0 @@
-import { TLTestApp } from '~test'
-
-describe('When using the tool', () => {
-  it('Starts in idle', () => {
-    const app = new TLTestApp().selectTool('erase')
-    expect(app.isIn('erase.idle')).toBe(true)
-  })
-  it('Transitions to pointing on pointerdown', () => {
-    const app = new TLTestApp().selectTool('erase').pointerDown([100, 100])
-    expect(app.isIn('erase.pointing')).toBe(true)
-  })
-  it('Transitions to creating only after leaving the dead zone', () => {
-    const app = new TLTestApp().selectTool('erase').pointerDown([100, 100]).pointerMove([100, 105])
-    expect(app.isIn('erase.pointing')).toBe(true)
-    app.pointerMove([100, 106])
-    expect(app.isIn('erase.erasing')).toBe(true)
-  })
-  it.todo('Erases all shapes under the pointer on pointer up from pointing state')
-  it.todo('Sets erasing shapes to all shapes intersecting path while moving in erasing state')
-  it.todo('Erases all erasing shapes on pointer up from erasing state')
-  it.todo('Clears erasing shapes on Escape from erasing state')
-  it('Transitions from idle to select.idle on Escape', () => {
-    const app = new TLTestApp().selectTool('erase')
-    expect(app.isIn('erase.idle')).toBe(true)
-    app.keyDown('Escape')
-    expect(app.isIn('select.idle')).toBe(true)
-  })
-})

tldraw/packages/core/src/lib/tools/TLEraseTool/TLEraseTool.tsx

@@ -1,6 +1,8 @@
+import { type TLEventMap, TLCursor } from '../../../types'
+import type { TLShape } from '../../shapes'
+import type { TLApp } from '../../TLApp'
+import { TLTool } from '../../TLTool'
 import { IdleState, PointingState, ErasingState } from './states'
-import { TLTool, TLApp, TLShape } from '~lib'
-import { TLEventMap, TLCursor } from '~types'
 
 export abstract class TLEraseTool<
   S extends TLShape = TLShape,

tldraw/packages/core/src/lib/tools/TLEraseTool/states/ErasingState.tsx

@@ -1,6 +1,8 @@
 import { Vec } from '@tldraw/vec'
-import { TLToolState, TLShape, TLApp } from '~lib'
-import type { TLEventMap, TLStateEvents } from '~types'
+import type { TLEventMap, TLStateEvents } from '../../../../types'
+import type { TLShape } from '../../../shapes'
+import type { TLApp } from '../../../TLApp'
+import { TLToolState } from '../../../TLToolState'
 import type { TLEraseTool } from '../TLEraseTool'
 
 export class ErasingState<