@tldraw/editor 5.1.1 → 5.2.0-canary.0878dbd31f0d

package/dist-esm/lib/editor/derivations/bindingsIndex.mjs

@@ -20,7 +20,7 @@ function fromScratch(bindingsQuery) {
   }
   return shapesToBindings;
 }
-const bindingsIndex = (editor) => {
+function bindingsIndex(editor) {
   const { store } = editor;
   const bindingsHistory = store.query.filterHistory("binding");
   const bindingsQuery = store.query.records("binding");
@@ -81,7 +81,7 @@ const bindingsIndex = (editor) => {
     }
     return nextValue ?? lastValue;
   });
-};
+}
 export {
   bindingsIndex
 };

package/dist-esm/lib/editor/derivations/bindingsIndex.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/editor/derivations/bindingsIndex.ts"],
-  "sourcesContent": ["import { Computed, RESET_VALUE, computed, isUninitialized } from '@tldraw/state'\nimport { TLBinding, TLShapeId } from '@tldraw/tlschema'\nimport { objectMapValues } from '@tldraw/utils'\nimport type { Editor } from '../Editor'\n\ntype TLBindingsIndex = Map<TLShapeId, TLBinding[]>\n\nfunction fromScratch(bindingsQuery: Computed<TLBinding[], unknown>) {\n\tconst allBindings = bindingsQuery.get() as TLBinding[]\n\n\tconst shapesToBindings: TLBindingsIndex = new Map()\n\n\tfor (const binding of allBindings) {\n\t\tconst { fromId, toId } = binding\n\t\tconst bindingsForFromShape = shapesToBindings.get(fromId)\n\t\tif (!bindingsForFromShape) {\n\t\t\tshapesToBindings.set(fromId, [binding])\n\t\t} else {\n\t\t\tbindingsForFromShape.push(binding)\n\t\t}\n\t\tconst bindingsForToShape = shapesToBindings.get(toId)\n\t\tif (!bindingsForToShape) {\n\t\t\tshapesToBindings.set(toId, [binding])\n\t\t} else {\n\t\t\tbindingsForToShape.push(binding)\n\t\t}\n\t}\n\n\treturn shapesToBindings\n}\n\nexport const bindingsIndex = (editor: Editor): Computed<TLBindingsIndex> => {\n\tconst { store } = editor\n\tconst bindingsHistory = store.query.filterHistory('binding')\n\tconst bindingsQuery = store.query.records('binding')\n\n\treturn computed<TLBindingsIndex>('arrowBindingsIndex', (_lastValue, lastComputedEpoch) => {\n\t\tif (isUninitialized(_lastValue)) {\n\t\t\treturn fromScratch(bindingsQuery)\n\t\t}\n\n\t\tconst lastValue = _lastValue\n\n\t\tconst diff = bindingsHistory.getDiffSince(lastComputedEpoch)\n\n\t\tif (diff === RESET_VALUE) {\n\t\t\treturn fromScratch(bindingsQuery)\n\t\t}\n\n\t\tlet nextValue: TLBindingsIndex | undefined = undefined\n\n\t\tfunction removingBinding(binding: TLBinding) {\n\t\t\tnextValue ??= new Map(lastValue)\n\t\t\tconst prevFrom = nextValue.get(binding.fromId)\n\t\t\tconst nextFrom = prevFrom?.filter((b) => b.id !== binding.id)\n\t\t\tif (!nextFrom?.length) {\n\t\t\t\tnextValue.delete(binding.fromId)\n\t\t\t} else {\n\t\t\t\tnextValue.set(binding.fromId, nextFrom)\n\t\t\t}\n\t\t\tconst prevTo = nextValue.get(binding.toId)\n\t\t\tconst nextTo = prevTo?.filter((b) => b.id !== binding.id)\n\t\t\tif (!nextTo?.length) {\n\t\t\t\tnextValue.delete(binding.toId)\n\t\t\t} else {\n\t\t\t\tnextValue.set(binding.toId, nextTo)\n\t\t\t}\n\t\t}\n\n\t\tfunction ensureNewArray(shapeId: TLShapeId) {\n\t\t\tnextValue ??= new Map(lastValue)\n\n\t\t\tlet result = nextValue.get(shapeId)\n\t\t\tif (!result) {\n\t\t\t\tresult = []\n\t\t\t\tnextValue.set(shapeId, result)\n\t\t\t} else if (result === lastValue.get(shapeId)) {\n\t\t\t\tresult = result.slice(0)\n\t\t\t\tnextValue.set(shapeId, result)\n\t\t\t}\n\t\t\treturn result\n\t\t}\n\n\t\tfunction addBinding(binding: TLBinding) {\n\t\t\tensureNewArray(binding.fromId).push(binding)\n\t\t\tensureNewArray(binding.toId).push(binding)\n\t\t}\n\n\t\tfor (const changes of diff) {\n\t\t\tfor (const newBinding of objectMapValues(changes.added)) {\n\t\t\t\taddBinding(newBinding)\n\t\t\t}\n\n\t\t\tfor (const [prev, next] of objectMapValues(changes.updated)) {\n\t\t\t\tremovingBinding(prev)\n\t\t\t\taddBinding(next)\n\t\t\t}\n\n\t\t\tfor (const prev of objectMapValues(changes.removed)) {\n\t\t\t\tremovingBinding(prev)\n\t\t\t}\n\t\t}\n\n\t\t// TODO: add diff entries if we need them\n\t\treturn nextValue ?? lastValue\n\t})\n}\n"],
-  "mappings": "AAAA,SAAmB,aAAa,UAAU,uBAAuB;AAEjE,SAAS,uBAAuB;AAKhC,SAAS,YAAY,eAA+C;AACnE,QAAM,cAAc,cAAc,IAAI;AAEtC,QAAM,mBAAoC,oBAAI,IAAI;AAElD,aAAW,WAAW,aAAa;AAClC,UAAM,EAAE,QAAQ,KAAK,IAAI;AACzB,UAAM,uBAAuB,iBAAiB,IAAI,MAAM;AACxD,QAAI,CAAC,sBAAsB;AAC1B,uBAAiB,IAAI,QAAQ,CAAC,OAAO,CAAC;AAAA,IACvC,OAAO;AACN,2BAAqB,KAAK,OAAO;AAAA,IAClC;AACA,UAAM,qBAAqB,iBAAiB,IAAI,IAAI;AACpD,QAAI,CAAC,oBAAoB;AACxB,uBAAiB,IAAI,MAAM,CAAC,OAAO,CAAC;AAAA,IACrC,OAAO;AACN,yBAAmB,KAAK,OAAO;AAAA,IAChC;AAAA,EACD;AAEA,SAAO;AACR;AAEO,MAAM,gBAAgB,CAAC,WAA8C;AAC3E,QAAM,EAAE,MAAM,IAAI;AAClB,QAAM,kBAAkB,MAAM,MAAM,cAAc,SAAS;AAC3D,QAAM,gBAAgB,MAAM,MAAM,QAAQ,SAAS;AAEnD,SAAO,SAA0B,sBAAsB,CAAC,YAAY,sBAAsB;AACzF,QAAI,gBAAgB,UAAU,GAAG;AAChC,aAAO,YAAY,aAAa;AAAA,IACjC;AAEA,UAAM,YAAY;AAElB,UAAM,OAAO,gBAAgB,aAAa,iBAAiB;AAE3D,QAAI,SAAS,aAAa;AACzB,aAAO,YAAY,aAAa;AAAA,IACjC;AAEA,QAAI,YAAyC;AAE7C,aAAS,gBAAgB,SAAoB;AAC5C,oBAAc,IAAI,IAAI,SAAS;AAC/B,YAAM,WAAW,UAAU,IAAI,QAAQ,MAAM;AAC7C,YAAM,WAAW,UAAU,OAAO,CAAC,MAAM,EAAE,OAAO,QAAQ,EAAE;AAC5D,UAAI,CAAC,UAAU,QAAQ;AACtB,kBAAU,OAAO,QAAQ,MAAM;AAAA,MAChC,OAAO;AACN,kBAAU,IAAI,QAAQ,QAAQ,QAAQ;AAAA,MACvC;AACA,YAAM,SAAS,UAAU,IAAI,QAAQ,IAAI;AACzC,YAAM,SAAS,QAAQ,OAAO,CAAC,MAAM,EAAE,OAAO,QAAQ,EAAE;AACxD,UAAI,CAAC,QAAQ,QAAQ;AACpB,kBAAU,OAAO,QAAQ,IAAI;AAAA,MAC9B,OAAO;AACN,kBAAU,IAAI,QAAQ,MAAM,MAAM;AAAA,MACnC;AAAA,IACD;AAEA,aAAS,eAAe,SAAoB;AAC3C,oBAAc,IAAI,IAAI,SAAS;AAE/B,UAAI,SAAS,UAAU,IAAI,OAAO;AAClC,UAAI,CAAC,QAAQ;AACZ,iBAAS,CAAC;AACV,kBAAU,IAAI,SAAS,MAAM;AAAA,MAC9B,WAAW,WAAW,UAAU,IAAI,OAAO,GAAG;AAC7C,iBAAS,OAAO,MAAM,CAAC;AACvB,kBAAU,IAAI,SAAS,MAAM;AAAA,MAC9B;AACA,aAAO;AAAA,IACR;AAEA,aAAS,WAAW,SAAoB;AACvC,qBAAe,QAAQ,MAAM,EAAE,KAAK,OAAO;AAC3C,qBAAe,QAAQ,IAAI,EAAE,KAAK,OAAO;AAAA,IAC1C;AAEA,eAAW,WAAW,MAAM;AAC3B,iBAAW,cAAc,gBAAgB,QAAQ,KAAK,GAAG;AACxD,mBAAW,UAAU;AAAA,MACtB;AAEA,iBAAW,CAAC,MAAM,IAAI,KAAK,gBAAgB,QAAQ,OAAO,GAAG;AAC5D,wBAAgB,IAAI;AACpB,mBAAW,IAAI;AAAA,MAChB;AAEA,iBAAW,QAAQ,gBAAgB,QAAQ,OAAO,GAAG;AACpD,wBAAgB,IAAI;AAAA,MACrB;AAAA,IACD;AAGA,WAAO,aAAa;AAAA,EACrB,CAAC;AACF;",
+  "sourcesContent": ["import { Computed, RESET_VALUE, computed, isUninitialized } from '@tldraw/state'\nimport { TLBinding, TLShapeId } from '@tldraw/tlschema'\nimport { objectMapValues } from '@tldraw/utils'\nimport type { Editor } from '../Editor'\n\ntype TLBindingsIndex = Map<TLShapeId, TLBinding[]>\n\nfunction fromScratch(bindingsQuery: Computed<TLBinding[], unknown>) {\n\tconst allBindings = bindingsQuery.get() as TLBinding[]\n\n\tconst shapesToBindings: TLBindingsIndex = new Map()\n\n\tfor (const binding of allBindings) {\n\t\tconst { fromId, toId } = binding\n\t\tconst bindingsForFromShape = shapesToBindings.get(fromId)\n\t\tif (!bindingsForFromShape) {\n\t\t\tshapesToBindings.set(fromId, [binding])\n\t\t} else {\n\t\t\tbindingsForFromShape.push(binding)\n\t\t}\n\t\tconst bindingsForToShape = shapesToBindings.get(toId)\n\t\tif (!bindingsForToShape) {\n\t\t\tshapesToBindings.set(toId, [binding])\n\t\t} else {\n\t\t\tbindingsForToShape.push(binding)\n\t\t}\n\t}\n\n\treturn shapesToBindings\n}\n\nexport function bindingsIndex(editor: Editor): Computed<TLBindingsIndex> {\n\tconst { store } = editor\n\tconst bindingsHistory = store.query.filterHistory('binding')\n\tconst bindingsQuery = store.query.records('binding')\n\n\treturn computed<TLBindingsIndex>('arrowBindingsIndex', (_lastValue, lastComputedEpoch) => {\n\t\tif (isUninitialized(_lastValue)) {\n\t\t\treturn fromScratch(bindingsQuery)\n\t\t}\n\n\t\tconst lastValue = _lastValue\n\n\t\tconst diff = bindingsHistory.getDiffSince(lastComputedEpoch)\n\n\t\tif (diff === RESET_VALUE) {\n\t\t\treturn fromScratch(bindingsQuery)\n\t\t}\n\n\t\tlet nextValue: TLBindingsIndex | undefined = undefined\n\n\t\tfunction removingBinding(binding: TLBinding) {\n\t\t\tnextValue ??= new Map(lastValue)\n\t\t\tconst prevFrom = nextValue.get(binding.fromId)\n\t\t\tconst nextFrom = prevFrom?.filter((b) => b.id !== binding.id)\n\t\t\tif (!nextFrom?.length) {\n\t\t\t\tnextValue.delete(binding.fromId)\n\t\t\t} else {\n\t\t\t\tnextValue.set(binding.fromId, nextFrom)\n\t\t\t}\n\t\t\tconst prevTo = nextValue.get(binding.toId)\n\t\t\tconst nextTo = prevTo?.filter((b) => b.id !== binding.id)\n\t\t\tif (!nextTo?.length) {\n\t\t\t\tnextValue.delete(binding.toId)\n\t\t\t} else {\n\t\t\t\tnextValue.set(binding.toId, nextTo)\n\t\t\t}\n\t\t}\n\n\t\tfunction ensureNewArray(shapeId: TLShapeId) {\n\t\t\tnextValue ??= new Map(lastValue)\n\n\t\t\tlet result = nextValue.get(shapeId)\n\t\t\tif (!result) {\n\t\t\t\tresult = []\n\t\t\t\tnextValue.set(shapeId, result)\n\t\t\t} else if (result === lastValue.get(shapeId)) {\n\t\t\t\tresult = result.slice(0)\n\t\t\t\tnextValue.set(shapeId, result)\n\t\t\t}\n\t\t\treturn result\n\t\t}\n\n\t\tfunction addBinding(binding: TLBinding) {\n\t\t\tensureNewArray(binding.fromId).push(binding)\n\t\t\tensureNewArray(binding.toId).push(binding)\n\t\t}\n\n\t\tfor (const changes of diff) {\n\t\t\tfor (const newBinding of objectMapValues(changes.added)) {\n\t\t\t\taddBinding(newBinding)\n\t\t\t}\n\n\t\t\tfor (const [prev, next] of objectMapValues(changes.updated)) {\n\t\t\t\tremovingBinding(prev)\n\t\t\t\taddBinding(next)\n\t\t\t}\n\n\t\t\tfor (const prev of objectMapValues(changes.removed)) {\n\t\t\t\tremovingBinding(prev)\n\t\t\t}\n\t\t}\n\n\t\t// TODO: add diff entries if we need them\n\t\treturn nextValue ?? lastValue\n\t})\n}\n"],
+  "mappings": "AAAA,SAAmB,aAAa,UAAU,uBAAuB;AAEjE,SAAS,uBAAuB;AAKhC,SAAS,YAAY,eAA+C;AACnE,QAAM,cAAc,cAAc,IAAI;AAEtC,QAAM,mBAAoC,oBAAI,IAAI;AAElD,aAAW,WAAW,aAAa;AAClC,UAAM,EAAE,QAAQ,KAAK,IAAI;AACzB,UAAM,uBAAuB,iBAAiB,IAAI,MAAM;AACxD,QAAI,CAAC,sBAAsB;AAC1B,uBAAiB,IAAI,QAAQ,CAAC,OAAO,CAAC;AAAA,IACvC,OAAO;AACN,2BAAqB,KAAK,OAAO;AAAA,IAClC;AACA,UAAM,qBAAqB,iBAAiB,IAAI,IAAI;AACpD,QAAI,CAAC,oBAAoB;AACxB,uBAAiB,IAAI,MAAM,CAAC,OAAO,CAAC;AAAA,IACrC,OAAO;AACN,yBAAmB,KAAK,OAAO;AAAA,IAChC;AAAA,EACD;AAEA,SAAO;AACR;AAEO,SAAS,cAAc,QAA2C;AACxE,QAAM,EAAE,MAAM,IAAI;AAClB,QAAM,kBAAkB,MAAM,MAAM,cAAc,SAAS;AAC3D,QAAM,gBAAgB,MAAM,MAAM,QAAQ,SAAS;AAEnD,SAAO,SAA0B,sBAAsB,CAAC,YAAY,sBAAsB;AACzF,QAAI,gBAAgB,UAAU,GAAG;AAChC,aAAO,YAAY,aAAa;AAAA,IACjC;AAEA,UAAM,YAAY;AAElB,UAAM,OAAO,gBAAgB,aAAa,iBAAiB;AAE3D,QAAI,SAAS,aAAa;AACzB,aAAO,YAAY,aAAa;AAAA,IACjC;AAEA,QAAI,YAAyC;AAE7C,aAAS,gBAAgB,SAAoB;AAC5C,oBAAc,IAAI,IAAI,SAAS;AAC/B,YAAM,WAAW,UAAU,IAAI,QAAQ,MAAM;AAC7C,YAAM,WAAW,UAAU,OAAO,CAAC,MAAM,EAAE,OAAO,QAAQ,EAAE;AAC5D,UAAI,CAAC,UAAU,QAAQ;AACtB,kBAAU,OAAO,QAAQ,MAAM;AAAA,MAChC,OAAO;AACN,kBAAU,IAAI,QAAQ,QAAQ,QAAQ;AAAA,MACvC;AACA,YAAM,SAAS,UAAU,IAAI,QAAQ,IAAI;AACzC,YAAM,SAAS,QAAQ,OAAO,CAAC,MAAM,EAAE,OAAO,QAAQ,EAAE;AACxD,UAAI,CAAC,QAAQ,QAAQ;AACpB,kBAAU,OAAO,QAAQ,IAAI;AAAA,MAC9B,OAAO;AACN,kBAAU,IAAI,QAAQ,MAAM,MAAM;AAAA,MACnC;AAAA,IACD;AAEA,aAAS,eAAe,SAAoB;AAC3C,oBAAc,IAAI,IAAI,SAAS;AAE/B,UAAI,SAAS,UAAU,IAAI,OAAO;AAClC,UAAI,CAAC,QAAQ;AACZ,iBAAS,CAAC;AACV,kBAAU,IAAI,SAAS,MAAM;AAAA,MAC9B,WAAW,WAAW,UAAU,IAAI,OAAO,GAAG;AAC7C,iBAAS,OAAO,MAAM,CAAC;AACvB,kBAAU,IAAI,SAAS,MAAM;AAAA,MAC9B;AACA,aAAO;AAAA,IACR;AAEA,aAAS,WAAW,SAAoB;AACvC,qBAAe,QAAQ,MAAM,EAAE,KAAK,OAAO;AAC3C,qBAAe,QAAQ,IAAI,EAAE,KAAK,OAAO;AAAA,IAC1C;AAEA,eAAW,WAAW,MAAM;AAC3B,iBAAW,cAAc,gBAAgB,QAAQ,KAAK,GAAG;AACxD,mBAAW,UAAU;AAAA,MACtB;AAEA,iBAAW,CAAC,MAAM,IAAI,KAAK,gBAAgB,QAAQ,OAAO,GAAG;AAC5D,wBAAgB,IAAI;AACpB,mBAAW,IAAI;AAAA,MAChB;AAEA,iBAAW,QAAQ,gBAAgB,QAAQ,OAAO,GAAG;AACpD,wBAAgB,IAAI;AAAA,MACrB;AAAA,IACD;AAGA,WAAO,aAAa;AAAA,EACrB,CAAC;AACF;",
   "names": []
 }

package/dist-esm/lib/editor/derivations/parentsToChildren.mjs

@@ -11,7 +11,7 @@ function fromScratch(shapeIdsQuery, store) {
   });
   return result;
 }
-const parentsToChildren = (store) => {
+function parentsToChildren(store) {
   const shapeIdsQuery = store.query.ids("shape");
   const shapeHistory = store.query.filterHistory("shape");
   return computed(
@@ -85,7 +85,7 @@ const parentsToChildren = (store) => {
       return newValue ?? lastValue;
     }
   );
-};
+}
 export {
   parentsToChildren
 };

package/dist-esm/lib/editor/derivations/parentsToChildren.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/editor/derivations/parentsToChildren.ts"],
-  "sourcesContent": ["import { Computed, computed, isUninitialized, RESET_VALUE } from '@tldraw/state'\nimport { CollectionDiff, RecordsDiff } from '@tldraw/store'\nimport { isShape, TLParentId, TLRecord, TLShape, TLShapeId, TLStore } from '@tldraw/tlschema'\nimport { sortByIndex } from '@tldraw/utils'\n\ntype ParentShapeIdsToChildShapeIds = Record<TLParentId, TLShapeId[]>\n\nfunction fromScratch(\n\tshapeIdsQuery: Computed<Set<TLShapeId>, CollectionDiff<TLShapeId>>,\n\tstore: TLStore\n) {\n\tconst result: ParentShapeIdsToChildShapeIds = {}\n\tconst shapeIds = shapeIdsQuery.get()\n\tconst sortedShapes = Array.from(shapeIds, (id) => store.get(id)!).sort(sortByIndex)\n\n\t// Populate the result object with an array for each parent.\n\tsortedShapes.forEach((shape) => {\n\t\tresult[shape.parentId] ??= []\n\t\tresult[shape.parentId].push(shape.id)\n\t})\n\n\treturn result\n}\n\nexport const parentsToChildren = (store: TLStore) => {\n\tconst shapeIdsQuery = store.query.ids<'shape'>('shape')\n\tconst shapeHistory = store.query.filterHistory('shape')\n\n\treturn computed<ParentShapeIdsToChildShapeIds>(\n\t\t'parentsToChildrenWithIndexes',\n\t\t(lastValue, lastComputedEpoch) => {\n\t\t\tif (isUninitialized(lastValue)) {\n\t\t\t\treturn fromScratch(shapeIdsQuery, store)\n\t\t\t}\n\n\t\t\tconst diff = shapeHistory.getDiffSince(lastComputedEpoch)\n\n\t\t\tif (diff === RESET_VALUE) {\n\t\t\t\treturn fromScratch(shapeIdsQuery, store)\n\t\t\t}\n\n\t\t\tif (diff.length === 0) return lastValue\n\n\t\t\tlet newValue: Record<TLParentId, TLShapeId[]> | null = null\n\n\t\t\tconst ensureNewArray = (parentId: TLParentId) => {\n\t\t\t\tif (!newValue) {\n\t\t\t\t\tnewValue = { ...lastValue }\n\t\t\t\t}\n\t\t\t\tif (!newValue[parentId]) {\n\t\t\t\t\tnewValue[parentId] = []\n\t\t\t\t} else if (newValue[parentId] === lastValue[parentId]) {\n\t\t\t\t\tnewValue[parentId] = [...newValue[parentId]!]\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tconst toSort = new Set<TLShapeId[]>()\n\n\t\t\tlet changes: RecordsDiff<TLRecord>\n\n\t\t\tfor (let i = 0, n = diff.length; i < n; i++) {\n\t\t\t\tchanges = diff[i]\n\n\t\t\t\t// Iterate through the added shapes, add them to the new value and mark them for sorting\n\t\t\t\tfor (const record of Object.values(changes.added)) {\n\t\t\t\t\tif (!isShape(record)) continue\n\t\t\t\t\tensureNewArray(record.parentId)\n\t\t\t\t\tnewValue![record.parentId].push(record.id)\n\t\t\t\t\ttoSort.add(newValue![record.parentId])\n\t\t\t\t}\n\n\t\t\t\t// Iterate through the updated shapes, add them to their parents in the new value and mark them for sorting\n\t\t\t\tfor (const [from, to] of Object.values(changes.updated)) {\n\t\t\t\t\tif (!isShape(to)) continue\n\t\t\t\t\tif (!isShape(from)) continue\n\n\t\t\t\t\tif (from.parentId !== to.parentId) {\n\t\t\t\t\t\t// If the parents have changed, remove the new value from the old parent and add it to the new parent\n\t\t\t\t\t\tensureNewArray(from.parentId)\n\t\t\t\t\t\tensureNewArray(to.parentId)\n\t\t\t\t\t\tnewValue![from.parentId].splice(newValue![from.parentId].indexOf(to.id), 1)\n\t\t\t\t\t\tnewValue![to.parentId].push(to.id)\n\t\t\t\t\t\ttoSort.add(newValue![to.parentId])\n\t\t\t\t\t} else if (from.index !== to.index) {\n\t\t\t\t\t\t// If the parent is the same but the index has changed (e.g. if they've been reordered), update the parent's array at the new index\n\t\t\t\t\t\tensureNewArray(to.parentId)\n\t\t\t\t\t\tconst idx = newValue![to.parentId].indexOf(to.id)\n\t\t\t\t\t\tnewValue![to.parentId][idx] = to.id\n\t\t\t\t\t\ttoSort.add(newValue![to.parentId])\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t// Iterate through the removed shapes, remove them from their parents in new value\n\t\t\t\tfor (const record of Object.values(changes.removed)) {\n\t\t\t\t\tif (!isShape(record)) continue\n\t\t\t\t\tensureNewArray(record.parentId)\n\t\t\t\t\tnewValue![record.parentId].splice(newValue![record.parentId].indexOf(record.id), 1)\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Sort the arrays that have been marked for sorting (in-place to avoid intermediate arrays)\n\t\t\tfor (const arr of toSort) {\n\t\t\t\t// Filter out any deleted shapes in-place\n\t\t\t\tlet writeIdx = 0\n\t\t\t\tfor (let readIdx = 0; readIdx < arr.length; readIdx++) {\n\t\t\t\t\tif (store.get(arr[readIdx])) {\n\t\t\t\t\t\tarr[writeIdx++] = arr[readIdx]\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tarr.length = writeIdx\n\n\t\t\t\t// Sort in-place by index\n\t\t\t\tarr.sort((a, b) => {\n\t\t\t\t\tconst shapeA = store.get(a) as TLShape\n\t\t\t\t\tconst shapeB = store.get(b) as TLShape\n\t\t\t\t\treturn sortByIndex(shapeA, shapeB)\n\t\t\t\t})\n\t\t\t}\n\n\t\t\treturn newValue ?? lastValue\n\t\t}\n\t)\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { Computed, computed, isUninitialized, RESET_VALUE } from '@tldraw/state'\nimport { CollectionDiff, RecordsDiff } from '@tldraw/store'\nimport { isShape, TLParentId, TLRecord, TLShape, TLShapeId, TLStore } from '@tldraw/tlschema'\nimport { sortByIndex } from '@tldraw/utils'\n\ntype ParentShapeIdsToChildShapeIds = Record<TLParentId, TLShapeId[]>\n\nfunction fromScratch(\n\tshapeIdsQuery: Computed<Set<TLShapeId>, CollectionDiff<TLShapeId>>,\n\tstore: TLStore\n) {\n\tconst result: ParentShapeIdsToChildShapeIds = {}\n\tconst shapeIds = shapeIdsQuery.get()\n\tconst sortedShapes = Array.from(shapeIds, (id) => store.get(id)!).sort(sortByIndex)\n\n\t// Populate the result object with an array for each parent.\n\tsortedShapes.forEach((shape) => {\n\t\tresult[shape.parentId] ??= []\n\t\tresult[shape.parentId].push(shape.id)\n\t})\n\n\treturn result\n}\n\nexport function parentsToChildren(store: TLStore) {\n\tconst shapeIdsQuery = store.query.ids<'shape'>('shape')\n\tconst shapeHistory = store.query.filterHistory('shape')\n\n\treturn computed<ParentShapeIdsToChildShapeIds>(\n\t\t'parentsToChildrenWithIndexes',\n\t\t(lastValue, lastComputedEpoch) => {\n\t\t\tif (isUninitialized(lastValue)) {\n\t\t\t\treturn fromScratch(shapeIdsQuery, store)\n\t\t\t}\n\n\t\t\tconst diff = shapeHistory.getDiffSince(lastComputedEpoch)\n\n\t\t\tif (diff === RESET_VALUE) {\n\t\t\t\treturn fromScratch(shapeIdsQuery, store)\n\t\t\t}\n\n\t\t\tif (diff.length === 0) return lastValue\n\n\t\t\tlet newValue: Record<TLParentId, TLShapeId[]> | null = null\n\n\t\t\tconst ensureNewArray = (parentId: TLParentId) => {\n\t\t\t\tif (!newValue) {\n\t\t\t\t\tnewValue = { ...lastValue }\n\t\t\t\t}\n\t\t\t\tif (!newValue[parentId]) {\n\t\t\t\t\tnewValue[parentId] = []\n\t\t\t\t} else if (newValue[parentId] === lastValue[parentId]) {\n\t\t\t\t\tnewValue[parentId] = [...newValue[parentId]!]\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tconst toSort = new Set<TLShapeId[]>()\n\n\t\t\tlet changes: RecordsDiff<TLRecord>\n\n\t\t\tfor (let i = 0, n = diff.length; i < n; i++) {\n\t\t\t\tchanges = diff[i]\n\n\t\t\t\t// Iterate through the added shapes, add them to the new value and mark them for sorting\n\t\t\t\tfor (const record of Object.values(changes.added)) {\n\t\t\t\t\tif (!isShape(record)) continue\n\t\t\t\t\tensureNewArray(record.parentId)\n\t\t\t\t\tnewValue![record.parentId].push(record.id)\n\t\t\t\t\ttoSort.add(newValue![record.parentId])\n\t\t\t\t}\n\n\t\t\t\t// Iterate through the updated shapes, add them to their parents in the new value and mark them for sorting\n\t\t\t\tfor (const [from, to] of Object.values(changes.updated)) {\n\t\t\t\t\tif (!isShape(to)) continue\n\t\t\t\t\tif (!isShape(from)) continue\n\n\t\t\t\t\tif (from.parentId !== to.parentId) {\n\t\t\t\t\t\t// If the parents have changed, remove the new value from the old parent and add it to the new parent\n\t\t\t\t\t\tensureNewArray(from.parentId)\n\t\t\t\t\t\tensureNewArray(to.parentId)\n\t\t\t\t\t\tnewValue![from.parentId].splice(newValue![from.parentId].indexOf(to.id), 1)\n\t\t\t\t\t\tnewValue![to.parentId].push(to.id)\n\t\t\t\t\t\ttoSort.add(newValue![to.parentId])\n\t\t\t\t\t} else if (from.index !== to.index) {\n\t\t\t\t\t\t// If the parent is the same but the index has changed (e.g. if they've been reordered), update the parent's array at the new index\n\t\t\t\t\t\tensureNewArray(to.parentId)\n\t\t\t\t\t\tconst idx = newValue![to.parentId].indexOf(to.id)\n\t\t\t\t\t\tnewValue![to.parentId][idx] = to.id\n\t\t\t\t\t\ttoSort.add(newValue![to.parentId])\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t// Iterate through the removed shapes, remove them from their parents in new value\n\t\t\t\tfor (const record of Object.values(changes.removed)) {\n\t\t\t\t\tif (!isShape(record)) continue\n\t\t\t\t\tensureNewArray(record.parentId)\n\t\t\t\t\tnewValue![record.parentId].splice(newValue![record.parentId].indexOf(record.id), 1)\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Sort the arrays that have been marked for sorting (in-place to avoid intermediate arrays)\n\t\t\tfor (const arr of toSort) {\n\t\t\t\t// Filter out any deleted shapes in-place\n\t\t\t\tlet writeIdx = 0\n\t\t\t\tfor (let readIdx = 0; readIdx < arr.length; readIdx++) {\n\t\t\t\t\tif (store.get(arr[readIdx])) {\n\t\t\t\t\t\tarr[writeIdx++] = arr[readIdx]\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tarr.length = writeIdx\n\n\t\t\t\t// Sort in-place by index\n\t\t\t\tarr.sort((a, b) => {\n\t\t\t\t\tconst shapeA = store.get(a) as TLShape\n\t\t\t\t\tconst shapeB = store.get(b) as TLShape\n\t\t\t\t\treturn sortByIndex(shapeA, shapeB)\n\t\t\t\t})\n\t\t\t}\n\n\t\t\treturn newValue ?? lastValue\n\t\t}\n\t)\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist-esm/lib/editor/derivations/shapeIdsInCurrentPage.mjs

@@ -13,7 +13,7 @@ const isShapeInPage = (store, pageId, shape) => {
   }
   return shape.parentId === pageId;
 };
-const deriveShapeIdsInCurrentPage = (store, getCurrentPageId) => {
+function deriveShapeIdsInCurrentPage(store, getCurrentPageId) {
   const shapesIndex = store.query.ids("shape");
   let lastPageId = null;
   function fromScratch() {
@@ -65,7 +65,7 @@ const deriveShapeIdsInCurrentPage = (store, getCurrentPageId) => {
     }
     return withDiff(result.value, result.diff);
   });
-};
+}
 export {
   deriveShapeIdsInCurrentPage
 };

package/dist-esm/lib/editor/derivations/shapeIdsInCurrentPage.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/editor/derivations/shapeIdsInCurrentPage.ts"],
-  "sourcesContent": ["import { computed, isUninitialized, RESET_VALUE, withDiff } from '@tldraw/state'\nimport { IncrementalSetConstructor } from '@tldraw/store'\nimport {\n\tisPageId,\n\tisShape,\n\tisShapeId,\n\tTLPageId,\n\tTLShape,\n\tTLShapeId,\n\tTLStore,\n} from '@tldraw/tlschema'\n\n/**\n * Get whether a shape is in the current page.\n *\n * @param store - The tldraw store.\n * @param pageId - The id of the page to check.\n * @param shape - The the shape to check.\n */\nconst isShapeInPage = (store: TLStore, pageId: TLPageId, shape: TLShape): boolean => {\n\twhile (!isPageId(shape.parentId)) {\n\t\tconst parent = store.get(shape.parentId)\n\t\tif (!parent) return false\n\t\tshape = parent\n\t}\n\n\treturn shape.parentId === pageId\n}\n\n/**\n * A derivation that returns a list of shape ids in the current page.\n *\n * @param store - The tldraw store.\n * @param getCurrentPageId - A function that returns the current page id.\n */\nexport const deriveShapeIdsInCurrentPage = (store: TLStore, getCurrentPageId: () => TLPageId) => {\n\tconst shapesIndex = store.query.ids('shape')\n\tlet lastPageId: null | TLPageId = null\n\tfunction fromScratch() {\n\t\tconst currentPageId = getCurrentPageId()\n\t\tlastPageId = currentPageId\n\t\treturn new Set(\n\t\t\t[...shapesIndex.get()].filter((id) => isShapeInPage(store, currentPageId, store.get(id)!))\n\t\t)\n\t}\n\treturn computed<Set<TLShapeId>>('_shapeIdsInCurrentPage', (prevValue, lastComputedEpoch) => {\n\t\tif (isUninitialized(prevValue)) {\n\t\t\treturn fromScratch()\n\t\t}\n\n\t\tconst currentPageId = getCurrentPageId()\n\n\t\tif (currentPageId !== lastPageId) {\n\t\t\treturn fromScratch()\n\t\t}\n\n\t\tconst diff = store.history.getDiffSince(lastComputedEpoch)\n\n\t\tif (diff === RESET_VALUE) {\n\t\t\treturn fromScratch()\n\t\t}\n\n\t\tconst builder = new IncrementalSetConstructor<TLShapeId>(\n\t\t\tprevValue\n\t\t) as IncrementalSetConstructor<TLShapeId>\n\n\t\tfor (const changes of diff) {\n\t\t\tfor (const record of Object.values(changes.added)) {\n\t\t\t\tif (isShape(record) && isShapeInPage(store, currentPageId, record)) {\n\t\t\t\t\tbuilder.add(record.id)\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfor (const [_from, to] of Object.values(changes.updated)) {\n\t\t\t\tif (isShape(to)) {\n\t\t\t\t\tif (isShapeInPage(store, currentPageId, to)) {\n\t\t\t\t\t\tbuilder.add(to.id)\n\t\t\t\t\t} else {\n\t\t\t\t\t\tbuilder.remove(to.id)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfor (const id of Object.keys(changes.removed)) {\n\t\t\t\tif (isShapeId(id)) {\n\t\t\t\t\tbuilder.remove(id)\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tconst result = builder.get()\n\t\tif (!result) {\n\t\t\treturn prevValue\n\t\t}\n\n\t\treturn withDiff(result.value, result.diff)\n\t})\n}\n"],
-  "mappings": "AAAA,SAAS,UAAU,iBAAiB,aAAa,gBAAgB;AACjE,SAAS,iCAAiC;AAC1C;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,OAKM;AASP,MAAM,gBAAgB,CAAC,OAAgB,QAAkB,UAA4B;AACpF,SAAO,CAAC,SAAS,MAAM,QAAQ,GAAG;AACjC,UAAM,SAAS,MAAM,IAAI,MAAM,QAAQ;AACvC,QAAI,CAAC,OAAQ,QAAO;AACpB,YAAQ;AAAA,EACT;AAEA,SAAO,MAAM,aAAa;AAC3B;AAQO,MAAM,8BAA8B,CAAC,OAAgB,qBAAqC;AAChG,QAAM,cAAc,MAAM,MAAM,IAAI,OAAO;AAC3C,MAAI,aAA8B;AAClC,WAAS,cAAc;AACtB,UAAM,gBAAgB,iBAAiB;AACvC,iBAAa;AACb,WAAO,IAAI;AAAA,MACV,CAAC,GAAG,YAAY,IAAI,CAAC,EAAE,OAAO,CAAC,OAAO,cAAc,OAAO,eAAe,MAAM,IAAI,EAAE,CAAE,CAAC;AAAA,IAC1F;AAAA,EACD;AACA,SAAO,SAAyB,0BAA0B,CAAC,WAAW,sBAAsB;AAC3F,QAAI,gBAAgB,SAAS,GAAG;AAC/B,aAAO,YAAY;AAAA,IACpB;AAEA,UAAM,gBAAgB,iBAAiB;AAEvC,QAAI,kBAAkB,YAAY;AACjC,aAAO,YAAY;AAAA,IACpB;AAEA,UAAM,OAAO,MAAM,QAAQ,aAAa,iBAAiB;AAEzD,QAAI,SAAS,aAAa;AACzB,aAAO,YAAY;AAAA,IACpB;AAEA,UAAM,UAAU,IAAI;AAAA,MACnB;AAAA,IACD;AAEA,eAAW,WAAW,MAAM;AAC3B,iBAAW,UAAU,OAAO,OAAO,QAAQ,KAAK,GAAG;AAClD,YAAI,QAAQ,MAAM,KAAK,cAAc,OAAO,eAAe,MAAM,GAAG;AACnE,kBAAQ,IAAI,OAAO,EAAE;AAAA,QACtB;AAAA,MACD;AAEA,iBAAW,CAAC,OAAO,EAAE,KAAK,OAAO,OAAO,QAAQ,OAAO,GAAG;AACzD,YAAI,QAAQ,EAAE,GAAG;AAChB,cAAI,cAAc,OAAO,eAAe,EAAE,GAAG;AAC5C,oBAAQ,IAAI,GAAG,EAAE;AAAA,UAClB,OAAO;AACN,oBAAQ,OAAO,GAAG,EAAE;AAAA,UACrB;AAAA,QACD;AAAA,MACD;AAEA,iBAAW,MAAM,OAAO,KAAK,QAAQ,OAAO,GAAG;AAC9C,YAAI,UAAU,EAAE,GAAG;AAClB,kBAAQ,OAAO,EAAE;AAAA,QAClB;AAAA,MACD;AAAA,IACD;AAEA,UAAM,SAAS,QAAQ,IAAI;AAC3B,QAAI,CAAC,QAAQ;AACZ,aAAO;AAAA,IACR;AAEA,WAAO,SAAS,OAAO,OAAO,OAAO,IAAI;AAAA,EAC1C,CAAC;AACF;",
+  "sourcesContent": ["import { computed, isUninitialized, RESET_VALUE, withDiff } from '@tldraw/state'\nimport { IncrementalSetConstructor } from '@tldraw/store'\nimport {\n\tisPageId,\n\tisShape,\n\tisShapeId,\n\tTLPageId,\n\tTLShape,\n\tTLShapeId,\n\tTLStore,\n} from '@tldraw/tlschema'\n\n/**\n * Get whether a shape is in the current page.\n *\n * @param store - The tldraw store.\n * @param pageId - The id of the page to check.\n * @param shape - The the shape to check.\n */\nconst isShapeInPage = (store: TLStore, pageId: TLPageId, shape: TLShape): boolean => {\n\twhile (!isPageId(shape.parentId)) {\n\t\tconst parent = store.get(shape.parentId)\n\t\tif (!parent) return false\n\t\tshape = parent\n\t}\n\n\treturn shape.parentId === pageId\n}\n\n/**\n * A derivation that returns a list of shape ids in the current page.\n *\n * @param store - The tldraw store.\n * @param getCurrentPageId - A function that returns the current page id.\n */\nexport function deriveShapeIdsInCurrentPage(store: TLStore, getCurrentPageId: () => TLPageId) {\n\tconst shapesIndex = store.query.ids('shape')\n\tlet lastPageId: null | TLPageId = null\n\tfunction fromScratch() {\n\t\tconst currentPageId = getCurrentPageId()\n\t\tlastPageId = currentPageId\n\t\treturn new Set(\n\t\t\t[...shapesIndex.get()].filter((id) => isShapeInPage(store, currentPageId, store.get(id)!))\n\t\t)\n\t}\n\treturn computed<Set<TLShapeId>>('_shapeIdsInCurrentPage', (prevValue, lastComputedEpoch) => {\n\t\tif (isUninitialized(prevValue)) {\n\t\t\treturn fromScratch()\n\t\t}\n\n\t\tconst currentPageId = getCurrentPageId()\n\n\t\tif (currentPageId !== lastPageId) {\n\t\t\treturn fromScratch()\n\t\t}\n\n\t\tconst diff = store.history.getDiffSince(lastComputedEpoch)\n\n\t\tif (diff === RESET_VALUE) {\n\t\t\treturn fromScratch()\n\t\t}\n\n\t\tconst builder = new IncrementalSetConstructor<TLShapeId>(\n\t\t\tprevValue\n\t\t) as IncrementalSetConstructor<TLShapeId>\n\n\t\tfor (const changes of diff) {\n\t\t\tfor (const record of Object.values(changes.added)) {\n\t\t\t\tif (isShape(record) && isShapeInPage(store, currentPageId, record)) {\n\t\t\t\t\tbuilder.add(record.id)\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfor (const [_from, to] of Object.values(changes.updated)) {\n\t\t\t\tif (isShape(to)) {\n\t\t\t\t\tif (isShapeInPage(store, currentPageId, to)) {\n\t\t\t\t\t\tbuilder.add(to.id)\n\t\t\t\t\t} else {\n\t\t\t\t\t\tbuilder.remove(to.id)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfor (const id of Object.keys(changes.removed)) {\n\t\t\t\tif (isShapeId(id)) {\n\t\t\t\t\tbuilder.remove(id)\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tconst result = builder.get()\n\t\tif (!result) {\n\t\t\treturn prevValue\n\t\t}\n\n\t\treturn withDiff(result.value, result.diff)\n\t})\n}\n"],
+  "mappings": "AAAA,SAAS,UAAU,iBAAiB,aAAa,gBAAgB;AACjE,SAAS,iCAAiC;AAC1C;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,OAKM;AASP,MAAM,gBAAgB,CAAC,OAAgB,QAAkB,UAA4B;AACpF,SAAO,CAAC,SAAS,MAAM,QAAQ,GAAG;AACjC,UAAM,SAAS,MAAM,IAAI,MAAM,QAAQ;AACvC,QAAI,CAAC,OAAQ,QAAO;AACpB,YAAQ;AAAA,EACT;AAEA,SAAO,MAAM,aAAa;AAC3B;AAQO,SAAS,4BAA4B,OAAgB,kBAAkC;AAC7F,QAAM,cAAc,MAAM,MAAM,IAAI,OAAO;AAC3C,MAAI,aAA8B;AAClC,WAAS,cAAc;AACtB,UAAM,gBAAgB,iBAAiB;AACvC,iBAAa;AACb,WAAO,IAAI;AAAA,MACV,CAAC,GAAG,YAAY,IAAI,CAAC,EAAE,OAAO,CAAC,OAAO,cAAc,OAAO,eAAe,MAAM,IAAI,EAAE,CAAE,CAAC;AAAA,IAC1F;AAAA,EACD;AACA,SAAO,SAAyB,0BAA0B,CAAC,WAAW,sBAAsB;AAC3F,QAAI,gBAAgB,SAAS,GAAG;AAC/B,aAAO,YAAY;AAAA,IACpB;AAEA,UAAM,gBAAgB,iBAAiB;AAEvC,QAAI,kBAAkB,YAAY;AACjC,aAAO,YAAY;AAAA,IACpB;AAEA,UAAM,OAAO,MAAM,QAAQ,aAAa,iBAAiB;AAEzD,QAAI,SAAS,aAAa;AACzB,aAAO,YAAY;AAAA,IACpB;AAEA,UAAM,UAAU,IAAI;AAAA,MACnB;AAAA,IACD;AAEA,eAAW,WAAW,MAAM;AAC3B,iBAAW,UAAU,OAAO,OAAO,QAAQ,KAAK,GAAG;AAClD,YAAI,QAAQ,MAAM,KAAK,cAAc,OAAO,eAAe,MAAM,GAAG;AACnE,kBAAQ,IAAI,OAAO,EAAE;AAAA,QACtB;AAAA,MACD;AAEA,iBAAW,CAAC,OAAO,EAAE,KAAK,OAAO,OAAO,QAAQ,OAAO,GAAG;AACzD,YAAI,QAAQ,EAAE,GAAG;AAChB,cAAI,cAAc,OAAO,eAAe,EAAE,GAAG;AAC5C,oBAAQ,IAAI,GAAG,EAAE;AAAA,UAClB,OAAO;AACN,oBAAQ,OAAO,GAAG,EAAE;AAAA,UACrB;AAAA,QACD;AAAA,MACD;AAEA,iBAAW,MAAM,OAAO,KAAK,QAAQ,OAAO,GAAG;AAC9C,YAAI,UAAU,EAAE,GAAG;AAClB,kBAAQ,OAAO,EAAE;AAAA,QAClB;AAAA,MACD;AAAA,IACD;AAEA,UAAM,SAAS,QAAQ,IAAI;AAC3B,QAAI,CAAC,QAAQ;AACZ,aAAO;AAAA,IACR;AAEA,WAAO,SAAS,OAAO,OAAO,OAAO,IAAI;AAAA,EAC1C,CAAC;AACF;",
   "names": []
 }

package/dist-esm/lib/editor/managers/ClickManager/ClickManager.mjs

@@ -20,6 +20,7 @@ class ClickManager {
   _clickTimeout;
   _clickScreenPoint;
   _previousScreenPoint;
+  _isPressingWhilePending = false;
   _getClickTimeout(state, id = uniqueId()) {
     this._clickId = id;
     clearTimeout(this._clickTimeout);
@@ -27,30 +28,12 @@ class ClickManager {
       () => {
         if (this._clickState === state && this._clickId === id) {
           switch (this._clickState) {
-            case "pendingTriple": {
-              this.editor.dispatch({
-                ...this.lastPointerInfo,
-                type: "click",
-                name: "double_click",
-                phase: "settle"
-              });
-              break;
-            }
-            case "pendingQuadruple": {
-              this.editor.dispatch({
-                ...this.lastPointerInfo,
-                type: "click",
-                name: "triple_click",
-                phase: "settle"
-              });
-              break;
-            }
             case "pendingOverflow": {
               this.editor.dispatch({
                 ...this.lastPointerInfo,
                 type: "click",
-                name: "quadruple_click",
-                phase: "settle"
+                name: "double_click",
+                phase: this._isPressingWhilePending ? "settle-down" : "settle-up"
               });
               break;
             }
@@ -84,6 +67,7 @@ class ClickManager {
       case "pointer_down": {
         if (!this._clickState) return info;
         this._clickScreenPoint = Vec.From(info.point);
+        this._isPressingWhilePending = true;
         if (this._previousScreenPoint && Vec.Dist2(this._previousScreenPoint, this._clickScreenPoint) > MAX_CLICK_DISTANCE ** 2) {
           this._clickState = "idle";
         }
@@ -91,32 +75,12 @@ class ClickManager {
         this.lastPointerInfo = info;
         switch (this._clickState) {
           case "pendingDouble": {
-            this._clickState = "pendingTriple";
-            this._clickTimeout = this._getClickTimeout(this._clickState);
-            return {
-              ...info,
-              type: "click",
-              name: "double_click",
-              phase: "down"
-            };
-          }
-          case "pendingTriple": {
-            this._clickState = "pendingQuadruple";
-            this._clickTimeout = this._getClickTimeout(this._clickState);
-            return {
-              ...info,
-              type: "click",
-              name: "triple_click",
-              phase: "down"
-            };
-          }
-          case "pendingQuadruple": {
             this._clickState = "pendingOverflow";
             this._clickTimeout = this._getClickTimeout(this._clickState);
             return {
               ...info,
               type: "click",
-              name: "quadruple_click",
+              name: "double_click",
               phase: "down"
             };
           }
@@ -137,28 +101,13 @@ class ClickManager {
       case "pointer_up": {
         if (!this._clickState) return info;
         this._clickScreenPoint = Vec.From(info.point);
+        this._isPressingWhilePending = false;
         switch (this._clickState) {
-          case "pendingTriple": {
-            return {
-              ...this.lastPointerInfo,
-              type: "click",
-              name: "double_click",
-              phase: "up"
-            };
-          }
-          case "pendingQuadruple": {
-            return {
-              ...this.lastPointerInfo,
-              type: "click",
-              name: "triple_click",
-              phase: "up"
-            };
-          }
           case "pendingOverflow": {
             return {
               ...this.lastPointerInfo,
               type: "click",
-              name: "quadruple_click",
+              name: "double_click",
               phase: "up"
             };
           }
@@ -179,6 +128,7 @@ class ClickManager {
   cancelDoubleClickTimeout() {
     this._clickTimeout = clearTimeout(this._clickTimeout);
     this._clickState = "idle";
+    this._isPressingWhilePending = false;
   }
 }
 __decorateClass([

package/dist-esm/lib/editor/managers/ClickManager/ClickManager.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/editor/managers/ClickManager/ClickManager.ts"],
-  "sourcesContent": ["import { bind, uniqueId } from '@tldraw/utils'\nimport { Vec } from '../../../primitives/Vec'\nimport type { Editor } from '../../Editor'\nimport { TLClickEventInfo, TLPointerEventInfo } from '../../types/event-types'\n\n/** @public */\nexport type TLClickState =\n\t| 'idle'\n\t| 'pendingDouble'\n\t| 'pendingTriple'\n\t| 'pendingQuadruple'\n\t| 'pendingOverflow'\n\t| 'overflow'\n\nconst MAX_CLICK_DISTANCE = 40\n\n/** @public */\nexport class ClickManager {\n\tconstructor(public editor: Editor) {}\n\n\tprivate _clickId = ''\n\n\tprivate _clickTimeout?: any\n\n\tprivate _clickScreenPoint?: Vec\n\n\tprivate _previousScreenPoint?: Vec\n\n\t@bind\n\t_getClickTimeout(state: TLClickState, id = uniqueId()) {\n\t\tthis._clickId = id\n\t\tclearTimeout(this._clickTimeout)\n\t\tthis._clickTimeout = this.editor.timers.setTimeout(\n\t\t\t() => {\n\t\t\t\tif (this._clickState === state && this._clickId === id) {\n\t\t\t\t\tswitch (this._clickState) {\n\t\t\t\t\t\tcase 'pendingTriple': {\n\t\t\t\t\t\t\tthis.editor.dispatch({\n\t\t\t\t\t\t\t\t...this.lastPointerInfo,\n\t\t\t\t\t\t\t\ttype: 'click',\n\t\t\t\t\t\t\t\tname: 'double_click',\n\t\t\t\t\t\t\t\tphase: 'settle',\n\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t}\n\t\t\t\t\t\tcase 'pendingQuadruple': {\n\t\t\t\t\t\t\tthis.editor.dispatch({\n\t\t\t\t\t\t\t\t...this.lastPointerInfo,\n\t\t\t\t\t\t\t\ttype: 'click',\n\t\t\t\t\t\t\t\tname: 'triple_click',\n\t\t\t\t\t\t\t\tphase: 'settle',\n\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t}\n\t\t\t\t\t\tcase 'pendingOverflow': {\n\t\t\t\t\t\t\tthis.editor.dispatch({\n\t\t\t\t\t\t\t\t...this.lastPointerInfo,\n\t\t\t\t\t\t\t\ttype: 'click',\n\t\t\t\t\t\t\t\tname: 'quadruple_click',\n\t\t\t\t\t\t\t\tphase: 'settle',\n\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t}\n\t\t\t\t\t\tdefault: {\n\t\t\t\t\t\t\t// noop\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tthis._clickState = 'idle'\n\t\t\t\t}\n\t\t\t},\n\t\t\tstate === 'idle' || state === 'pendingDouble'\n\t\t\t\t? this.editor.options.doubleClickDurationMs\n\t\t\t\t: this.editor.options.multiClickDurationMs\n\t\t)\n\t}\n\n\t/**\n\t * The current click state.\n\t *\n\t * @internal\n\t */\n\tprivate _clickState?: TLClickState = 'idle'\n\n\t/**\n\t * The current click state.\n\t *\n\t * @public\n\t */\n\t// eslint-disable-next-line tldraw/no-setter-getter\n\tget clickState() {\n\t\treturn this._clickState\n\t}\n\n\tlastPointerInfo = {} as TLPointerEventInfo\n\n\thandlePointerEvent(info: TLPointerEventInfo): TLPointerEventInfo | TLClickEventInfo {\n\t\tswitch (info.name) {\n\t\t\tcase 'pointer_down': {\n\t\t\t\tif (!this._clickState) return info\n\t\t\t\tthis._clickScreenPoint = Vec.From(info.point)\n\n\t\t\t\tif (\n\t\t\t\t\tthis._previousScreenPoint &&\n\t\t\t\t\tVec.Dist2(this._previousScreenPoint, this._clickScreenPoint) > MAX_CLICK_DISTANCE ** 2\n\t\t\t\t) {\n\t\t\t\t\tthis._clickState = 'idle'\n\t\t\t\t}\n\n\t\t\t\tthis._previousScreenPoint = this._clickScreenPoint\n\n\t\t\t\tthis.lastPointerInfo = info\n\n\t\t\t\tswitch (this._clickState) {\n\t\t\t\t\tcase 'pendingDouble': {\n\t\t\t\t\t\tthis._clickState = 'pendingTriple'\n\t\t\t\t\t\tthis._clickTimeout = this._getClickTimeout(this._clickState)\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...info,\n\t\t\t\t\t\t\ttype: 'click',\n\t\t\t\t\t\t\tname: 'double_click',\n\t\t\t\t\t\t\tphase: 'down',\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tcase 'pendingTriple': {\n\t\t\t\t\t\tthis._clickState = 'pendingQuadruple'\n\t\t\t\t\t\tthis._clickTimeout = this._getClickTimeout(this._clickState)\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...info,\n\t\t\t\t\t\t\ttype: 'click',\n\t\t\t\t\t\t\tname: 'triple_click',\n\t\t\t\t\t\t\tphase: 'down',\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tcase 'pendingQuadruple': {\n\t\t\t\t\t\tthis._clickState = 'pendingOverflow'\n\t\t\t\t\t\tthis._clickTimeout = this._getClickTimeout(this._clickState)\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...info,\n\t\t\t\t\t\t\ttype: 'click',\n\t\t\t\t\t\t\tname: 'quadruple_click',\n\t\t\t\t\t\t\tphase: 'down',\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tcase 'idle': {\n\t\t\t\t\t\tthis._clickState = 'pendingDouble'\n\t\t\t\t\t\tbreak\n\t\t\t\t\t}\n\t\t\t\t\tcase 'pendingOverflow': {\n\t\t\t\t\t\tthis._clickState = 'overflow'\n\t\t\t\t\t\tbreak\n\t\t\t\t\t}\n\t\t\t\t\tdefault: {\n\t\t\t\t\t\t// overflow\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tthis._clickTimeout = this._getClickTimeout(this._clickState)\n\t\t\t\treturn info\n\t\t\t}\n\t\t\tcase 'pointer_up': {\n\t\t\t\tif (!this._clickState) return info\n\t\t\t\tthis._clickScreenPoint = Vec.From(info.point)\n\n\t\t\t\tswitch (this._clickState) {\n\t\t\t\t\tcase 'pendingTriple': {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...this.lastPointerInfo,\n\t\t\t\t\t\t\ttype: 'click',\n\t\t\t\t\t\t\tname: 'double_click',\n\t\t\t\t\t\t\tphase: 'up',\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tcase 'pendingQuadruple': {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...this.lastPointerInfo,\n\t\t\t\t\t\t\ttype: 'click',\n\t\t\t\t\t\t\tname: 'triple_click',\n\t\t\t\t\t\t\tphase: 'up',\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tcase 'pendingOverflow': {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...this.lastPointerInfo,\n\t\t\t\t\t\t\ttype: 'click',\n\t\t\t\t\t\t\tname: 'quadruple_click',\n\t\t\t\t\t\t\tphase: 'up',\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tdefault: {\n\t\t\t\t\t\t// idle, pendingDouble, overflow\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn info\n\t\t\t}\n\t\t\tcase 'pointer_move': {\n\t\t\t\tif (\n\t\t\t\t\tthis._clickState !== 'idle' &&\n\t\t\t\t\tthis._clickScreenPoint &&\n\t\t\t\t\tVec.Dist2(this._clickScreenPoint, this.editor.inputs.getCurrentScreenPoint()) >\n\t\t\t\t\t\t(this.editor.getInstanceState().isCoarsePointer\n\t\t\t\t\t\t\t? this.editor.options.coarseDragDistanceSquared\n\t\t\t\t\t\t\t: this.editor.options.dragDistanceSquared)\n\t\t\t\t) {\n\t\t\t\t\tthis.cancelDoubleClickTimeout()\n\t\t\t\t}\n\t\t\t\treturn info\n\t\t\t}\n\t\t}\n\t\treturn info\n\t}\n\n\t/**\n\t * Cancel the double click timeout.\n\t *\n\t * @internal\n\t */\n\t@bind\n\tcancelDoubleClickTimeout() {\n\t\tthis._clickTimeout = clearTimeout(this._clickTimeout)\n\t\tthis._clickState = 'idle'\n\t}\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { bind, uniqueId } from '@tldraw/utils'\nimport { Vec } from '../../../primitives/Vec'\nimport type { Editor } from '../../Editor'\nimport { TLClickEventInfo, TLPointerEventInfo } from '../../types/event-types'\n\n/** @public */\nexport type TLClickState = 'idle' | 'pendingDouble' | 'pendingOverflow' | 'overflow'\n\nconst MAX_CLICK_DISTANCE = 40\n\n/** @public */\nexport class ClickManager {\n\tconstructor(public editor: Editor) {}\n\n\tprivate _clickId = ''\n\n\tprivate _clickTimeout?: any\n\n\tprivate _clickScreenPoint?: Vec\n\n\tprivate _previousScreenPoint?: Vec\n\n\tprivate _isPressingWhilePending = false\n\n\t@bind\n\t_getClickTimeout(state: TLClickState, id = uniqueId()) {\n\t\tthis._clickId = id\n\t\tclearTimeout(this._clickTimeout)\n\t\tthis._clickTimeout = this.editor.timers.setTimeout(\n\t\t\t() => {\n\t\t\t\tif (this._clickState === state && this._clickId === id) {\n\t\t\t\t\tswitch (this._clickState) {\n\t\t\t\t\t\tcase 'pendingOverflow': {\n\t\t\t\t\t\t\tthis.editor.dispatch({\n\t\t\t\t\t\t\t\t...this.lastPointerInfo,\n\t\t\t\t\t\t\t\ttype: 'click',\n\t\t\t\t\t\t\t\tname: 'double_click',\n\t\t\t\t\t\t\t\tphase: this._isPressingWhilePending ? 'settle-down' : 'settle-up',\n\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t}\n\t\t\t\t\t\tdefault: {\n\t\t\t\t\t\t\t// noop\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tthis._clickState = 'idle'\n\t\t\t\t}\n\t\t\t},\n\t\t\tstate === 'idle' || state === 'pendingDouble'\n\t\t\t\t? this.editor.options.doubleClickDurationMs\n\t\t\t\t: this.editor.options.multiClickDurationMs\n\t\t)\n\t}\n\n\t/**\n\t * The current click state.\n\t *\n\t * @internal\n\t */\n\tprivate _clickState?: TLClickState = 'idle'\n\n\t/**\n\t * The current click state.\n\t *\n\t * @public\n\t */\n\t// eslint-disable-next-line tldraw/no-setter-getter\n\tget clickState() {\n\t\treturn this._clickState\n\t}\n\n\tlastPointerInfo = {} as TLPointerEventInfo\n\n\thandlePointerEvent(info: TLPointerEventInfo): TLPointerEventInfo | TLClickEventInfo {\n\t\tswitch (info.name) {\n\t\t\tcase 'pointer_down': {\n\t\t\t\tif (!this._clickState) return info\n\t\t\t\tthis._clickScreenPoint = Vec.From(info.point)\n\n\t\t\t\tthis._isPressingWhilePending = true\n\n\t\t\t\tif (\n\t\t\t\t\tthis._previousScreenPoint &&\n\t\t\t\t\tVec.Dist2(this._previousScreenPoint, this._clickScreenPoint) > MAX_CLICK_DISTANCE ** 2\n\t\t\t\t) {\n\t\t\t\t\tthis._clickState = 'idle'\n\t\t\t\t}\n\n\t\t\t\tthis._previousScreenPoint = this._clickScreenPoint\n\n\t\t\t\tthis.lastPointerInfo = info\n\n\t\t\t\tswitch (this._clickState) {\n\t\t\t\t\tcase 'pendingDouble': {\n\t\t\t\t\t\tthis._clickState = 'pendingOverflow'\n\t\t\t\t\t\tthis._clickTimeout = this._getClickTimeout(this._clickState)\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...info,\n\t\t\t\t\t\t\ttype: 'click',\n\t\t\t\t\t\t\tname: 'double_click',\n\t\t\t\t\t\t\tphase: 'down',\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tcase 'idle': {\n\t\t\t\t\t\tthis._clickState = 'pendingDouble'\n\t\t\t\t\t\tbreak\n\t\t\t\t\t}\n\t\t\t\t\tcase 'pendingOverflow': {\n\t\t\t\t\t\tthis._clickState = 'overflow'\n\t\t\t\t\t\tbreak\n\t\t\t\t\t}\n\t\t\t\t\tdefault: {\n\t\t\t\t\t\t// overflow\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tthis._clickTimeout = this._getClickTimeout(this._clickState)\n\t\t\t\treturn info\n\t\t\t}\n\t\t\tcase 'pointer_up': {\n\t\t\t\tif (!this._clickState) return info\n\n\t\t\t\tthis._clickScreenPoint = Vec.From(info.point)\n\n\t\t\t\tthis._isPressingWhilePending = false\n\n\t\t\t\tswitch (this._clickState) {\n\t\t\t\t\tcase 'pendingOverflow': {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...this.lastPointerInfo,\n\t\t\t\t\t\t\ttype: 'click',\n\t\t\t\t\t\t\tname: 'double_click',\n\t\t\t\t\t\t\tphase: 'up',\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tdefault: {\n\t\t\t\t\t\t// idle, pendingDouble, overflow\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn info\n\t\t\t}\n\t\t\tcase 'pointer_move': {\n\t\t\t\tif (\n\t\t\t\t\tthis._clickState !== 'idle' &&\n\t\t\t\t\tthis._clickScreenPoint &&\n\t\t\t\t\tVec.Dist2(this._clickScreenPoint, this.editor.inputs.getCurrentScreenPoint()) >\n\t\t\t\t\t\t(this.editor.getInstanceState().isCoarsePointer\n\t\t\t\t\t\t\t? this.editor.options.coarseDragDistanceSquared\n\t\t\t\t\t\t\t: this.editor.options.dragDistanceSquared)\n\t\t\t\t) {\n\t\t\t\t\tthis.cancelDoubleClickTimeout()\n\t\t\t\t}\n\t\t\t\treturn info\n\t\t\t}\n\t\t}\n\t\treturn info\n\t}\n\n\t/**\n\t * Cancel the double click timeout.\n\t *\n\t * @internal\n\t */\n\t@bind\n\tcancelDoubleClickTimeout() {\n\t\tthis._clickTimeout = clearTimeout(this._clickTimeout)\n\t\tthis._clickState = 'idle'\n\t\t// when a double click is cancelled, we are no longer pending any further\n\t\t// clicks, so we set this to false even if the user is still pressing\n\t\tthis._isPressingWhilePending = false\n\t}\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist-esm/lib/editor/managers/CollaboratorsManager/CollaboratorsManager.mjs

@@ -30,7 +30,7 @@ class CollaboratorsManager {
   _visibilityClock = atom("collaboratorVisibilityClock", Date.now());
   _getCollaboratorsQuery() {
     return this.editor.store.query.records("instance_presence", () => ({
-      userId: { neq: this.editor.user.getId() }
+      userId: { neq: this.editor.user.getRecordId() }
     }));
   }
   getCollaborators() {
@@ -58,10 +58,10 @@ class CollaboratorsManager {
     const collaborators = this.getCollaborators();
     if (!collaborators.length) return EMPTY_ARRAY;
     const { followingUserId, highlightedUserIds } = this.editor.getInstanceState();
-    const currentUserId = this.editor.user.getId();
+    const currentUserId = this.editor.user.getRecordId();
     return collaborators.filter((presence) => {
       const { lastActivityTimestamp, userId, chatMessage } = presence;
-      const elapsed = Math.max(0, now - (lastActivityTimestamp ?? now));
+      const elapsed = lastActivityTimestamp ? Math.max(0, now - lastActivityTimestamp) : 0;
       if (elapsed > collaboratorInactiveTimeoutMs) {
         return followingUserId === userId || highlightedUserIds.includes(userId);
       }

package/dist-esm/lib/editor/managers/CollaboratorsManager/CollaboratorsManager.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/editor/managers/CollaboratorsManager/CollaboratorsManager.ts"],
-  "sourcesContent": ["import { EMPTY_ARRAY, atom, computed } from '@tldraw/state'\nimport type { TLInstancePresence } from '@tldraw/tlschema'\nimport { maxBy } from '@tldraw/utils'\nimport type { Editor } from '../../Editor'\n\n/**\n * Tracks remote peers and exposes the collaborator-related queries used by the\n * editor and its overlays. Encapsulates the visibility clock that periodically\n * re-evaluates which collaborators should be visible based on activity.\n *\n * Accessed via {@link Editor.collaborators}.\n *\n * @public\n */\nexport class CollaboratorsManager {\n\tconstructor(private readonly editor: Editor) {}\n\n\tprivate _visibilityClockStarted = false\n\n\tprivate _startVisibilityClock() {\n\t\tif (this._visibilityClockStarted) return\n\t\tthis._visibilityClockStarted = true\n\n\t\t// Editor disposes `editor.timers` on its own teardown, so the interval is\n\t\t// automatically cleared when the editor is disposed.\n\t\tthis.editor.timers.setInterval(() => {\n\t\t\tthis._visibilityClock.set(Date.now())\n\t\t}, this.editor.options.collaboratorCheckIntervalMs)\n\t}\n\n\t/**\n\t * Drives reactive re-evaluation of {@link CollaboratorsManager.getVisibleCollaborators}.\n\t * Ticked on a fixed interval so callers don't need to manage their own activity timers.\n\t */\n\tprivate readonly _visibilityClock = atom('collaboratorVisibilityClock', Date.now())\n\n\t@computed\n\tprivate _getCollaboratorsQuery() {\n\t\treturn this.editor.store.query.records('instance_presence', () => ({\n\t\t\tuserId: { neq: this.editor.user.getId() },\n\t\t}))\n\t}\n\n\t/**\n\t * Returns a list of presence records for all peer collaborators.\n\t * This will return the latest presence record for each connected user.\n\t */\n\t@computed\n\tgetCollaborators(): TLInstancePresence[] {\n\t\tconst allPresenceRecords = this._getCollaboratorsQuery().get()\n\t\tif (!allPresenceRecords.length) return EMPTY_ARRAY\n\t\tconst userIds = [...new Set(allPresenceRecords.map((c) => c.userId))].sort()\n\t\treturn userIds.map((id) => {\n\t\t\tconst latestPresence = maxBy(\n\t\t\t\tallPresenceRecords.filter((c) => c.userId === id),\n\t\t\t\t(p) => p.lastActivityTimestamp ?? 0\n\t\t\t)\n\t\t\treturn latestPresence!\n\t\t})\n\t}\n\n\t/**\n\t * Returns a list of presence records for all peer collaborators on the current page.\n\t * This will return the latest presence record for each connected user.\n\t */\n\t@computed\n\tgetCollaboratorsOnCurrentPage(): TLInstancePresence[] {\n\t\tconst currentPageId = this.editor.getCurrentPageId()\n\t\treturn this.getCollaborators().filter((c) => c.currentPageId === currentPageId)\n\t}\n\n\t/**\n\t * Returns a list of presence records for peer collaborators who should currently be\n\t * shown in the UI. Filters {@link CollaboratorsManager.getCollaborators} by activity\n\t * state (active / idle / inactive) and visibility rules such as following and\n\t * highlighted users. Re-evaluates on the visibility clock, so callers don't need to\n\t * drive their own activity timer.\n\t */\n\t@computed\n\tgetVisibleCollaborators(): TLInstancePresence[] {\n\t\tconst { editor } = this\n\t\tconst { collaboratorInactiveTimeoutMs, collaboratorIdleTimeoutMs } = editor.options\n\n\t\tthis._startVisibilityClock()\n\t\tthis._visibilityClock.get()\n\t\tconst now = Date.now()\n\t\tconst collaborators = this.getCollaborators()\n\t\tif (!collaborators.length) return EMPTY_ARRAY\n\n\t\tconst { followingUserId, highlightedUserIds } = this.editor.getInstanceState()\n\t\tconst currentUserId = this.editor.user.getId()\n\n\t\treturn collaborators.filter((presence) => {\n\t\t\tconst { lastActivityTimestamp, userId, chatMessage } = presence\n\n\t\t\t// Treat a missing `lastActivityTimestamp` as \"active right now\" (elapsed = 0)\n\t\t\t// so newly-joined peers aren't immediately classified as idle/inactive.\n\t\t\tconst elapsed = Math.max(0, now - (lastActivityTimestamp ?? now))\n\n\t\t\tif (elapsed > collaboratorInactiveTimeoutMs) {\n\t\t\t\t// Inactive: If they're inactive, only show if we're following them or they're highlighted\n\t\t\t\treturn followingUserId === userId || highlightedUserIds.includes(userId)\n\t\t\t}\n\n\t\t\tif (elapsed > collaboratorIdleTimeoutMs) {\n\t\t\t\t// Idle: If they're idle and following us, hide them unless they have a chat message or are highlighted\n\t\t\t\tif (presence.followingUserId === currentUserId) {\n\t\t\t\t\treturn !!(chatMessage || highlightedUserIds.includes(userId))\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Active\n\t\t\treturn true\n\t\t})\n\t}\n\n\t/**\n\t * Returns a list of presence records for peer collaborators who should currently be\n\t * shown in the UI, filtered to those on the current page.\n\t */\n\t@computed\n\tgetVisibleCollaboratorsOnCurrentPage(): TLInstancePresence[] {\n\t\tconst currentPageId = this.editor.getCurrentPageId()\n\t\treturn this.getVisibleCollaborators().filter((c) => c.currentPageId === currentPageId)\n\t}\n}\n"],
-  "mappings": ";;;;;;;;;;AAAA,SAAS,aAAa,MAAM,gBAAgB;AAE5C,SAAS,aAAa;AAYf,MAAM,qBAAqB;AAAA,EACjC,YAA6B,QAAgB;AAAhB;AAAA,EAAiB;AAAA,EAAjB;AAAA,EAErB,0BAA0B;AAAA,EAE1B,wBAAwB;AAC/B,QAAI,KAAK,wBAAyB;AAClC,SAAK,0BAA0B;AAI/B,SAAK,OAAO,OAAO,YAAY,MAAM;AACpC,WAAK,iBAAiB,IAAI,KAAK,IAAI,CAAC;AAAA,IACrC,GAAG,KAAK,OAAO,QAAQ,2BAA2B;AAAA,EACnD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMiB,mBAAmB,KAAK,+BAA+B,KAAK,IAAI,CAAC;AAAA,EAG1E,yBAAyB;AAChC,WAAO,KAAK,OAAO,MAAM,MAAM,QAAQ,qBAAqB,OAAO;AAAA,MAClE,QAAQ,EAAE,KAAK,KAAK,OAAO,KAAK,MAAM,EAAE;AAAA,IACzC,EAAE;AAAA,EACH;AAAA,EAOA,mBAAyC;AACxC,UAAM,qBAAqB,KAAK,uBAAuB,EAAE,IAAI;AAC7D,QAAI,CAAC,mBAAmB,OAAQ,QAAO;AACvC,UAAM,UAAU,CAAC,GAAG,IAAI,IAAI,mBAAmB,IAAI,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,EAAE,KAAK;AAC3E,WAAO,QAAQ,IAAI,CAAC,OAAO;AAC1B,YAAM,iBAAiB;AAAA,QACtB,mBAAmB,OAAO,CAAC,MAAM,EAAE,WAAW,EAAE;AAAA,QAChD,CAAC,MAAM,EAAE,yBAAyB;AAAA,MACnC;AACA,aAAO;AAAA,IACR,CAAC;AAAA,EACF;AAAA,EAOA,gCAAsD;AACrD,UAAM,gBAAgB,KAAK,OAAO,iBAAiB;AACnD,WAAO,KAAK,iBAAiB,EAAE,OAAO,CAAC,MAAM,EAAE,kBAAkB,aAAa;AAAA,EAC/E;AAAA,EAUA,0BAAgD;AAC/C,UAAM,EAAE,OAAO,IAAI;AACnB,UAAM,EAAE,+BAA+B,0BAA0B,IAAI,OAAO;AAE5E,SAAK,sBAAsB;AAC3B,SAAK,iBAAiB,IAAI;AAC1B,UAAM,MAAM,KAAK,IAAI;AACrB,UAAM,gBAAgB,KAAK,iBAAiB;AAC5C,QAAI,CAAC,cAAc,OAAQ,QAAO;AAElC,UAAM,EAAE,iBAAiB,mBAAmB,IAAI,KAAK,OAAO,iBAAiB;AAC7E,UAAM,gBAAgB,KAAK,OAAO,KAAK,MAAM;AAE7C,WAAO,cAAc,OAAO,CAAC,aAAa;AACzC,YAAM,EAAE,uBAAuB,QAAQ,YAAY,IAAI;AAIvD,YAAM,UAAU,KAAK,IAAI,GAAG,OAAO,yBAAyB,IAAI;AAEhE,UAAI,UAAU,+BAA+B;AAE5C,eAAO,oBAAoB,UAAU,mBAAmB,SAAS,MAAM;AAAA,MACxE;AAEA,UAAI,UAAU,2BAA2B;AAExC,YAAI,SAAS,oBAAoB,eAAe;AAC/C,iBAAO,CAAC,EAAE,eAAe,mBAAmB,SAAS,MAAM;AAAA,QAC5D;AAAA,MACD;AAGA,aAAO;AAAA,IACR,CAAC;AAAA,EACF;AAAA,EAOA,uCAA6D;AAC5D,UAAM,gBAAgB,KAAK,OAAO,iBAAiB;AACnD,WAAO,KAAK,wBAAwB,EAAE,OAAO,CAAC,MAAM,EAAE,kBAAkB,aAAa;AAAA,EACtF;AACD;AAxFS;AAAA,EADP;AAAA,GAtBW,qBAuBJ;AAWR;AAAA,EADC;AAAA,GAjCW,qBAkCZ;AAkBA;AAAA,EADC;AAAA,GAnDW,qBAoDZ;AAaA;AAAA,EADC;AAAA,GAhEW,qBAiEZ;AA0CA;AAAA,EADC;AAAA,GA1GW,qBA2GZ;",
+  "sourcesContent": ["import { EMPTY_ARRAY, atom, computed } from '@tldraw/state'\nimport type { TLInstancePresence } from '@tldraw/tlschema'\nimport { maxBy } from '@tldraw/utils'\nimport type { Editor } from '../../Editor'\n\n/**\n * Tracks remote peers and exposes the collaborator-related queries used by the\n * editor and its overlays. Encapsulates the visibility clock that periodically\n * re-evaluates which collaborators should be visible based on activity.\n *\n * Accessed via {@link Editor.collaborators}.\n *\n * @public\n */\nexport class CollaboratorsManager {\n\tconstructor(private readonly editor: Editor) {}\n\n\tprivate _visibilityClockStarted = false\n\n\tprivate _startVisibilityClock() {\n\t\tif (this._visibilityClockStarted) return\n\t\tthis._visibilityClockStarted = true\n\n\t\t// Editor disposes `editor.timers` on its own teardown, so the interval is\n\t\t// automatically cleared when the editor is disposed.\n\t\tthis.editor.timers.setInterval(() => {\n\t\t\tthis._visibilityClock.set(Date.now())\n\t\t}, this.editor.options.collaboratorCheckIntervalMs)\n\t}\n\n\t/**\n\t * Drives reactive re-evaluation of {@link CollaboratorsManager.getVisibleCollaborators}.\n\t * Ticked on a fixed interval so callers don't need to manage their own activity timers.\n\t */\n\tprivate readonly _visibilityClock = atom('collaboratorVisibilityClock', Date.now())\n\n\t@computed\n\tprivate _getCollaboratorsQuery() {\n\t\treturn this.editor.store.query.records('instance_presence', () => ({\n\t\t\tuserId: { neq: this.editor.user.getRecordId() },\n\t\t}))\n\t}\n\n\t/**\n\t * Returns a list of presence records for all peer collaborators.\n\t * This will return the latest presence record for each connected user.\n\t */\n\t@computed\n\tgetCollaborators(): TLInstancePresence[] {\n\t\tconst allPresenceRecords = this._getCollaboratorsQuery().get()\n\t\tif (!allPresenceRecords.length) return EMPTY_ARRAY\n\t\tconst userIds = [...new Set(allPresenceRecords.map((c) => c.userId))].sort()\n\t\treturn userIds.map((id) => {\n\t\t\tconst latestPresence = maxBy(\n\t\t\t\tallPresenceRecords.filter((c) => c.userId === id),\n\t\t\t\t(p) => p.lastActivityTimestamp ?? 0\n\t\t\t)\n\t\t\treturn latestPresence!\n\t\t})\n\t}\n\n\t/**\n\t * Returns a list of presence records for all peer collaborators on the current page.\n\t * This will return the latest presence record for each connected user.\n\t */\n\t@computed\n\tgetCollaboratorsOnCurrentPage(): TLInstancePresence[] {\n\t\tconst currentPageId = this.editor.getCurrentPageId()\n\t\treturn this.getCollaborators().filter((c) => c.currentPageId === currentPageId)\n\t}\n\n\t/**\n\t * Returns a list of presence records for peer collaborators who should currently be\n\t * shown in the UI. Filters {@link CollaboratorsManager.getCollaborators} by activity\n\t * state (active / idle / inactive) and visibility rules such as following and\n\t * highlighted users. Re-evaluates on the visibility clock, so callers don't need to\n\t * drive their own activity timer.\n\t */\n\t@computed\n\tgetVisibleCollaborators(): TLInstancePresence[] {\n\t\tconst { editor } = this\n\t\tconst { collaboratorInactiveTimeoutMs, collaboratorIdleTimeoutMs } = editor.options\n\n\t\tthis._startVisibilityClock()\n\t\tthis._visibilityClock.get()\n\t\tconst now = Date.now()\n\t\tconst collaborators = this.getCollaborators()\n\t\tif (!collaborators.length) return EMPTY_ARRAY\n\n\t\tconst { followingUserId, highlightedUserIds } = this.editor.getInstanceState()\n\t\tconst currentUserId = this.editor.user.getRecordId()\n\n\t\treturn collaborators.filter((presence) => {\n\t\t\tconst { lastActivityTimestamp, userId, chatMessage } = presence\n\n\t\t\t// Treat a missing or zero `lastActivityTimestamp` as \"active right now\"\n\t\t\t// (elapsed = 0) so newly-joined peers aren't immediately classified as\n\t\t\t// idle/inactive. The broadcast default for peers who haven't moved their\n\t\t\t// pointer yet is `0` (e.g. someone on a touch device who joins and just\n\t\t\t// watches), so a plain `?? now` would leave them hidden. See issue #9017.\n\t\t\tconst elapsed = lastActivityTimestamp ? Math.max(0, now - lastActivityTimestamp) : 0\n\n\t\t\tif (elapsed > collaboratorInactiveTimeoutMs) {\n\t\t\t\t// Inactive: If they're inactive, only show if we're following them or they're highlighted\n\t\t\t\treturn followingUserId === userId || highlightedUserIds.includes(userId)\n\t\t\t}\n\n\t\t\tif (elapsed > collaboratorIdleTimeoutMs) {\n\t\t\t\t// Idle: If they're idle and following us, hide them unless they have a chat message or are highlighted\n\t\t\t\tif (presence.followingUserId === currentUserId) {\n\t\t\t\t\treturn !!(chatMessage || highlightedUserIds.includes(userId))\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Active\n\t\t\treturn true\n\t\t})\n\t}\n\n\t/**\n\t * Returns a list of presence records for peer collaborators who should currently be\n\t * shown in the UI, filtered to those on the current page.\n\t */\n\t@computed\n\tgetVisibleCollaboratorsOnCurrentPage(): TLInstancePresence[] {\n\t\tconst currentPageId = this.editor.getCurrentPageId()\n\t\treturn this.getVisibleCollaborators().filter((c) => c.currentPageId === currentPageId)\n\t}\n}\n"],
+  "mappings": ";;;;;;;;;;AAAA,SAAS,aAAa,MAAM,gBAAgB;AAE5C,SAAS,aAAa;AAYf,MAAM,qBAAqB;AAAA,EACjC,YAA6B,QAAgB;AAAhB;AAAA,EAAiB;AAAA,EAAjB;AAAA,EAErB,0BAA0B;AAAA,EAE1B,wBAAwB;AAC/B,QAAI,KAAK,wBAAyB;AAClC,SAAK,0BAA0B;AAI/B,SAAK,OAAO,OAAO,YAAY,MAAM;AACpC,WAAK,iBAAiB,IAAI,KAAK,IAAI,CAAC;AAAA,IACrC,GAAG,KAAK,OAAO,QAAQ,2BAA2B;AAAA,EACnD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMiB,mBAAmB,KAAK,+BAA+B,KAAK,IAAI,CAAC;AAAA,EAG1E,yBAAyB;AAChC,WAAO,KAAK,OAAO,MAAM,MAAM,QAAQ,qBAAqB,OAAO;AAAA,MAClE,QAAQ,EAAE,KAAK,KAAK,OAAO,KAAK,YAAY,EAAE;AAAA,IAC/C,EAAE;AAAA,EACH;AAAA,EAOA,mBAAyC;AACxC,UAAM,qBAAqB,KAAK,uBAAuB,EAAE,IAAI;AAC7D,QAAI,CAAC,mBAAmB,OAAQ,QAAO;AACvC,UAAM,UAAU,CAAC,GAAG,IAAI,IAAI,mBAAmB,IAAI,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,EAAE,KAAK;AAC3E,WAAO,QAAQ,IAAI,CAAC,OAAO;AAC1B,YAAM,iBAAiB;AAAA,QACtB,mBAAmB,OAAO,CAAC,MAAM,EAAE,WAAW,EAAE;AAAA,QAChD,CAAC,MAAM,EAAE,yBAAyB;AAAA,MACnC;AACA,aAAO;AAAA,IACR,CAAC;AAAA,EACF;AAAA,EAOA,gCAAsD;AACrD,UAAM,gBAAgB,KAAK,OAAO,iBAAiB;AACnD,WAAO,KAAK,iBAAiB,EAAE,OAAO,CAAC,MAAM,EAAE,kBAAkB,aAAa;AAAA,EAC/E;AAAA,EAUA,0BAAgD;AAC/C,UAAM,EAAE,OAAO,IAAI;AACnB,UAAM,EAAE,+BAA+B,0BAA0B,IAAI,OAAO;AAE5E,SAAK,sBAAsB;AAC3B,SAAK,iBAAiB,IAAI;AAC1B,UAAM,MAAM,KAAK,IAAI;AACrB,UAAM,gBAAgB,KAAK,iBAAiB;AAC5C,QAAI,CAAC,cAAc,OAAQ,QAAO;AAElC,UAAM,EAAE,iBAAiB,mBAAmB,IAAI,KAAK,OAAO,iBAAiB;AAC7E,UAAM,gBAAgB,KAAK,OAAO,KAAK,YAAY;AAEnD,WAAO,cAAc,OAAO,CAAC,aAAa;AACzC,YAAM,EAAE,uBAAuB,QAAQ,YAAY,IAAI;AAOvD,YAAM,UAAU,wBAAwB,KAAK,IAAI,GAAG,MAAM,qBAAqB,IAAI;AAEnF,UAAI,UAAU,+BAA+B;AAE5C,eAAO,oBAAoB,UAAU,mBAAmB,SAAS,MAAM;AAAA,MACxE;AAEA,UAAI,UAAU,2BAA2B;AAExC,YAAI,SAAS,oBAAoB,eAAe;AAC/C,iBAAO,CAAC,EAAE,eAAe,mBAAmB,SAAS,MAAM;AAAA,QAC5D;AAAA,MACD;AAGA,aAAO;AAAA,IACR,CAAC;AAAA,EACF;AAAA,EAOA,uCAA6D;AAC5D,UAAM,gBAAgB,KAAK,OAAO,iBAAiB;AACnD,WAAO,KAAK,wBAAwB,EAAE,OAAO,CAAC,MAAM,EAAE,kBAAkB,aAAa;AAAA,EACtF;AACD;AA3FS;AAAA,EADP;AAAA,GAtBW,qBAuBJ;AAWR;AAAA,EADC;AAAA,GAjCW,qBAkCZ;AAkBA;AAAA,EADC;AAAA,GAnDW,qBAoDZ;AAaA;AAAA,EADC;AAAA,GAhEW,qBAiEZ;AA6CA;AAAA,EADC;AAAA,GA7GW,qBA8GZ;",
   "names": []
 }

package/dist-esm/lib/editor/managers/FocusManager/FocusManager.mjs

@@ -53,8 +53,7 @@ class FocusManager {
   handleKeyDown(keyEvent) {
     const container = this.editor.getContainer();
     const activeEl = container.ownerDocument.activeElement;
-    if (this.editor.isIn("select.editing_shape") && !activeEl?.closest(".tlui-contextual-toolbar"))
-      return;
+    if (this.editor.getEditingShapeId() && !activeEl?.closest(".tlui-contextual-toolbar")) return;
     if (activeEl === container && this.editor.getSelectedShapeIds().length > 0) return;
     if (["Tab", "ArrowUp", "ArrowDown"].includes(keyEvent.key)) {
       container.classList.remove("tl-container__no-focus-ring");

package/dist-esm/lib/editor/managers/FocusManager/FocusManager.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/editor/managers/FocusManager/FocusManager.ts"],
-  "sourcesContent": ["import { bind } from '@tldraw/utils'\nimport type { Editor } from '../../Editor'\n\n/**\n * A manager for ensuring correct focus across the editor.\n * It will listen for changes in the instance state to make sure the\n * container is focused when the editor is focused.\n * Also, it will make sure that the focus is on things like text\n * labels when the editor is in editing mode.\n *\n * @internal\n */\nexport class FocusManager {\n\tprivate disposeSideEffectListener?: () => void\n\n\tconstructor(\n\t\tpublic editor: Editor,\n\t\tautoFocus?: boolean\n\t) {\n\t\tthis.disposeSideEffectListener = editor.sideEffects.registerAfterChangeHandler(\n\t\t\t'instance',\n\t\t\t(prev, next) => {\n\t\t\t\tif (prev.isFocused !== next.isFocused) {\n\t\t\t\t\tthis.updateContainerClass()\n\t\t\t\t}\n\t\t\t}\n\t\t)\n\n\t\tconst currentFocusState = editor.getInstanceState().isFocused\n\t\tif (autoFocus !== currentFocusState) {\n\t\t\teditor.updateInstanceState({ isFocused: !!autoFocus })\n\t\t}\n\t\tthis.updateContainerClass()\n\n\t\tconst body = editor.getContainerDocument().body\n\t\tbody.addEventListener('keydown', this.handleKeyDown)\n\t\tbody.addEventListener('mousedown', this.handleMouseDown)\n\t}\n\n\t/**\n\t * The editor's focus state and the container's focus state\n\t * are not necessarily always in sync. For that reason we\n\t * can't rely on the css `:focus` or `:focus-within` selectors to style the\n\t * editor when it is in focus.\n\t *\n\t * For that reason we synchronize the editor's focus state with a\n\t * special class on the container: tl-container__focused\n\t */\n\tprivate updateContainerClass() {\n\t\tconst container = this.editor.getContainer()\n\t\tconst instanceState = this.editor.getInstanceState()\n\n\t\tif (instanceState.isFocused) {\n\t\t\tcontainer.classList.add('tl-container__focused')\n\t\t} else {\n\t\t\tcontainer.classList.remove('tl-container__focused')\n\t\t}\n\t\tcontainer.classList.add('tl-container__no-focus-ring')\n\t}\n\n\t@bind private handleKeyDown(keyEvent: KeyboardEvent) {\n\t\tconst container = this.editor.getContainer()\n\t\tconst activeEl = container.ownerDocument.activeElement\n\t\t// Edit mode should remove the focus ring, however if the active element's\n\t\t// parent is the contextual toolbar, then allow it.\n\t\tif (this.editor.isIn('select.editing_shape') && !activeEl?.closest('.tlui-contextual-toolbar'))\n\t\t\treturn\n\t\tif (activeEl === container && this.editor.getSelectedShapeIds().length > 0) return\n\t\tif (['Tab', 'ArrowUp', 'ArrowDown'].includes(keyEvent.key)) {\n\t\t\tcontainer.classList.remove('tl-container__no-focus-ring')\n\t\t}\n\t}\n\n\t@bind private handleMouseDown() {\n\t\tconst container = this.editor.getContainer()\n\t\tcontainer.classList.add('tl-container__no-focus-ring')\n\t}\n\n\tfocus() {\n\t\tthis.editor.getContainer().focus()\n\t}\n\n\tblur({ blurContainer = true } = {}) {\n\t\tthis.editor.complete() // stop any interaction\n\t\tif (blurContainer) this.editor.getContainer().blur() // blur the container\n\t}\n\n\tdispose() {\n\t\tconst body = this.editor.getContainerDocument().body\n\t\tbody.removeEventListener('keydown', this.handleKeyDown)\n\t\tbody.removeEventListener('mousedown', this.handleMouseDown)\n\t\tthis.disposeSideEffectListener?.()\n\t}\n}\n"],
-  "mappings": ";;;;;;;;;;AAAA,SAAS,YAAY;AAYd,MAAM,aAAa;AAAA,EAGzB,YACQ,QACP,WACC;AAFM;AAGP,SAAK,4BAA4B,OAAO,YAAY;AAAA,MACnD;AAAA,MACA,CAAC,MAAM,SAAS;AACf,YAAI,KAAK,cAAc,KAAK,WAAW;AACtC,eAAK,qBAAqB;AAAA,QAC3B;AAAA,MACD;AAAA,IACD;AAEA,UAAM,oBAAoB,OAAO,iBAAiB,EAAE;AACpD,QAAI,cAAc,mBAAmB;AACpC,aAAO,oBAAoB,EAAE,WAAW,CAAC,CAAC,UAAU,CAAC;AAAA,IACtD;AACA,SAAK,qBAAqB;AAE1B,UAAM,OAAO,OAAO,qBAAqB,EAAE;AAC3C,SAAK,iBAAiB,WAAW,KAAK,aAAa;AACnD,SAAK,iBAAiB,aAAa,KAAK,eAAe;AAAA,EACxD;AAAA,EArBQ;AAAA,EAHA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAmCA,uBAAuB;AAC9B,UAAM,YAAY,KAAK,OAAO,aAAa;AAC3C,UAAM,gBAAgB,KAAK,OAAO,iBAAiB;AAEnD,QAAI,cAAc,WAAW;AAC5B,gBAAU,UAAU,IAAI,uBAAuB;AAAA,IAChD,OAAO;AACN,gBAAU,UAAU,OAAO,uBAAuB;AAAA,IACnD;AACA,cAAU,UAAU,IAAI,6BAA6B;AAAA,EACtD;AAAA,EAEc,cAAc,UAAyB;AACpD,UAAM,YAAY,KAAK,OAAO,aAAa;AAC3C,UAAM,WAAW,UAAU,cAAc;AAGzC,QAAI,KAAK,OAAO,KAAK,sBAAsB,KAAK,CAAC,UAAU,QAAQ,0BAA0B;AAC5F;AACD,QAAI,aAAa,aAAa,KAAK,OAAO,oBAAoB,EAAE,SAAS,EAAG;AAC5E,QAAI,CAAC,OAAO,WAAW,WAAW,EAAE,SAAS,SAAS,GAAG,GAAG;AAC3D,gBAAU,UAAU,OAAO,6BAA6B;AAAA,IACzD;AAAA,EACD;AAAA,EAEc,kBAAkB;AAC/B,UAAM,YAAY,KAAK,OAAO,aAAa;AAC3C,cAAU,UAAU,IAAI,6BAA6B;AAAA,EACtD;AAAA,EAEA,QAAQ;AACP,SAAK,OAAO,aAAa,EAAE,MAAM;AAAA,EAClC;AAAA,EAEA,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC,GAAG;AACnC,SAAK,OAAO,SAAS;AACrB,QAAI,cAAe,MAAK,OAAO,aAAa,EAAE,KAAK;AAAA,EACpD;AAAA,EAEA,UAAU;AACT,UAAM,OAAO,KAAK,OAAO,qBAAqB,EAAE;AAChD,SAAK,oBAAoB,WAAW,KAAK,aAAa;AACtD,SAAK,oBAAoB,aAAa,KAAK,eAAe;AAC1D,SAAK,4BAA4B;AAAA,EAClC;AACD;AAjCe;AAAA,EAAb;AAAA,GAhDW,aAgDE;AAaA;AAAA,EAAb;AAAA,GA7DW,aA6DE;",
+  "sourcesContent": ["import { bind } from '@tldraw/utils'\nimport type { Editor } from '../../Editor'\n\n/**\n * A manager for ensuring correct focus across the editor.\n * It will listen for changes in the instance state to make sure the\n * container is focused when the editor is focused.\n * Also, it will make sure that the focus is on things like text\n * labels when the editor is in editing mode.\n *\n * @internal\n */\nexport class FocusManager {\n\tprivate disposeSideEffectListener?: () => void\n\n\tconstructor(\n\t\tpublic editor: Editor,\n\t\tautoFocus?: boolean\n\t) {\n\t\tthis.disposeSideEffectListener = editor.sideEffects.registerAfterChangeHandler(\n\t\t\t'instance',\n\t\t\t(prev, next) => {\n\t\t\t\tif (prev.isFocused !== next.isFocused) {\n\t\t\t\t\tthis.updateContainerClass()\n\t\t\t\t}\n\t\t\t}\n\t\t)\n\n\t\tconst currentFocusState = editor.getInstanceState().isFocused\n\t\tif (autoFocus !== currentFocusState) {\n\t\t\teditor.updateInstanceState({ isFocused: !!autoFocus })\n\t\t}\n\t\tthis.updateContainerClass()\n\n\t\tconst body = editor.getContainerDocument().body\n\t\tbody.addEventListener('keydown', this.handleKeyDown)\n\t\tbody.addEventListener('mousedown', this.handleMouseDown)\n\t}\n\n\t/**\n\t * The editor's focus state and the container's focus state\n\t * are not necessarily always in sync. For that reason we\n\t * can't rely on the css `:focus` or `:focus-within` selectors to style the\n\t * editor when it is in focus.\n\t *\n\t * For that reason we synchronize the editor's focus state with a\n\t * special class on the container: tl-container__focused\n\t */\n\tprivate updateContainerClass() {\n\t\tconst container = this.editor.getContainer()\n\t\tconst instanceState = this.editor.getInstanceState()\n\n\t\tif (instanceState.isFocused) {\n\t\t\tcontainer.classList.add('tl-container__focused')\n\t\t} else {\n\t\t\tcontainer.classList.remove('tl-container__focused')\n\t\t}\n\t\tcontainer.classList.add('tl-container__no-focus-ring')\n\t}\n\n\t@bind private handleKeyDown(keyEvent: KeyboardEvent) {\n\t\tconst container = this.editor.getContainer()\n\t\tconst activeEl = container.ownerDocument.activeElement\n\t\t// Edit mode should remove the focus ring, however if the active element's\n\t\t// parent is the contextual toolbar, then allow it.\n\t\tif (this.editor.getEditingShapeId() && !activeEl?.closest('.tlui-contextual-toolbar')) return\n\t\tif (activeEl === container && this.editor.getSelectedShapeIds().length > 0) return\n\t\tif (['Tab', 'ArrowUp', 'ArrowDown'].includes(keyEvent.key)) {\n\t\t\tcontainer.classList.remove('tl-container__no-focus-ring')\n\t\t}\n\t}\n\n\t@bind private handleMouseDown() {\n\t\tconst container = this.editor.getContainer()\n\t\tcontainer.classList.add('tl-container__no-focus-ring')\n\t}\n\n\tfocus() {\n\t\tthis.editor.getContainer().focus()\n\t}\n\n\tblur({ blurContainer = true } = {}) {\n\t\tthis.editor.complete() // stop any interaction\n\t\tif (blurContainer) this.editor.getContainer().blur() // blur the container\n\t}\n\n\tdispose() {\n\t\tconst body = this.editor.getContainerDocument().body\n\t\tbody.removeEventListener('keydown', this.handleKeyDown)\n\t\tbody.removeEventListener('mousedown', this.handleMouseDown)\n\t\tthis.disposeSideEffectListener?.()\n\t}\n}\n"],
+  "mappings": ";;;;;;;;;;AAAA,SAAS,YAAY;AAYd,MAAM,aAAa;AAAA,EAGzB,YACQ,QACP,WACC;AAFM;AAGP,SAAK,4BAA4B,OAAO,YAAY;AAAA,MACnD;AAAA,MACA,CAAC,MAAM,SAAS;AACf,YAAI,KAAK,cAAc,KAAK,WAAW;AACtC,eAAK,qBAAqB;AAAA,QAC3B;AAAA,MACD;AAAA,IACD;AAEA,UAAM,oBAAoB,OAAO,iBAAiB,EAAE;AACpD,QAAI,cAAc,mBAAmB;AACpC,aAAO,oBAAoB,EAAE,WAAW,CAAC,CAAC,UAAU,CAAC;AAAA,IACtD;AACA,SAAK,qBAAqB;AAE1B,UAAM,OAAO,OAAO,qBAAqB,EAAE;AAC3C,SAAK,iBAAiB,WAAW,KAAK,aAAa;AACnD,SAAK,iBAAiB,aAAa,KAAK,eAAe;AAAA,EACxD;AAAA,EArBQ;AAAA,EAHA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAmCA,uBAAuB;AAC9B,UAAM,YAAY,KAAK,OAAO,aAAa;AAC3C,UAAM,gBAAgB,KAAK,OAAO,iBAAiB;AAEnD,QAAI,cAAc,WAAW;AAC5B,gBAAU,UAAU,IAAI,uBAAuB;AAAA,IAChD,OAAO;AACN,gBAAU,UAAU,OAAO,uBAAuB;AAAA,IACnD;AACA,cAAU,UAAU,IAAI,6BAA6B;AAAA,EACtD;AAAA,EAEc,cAAc,UAAyB;AACpD,UAAM,YAAY,KAAK,OAAO,aAAa;AAC3C,UAAM,WAAW,UAAU,cAAc;AAGzC,QAAI,KAAK,OAAO,kBAAkB,KAAK,CAAC,UAAU,QAAQ,0BAA0B,EAAG;AACvF,QAAI,aAAa,aAAa,KAAK,OAAO,oBAAoB,EAAE,SAAS,EAAG;AAC5E,QAAI,CAAC,OAAO,WAAW,WAAW,EAAE,SAAS,SAAS,GAAG,GAAG;AAC3D,gBAAU,UAAU,OAAO,6BAA6B;AAAA,IACzD;AAAA,EACD;AAAA,EAEc,kBAAkB;AAC/B,UAAM,YAAY,KAAK,OAAO,aAAa;AAC3C,cAAU,UAAU,IAAI,6BAA6B;AAAA,EACtD;AAAA,EAEA,QAAQ;AACP,SAAK,OAAO,aAAa,EAAE,MAAM;AAAA,EAClC;AAAA,EAEA,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC,GAAG;AACnC,SAAK,OAAO,SAAS;AACrB,QAAI,cAAe,MAAK,OAAO,aAAa,EAAE,KAAK;AAAA,EACpD;AAAA,EAEA,UAAU;AACT,UAAM,OAAO,KAAK,OAAO,qBAAqB,EAAE;AAChD,SAAK,oBAAoB,WAAW,KAAK,aAAa;AACtD,SAAK,oBAAoB,aAAa,KAAK,eAAe;AAC1D,SAAK,4BAA4B;AAAA,EAClC;AACD;AAhCe;AAAA,EAAb;AAAA,GAhDW,aAgDE;AAYA;AAAA,EAAb;AAAA,GA5DW,aA4DE;",
   "names": []
 }

package/dist-esm/lib/editor/managers/UserPreferencesManager/UserPreferencesManager.mjs

@@ -9,6 +9,7 @@ var __decorateClass = (decorators, target, key, kind) => {
   return result;
 };
 import { atom, computed } from "@tldraw/state";
+import { createUserId } from "@tldraw/tlschema";
 import { defaultUserPreferences } from "../../../config/TLUserPreferences.mjs";
 import { getGlobalWindow } from "../../../utils/dom.mjs";
 class UserPreferencesManager {
@@ -45,7 +46,7 @@ class UserPreferencesManager {
   }
   getUserPreferences() {
     return {
-      id: this.getId(),
+      id: this.getExternalId(),
       name: this.getName(),
       locale: this.getLocale(),
       color: this.getColor(),
@@ -84,9 +85,15 @@ class UserPreferencesManager {
   getAreKeyboardShortcutsEnabled() {
     return this.user.userPreferences.get().areKeyboardShortcutsEnabled ?? defaultUserPreferences.areKeyboardShortcutsEnabled;
   }
-  getId() {
+  getExternalId() {
     return this.user.userPreferences.get().id;
   }
+  getId() {
+    return this.getExternalId();
+  }
+  getRecordId() {
+    return createUserId(this.getExternalId());
+  }
   getName() {
     return this.user.userPreferences.get().name?.trim() ?? defaultUserPreferences.name;
   }
@@ -133,9 +140,15 @@ __decorateClass([
 __decorateClass([
   computed
 ], UserPreferencesManager.prototype, "getAreKeyboardShortcutsEnabled", 1);
+__decorateClass([
+  computed
+], UserPreferencesManager.prototype, "getExternalId", 1);
 __decorateClass([
   computed
 ], UserPreferencesManager.prototype, "getId", 1);
+__decorateClass([
+  computed
+], UserPreferencesManager.prototype, "getRecordId", 1);
 __decorateClass([
   computed
 ], UserPreferencesManager.prototype, "getName", 1);

package/dist-esm/lib/editor/managers/UserPreferencesManager/UserPreferencesManager.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/editor/managers/UserPreferencesManager/UserPreferencesManager.ts"],
-  "sourcesContent": ["import { atom, computed } from '@tldraw/state'\nimport { TLCurrentUser } from '../../../config/createTLCurrentUser'\nimport { TLUserPreferences, defaultUserPreferences } from '../../../config/TLUserPreferences'\nimport { getGlobalWindow } from '../../../utils/dom'\n\n/** @public */\nexport class UserPreferencesManager {\n\tsystemColorScheme = atom<'dark' | 'light'>('systemColorScheme', 'light')\n\tdisposables = new Set<() => void>()\n\tdispose() {\n\t\tthis.disposables.forEach((d) => d())\n\t}\n\tconstructor(\n\t\tprivate readonly user: TLCurrentUser,\n\t\tprivate readonly colorScheme: 'light' | 'dark' | 'system'\n\t) {\n\t\tif (typeof window === 'undefined' || !getGlobalWindow().matchMedia) return\n\n\t\tconst darkModeMediaQuery = getGlobalWindow().matchMedia('(prefers-color-scheme: dark)')\n\t\tif (darkModeMediaQuery?.matches) {\n\t\t\tthis.systemColorScheme.set('dark')\n\t\t}\n\t\tconst handleChange = (e: MediaQueryListEvent) => {\n\t\t\tif (e.matches) {\n\t\t\t\tthis.systemColorScheme.set('dark')\n\t\t\t} else {\n\t\t\t\tthis.systemColorScheme.set('light')\n\t\t\t}\n\t\t}\n\t\tdarkModeMediaQuery?.addEventListener('change', handleChange)\n\t\tthis.disposables.add(() => darkModeMediaQuery?.removeEventListener('change', handleChange))\n\t}\n\n\tupdateUserPreferences(userPreferences: Partial<TLUserPreferences>) {\n\t\tthis.user.setUserPreferences({\n\t\t\t...this.user.userPreferences.get(),\n\t\t\t...userPreferences,\n\t\t})\n\t}\n\t@computed getUserPreferences() {\n\t\treturn {\n\t\t\tid: this.getId(),\n\t\t\tname: this.getName(),\n\t\t\tlocale: this.getLocale(),\n\t\t\tcolor: this.getColor(),\n\t\t\tanimationSpeed: this.getAnimationSpeed(),\n\t\t\tareKeyboardShortcutsEnabled: this.getAreKeyboardShortcutsEnabled(),\n\t\t\tisSnapMode: this.getIsSnapMode(),\n\t\t\tcolorScheme: this.user.userPreferences.get().colorScheme,\n\t\t\tisDarkMode: this.getIsDarkMode(),\n\t\t\tisWrapMode: this.getIsWrapMode(),\n\t\t\tisDynamicResizeMode: this.getIsDynamicResizeMode(),\n\t\t\tenhancedA11yMode: this.getEnhancedA11yMode(),\n\t\t\tinputMode: this.getInputMode(),\n\t\t\tisZoomDirectionInverted: this.getIsZoomDirectionInverted(),\n\t\t}\n\t}\n\n\t@computed getIsDarkMode() {\n\t\tconst userColorScheme = this.user.userPreferences.get().colorScheme\n\t\tconst scheme = userColorScheme ?? this.colorScheme\n\t\tswitch (scheme) {\n\t\t\tcase 'dark':\n\t\t\t\treturn true\n\t\t\tcase 'light':\n\t\t\t\treturn false\n\t\t\tcase 'system':\n\t\t\t\treturn this.systemColorScheme.get() === 'dark'\n\t\t\tdefault:\n\t\t\t\treturn false\n\t\t}\n\t}\n\n\t/**\n\t * The speed at which the user can scroll by dragging toward the edge of the screen.\n\t */\n\t@computed getEdgeScrollSpeed() {\n\t\treturn this.user.userPreferences.get().edgeScrollSpeed ?? defaultUserPreferences.edgeScrollSpeed\n\t}\n\n\t@computed getAnimationSpeed() {\n\t\treturn this.user.userPreferences.get().animationSpeed ?? defaultUserPreferences.animationSpeed\n\t}\n\n\t@computed getAreKeyboardShortcutsEnabled() {\n\t\treturn (\n\t\t\tthis.user.userPreferences.get().areKeyboardShortcutsEnabled ??\n\t\t\tdefaultUserPreferences.areKeyboardShortcutsEnabled\n\t\t)\n\t}\n\n\t@computed getId() {\n\t\treturn this.user.userPreferences.get().id\n\t}\n\n\t@computed getName() {\n\t\treturn this.user.userPreferences.get().name?.trim() ?? defaultUserPreferences.name\n\t}\n\n\t@computed getLocale() {\n\t\treturn this.user.userPreferences.get().locale ?? defaultUserPreferences.locale\n\t}\n\n\t@computed getColor() {\n\t\treturn this.user.userPreferences.get().color ?? defaultUserPreferences.color\n\t}\n\n\t@computed getIsSnapMode() {\n\t\treturn this.user.userPreferences.get().isSnapMode ?? defaultUserPreferences.isSnapMode\n\t}\n\n\t@computed getIsWrapMode() {\n\t\treturn this.user.userPreferences.get().isWrapMode ?? defaultUserPreferences.isWrapMode\n\t}\n\n\t@computed getIsDynamicResizeMode() {\n\t\treturn (\n\t\t\tthis.user.userPreferences.get().isDynamicSizeMode ?? defaultUserPreferences.isDynamicSizeMode\n\t\t)\n\t}\n\n\t@computed getIsPasteAtCursorMode() {\n\t\treturn (\n\t\t\tthis.user.userPreferences.get().isPasteAtCursorMode ??\n\t\t\tdefaultUserPreferences.isPasteAtCursorMode\n\t\t)\n\t}\n\n\t@computed getEnhancedA11yMode() {\n\t\treturn (\n\t\t\tthis.user.userPreferences.get().enhancedA11yMode ?? defaultUserPreferences.enhancedA11yMode\n\t\t)\n\t}\n\n\t@computed getInputMode() {\n\t\treturn this.user.userPreferences.get().inputMode ?? defaultUserPreferences.inputMode\n\t}\n\n\t@computed getIsZoomDirectionInverted() {\n\t\treturn (\n\t\t\tthis.user.userPreferences.get().isZoomDirectionInverted ??\n\t\t\tdefaultUserPreferences.isZoomDirectionInverted\n\t\t)\n\t}\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { atom, computed } from '@tldraw/state'\nimport { createUserId, TLUserId } from '@tldraw/tlschema'\nimport { TLCurrentUser } from '../../../config/createTLCurrentUser'\nimport { TLUserPreferences, defaultUserPreferences } from '../../../config/TLUserPreferences'\nimport { getGlobalWindow } from '../../../utils/dom'\n\n/** @public */\nexport class UserPreferencesManager {\n\tsystemColorScheme = atom<'dark' | 'light'>('systemColorScheme', 'light')\n\tdisposables = new Set<() => void>()\n\tdispose() {\n\t\tthis.disposables.forEach((d) => d())\n\t}\n\tconstructor(\n\t\tprivate readonly user: TLCurrentUser,\n\t\tprivate readonly colorScheme: 'light' | 'dark' | 'system'\n\t) {\n\t\tif (typeof window === 'undefined' || !getGlobalWindow().matchMedia) return\n\n\t\tconst darkModeMediaQuery = getGlobalWindow().matchMedia('(prefers-color-scheme: dark)')\n\t\tif (darkModeMediaQuery?.matches) {\n\t\t\tthis.systemColorScheme.set('dark')\n\t\t}\n\t\tconst handleChange = (e: MediaQueryListEvent) => {\n\t\t\tif (e.matches) {\n\t\t\t\tthis.systemColorScheme.set('dark')\n\t\t\t} else {\n\t\t\t\tthis.systemColorScheme.set('light')\n\t\t\t}\n\t\t}\n\t\tdarkModeMediaQuery?.addEventListener('change', handleChange)\n\t\tthis.disposables.add(() => darkModeMediaQuery?.removeEventListener('change', handleChange))\n\t}\n\n\tupdateUserPreferences(userPreferences: Partial<TLUserPreferences>) {\n\t\tthis.user.setUserPreferences({\n\t\t\t...this.user.userPreferences.get(),\n\t\t\t...userPreferences,\n\t\t})\n\t}\n\t@computed getUserPreferences() {\n\t\treturn {\n\t\t\tid: this.getExternalId(),\n\t\t\tname: this.getName(),\n\t\t\tlocale: this.getLocale(),\n\t\t\tcolor: this.getColor(),\n\t\t\tanimationSpeed: this.getAnimationSpeed(),\n\t\t\tareKeyboardShortcutsEnabled: this.getAreKeyboardShortcutsEnabled(),\n\t\t\tisSnapMode: this.getIsSnapMode(),\n\t\t\tcolorScheme: this.user.userPreferences.get().colorScheme,\n\t\t\tisDarkMode: this.getIsDarkMode(),\n\t\t\tisWrapMode: this.getIsWrapMode(),\n\t\t\tisDynamicResizeMode: this.getIsDynamicResizeMode(),\n\t\t\tenhancedA11yMode: this.getEnhancedA11yMode(),\n\t\t\tinputMode: this.getInputMode(),\n\t\t\tisZoomDirectionInverted: this.getIsZoomDirectionInverted(),\n\t\t}\n\t}\n\n\t@computed getIsDarkMode() {\n\t\tconst userColorScheme = this.user.userPreferences.get().colorScheme\n\t\tconst scheme = userColorScheme ?? this.colorScheme\n\t\tswitch (scheme) {\n\t\t\tcase 'dark':\n\t\t\t\treturn true\n\t\t\tcase 'light':\n\t\t\t\treturn false\n\t\t\tcase 'system':\n\t\t\t\treturn this.systemColorScheme.get() === 'dark'\n\t\t\tdefault:\n\t\t\t\treturn false\n\t\t}\n\t}\n\n\t/**\n\t * The speed at which the user can scroll by dragging toward the edge of the screen.\n\t */\n\t@computed getEdgeScrollSpeed() {\n\t\treturn this.user.userPreferences.get().edgeScrollSpeed ?? defaultUserPreferences.edgeScrollSpeed\n\t}\n\n\t@computed getAnimationSpeed() {\n\t\treturn this.user.userPreferences.get().animationSpeed ?? defaultUserPreferences.animationSpeed\n\t}\n\n\t@computed getAreKeyboardShortcutsEnabled() {\n\t\treturn (\n\t\t\tthis.user.userPreferences.get().areKeyboardShortcutsEnabled ??\n\t\t\tdefaultUserPreferences.areKeyboardShortcutsEnabled\n\t\t)\n\t}\n\n\t/**\n\t * The current user's raw, app-provided id \u2014 the value set in the user's\n\t * {@link @tldraw/editor#TLUserPreferences}. Use this when you need the id your application\n\t * assigned to the user. To compare against or look up store records, use\n\t * {@link UserPreferencesManager.getRecordId} instead.\n\t */\n\t@computed getExternalId(): string {\n\t\treturn this.user.userPreferences.get().id\n\t}\n\n\t/**\n\t * @deprecated Use {@link UserPreferencesManager.getExternalId} for the raw app-provided id, or\n\t * {@link UserPreferencesManager.getRecordId} for the prefixed `TLUserId` record id.\n\t */\n\t@computed getId() {\n\t\treturn this.getExternalId()\n\t}\n\n\t/**\n\t * The current user's id as a tldraw {@link @tldraw/tlschema#TLUserId} record id (prefixed\n\t * with `user:`). Use this when comparing against or looking up store records, such as a\n\t * presence record's `userId` or `followingUserId`. For the raw, app-provided id, use\n\t * {@link UserPreferencesManager.getExternalId}.\n\t */\n\t@computed getRecordId(): TLUserId {\n\t\treturn createUserId(this.getExternalId())\n\t}\n\n\t@computed getName() {\n\t\treturn this.user.userPreferences.get().name?.trim() ?? defaultUserPreferences.name\n\t}\n\n\t@computed getLocale() {\n\t\treturn this.user.userPreferences.get().locale ?? defaultUserPreferences.locale\n\t}\n\n\t@computed getColor() {\n\t\treturn this.user.userPreferences.get().color ?? defaultUserPreferences.color\n\t}\n\n\t@computed getIsSnapMode() {\n\t\treturn this.user.userPreferences.get().isSnapMode ?? defaultUserPreferences.isSnapMode\n\t}\n\n\t@computed getIsWrapMode() {\n\t\treturn this.user.userPreferences.get().isWrapMode ?? defaultUserPreferences.isWrapMode\n\t}\n\n\t@computed getIsDynamicResizeMode() {\n\t\treturn (\n\t\t\tthis.user.userPreferences.get().isDynamicSizeMode ?? defaultUserPreferences.isDynamicSizeMode\n\t\t)\n\t}\n\n\t@computed getIsPasteAtCursorMode() {\n\t\treturn (\n\t\t\tthis.user.userPreferences.get().isPasteAtCursorMode ??\n\t\t\tdefaultUserPreferences.isPasteAtCursorMode\n\t\t)\n\t}\n\n\t@computed getEnhancedA11yMode() {\n\t\treturn (\n\t\t\tthis.user.userPreferences.get().enhancedA11yMode ?? defaultUserPreferences.enhancedA11yMode\n\t\t)\n\t}\n\n\t@computed getInputMode() {\n\t\treturn this.user.userPreferences.get().inputMode ?? defaultUserPreferences.inputMode\n\t}\n\n\t@computed getIsZoomDirectionInverted() {\n\t\treturn (\n\t\t\tthis.user.userPreferences.get().isZoomDirectionInverted ??\n\t\t\tdefaultUserPreferences.isZoomDirectionInverted\n\t\t)\n\t}\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist-esm/lib/editor/overlays/strokeShapeIndicators.mjs

@@ -0,0 +1,59 @@
+import { createComputedCache } from "@tldraw/store";
+const indicatorPathCache = createComputedCache(
+  "shapeIndicatorPath",
+  (editor, shape) => {
+    const util = editor.getShapeUtil(shape);
+    return util.getIndicatorPath(shape);
+  },
+  {
+    areRecordsEqual(a, b) {
+      return a.props === b.props;
+    }
+  }
+);
+function strokeShapeIndicators(editor, ctx, shapeIds) {
+  if (shapeIds.length === 0) return;
+  const batched = new Path2D();
+  for (const shapeId of shapeIds) {
+    const shape = editor.getShape(shapeId);
+    if (!shape || shape.isLocked) continue;
+    const pageTransform = editor.getShapePageTransform(shape);
+    if (!pageTransform) continue;
+    const indicatorPath = indicatorPathCache.get(editor, shape.id);
+    if (!indicatorPath) continue;
+    if (indicatorPath instanceof Path2D) {
+      batched.addPath(indicatorPath, pageTransform);
+      continue;
+    }
+    const { path, clipPath, additionalPaths } = indicatorPath;
+    if (!clipPath) {
+      batched.addPath(path, pageTransform);
+      if (additionalPaths) {
+        for (const p of additionalPaths) batched.addPath(p, pageTransform);
+      }
+      continue;
+    }
+    ctx.save();
+    ctx.transform(
+      pageTransform.a,
+      pageTransform.b,
+      pageTransform.c,
+      pageTransform.d,
+      pageTransform.e,
+      pageTransform.f
+    );
+    ctx.save();
+    ctx.clip(clipPath, "evenodd");
+    ctx.stroke(path);
+    ctx.restore();
+    if (additionalPaths) {
+      for (const p of additionalPaths) ctx.stroke(p);
+    }
+    ctx.restore();
+  }
+  ctx.stroke(batched);
+}
+export {
+  strokeShapeIndicators
+};
+//# sourceMappingURL=strokeShapeIndicators.mjs.map

package/dist-esm/lib/editor/overlays/strokeShapeIndicators.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/lib/editor/overlays/strokeShapeIndicators.ts"],
+  "sourcesContent": ["import { createComputedCache } from '@tldraw/store'\nimport { TLShape, TLShapeId } from '@tldraw/tlschema'\nimport type { Editor } from '../Editor'\n\nconst indicatorPathCache = createComputedCache(\n\t'shapeIndicatorPath',\n\t(editor: Editor, shape: TLShape) => {\n\t\tconst util = editor.getShapeUtil(shape)\n\t\treturn util.getIndicatorPath(shape)\n\t},\n\t{\n\t\tareRecordsEqual(a, b) {\n\t\t\treturn a.props === b.props\n\t\t},\n\t}\n)\n\n/**\n * Combine every batchable shape indicator into a single page-space `Path2D` and\n * emit one stroke call. Shapes whose indicator needs an evenodd clip (e.g.\n * arrows with labels or complex arrowheads) can't be batched \u2014 they still\n * stroke individually inside a save/restore with `ctx.clip` applied.\n *\n * Shared by any overlay util that paints shape indicators (e.g. collaborator\n * selections).\n *\n * @public\n */\nexport function strokeShapeIndicators(\n\teditor: Editor,\n\tctx: CanvasRenderingContext2D,\n\tshapeIds: TLShapeId[]\n): void {\n\tif (shapeIds.length === 0) return\n\n\tconst batched = new Path2D()\n\n\tfor (const shapeId of shapeIds) {\n\t\tconst shape = editor.getShape(shapeId)\n\t\tif (!shape || shape.isLocked) continue\n\n\t\tconst pageTransform = editor.getShapePageTransform(shape)\n\t\tif (!pageTransform) continue\n\n\t\tconst indicatorPath = indicatorPathCache.get(editor, shape.id)\n\t\tif (!indicatorPath) continue\n\n\t\tif (indicatorPath instanceof Path2D) {\n\t\t\tbatched.addPath(indicatorPath, pageTransform)\n\t\t\tcontinue\n\t\t}\n\n\t\tconst { path, clipPath, additionalPaths } = indicatorPath\n\n\t\tif (!clipPath) {\n\t\t\tbatched.addPath(path, pageTransform)\n\t\t\tif (additionalPaths) {\n\t\t\t\tfor (const p of additionalPaths) batched.addPath(p, pageTransform)\n\t\t\t}\n\t\t\tcontinue\n\t\t}\n\n\t\t// Clipped case: fall back to an individual stroke. Rare (arrows with\n\t\t// labels / complex arrowheads), so the extra save/restore/stroke\n\t\t// pair per such shape isn't worth batching away.\n\t\tctx.save()\n\t\tctx.transform(\n\t\t\tpageTransform.a,\n\t\t\tpageTransform.b,\n\t\t\tpageTransform.c,\n\t\t\tpageTransform.d,\n\t\t\tpageTransform.e,\n\t\t\tpageTransform.f\n\t\t)\n\t\tctx.save()\n\t\tctx.clip(clipPath, 'evenodd')\n\t\tctx.stroke(path)\n\t\tctx.restore()\n\t\tif (additionalPaths) {\n\t\t\tfor (const p of additionalPaths) ctx.stroke(p)\n\t\t}\n\t\tctx.restore()\n\t}\n\n\tctx.stroke(batched)\n}\n"],
+  "mappings": "AAAA,SAAS,2BAA2B;AAIpC,MAAM,qBAAqB;AAAA,EAC1B;AAAA,EACA,CAAC,QAAgB,UAAmB;AACnC,UAAM,OAAO,OAAO,aAAa,KAAK;AACtC,WAAO,KAAK,iBAAiB,KAAK;AAAA,EACnC;AAAA,EACA;AAAA,IACC,gBAAgB,GAAG,GAAG;AACrB,aAAO,EAAE,UAAU,EAAE;AAAA,IACtB;AAAA,EACD;AACD;AAaO,SAAS,sBACf,QACA,KACA,UACO;AACP,MAAI,SAAS,WAAW,EAAG;AAE3B,QAAM,UAAU,IAAI,OAAO;AAE3B,aAAW,WAAW,UAAU;AAC/B,UAAM,QAAQ,OAAO,SAAS,OAAO;AACrC,QAAI,CAAC,SAAS,MAAM,SAAU;AAE9B,UAAM,gBAAgB,OAAO,sBAAsB,KAAK;AACxD,QAAI,CAAC,cAAe;AAEpB,UAAM,gBAAgB,mBAAmB,IAAI,QAAQ,MAAM,EAAE;AAC7D,QAAI,CAAC,cAAe;AAEpB,QAAI,yBAAyB,QAAQ;AACpC,cAAQ,QAAQ,eAAe,aAAa;AAC5C;AAAA,IACD;AAEA,UAAM,EAAE,MAAM,UAAU,gBAAgB,IAAI;AAE5C,QAAI,CAAC,UAAU;AACd,cAAQ,QAAQ,MAAM,aAAa;AACnC,UAAI,iBAAiB;AACpB,mBAAW,KAAK,gBAAiB,SAAQ,QAAQ,GAAG,aAAa;AAAA,MAClE;AACA;AAAA,IACD;AAKA,QAAI,KAAK;AACT,QAAI;AAAA,MACH,cAAc;AAAA,MACd,cAAc;AAAA,MACd,cAAc;AAAA,MACd,cAAc;AAAA,MACd,cAAc;AAAA,MACd,cAAc;AAAA,IACf;AACA,QAAI,KAAK;AACT,QAAI,KAAK,UAAU,SAAS;AAC5B,QAAI,OAAO,IAAI;AACf,QAAI,QAAQ;AACZ,QAAI,iBAAiB;AACpB,iBAAW,KAAK,gBAAiB,KAAI,OAAO,CAAC;AAAA,IAC9C;AACA,QAAI,QAAQ;AAAA,EACb;AAEA,MAAI,OAAO,OAAO;AACnB;",
+  "names": []
+}