Peng Xiao 3 سال پیش
والد
کامیت
d00a3dbff2
40فایلهای تغییر یافته به همراه213 افزوده شده و 125 حذف شده
  1. 2 2
      src/main/frontend/handler/page.cljs
  2. 1 1
      tldraw/.prettierrc
  3. 2 2
      tldraw/apps/tldraw-logseq/build.mjs
  4. 1 1
      tldraw/apps/tldraw-logseq/src/components/ActionBar/index.ts
  5. 1 1
      tldraw/apps/tldraw-logseq/src/components/AppUI.tsx
  6. 1 5
      tldraw/apps/tldraw-logseq/src/components/Devtools/Devtools.tsx
  7. 4 3
      tldraw/apps/tldraw-logseq/src/components/Minimap/Minimap.tsx
  8. 16 1
      tldraw/apps/tldraw-logseq/src/components/StatusBar/StatusBar.tsx
  9. 1 1
      tldraw/apps/tldraw-logseq/src/components/icons/index.ts
  10. 1 1
      tldraw/apps/tldraw-logseq/src/components/inputs/ColorInput.tsx
  11. 1 1
      tldraw/apps/tldraw-logseq/src/lib/shapes/TextShape.tsx
  12. 20 20
      tldraw/apps/tldraw-logseq/src/lib/shapes/arrow/constants.ts
  13. 1 1
      tldraw/apps/tldraw-logseq/src/lib/shapes/index.ts
  14. 16 4
      tldraw/apps/tldraw-logseq/src/lib/shapes/text/TextAreaUtils.ts
  15. 0 1
      tldraw/apps/tldraw-logseq/src/lib/shapes/text/TextLabel.tsx
  16. 1 1
      tldraw/apps/tldraw-logseq/src/lib/shapes/text/getTextSize.ts
  17. 13 9
      tldraw/apps/tldraw-logseq/src/styles.css
  18. 1 1
      tldraw/apps/tldraw-logseq/tsconfig.json
  19. 2 2
      tldraw/apps/tldraw-logseq/tsup.config.ts
  20. 1 1
      tldraw/cljs-demo/public/index.html
  21. 0 1
      tldraw/demo/src/index.css
  22. 1 1
      tldraw/demo/tailwind.config.js
  23. 2 2
      tldraw/demo/vite.config.js
  24. 1 1
      tldraw/packages/core/src/lib/TLApi/TLApi.ts
  25. 17 4
      tldraw/packages/core/src/lib/TLApp/TLApp.ts
  26. 1 1
      tldraw/packages/core/src/lib/TLViewport.ts
  27. 1 1
      tldraw/packages/core/src/lib/shapes/TLBoxShape/TLBoxShape.tsx
  28. 22 23
      tldraw/packages/core/src/lib/tools/TLSelectTool/states/ResizingState.ts
  29. 1 1
      tldraw/packages/core/src/types/types.ts
  30. 2 2
      tldraw/packages/core/src/utils/PolygonUtils.ts
  31. 0 1
      tldraw/packages/core/src/utils/index.ts
  32. 1 1
      tldraw/packages/react/src/components/ui/SelectionForeground/handles/EdgeHandle.tsx
  33. 2 2
      tldraw/packages/react/src/hooks/useKeyboardEvents.ts
  34. 1 1
      tldraw/packages/react/src/hooks/useMinimapEvents.ts
  35. 1 1
      tldraw/packages/react/src/hooks/useSetup.ts
  36. 1 1
      tldraw/packages/react/src/lib/TLReactApp.ts
  37. 1 1
      tldraw/packages/utils/curve/package.json
  38. 1 1
      tldraw/packages/utils/intersect/package.json
  39. 70 19
      tldraw/packages/utils/intersect/src/index.ts
  40. 1 1
      tldraw/packages/utils/vec/package.json

+ 2 - 2
src/main/frontend/handler/page.cljs

@@ -91,7 +91,7 @@
   (and (not journal?)
        (util/create-title-property? page-name)))
 
-(defn- build-page-tx [format properties page journal?]
+(defn- build-page-tx [format properties page journal? whiteboard?]
   (when (:block/uuid page)
     (let [page-entity [:block/uuid (:block/uuid page)]
           create-title? (create-title-property? journal?
@@ -123,7 +123,7 @@
    :uuid                - when set, use this uuid instead of generating a new one."
   ([title]
    (create! title {}))
-  ([title {:keys [redirect? create-first-block? format properties split-namespace? journal? uuid]
+  ([title {:keys [redirect? create-first-block? format properties split-namespace? journal? whiteboard? uuid]
            :or   {redirect?           true
                   create-first-block? true
                   format              nil

+ 1 - 1
tldraw/.prettierrc

@@ -8,4 +8,4 @@
   "jsxSingleQuote": false,
   "jsxBracketSameLine": false,
   "arrowParens": "avoid"
-}
+}

+ 2 - 2
tldraw/apps/tldraw-logseq/build.mjs

@@ -11,9 +11,9 @@ const packageJson = fs.readFileSync('package.json', 'utf8')
 const glob = JSON.parse(packageJson)
 Object.assign(glob, {
   main: './index.js',
-  module: './index.mjs'
+  module: './index.mjs',
 })
 
 fs.writeFileSync('dist/package.json', JSON.stringify(glob, null, 2))
 
-await $`ln -f ${__dirname}/dist/index.js ${__dirname}/../../../src/js/tldraw-logseq.js`
+await $`ln -f ${__dirname}/dist/index.js ${__dirname}/../../../src/js/tldraw-logseq.js`

+ 1 - 1
tldraw/apps/tldraw-logseq/src/components/ActionBar/index.ts

@@ -1 +1 @@
-export * from './ActionBar';
+export * from './ActionBar'

+ 1 - 1
tldraw/apps/tldraw-logseq/src/components/AppUI.tsx

@@ -7,7 +7,7 @@ import { DevTools } from './Devtools'
 import { Minimap } from './Minimap'
 import { ActionBar } from './ActionBar'
 
-const isDev = process.env.NODE_ENV === 'development'
+const isDev = process.env.NODE_ENV !== 'development'
 
 export const AppUI = observer(function AppUI() {
   return (

+ 1 - 5
tldraw/apps/tldraw-logseq/src/components/Devtools/Devtools.tsx

@@ -52,9 +52,5 @@ export const DevTools = observer(() => {
       )
     : null
 
-  return (
-    <>
-      {rendererStatus}
-    </>
-  )
+  return <>{rendererStatus}</>
 })

+ 4 - 3
tldraw/apps/tldraw-logseq/src/components/Minimap/Minimap.tsx

@@ -10,7 +10,9 @@ export const Minimap = observer(function Minimap() {
   const app = useApp()
 
   const [whiteboardPreviewManager] = React.useState(() => new PreviewManager(app.serialized))
-  const [preview, setPreview] = React.useState(() => whiteboardPreviewManager.generatePreviewJsx(app.viewport))
+  const [preview, setPreview] = React.useState(() =>
+    whiteboardPreviewManager.generatePreviewJsx(app.viewport)
+  )
 
   const [active, setActive] = React.useState(false)
 
@@ -36,7 +38,7 @@ export const Minimap = observer(function Minimap() {
 
   return (
     <>
-    {active && (
+      {active && (
         <div className="preview-minimap" {...events}>
           {preview}
         </div>
@@ -48,7 +50,6 @@ export const Minimap = observer(function Minimap() {
       >
         <Crosshair2Icon />
       </button>
-      
     </>
   )
 })

+ 16 - 1
tldraw/apps/tldraw-logseq/src/components/StatusBar/StatusBar.tsx

@@ -9,10 +9,25 @@ export const StatusBar = observer(function StatusBar() {
   const app = useApp<Shape>()
   React.useEffect(() => {
     const canvas = document.querySelector<HTMLElement>('.logseq-tldraw-wrapper .tl-canvas')
+    const actionBar = document.querySelector<HTMLElement>('.logseq-tldraw-wrapper .action-bar')
     if (canvas) {
       canvas.style.height = 'calc(100% - 32px)'
     }
-  }, [])
+
+    if (actionBar) {
+      actionBar.style.marginBottom = '32px'
+    }
+
+    return () => {
+      if (canvas) {
+        canvas.style.height = '100%'
+      }
+
+      if (actionBar) {
+        actionBar.style.marginBottom = '0px'
+      }
+    }
+  })
   return (
     <div className="statusbar">
       {app.selectedTool.id} | {app.selectedTool.currentState.id}

+ 1 - 1
tldraw/apps/tldraw-logseq/src/components/icons/index.ts

@@ -15,4 +15,4 @@ export * from './EraserIcon'
 export * from './MultiplayerIcon'
 export * from './DiscordIcon'
 export * from './LineIcon'
-export * from './LogseqIcon'
+export * from './LogseqIcon'

+ 1 - 1
tldraw/apps/tldraw-logseq/src/components/inputs/ColorInput.tsx

@@ -27,7 +27,7 @@ export function ColorInput({ label, value, onChange, ...rest }: ColorInputProps)
           name={`color-${label}`}
           type="color"
           value={computedValue}
-          onChange={(e) => {
+          onChange={e => {
             setComputedValue(e.target.value)
             onChange?.(e)
           }}

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

@@ -273,7 +273,7 @@ export class TextShape extends TLTextShape<TextShapeProps> {
     const {
       props: { text, stroke, fontSize, fontFamily },
     } = this
-    // Stretch to the bound size 
+    // Stretch to the bound size
     const bounds = this.getBounds()
 
     return (

+ 20 - 20
tldraw/apps/tldraw-logseq/src/lib/shapes/arrow/constants.ts

@@ -20,25 +20,25 @@ export type Easing =
   | 'easeInOutExpo'
 
 export const EASINGS: Record<Easing, (t: number) => number> = {
-  linear: (t) => t,
-  easeInQuad: (t) => t * t,
-  easeOutQuad: (t) => t * (2 - t),
-  easeInOutQuad: (t) => (t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t),
-  easeInCubic: (t) => t * t * t,
-  easeOutCubic: (t) => --t * t * t + 1,
-  easeInOutCubic: (t) => (t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1),
-  easeInQuart: (t) => t * t * t * t,
-  easeOutQuart: (t) => 1 - --t * t * t * t,
-  easeInOutQuart: (t) => (t < 0.5 ? 8 * t * t * t * t : 1 - 8 * --t * t * t * t),
-  easeInQuint: (t) => t * t * t * t * t,
-  easeOutQuint: (t) => 1 + --t * t * t * t * t,
-  easeInOutQuint: (t) => (t < 0.5 ? 16 * t * t * t * t * t : 1 + 16 * --t * t * t * t * t),
-  easeInSine: (t) => 1 - Math.cos((t * Math.PI) / 2),
-  easeOutSine: (t) => Math.sin((t * Math.PI) / 2),
-  easeInOutSine: (t) => -(Math.cos(Math.PI * t) - 1) / 2,
-  easeInExpo: (t) => (t <= 0 ? 0 : Math.pow(2, 10 * t - 10)),
-  easeOutExpo: (t) => (t >= 1 ? 1 : 1 - Math.pow(2, -10 * t)),
-  easeInOutExpo: (t) =>
+  linear: t => t,
+  easeInQuad: t => t * t,
+  easeOutQuad: t => t * (2 - t),
+  easeInOutQuad: t => (t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t),
+  easeInCubic: t => t * t * t,
+  easeOutCubic: t => --t * t * t + 1,
+  easeInOutCubic: t => (t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1),
+  easeInQuart: t => t * t * t * t,
+  easeOutQuart: t => 1 - --t * t * t * t,
+  easeInOutQuart: t => (t < 0.5 ? 8 * t * t * t * t : 1 - 8 * --t * t * t * t),
+  easeInQuint: t => t * t * t * t * t,
+  easeOutQuint: t => 1 + --t * t * t * t * t,
+  easeInOutQuint: t => (t < 0.5 ? 16 * t * t * t * t * t : 1 + 16 * --t * t * t * t * t),
+  easeInSine: t => 1 - Math.cos((t * Math.PI) / 2),
+  easeOutSine: t => Math.sin((t * Math.PI) / 2),
+  easeInOutSine: t => -(Math.cos(Math.PI * t) - 1) / 2,
+  easeInExpo: t => (t <= 0 ? 0 : Math.pow(2, 10 * t - 10)),
+  easeOutExpo: t => (t >= 1 ? 1 : 1 - Math.pow(2, -10 * t)),
+  easeInOutExpo: t =>
     t <= 0
       ? 0
       : t >= 1
@@ -46,4 +46,4 @@ export const EASINGS: Record<Easing, (t: number) => number> = {
       : t < 0.5
       ? Math.pow(2, 20 * t - 10) / 2
       : (2 - Math.pow(2, -20 * t + 10)) / 2,
-}
+}

+ 1 - 1
tldraw/apps/tldraw-logseq/src/lib/shapes/index.ts

@@ -49,4 +49,4 @@ export const shapes: TLReactShapeConstructor<Shape>[] = [
   TextShape,
   YouTubeShape,
   LogseqPortalShape,
-]
+]

+ 16 - 4
tldraw/apps/tldraw-logseq/src/lib/shapes/text/TextAreaUtils.ts

@@ -24,7 +24,10 @@ export class TextAreaUtils {
     )
   }
 
-  /** Inserts `text` at the cursor’s position, replacing any selection, with **undo** support and by firing the `input` event. */
+  /**
+   * Inserts `text` at the cursor’s position, replacing any selection, with **undo** support and by
+   * firing the `input` event.
+   */
   static insert(field: HTMLTextAreaElement | HTMLInputElement, text: string): void {
     const document = field.ownerDocument
     const initialFocus = document.activeElement
@@ -43,7 +46,10 @@ export class TextAreaUtils {
     }
   }
 
-  /** Replaces the entire content, equivalent to `field.value = text` but with **undo** support and by firing the `input` event. */
+  /**
+   * Replaces the entire content, equivalent to `field.value = text` but with **undo** support and
+   * by firing the `input` event.
+   */
   static set(field: HTMLTextAreaElement | HTMLInputElement, text: string): void {
     field.select()
     TextAreaUtils.insert(field, text)
@@ -58,7 +64,10 @@ export class TextAreaUtils {
     )
   }
 
-  /** Adds the `wrappingText` before and after field’s selection (or cursor). If `endWrappingText` is provided, it will be used instead of `wrappingText` at on the right. */
+  /**
+   * Adds the `wrappingText` before and after field’s selection (or cursor). If `endWrappingText` is
+   * provided, it will be used instead of `wrappingText` at on the right.
+   */
   static wrapSelection(
     field: HTMLTextAreaElement | HTMLInputElement,
     wrap: string,
@@ -73,7 +82,10 @@ export class TextAreaUtils {
     field.selectionEnd = (selectionEnd || 0) + wrap.length
   }
 
-  /** Finds and replaces strings and regex in the field’s value, like `field.value = field.value.replace()` but better */
+  /**
+   * Finds and replaces strings and regex in the field’s value, like `field.value =
+   * field.value.replace()` but better
+   */
   static replace(
     field: HTMLTextAreaElement | HTMLInputElement,
     searchValue: string | RegExp,

+ 0 - 1
tldraw/apps/tldraw-logseq/src/lib/shapes/text/TextLabel.tsx

@@ -183,4 +183,3 @@ export const TextLabel = React.memo(function TextLabel({
     </div>
   )
 })
-

+ 1 - 1
tldraw/apps/tldraw-logseq/src/lib/shapes/text/getTextSize.ts

@@ -1,4 +1,4 @@
-import { LETTER_SPACING } from "./constants"
+import { LETTER_SPACING } from './constants'
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 let melm: any

+ 13 - 9
tldraw/apps/tldraw-logseq/src/styles.css

@@ -54,13 +54,13 @@
   font-size: inherit;
 }
 
-
 .logseq-tldraw .action-bar {
   position: absolute;
-  bottom: 31px;
+  bottom: 0;
+
   /* width: 100%; */
   float: left;
-  left: 0px;
+  left: 0;
   grid-row: 1;
   display: flex;
   align-items: center;
@@ -68,6 +68,8 @@
   color: black;
   border-top-right-radius: 15px;
   border: black solid 1px;
+  border-left: none;
+  border-bottom: none;
   z-index: 100000;
   user-select: none;
   background: white;
@@ -87,7 +89,7 @@
   background-color: #fff;
   border-radius: 6px;
   padding: 5px;
-  box-shadow: 0px 10px 38px -10px rgba(22, 23, 24, 0.35), 0px 10px 20px -15px rgba(22, 23, 24, 0.2); 
+  box-shadow: 0 10px 38px -10px rgba(22, 23, 24, 0.35), 0 10px 20px -15px rgba(22, 23, 24, 0.2);
 }
 
 .dropdown-item {
@@ -100,10 +102,11 @@
   display: flex;
   align-items: center;
   height: 25px;
-  padding: 0px 5px;
+  padding: 0 5px;
   position: relative;
   user-select: none;
 }
+
 .dropdown-item:focus {
   color: white;
   background-color: black;
@@ -115,7 +118,7 @@
   color: black;
 }
 
-.right-slot:focus{
+.right-slot:focus {
   color: whites;
 }
 
@@ -258,7 +261,7 @@
   gap: 8px;
 }
 
-.logseq-tldraw .floating-panel>button {
+.logseq-tldraw .floating-panel > button {
   border-radius: 4px;
 }
 
@@ -286,7 +289,7 @@
   color: var(--color-selectedContrast);
 }
 
-.logseq-tldraw .floating-panel[data-tool-locked='true']>.button[data-selected='true']::after {
+.logseq-tldraw .floating-panel[data-tool-locked='true'] > .button[data-selected='true']::after {
   content: '';
   display: block;
   height: 6px;
@@ -458,6 +461,7 @@
 .logseq-tldraw .preview-minimap {
   height: 300px;
   width: 400px;
+
   /* Set top to be the viewport minus 10px */
   bottom: calc(100vh - 320px);
 
@@ -605,4 +609,4 @@ html[data-theme='light'] .logseq-tldraw .tl-logseq-portal-header {
 
 html[data-theme='dark'] .logseq-tldraw .tl-logseq-portal-header {
   backdrop-filter: brightness(1.2);
-}
+}

+ 1 - 1
tldraw/apps/tldraw-logseq/tsconfig.json

@@ -7,7 +7,7 @@
     "baseUrl": ".",
     "paths": {
       "~*": ["src/*"]
-    },
+    }
   },
   "references": [
     { "path": "../../packages/core" },

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

@@ -10,6 +10,6 @@ export default defineConfig({
     '.png': 'base64',
   },
   env: {
-    NODE_ENV: 'production'
-  }
+    NODE_ENV: 'production',
+  },
 })

+ 1 - 1
tldraw/cljs-demo/public/index.html

@@ -8,7 +8,7 @@
     />
     <meta http-equiv="X-UA-Compatible" content="ie=edge" />
   </head>
-  <body >
+  <body>
     <div id="app"></div>
     <script src="js/main.js"></script>
     <link rel="stylesheet" href="styles.css" />

+ 0 - 1
tldraw/demo/src/index.css

@@ -1,4 +1,3 @@
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
-

+ 1 - 1
tldraw/demo/tailwind.config.js

@@ -1,5 +1,5 @@
 module.exports = {
-  // just import everything for ease of dev 
+  // just import everything for ease of dev
   safelist: [{ pattern: /.*/ }],
   theme: {
     extend: {},

+ 2 - 2
tldraw/demo/vite.config.js

@@ -23,8 +23,8 @@ export default defineConfig({
   server: {
     port: '3031',
     fs: {
-      strict: false
-    }
+      strict: false,
+    },
   },
   resolve: {
     alias: [

+ 1 - 1
tldraw/packages/core/src/lib/TLApi/TLApi.ts

@@ -141,7 +141,7 @@ export class TLApi<S extends TLShape = TLShape, K extends TLEventMap = TLEventMa
     this.app.viewport.update({
       point: Vec.add(Vec.neg(BoundsUtils.getBoundsCenter(commonBounds)), [
         this.app.viewport.currentView.width / 2,
-        this.app.viewport.currentView.height/ 2,
+        this.app.viewport.currentView.height / 2,
       ]),
     })
     return this

+ 17 - 4
tldraw/packages/core/src/lib/TLApp/TLApp.ts

@@ -6,15 +6,28 @@ import { action, computed, makeObservable, observable, transaction } from 'mobx'
 import { GRID_SIZE } from '~constants'
 import {
   TLInputs,
-  TLPage, TLPageModel, TLSelectTool, TLShape, TLShapeConstructor,
-  TLShapeModel, TLToolConstructor, TLViewport
+  TLPage,
+  TLPageModel,
+  TLSelectTool,
+  TLShape,
+  TLShapeConstructor,
+  TLShapeModel,
+  TLToolConstructor,
+  TLViewport,
 } from '~lib'
 import { TLApi } from '~lib/TLApi'
 import { TLCursors } from '~lib/TLCursors'
 import type {
-  TLAsset, TLBounds, TLCallback, TLEventMap, TLEvents, TLShortcut, TLStateEvents, TLSubscription,
+  TLAsset,
+  TLBounds,
+  TLCallback,
+  TLEventMap,
+  TLEvents,
+  TLShortcut,
+  TLStateEvents,
+  TLSubscription,
   TLSubscriptionEventInfo,
-  TLSubscriptionEventName
+  TLSubscriptionEventName,
 } from '~types'
 import { BoundsUtils, KeyUtils } from '~utils'
 import { TLHistory } from '../TLHistory'

+ 1 - 1
tldraw/packages/core/src/lib/TLViewport.ts

@@ -10,7 +10,7 @@ export class TLViewport {
 
   static readonly minZoom = 0.25
   static readonly maxZoom = 4
-  static readonly zooms = [0.25, 0.5, 1, 1.5 , 2, 3, 4]
+  static readonly zooms = [0.25, 0.5, 1, 1.5, 2, 3, 4]
 
   /* ------------------- Properties ------------------- */
 

+ 1 - 1
tldraw/packages/core/src/lib/shapes/TLBoxShape/TLBoxShape.tsx

@@ -17,7 +17,7 @@ export class TLBoxShape<P extends TLBoxShapeProps = TLBoxShapeProps, M = any> ex
   }
 
   static id = 'box'
-  
+
   canBind = true
 
   static defaultProps: TLBoxShapeProps = {

+ 22 - 23
tldraw/packages/core/src/lib/tools/TLSelectTool/states/ResizingState.ts

@@ -66,29 +66,28 @@ export class ResizingState<
     this.initialCommonBounds = { ...selectionBounds }
     // @ts-expect-error maybe later
     this.snapshots = Object.fromEntries(
-      selectedShapesArray
-        .map(shape => {
-          const bounds = { ...shape.bounds }
-          const [cx, cy] = BoundsUtils.getBoundsCenter(bounds)
-          return [
-            shape.id,
-            {
-              props: shape.serialized,
-              bounds,
-              transformOrigin: [
-                (cx - this.initialCommonBounds.minX) / this.initialCommonBounds.width,
-                (cy - this.initialCommonBounds.minY) / this.initialCommonBounds.height,
-              ],
-              innerTransformOrigin: [
-                (cx - initialInnerBounds.minX) / initialInnerBounds.width,
-                (cy - initialInnerBounds.minY) / initialInnerBounds.height,
-              ],
-              isAspectRatioLocked:
-                shape.props.isAspectRatioLocked ||
-                Boolean(!shape.canChangeAspectRatio || shape.props.rotation),
-            },
-          ]
-        })
+      selectedShapesArray.map(shape => {
+        const bounds = { ...shape.bounds }
+        const [cx, cy] = BoundsUtils.getBoundsCenter(bounds)
+        return [
+          shape.id,
+          {
+            props: shape.serialized,
+            bounds,
+            transformOrigin: [
+              (cx - this.initialCommonBounds.minX) / this.initialCommonBounds.width,
+              (cy - this.initialCommonBounds.minY) / this.initialCommonBounds.height,
+            ],
+            innerTransformOrigin: [
+              (cx - initialInnerBounds.minX) / initialInnerBounds.width,
+              (cy - initialInnerBounds.minY) / initialInnerBounds.height,
+            ],
+            isAspectRatioLocked:
+              shape.props.isAspectRatioLocked ||
+              Boolean(!shape.canChangeAspectRatio || shape.props.rotation),
+          },
+        ]
+      })
     )
     selectedShapesArray.forEach(shape => shape.onResizeStart?.({ isSingle: this.isSingle }))
   }

+ 1 - 1
tldraw/packages/core/src/types/types.ts

@@ -168,7 +168,7 @@ export type TLSubscriptionEvent =
       event: 'delete-assets'
       info: { assets: TLAsset[] }
     }
-    | {
+  | {
       event: 'canvas-dbclick'
       info: { point: number[] }
     }

+ 2 - 2
tldraw/packages/core/src/utils/PolygonUtils.ts

@@ -106,8 +106,8 @@ export class PolygonUtils {
   }
 
   static getPolygonCentroid(points: number[][]): number[] {
-    const x = points.map((point) => point[0])
-    const y = points.map((point) => point[1])
+    const x = points.map(point => point[0])
+    const y = points.map(point => point[1])
     const cx = Math.min(...x) + Math.max(...x)
     const cy = Math.min(...y) + Math.max(...y)
     return [cx ? cx / 2 : 0, cy ? cy / 2 : 0]

+ 0 - 1
tldraw/packages/core/src/utils/index.ts

@@ -62,4 +62,3 @@ export function isDarwin(): boolean {
 export function modKey(e: any): boolean {
   return isDarwin() ? e.metaKey : e.ctrlKey
 }
-

+ 1 - 1
tldraw/packages/react/src/components/ui/SelectionForeground/handles/EdgeHandle.tsx

@@ -35,7 +35,7 @@ export const EdgeHandle = observer<EdgeHandleProps>(function EdgeHandle({
 
   return (
     <rect
-      pointerEvents={(isHidden || disabled) ? 'none' : 'all'}
+      pointerEvents={isHidden || disabled ? 'none' : 'all'}
       className={'tl-transparent tl-edge-handle ' + (isHidden ? '' : edgeClassnames[edge])}
       aria-label={`${edge} target`}
       opacity={isHidden ? 0 : 1}

+ 2 - 2
tldraw/packages/react/src/hooks/useKeyboardEvents.ts

@@ -16,11 +16,11 @@ export function useKeyboardEvents() {
     }
     window.addEventListener('keydown', onKeyDown)
     window.addEventListener('keyup', onKeyUp)
-    document.addEventListener('paste', (e) => {
+    document.addEventListener('paste', e => {
       e.preventDefault()
       app.paste(e)
     })
-    document.addEventListener('copy', (e) => {
+    document.addEventListener('copy', e => {
       e.preventDefault()
       app.copy()
     })

+ 1 - 1
tldraw/packages/react/src/hooks/useMinimapEvents.ts

@@ -46,4 +46,4 @@ export function useMinimapEvents() {
   }, [callbacks])
 
   return events
-}
+}

+ 1 - 1
tldraw/packages/react/src/hooks/useSetup.ts

@@ -20,7 +20,7 @@ export function useSetup<
     onDeleteShapes,
     onFileDrop,
     onPaste,
-    onCanvasDBClick
+    onCanvasDBClick,
   } = props
 
   React.useLayoutEffect(() => {

+ 1 - 1
tldraw/packages/react/src/lib/TLReactApp.ts

@@ -3,5 +3,5 @@ import type { TLReactShape } from './TLReactShape'
 import type { TLReactEventMap } from '~types'
 
 export class TLReactApp<S extends TLReactShape = TLReactShape> extends TLApp<S, TLReactEventMap> {
-    pubEvent?: any
+  pubEvent?: any
 }

+ 1 - 1
tldraw/packages/utils/curve/package.json

@@ -35,4 +35,4 @@
     "clean": "rm -rf dist"
   },
   "gitHead": "3ab5db27b9e83736fdae934474e80e90c854922c"
-}
+}

+ 1 - 1
tldraw/packages/utils/intersect/package.json

@@ -37,4 +37,4 @@
     "@tldraw/vec": "2.0.0-alpha.1"
   },
   "gitHead": "3ab5db27b9e83736fdae934474e80e90c854922c"
-}
+}

+ 70 - 19
tldraw/packages/utils/intersect/src/index.ts

@@ -18,6 +18,7 @@ export interface TLBounds {
 
 /**
  * Get an intersection.
+ *
  * @param message
  * @param points
  * @internal
@@ -28,7 +29,6 @@ function createIntersection(message: string, ...points: number[][]): TLIntersect
 }
 
 /**
- *
  * @param point
  * @param size
  * @param rotation
@@ -51,6 +51,7 @@ function getRectangleSides(point: number[], size: number[], rotation = 0): [stri
 
 /**
  * Get whether angle c lies between angles a and b.
+ *
  * @param a
  * @param b
  * @param c
@@ -94,6 +95,7 @@ export function intersectLineLine(AB: number[][], PQ: number[][]): number[] | un
 
 /**
  * Find the intersection between a ray and a ray.
+ *
  * @param p0 The first ray's point
  * @param n0 The first ray's direction vector.
  * @param p1 The second ray's point.
@@ -126,6 +128,7 @@ export function intersectRayRay(
 
 /**
  * Find the intersections between a ray and a line segment.
+ *
  * @param origin
  * @param direction
  * @param a1
@@ -157,6 +160,7 @@ export function intersectRayLineSegment(
 
 /**
  * Find the intersections between a ray and a rectangle.
+ *
  * @param origin
  * @param direction
  * @param point
@@ -175,6 +179,7 @@ export function intersectRayRectangle(
 
 /**
  * Find the intersections between a ray and an ellipse.
+ *
  * @param origin
  * @param direction
  * @param center
@@ -197,6 +202,7 @@ export function intersectRayEllipse(
 
 /**
  * Find the intersections between a ray and a bounding box.
+ *
  * @param origin
  * @param direction
  * @param bounds
@@ -218,6 +224,7 @@ export function intersectRayBounds(
 
 /**
  * Find the intersection between a line segment and a ray.
+ *
  * @param a1
  * @param a2
  * @param origin
@@ -234,6 +241,7 @@ export function intersectLineSegmentRay(
 
 /**
  * Find the intersection between a line segment and a line segment.
+ *
  * @param a1
  * @param a2
  * @param b1
@@ -274,6 +282,7 @@ export function intersectLineSegmentLineSegment(
 
 /**
  * Find the intersections between a line segment and a rectangle.
+ *
  * @param a1
  * @param a2
  * @param point
@@ -290,6 +299,7 @@ export function intersectLineSegmentRectangle(
 
 /**
  * Find the intersections between a line segment and an arc.
+ *
  * @param a1
  * @param a2
  * @param center
@@ -311,7 +321,7 @@ export function intersectLineSegmentArc(
 
   if (!ellipseTest.didIntersect) return createIntersection('no intersection')
 
-  const points = ellipseTest.points.filter((point) =>
+  const points = ellipseTest.points.filter(point =>
     isAngleBetween(sa, ea, Vec.angle(center, point))
   )
 
@@ -324,6 +334,7 @@ export function intersectLineSegmentArc(
 
 /**
  * Find the intersections between a line segment and a circle.
+ *
  * @param a1
  * @param a2
  * @param c
@@ -375,6 +386,7 @@ export function intersectLineSegmentCircle(
 
 /**
  * Find the intersections between a line segment and an ellipse.
+ *
  * @param a1
  * @param a2
  * @param center
@@ -429,15 +441,16 @@ export function intersectLineSegmentEllipse(
   // Filter to only points that are on the segment.
   // Solve for points, then counter-rotate points.
   const points = tValues
-    .filter((t) => t >= 0 && t <= 1)
-    .map((t) => Vec.add(center, Vec.add(a1, Vec.mul(Vec.sub(a2, a1), t))))
-    .map((p) => Vec.rotWith(p, center, rotation))
+    .filter(t => t >= 0 && t <= 1)
+    .map(t => Vec.add(center, Vec.add(a1, Vec.mul(Vec.sub(a2, a1), t))))
+    .map(p => Vec.rotWith(p, center, rotation))
 
   return createIntersection('intersection', ...points)
 }
 
 /**
  * Find the intersections between a line segment and a bounding box.
+ *
  * @param a1
  * @param a2
  * @param bounds
@@ -452,6 +465,7 @@ export function intersectLineSegmentBounds(
 
 /**
  * Find the intersections between a line segment and a polyline.
+ *
  * @param a1
  * @param a2
  * @param points
@@ -479,6 +493,7 @@ export function intersectLineSegmentPolyline(
 }
 /**
  * Find the intersections between a line segment and a closed polygon.
+ *
  * @param a1
  * @param a2
  * @param points
@@ -511,6 +526,7 @@ export function intersectLineSegmentPolygon(
 
 /**
  * Find the intersections between a rectangle and a ray.
+ *
  * @param point
  * @param size
  * @param rotation
@@ -537,11 +553,12 @@ export function intersectRectangleRay(
     []
   )
 
-  return sideIntersections.filter((int) => int.didIntersect)
+  return sideIntersections.filter(int => int.didIntersect)
 }
 
 /**
  * Find the intersections between a rectangle and a line segment.
+ *
  * @param point
  * @param size
  * @param a1
@@ -566,11 +583,12 @@ export function intersectRectangleLineSegment(
     []
   )
 
-  return sideIntersections.filter((int) => int.didIntersect)
+  return sideIntersections.filter(int => int.didIntersect)
 }
 
 /**
  * Find the intersections between a rectangle and a rectangle.
+ *
  * @param point1
  * @param size1
  * @param point2
@@ -587,9 +605,7 @@ export function intersectRectangleRectangle(
       const intersections = intersectRectangleLineSegment(point2, size2, a1, a2)
 
       acc.push(
-        ...intersections.map((int) =>
-          createIntersection(`${message} ${int.message}`, ...int.points)
-        )
+        ...intersections.map(int => createIntersection(`${message} ${int.message}`, ...int.points))
       )
 
       return acc
@@ -597,11 +613,12 @@ export function intersectRectangleRectangle(
     []
   )
 
-  return sideIntersections.filter((int) => int.didIntersect)
+  return sideIntersections.filter(int => int.didIntersect)
 }
 
 /**
  * Find the intersections between a rectangle and an arc.
+ *
  * @param point
  * @param size
  * @param center
@@ -630,11 +647,12 @@ export function intersectRectangleArc(
     []
   )
 
-  return sideIntersections.filter((int) => int.didIntersect)
+  return sideIntersections.filter(int => int.didIntersect)
 }
 
 /**
  * Find the intersections between a rectangle and a circle.
+ *
  * @param point
  * @param size
  * @param c
@@ -659,11 +677,12 @@ export function intersectRectangleCircle(
     []
   )
 
-  return sideIntersections.filter((int) => int.didIntersect)
+  return sideIntersections.filter(int => int.didIntersect)
 }
 
 /**
  * Find the intersections between a rectangle and an ellipse.
+ *
  * @param point
  * @param size
  * @param c
@@ -692,11 +711,12 @@ export function intersectRectangleEllipse(
     []
   )
 
-  return sideIntersections.filter((int) => int.didIntersect)
+  return sideIntersections.filter(int => int.didIntersect)
 }
 
 /**
  * Find the intersections between a rectangle and a bounding box.
+ *
  * @param point
  * @param size
  * @param bounds
@@ -712,6 +732,7 @@ export function intersectRectangleBounds(
 
 /**
  * Find the intersections between a rectangle and a polyline.
+ *
  * @param point
  * @param size
  * @param points
@@ -734,10 +755,11 @@ export function intersectRectanglePolyline(
     []
   )
 
-  return sideIntersections.filter((int) => int.didIntersect)
+  return sideIntersections.filter(int => int.didIntersect)
 }
 /**
  * Find the intersections between a rectangle and a polygon.
+ *
  * @param point
  * @param size
  * @param points
@@ -760,7 +782,7 @@ export function intersectRectanglePolygon(
     []
   )
 
-  return sideIntersections.filter((int) => int.didIntersect)
+  return sideIntersections.filter(int => int.didIntersect)
 }
 
 /* -------------------------------------------------- */
@@ -769,6 +791,7 @@ export function intersectRectanglePolygon(
 
 /**
  * Find the intersections between a arc and a line segment.
+ *
  * @param center
  * @param radius
  * @param start
@@ -789,6 +812,7 @@ export function intersectArcLineSegment(
 
 /**
  * Find the intersections between a arc and a rectangle.
+ *
  * @param center
  * @param radius
  * @param start
@@ -809,6 +833,7 @@ export function intersectArcRectangle(
 
 /**
  * Find the intersections between a arc and a bounding box.
+ *
  * @param center
  * @param radius
  * @param start
@@ -832,6 +857,7 @@ export function intersectArcBounds(
 
 /**
  * Find the intersections between a circle and a line segment.
+ *
  * @param c
  * @param r
  * @param a1
@@ -848,6 +874,7 @@ export function intersectCircleLineSegment(
 
 /**
  * Find the intersections between a circle and a circle.
+ *
  * @param c1
  * @param r1
  * @param c2
@@ -878,6 +905,7 @@ export function intersectCircleCircle(
 
 /**
  * Find the intersections between a circle and a rectangle.
+ *
  * @param c
  * @param r
  * @param point
@@ -894,6 +922,7 @@ export function intersectCircleRectangle(
 
 /**
  * Find the intersections between a circle and a bounding box.
+ *
  * @param c
  * @param r
  * @param bounds
@@ -909,6 +938,7 @@ export function intersectCircleBounds(c: number[], r: number, bounds: TLBounds):
 
 /**
  * Find the intersections between an ellipse and a ray.
+ *
  * @param center
  * @param rx
  * @param ry
@@ -929,6 +959,7 @@ export function intersectEllipseRay(
 
 /**
  * Find the intersections between an ellipse and a line segment.
+ *
  * @param center
  * @param rx
  * @param ry
@@ -953,6 +984,7 @@ export function intersectEllipseLineSegment(
 
 /**
  * Find the intersections between an ellipse and a rectangle.
+ *
  * @param center
  * @param rx
  * @param ry
@@ -976,8 +1008,9 @@ export function intersectEllipseRectangle(
 }
 
 /**
- * Find the intersections between an ellipse and an ellipse.
- * Adapted from https://gist.github.com/drawable/92792f59b6ff8869d8b1
+ * Find the intersections between an ellipse and an ellipse. Adapted from
+ * https://gist.github.com/drawable/92792f59b6ff8869d8b1
+ *
  * @param _c1
  * @param _rx1
  * @param _ry1
@@ -1011,6 +1044,7 @@ export function intersectEllipseEllipse(
 
 /**
  * Find the intersections between an ellipse and a circle.
+ *
  * @param c
  * @param rx
  * @param ry
@@ -1031,6 +1065,7 @@ export function intersectEllipseCircle(
 
 /**
  * Find the intersections between an ellipse and a bounding box.
+ *
  * @param c
  * @param rx
  * @param ry
@@ -1050,6 +1085,7 @@ export function intersectEllipseBounds(
 
 /**
  * Find the intersections between a bounding box and a ray.
+ *
  * @param bounds
  * @param origin
  * @param direction
@@ -1065,6 +1101,7 @@ export function intersectBoundsRay(
 
 /**
  * Find the intersections between a bounding box and a line segment.
+ *
  * @param bounds
  * @param a1
  * @param a2
@@ -1080,6 +1117,7 @@ export function intersectBoundsLineSegment(
 
 /**
  * Find the intersections between a bounding box and a rectangle.
+ *
  * @param bounds
  * @param point
  * @param size
@@ -1095,6 +1133,7 @@ export function intersectBoundsRectangle(
 
 /**
  * Find the intersections between a bounding box and a bounding box.
+ *
  * @param bounds1
  * @param bounds2
  */
@@ -1109,6 +1148,7 @@ export function intersectBoundsBounds(bounds1: TLBounds, bounds2: TLBounds): TLI
 
 /**
  * Find the intersections between a bounding box and an arc.
+ *
  * @param bounds
  * @param center
  * @param radius
@@ -1128,6 +1168,7 @@ export function intersectBoundsArc(
 
 /**
  * Find the intersections between a bounding box and a circle.
+ *
  * @param bounds
  * @param c
  * @param r
@@ -1139,6 +1180,7 @@ export function intersectBoundsCircle(bounds: TLBounds, c: number[], r: number):
 
 /**
  * Find the intersections between a bounding box and an ellipse.
+ *
  * @param bounds
  * @param c
  * @param rx
@@ -1158,6 +1200,7 @@ export function intersectBoundsEllipse(
 
 /**
  * Find the intersections between a bounding box and a polyline.
+ *
  * @param bounds
  * @param points
  */
@@ -1167,6 +1210,7 @@ export function intersectBoundsPolyline(bounds: TLBounds, points: number[][]): T
 
 /**
  * Find the intersections between a bounding box and a polygon.
+ *
  * @param bounds
  * @param points
  */
@@ -1180,6 +1224,7 @@ export function intersectBoundsPolygon(bounds: TLBounds, points: number[][]): TL
 
 /**
  * Find the intersections between a polyline and a line segment.
+ *
  * @param points
  * @param a1
  * @param a2
@@ -1194,6 +1239,7 @@ export function intersectPolylineLineSegment(
 
 /**
  * Find the intersections between a polyline and a rectangle.
+ *
  * @param points
  * @param point
  * @param size
@@ -1208,6 +1254,7 @@ export function intersectPolylineRectangle(
 
 /**
  * Find the intersections between a polyline and a bounding box.
+ *
  * @param points
  * @param bounds
  */
@@ -1225,6 +1272,7 @@ export function intersectPolylineBounds(points: number[][], bounds: TLBounds): T
 
 /**
  * Find the intersections between a polygon nd a line segment.
+ *
  * @param points
  * @param a1
  * @param a2
@@ -1239,6 +1287,7 @@ export function intersectPolygonLineSegment(
 
 /**
  * Find the intersections between a polygon and a rectangle.
+ *
  * @param points
  * @param point
  * @param size
@@ -1253,6 +1302,7 @@ export function intersectPolygonRectangle(
 
 /**
  * Find the intersections between a polygon and a bounding box.
+ *
  * @param points
  * @param bounds
  */
@@ -1266,6 +1316,7 @@ export function intersectPolygonBounds(points: number[][], bounds: TLBounds): TL
 
 /**
  * Find the intersections between a rectangle and a ray.
+ *
  * @param point
  * @param size
  * @param rotation
@@ -1290,7 +1341,7 @@ export function intersectRayPolygon(
     []
   )
 
-  return sideIntersections.filter((int) => int.didIntersect)
+  return sideIntersections.filter(int => int.didIntersect)
 }
 
 export function pointsToLineSegments(points: number[][], closed = false) {

+ 1 - 1
tldraw/packages/utils/vec/package.json

@@ -33,4 +33,4 @@
     "clean": "rm -rf dist"
   },
   "gitHead": "3ab5db27b9e83736fdae934474e80e90c854922c"
-}
+}