@tldraw/editor 5.6.0-canary.e9e8ec003426 → 5.6.0-canary.f2082e9fe322
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist-cjs/index.js +1 -1
- package/dist-cjs/lib/components/LiveCollaborators.js +3 -3
- package/dist-cjs/lib/components/LiveCollaborators.js.map +2 -2
- package/dist-cjs/version.js +3 -3
- package/dist-cjs/version.js.map +1 -1
- package/dist-esm/index.mjs +1 -1
- package/dist-esm/lib/components/LiveCollaborators.mjs +3 -3
- package/dist-esm/lib/components/LiveCollaborators.mjs.map +2 -2
- package/dist-esm/version.mjs +3 -3
- package/dist-esm/version.mjs.map +1 -1
- package/editor.css +2 -1
- package/package.json +7 -7
- package/src/lib/components/LiveCollaborators.tsx +3 -3
- package/src/version.ts +3 -3
package/dist-cjs/index.js
CHANGED
|
@@ -392,7 +392,7 @@ var import_uniq = require("./lib/utils/uniq");
|
|
|
392
392
|
var import_defaultThemes2 = require("./lib/editor/managers/ThemeManager/defaultThemes");
|
|
393
393
|
(0, import_utils.registerTldrawLibraryVersion)(
|
|
394
394
|
"@tldraw/editor",
|
|
395
|
-
"5.6.0-canary.
|
|
395
|
+
"5.6.0-canary.f2082e9fe322",
|
|
396
396
|
"cjs"
|
|
397
397
|
);
|
|
398
398
|
//# sourceMappingURL=index.js.map
|
|
@@ -85,15 +85,15 @@ const Collaborator = (0, import_state_react.track)(function Collaborator2({
|
|
|
85
85
|
});
|
|
86
86
|
function CursorDef() {
|
|
87
87
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { id: (0, import_useSafeId.useSharedSafeId)("cursor"), children: [
|
|
88
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { fill: "rgba(0,0,0,.2)", transform: "translate(-11,-
|
|
88
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { fill: "rgba(0,0,0,.2)", transform: "translate(-11,-9)", children: [
|
|
89
89
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m12 24.4219v-16.015l11.591 11.619h-6.781l-.411.124z" }),
|
|
90
90
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m21.0845 25.0962-3.605 1.535-4.682-11.089 3.686-1.553z" })
|
|
91
91
|
] }),
|
|
92
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { fill: "white", transform: "translate(-12,-
|
|
92
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { fill: "white", transform: "translate(-12,-10)", children: [
|
|
93
93
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m12 24.4219v-16.015l11.591 11.619h-6.781l-.411.124z" }),
|
|
94
94
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m21.0845 25.0962-3.605 1.535-4.682-11.089 3.686-1.553z" })
|
|
95
95
|
] }),
|
|
96
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { fill: "currentColor", transform: "translate(-12,-
|
|
96
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { fill: "currentColor", transform: "translate(-12,-10)", children: [
|
|
97
97
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m19.751 24.4155-1.844.774-3.1-7.374 1.841-.775z" }),
|
|
98
98
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m13 10.814v11.188l2.969-2.866.428-.139h4.768z" })
|
|
99
99
|
] })
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/lib/components/LiveCollaborators.tsx"],
|
|
4
|
-
"sourcesContent": ["import { track, useQuickReactor, useValue } from '@tldraw/state-react'\nimport { TLInstancePresence } from '@tldraw/tlschema'\nimport { useLayoutEffect, useRef } from 'react'\nimport { useEditorComponents } from '../hooks/EditorComponentsContext'\nimport { useEditor } from '../hooks/useEditor'\nimport { useSharedSafeId } from '../hooks/useSafeId'\nimport { isCursorInViewport } from '../utils/collaborators'\nimport { setStyleProperty } from '../utils/dom'\nimport { getHtmlLayerTransform } from '../utils/getHtmlLayerTransform'\n\n/**\n * The collaborator cursor layer: a DOM layer stacked as a sibling of the canvas \u2014 above all canvas\n * content, below the in-front layer and the UI panels \u2014 hosting each visible collaborator's cursor\n * (arrow, name tag, chat message). Off-viewport collaborators are the canvas-drawn hint arrows' job\n * (CollaboratorHintOverlayUtil), not this layer's.\n *\n * Cursors are DOM rather than canvas-drawn so their chrome styles and composes like the rest of\n * the UI. Re-render traffic is kept narrow: per-cursor positioning writes `transform` directly\n * (see `useTransform`), so a pointer move re-renders only the moved cursor; the camera transform\n * is written imperatively below, so a pure pan re-renders only cursors whose viewport visibility\n * flips (an equality-gated boolean per cursor); a zoom change re-renders every visible cursor,\n * because each one rescales by `1/zoom`.\n *\n * @public @react\n */\nexport const LiveCollaborators = track(function LiveCollaborators() {\n\tconst editor = useEditor()\n\tconst { CollaboratorCursor } = useEditorComponents()\n\n\t// The inner layer carries the camera transform, so the cursor components position in page\n\t// space exactly as canvas content does. Unlike the canvas's html layers this one unmounts\n\t// while no collaborators are visible, so the transform is written at two moments: on every\n\t// camera change (the reactor), and after every render (the layout effect, like useTransform\n\t// does per cursor) \u2014 the reactor's last run hit a null ref while the layer was unmounted,\n\t// and without the render-time write a reappearing layer would keep an identity transform\n\t// until the next camera move.\n\tconst rHtmlLayer = useRef<HTMLDivElement | null>(null)\n\tuseLayoutEffect(() => {\n\t\tconst elm = rHtmlLayer.current\n\t\tif (!elm) return\n\t\tsetStyleProperty(elm, 'transform', getHtmlLayerTransform(editor))\n\t})\n\tuseQuickReactor(\n\t\t'position collaborators layer',\n\t\tfunction positionCollaboratorsWhenCameraMoves() {\n\t\t\t// Reads the camera even while the layer is unmounted, keeping the subscription alive.\n\t\t\tconst transform = getHtmlLayerTransform(editor)\n\t\t\tsetStyleProperty(rHtmlLayer.current, 'transform', transform)\n\t\t},\n\t\t[editor]\n\t)\n\n\t// Visibility (activity state, following, highlighting) is handled by the editor.\n\tconst collaborators = editor.getVisibleCollaboratorsOnCurrentPage()\n\tif (collaborators.length === 0) return null\n\tif (!CollaboratorCursor) return null\n\n\treturn (\n\t\t<div className=\"tl-collaborators\">\n\t\t\t<svg className=\"tl-svg-context\" aria-hidden=\"true\">\n\t\t\t\t<defs>\n\t\t\t\t\t<CursorDef />\n\t\t\t\t</defs>\n\t\t\t</svg>\n\t\t\t<div ref={rHtmlLayer} className=\"tl-html-layer\">\n\t\t\t\t{collaborators.map((presence) => (\n\t\t\t\t\t<Collaborator key={presence.userId} latestPresence={presence} />\n\t\t\t\t))}\n\t\t\t</div>\n\t\t</div>\n\t)\n})\n\nconst Collaborator = track(function Collaborator({\n\tlatestPresence,\n}: {\n\tlatestPresence: TLInstancePresence\n}) {\n\tconst editor = useEditor()\n\tconst { CollaboratorCursor } = useEditorComponents()\n\n\tconst { userId, chatMessage, userName, cursor, color } = latestPresence\n\n\t// The viewport read lives inside this equality-gated computed rather than the tracked render:\n\t// pans move the viewport every frame, but this component only needs to know when the cursor\n\t// crosses the edge, so it subscribes to the boolean and re-renders only when it flips.\n\tconst cursorInViewport = useValue(\n\t\t'cursor in viewport',\n\t\t() =>\n\t\t\t!!cursor && isCursorInViewport(cursor, editor.getViewportPageBounds(), editor.getZoomLevel()),\n\t\t[editor, cursor]\n\t)\n\t// The zoom read is tracked directly: the cursor scales by 1/zoom, so zoom changes must\n\t// re-render it. Pure pans leave the zoom value unchanged, so they never invalidate this.\n\tconst zoomLevel = editor.getZoomLevel()\n\n\tif (!cursor) return null\n\n\t// Off-viewport collaborators show as the canvas-drawn hint arrows\n\t// (CollaboratorHintOverlayUtil), which shares this predicate \u2014 only the cursor itself is DOM.\n\tif (!cursorInViewport) return null\n\tif (!CollaboratorCursor) return null\n\treturn (\n\t\t<CollaboratorCursor\n\t\t\tclassName=\"tl-collaborator__cursor\"\n\t\t\tuserId={userId}\n\t\t\tpoint={cursor}\n\t\t\tcolor={color}\n\t\t\tzoom={zoomLevel}\n\t\t\tname={userName !== 'New User' ? userName : null}\n\t\t\tchatMessage={chatMessage ?? ''}\n\t\t/>\n\t)\n})\n\nfunction CursorDef() {\n\treturn (\n\t\t<g id={useSharedSafeId('cursor')}>\n\t\t\t<g fill=\"rgba(0,0,0,.2)\" transform=\"translate(-11,-
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA0DE;AA1DF,yBAAiD;AAEjD,mBAAwC;AACxC,qCAAoC;AACpC,uBAA0B;AAC1B,uBAAgC;AAChC,2BAAmC;AACnC,iBAAiC;AACjC,mCAAsC;AAiB/B,MAAM,wBAAoB,0BAAM,SAASA,qBAAoB;AACnE,QAAM,aAAS,4BAAU;AACzB,QAAM,EAAE,mBAAmB,QAAI,oDAAoB;AASnD,QAAM,iBAAa,qBAA8B,IAAI;AACrD,oCAAgB,MAAM;AACrB,UAAM,MAAM,WAAW;AACvB,QAAI,CAAC,IAAK;AACV,qCAAiB,KAAK,iBAAa,oDAAsB,MAAM,CAAC;AAAA,EACjE,CAAC;AACD;AAAA,IACC;AAAA,IACA,SAAS,uCAAuC;AAE/C,YAAM,gBAAY,oDAAsB,MAAM;AAC9C,uCAAiB,WAAW,SAAS,aAAa,SAAS;AAAA,IAC5D;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AAGA,QAAM,gBAAgB,OAAO,qCAAqC;AAClE,MAAI,cAAc,WAAW,EAAG,QAAO;AACvC,MAAI,CAAC,mBAAoB,QAAO;AAEhC,SACC,6CAAC,SAAI,WAAU,oBACd;AAAA,gDAAC,SAAI,WAAU,kBAAiB,eAAY,QAC3C,sDAAC,UACA,sDAAC,aAAU,GACZ,GACD;AAAA,IACA,4CAAC,SAAI,KAAK,YAAY,WAAU,iBAC9B,wBAAc,IAAI,CAAC,aACnB,4CAAC,gBAAmC,gBAAgB,YAAjC,SAAS,MAAkC,CAC9D,GACF;AAAA,KACD;AAEF,CAAC;AAED,MAAM,mBAAe,0BAAM,SAASC,cAAa;AAAA,EAChD;AACD,GAEG;AACF,QAAM,aAAS,4BAAU;AACzB,QAAM,EAAE,mBAAmB,QAAI,oDAAoB;AAEnD,QAAM,EAAE,QAAQ,aAAa,UAAU,QAAQ,MAAM,IAAI;AAKzD,QAAM,uBAAmB;AAAA,IACxB;AAAA,IACA,MACC,CAAC,CAAC,cAAU,yCAAmB,QAAQ,OAAO,sBAAsB,GAAG,OAAO,aAAa,CAAC;AAAA,IAC7F,CAAC,QAAQ,MAAM;AAAA,EAChB;AAGA,QAAM,YAAY,OAAO,aAAa;AAEtC,MAAI,CAAC,OAAQ,QAAO;AAIpB,MAAI,CAAC,iBAAkB,QAAO;AAC9B,MAAI,CAAC,mBAAoB,QAAO;AAChC,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA,MAAM;AAAA,MACN,MAAM,aAAa,aAAa,WAAW;AAAA,MAC3C,aAAa,eAAe;AAAA;AAAA,EAC7B;AAEF,CAAC;AAED,SAAS,YAAY;AACpB,SACC,6CAAC,OAAE,QAAI,kCAAgB,QAAQ,GAC9B;AAAA,iDAAC,OAAE,MAAK,kBAAiB,WAAU,
|
|
4
|
+
"sourcesContent": ["import { track, useQuickReactor, useValue } from '@tldraw/state-react'\nimport { TLInstancePresence } from '@tldraw/tlschema'\nimport { useLayoutEffect, useRef } from 'react'\nimport { useEditorComponents } from '../hooks/EditorComponentsContext'\nimport { useEditor } from '../hooks/useEditor'\nimport { useSharedSafeId } from '../hooks/useSafeId'\nimport { isCursorInViewport } from '../utils/collaborators'\nimport { setStyleProperty } from '../utils/dom'\nimport { getHtmlLayerTransform } from '../utils/getHtmlLayerTransform'\n\n/**\n * The collaborator cursor layer: a DOM layer stacked as a sibling of the canvas \u2014 above all canvas\n * content, below the in-front layer and the UI panels \u2014 hosting each visible collaborator's cursor\n * (arrow, name tag, chat message). Off-viewport collaborators are the canvas-drawn hint arrows' job\n * (CollaboratorHintOverlayUtil), not this layer's.\n *\n * Cursors are DOM rather than canvas-drawn so their chrome styles and composes like the rest of\n * the UI. Re-render traffic is kept narrow: per-cursor positioning writes `transform` directly\n * (see `useTransform`), so a pointer move re-renders only the moved cursor; the camera transform\n * is written imperatively below, so a pure pan re-renders only cursors whose viewport visibility\n * flips (an equality-gated boolean per cursor); a zoom change re-renders every visible cursor,\n * because each one rescales by `1/zoom`.\n *\n * @public @react\n */\nexport const LiveCollaborators = track(function LiveCollaborators() {\n\tconst editor = useEditor()\n\tconst { CollaboratorCursor } = useEditorComponents()\n\n\t// The inner layer carries the camera transform, so the cursor components position in page\n\t// space exactly as canvas content does. Unlike the canvas's html layers this one unmounts\n\t// while no collaborators are visible, so the transform is written at two moments: on every\n\t// camera change (the reactor), and after every render (the layout effect, like useTransform\n\t// does per cursor) \u2014 the reactor's last run hit a null ref while the layer was unmounted,\n\t// and without the render-time write a reappearing layer would keep an identity transform\n\t// until the next camera move.\n\tconst rHtmlLayer = useRef<HTMLDivElement | null>(null)\n\tuseLayoutEffect(() => {\n\t\tconst elm = rHtmlLayer.current\n\t\tif (!elm) return\n\t\tsetStyleProperty(elm, 'transform', getHtmlLayerTransform(editor))\n\t})\n\tuseQuickReactor(\n\t\t'position collaborators layer',\n\t\tfunction positionCollaboratorsWhenCameraMoves() {\n\t\t\t// Reads the camera even while the layer is unmounted, keeping the subscription alive.\n\t\t\tconst transform = getHtmlLayerTransform(editor)\n\t\t\tsetStyleProperty(rHtmlLayer.current, 'transform', transform)\n\t\t},\n\t\t[editor]\n\t)\n\n\t// Visibility (activity state, following, highlighting) is handled by the editor.\n\tconst collaborators = editor.getVisibleCollaboratorsOnCurrentPage()\n\tif (collaborators.length === 0) return null\n\tif (!CollaboratorCursor) return null\n\n\treturn (\n\t\t<div className=\"tl-collaborators\">\n\t\t\t<svg className=\"tl-svg-context\" aria-hidden=\"true\">\n\t\t\t\t<defs>\n\t\t\t\t\t<CursorDef />\n\t\t\t\t</defs>\n\t\t\t</svg>\n\t\t\t<div ref={rHtmlLayer} className=\"tl-html-layer\">\n\t\t\t\t{collaborators.map((presence) => (\n\t\t\t\t\t<Collaborator key={presence.userId} latestPresence={presence} />\n\t\t\t\t))}\n\t\t\t</div>\n\t\t</div>\n\t)\n})\n\nconst Collaborator = track(function Collaborator({\n\tlatestPresence,\n}: {\n\tlatestPresence: TLInstancePresence\n}) {\n\tconst editor = useEditor()\n\tconst { CollaboratorCursor } = useEditorComponents()\n\n\tconst { userId, chatMessage, userName, cursor, color } = latestPresence\n\n\t// The viewport read lives inside this equality-gated computed rather than the tracked render:\n\t// pans move the viewport every frame, but this component only needs to know when the cursor\n\t// crosses the edge, so it subscribes to the boolean and re-renders only when it flips.\n\tconst cursorInViewport = useValue(\n\t\t'cursor in viewport',\n\t\t() =>\n\t\t\t!!cursor && isCursorInViewport(cursor, editor.getViewportPageBounds(), editor.getZoomLevel()),\n\t\t[editor, cursor]\n\t)\n\t// The zoom read is tracked directly: the cursor scales by 1/zoom, so zoom changes must\n\t// re-render it. Pure pans leave the zoom value unchanged, so they never invalidate this.\n\tconst zoomLevel = editor.getZoomLevel()\n\n\tif (!cursor) return null\n\n\t// Off-viewport collaborators show as the canvas-drawn hint arrows\n\t// (CollaboratorHintOverlayUtil), which shares this predicate \u2014 only the cursor itself is DOM.\n\tif (!cursorInViewport) return null\n\tif (!CollaboratorCursor) return null\n\treturn (\n\t\t<CollaboratorCursor\n\t\t\tclassName=\"tl-collaborator__cursor\"\n\t\t\tuserId={userId}\n\t\t\tpoint={cursor}\n\t\t\tcolor={color}\n\t\t\tzoom={zoomLevel}\n\t\t\tname={userName !== 'New User' ? userName : null}\n\t\t\tchatMessage={chatMessage ?? ''}\n\t\t/>\n\t)\n})\n\nfunction CursorDef() {\n\treturn (\n\t\t<g id={useSharedSafeId('cursor')}>\n\t\t\t<g fill=\"rgba(0,0,0,.2)\" transform=\"translate(-11,-9)\">\n\t\t\t\t<path d=\"m12 24.4219v-16.015l11.591 11.619h-6.781l-.411.124z\" />\n\t\t\t\t<path d=\"m21.0845 25.0962-3.605 1.535-4.682-11.089 3.686-1.553z\" />\n\t\t\t</g>\n\t\t\t<g fill=\"white\" transform=\"translate(-12,-10)\">\n\t\t\t\t<path d=\"m12 24.4219v-16.015l11.591 11.619h-6.781l-.411.124z\" />\n\t\t\t\t<path d=\"m21.0845 25.0962-3.605 1.535-4.682-11.089 3.686-1.553z\" />\n\t\t\t</g>\n\t\t\t<g fill=\"currentColor\" transform=\"translate(-12,-10)\">\n\t\t\t\t<path d=\"m19.751 24.4155-1.844.774-3.1-7.374 1.841-.775z\" />\n\t\t\t\t<path d=\"m13 10.814v11.188l2.969-2.866.428-.139h4.768z\" />\n\t\t\t</g>\n\t\t</g>\n\t)\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA0DE;AA1DF,yBAAiD;AAEjD,mBAAwC;AACxC,qCAAoC;AACpC,uBAA0B;AAC1B,uBAAgC;AAChC,2BAAmC;AACnC,iBAAiC;AACjC,mCAAsC;AAiB/B,MAAM,wBAAoB,0BAAM,SAASA,qBAAoB;AACnE,QAAM,aAAS,4BAAU;AACzB,QAAM,EAAE,mBAAmB,QAAI,oDAAoB;AASnD,QAAM,iBAAa,qBAA8B,IAAI;AACrD,oCAAgB,MAAM;AACrB,UAAM,MAAM,WAAW;AACvB,QAAI,CAAC,IAAK;AACV,qCAAiB,KAAK,iBAAa,oDAAsB,MAAM,CAAC;AAAA,EACjE,CAAC;AACD;AAAA,IACC;AAAA,IACA,SAAS,uCAAuC;AAE/C,YAAM,gBAAY,oDAAsB,MAAM;AAC9C,uCAAiB,WAAW,SAAS,aAAa,SAAS;AAAA,IAC5D;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AAGA,QAAM,gBAAgB,OAAO,qCAAqC;AAClE,MAAI,cAAc,WAAW,EAAG,QAAO;AACvC,MAAI,CAAC,mBAAoB,QAAO;AAEhC,SACC,6CAAC,SAAI,WAAU,oBACd;AAAA,gDAAC,SAAI,WAAU,kBAAiB,eAAY,QAC3C,sDAAC,UACA,sDAAC,aAAU,GACZ,GACD;AAAA,IACA,4CAAC,SAAI,KAAK,YAAY,WAAU,iBAC9B,wBAAc,IAAI,CAAC,aACnB,4CAAC,gBAAmC,gBAAgB,YAAjC,SAAS,MAAkC,CAC9D,GACF;AAAA,KACD;AAEF,CAAC;AAED,MAAM,mBAAe,0BAAM,SAASC,cAAa;AAAA,EAChD;AACD,GAEG;AACF,QAAM,aAAS,4BAAU;AACzB,QAAM,EAAE,mBAAmB,QAAI,oDAAoB;AAEnD,QAAM,EAAE,QAAQ,aAAa,UAAU,QAAQ,MAAM,IAAI;AAKzD,QAAM,uBAAmB;AAAA,IACxB;AAAA,IACA,MACC,CAAC,CAAC,cAAU,yCAAmB,QAAQ,OAAO,sBAAsB,GAAG,OAAO,aAAa,CAAC;AAAA,IAC7F,CAAC,QAAQ,MAAM;AAAA,EAChB;AAGA,QAAM,YAAY,OAAO,aAAa;AAEtC,MAAI,CAAC,OAAQ,QAAO;AAIpB,MAAI,CAAC,iBAAkB,QAAO;AAC9B,MAAI,CAAC,mBAAoB,QAAO;AAChC,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA,MAAM;AAAA,MACN,MAAM,aAAa,aAAa,WAAW;AAAA,MAC3C,aAAa,eAAe;AAAA;AAAA,EAC7B;AAEF,CAAC;AAED,SAAS,YAAY;AACpB,SACC,6CAAC,OAAE,QAAI,kCAAgB,QAAQ,GAC9B;AAAA,iDAAC,OAAE,MAAK,kBAAiB,WAAU,qBAClC;AAAA,kDAAC,UAAK,GAAE,uDAAsD;AAAA,MAC9D,4CAAC,UAAK,GAAE,0DAAyD;AAAA,OAClE;AAAA,IACA,6CAAC,OAAE,MAAK,SAAQ,WAAU,sBACzB;AAAA,kDAAC,UAAK,GAAE,uDAAsD;AAAA,MAC9D,4CAAC,UAAK,GAAE,0DAAyD;AAAA,OAClE;AAAA,IACA,6CAAC,OAAE,MAAK,gBAAe,WAAU,sBAChC;AAAA,kDAAC,UAAK,GAAE,mDAAkD;AAAA,MAC1D,4CAAC,UAAK,GAAE,iDAAgD;AAAA,OACzD;AAAA,KACD;AAEF;",
|
|
6
6
|
"names": ["LiveCollaborators", "Collaborator"]
|
|
7
7
|
}
|
package/dist-cjs/version.js
CHANGED
|
@@ -22,10 +22,10 @@ __export(version_exports, {
|
|
|
22
22
|
version: () => version
|
|
23
23
|
});
|
|
24
24
|
module.exports = __toCommonJS(version_exports);
|
|
25
|
-
const version = "5.6.0-canary.
|
|
25
|
+
const version = "5.6.0-canary.f2082e9fe322";
|
|
26
26
|
const publishDates = {
|
|
27
27
|
major: "2026-05-06T16:28:18.473Z",
|
|
28
|
-
minor: "2026-10-
|
|
29
|
-
patch: "2026-10-
|
|
28
|
+
minor: "2026-10-02T10:28:43.324Z",
|
|
29
|
+
patch: "2026-10-02T10:28:43.324Z"
|
|
30
30
|
};
|
|
31
31
|
//# sourceMappingURL=version.js.map
|
package/dist-cjs/version.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/version.ts"],
|
|
4
|
-
"sourcesContent": ["// This file is automatically generated by internal/scripts/refresh-assets.ts.\n// Do not edit manually. Or do, I'm a comment, not a cop.\n\nexport const version = '5.6.0-canary.
|
|
4
|
+
"sourcesContent": ["// This file is automatically generated by internal/scripts/refresh-assets.ts.\n// Do not edit manually. Or do, I'm a comment, not a cop.\n\nexport const version = '5.6.0-canary.f2082e9fe322'\nexport const publishDates = {\n\tmajor: '2026-05-06T16:28:18.473Z',\n\tminor: '2026-10-02T10:28:43.324Z',\n\tpatch: '2026-10-02T10:28:43.324Z',\n}\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGO,MAAM,UAAU;AAChB,MAAM,eAAe;AAAA,EAC3B,OAAO;AAAA,EACP,OAAO;AAAA,EACP,OAAO;AACR;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist-esm/index.mjs
CHANGED
|
@@ -312,7 +312,7 @@ import { LocalIndexedDb, Table } from "./lib/utils/sync/LocalIndexedDb.mjs";
|
|
|
312
312
|
import { uniq } from "./lib/utils/uniq.mjs";
|
|
313
313
|
registerTldrawLibraryVersion(
|
|
314
314
|
"@tldraw/editor",
|
|
315
|
-
"5.6.0-canary.
|
|
315
|
+
"5.6.0-canary.f2082e9fe322",
|
|
316
316
|
"esm"
|
|
317
317
|
);
|
|
318
318
|
import { getColorValue } from "./lib/editor/managers/ThemeManager/defaultThemes.mjs";
|
|
@@ -62,15 +62,15 @@ const Collaborator = track(function Collaborator2({
|
|
|
62
62
|
});
|
|
63
63
|
function CursorDef() {
|
|
64
64
|
return /* @__PURE__ */ jsxs("g", { id: useSharedSafeId("cursor"), children: [
|
|
65
|
-
/* @__PURE__ */ jsxs("g", { fill: "rgba(0,0,0,.2)", transform: "translate(-11,-
|
|
65
|
+
/* @__PURE__ */ jsxs("g", { fill: "rgba(0,0,0,.2)", transform: "translate(-11,-9)", children: [
|
|
66
66
|
/* @__PURE__ */ jsx("path", { d: "m12 24.4219v-16.015l11.591 11.619h-6.781l-.411.124z" }),
|
|
67
67
|
/* @__PURE__ */ jsx("path", { d: "m21.0845 25.0962-3.605 1.535-4.682-11.089 3.686-1.553z" })
|
|
68
68
|
] }),
|
|
69
|
-
/* @__PURE__ */ jsxs("g", { fill: "white", transform: "translate(-12,-
|
|
69
|
+
/* @__PURE__ */ jsxs("g", { fill: "white", transform: "translate(-12,-10)", children: [
|
|
70
70
|
/* @__PURE__ */ jsx("path", { d: "m12 24.4219v-16.015l11.591 11.619h-6.781l-.411.124z" }),
|
|
71
71
|
/* @__PURE__ */ jsx("path", { d: "m21.0845 25.0962-3.605 1.535-4.682-11.089 3.686-1.553z" })
|
|
72
72
|
] }),
|
|
73
|
-
/* @__PURE__ */ jsxs("g", { fill: "currentColor", transform: "translate(-12,-
|
|
73
|
+
/* @__PURE__ */ jsxs("g", { fill: "currentColor", transform: "translate(-12,-10)", children: [
|
|
74
74
|
/* @__PURE__ */ jsx("path", { d: "m19.751 24.4155-1.844.774-3.1-7.374 1.841-.775z" }),
|
|
75
75
|
/* @__PURE__ */ jsx("path", { d: "m13 10.814v11.188l2.969-2.866.428-.139h4.768z" })
|
|
76
76
|
] })
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/lib/components/LiveCollaborators.tsx"],
|
|
4
|
-
"sourcesContent": ["import { track, useQuickReactor, useValue } from '@tldraw/state-react'\nimport { TLInstancePresence } from '@tldraw/tlschema'\nimport { useLayoutEffect, useRef } from 'react'\nimport { useEditorComponents } from '../hooks/EditorComponentsContext'\nimport { useEditor } from '../hooks/useEditor'\nimport { useSharedSafeId } from '../hooks/useSafeId'\nimport { isCursorInViewport } from '../utils/collaborators'\nimport { setStyleProperty } from '../utils/dom'\nimport { getHtmlLayerTransform } from '../utils/getHtmlLayerTransform'\n\n/**\n * The collaborator cursor layer: a DOM layer stacked as a sibling of the canvas \u2014 above all canvas\n * content, below the in-front layer and the UI panels \u2014 hosting each visible collaborator's cursor\n * (arrow, name tag, chat message). Off-viewport collaborators are the canvas-drawn hint arrows' job\n * (CollaboratorHintOverlayUtil), not this layer's.\n *\n * Cursors are DOM rather than canvas-drawn so their chrome styles and composes like the rest of\n * the UI. Re-render traffic is kept narrow: per-cursor positioning writes `transform` directly\n * (see `useTransform`), so a pointer move re-renders only the moved cursor; the camera transform\n * is written imperatively below, so a pure pan re-renders only cursors whose viewport visibility\n * flips (an equality-gated boolean per cursor); a zoom change re-renders every visible cursor,\n * because each one rescales by `1/zoom`.\n *\n * @public @react\n */\nexport const LiveCollaborators = track(function LiveCollaborators() {\n\tconst editor = useEditor()\n\tconst { CollaboratorCursor } = useEditorComponents()\n\n\t// The inner layer carries the camera transform, so the cursor components position in page\n\t// space exactly as canvas content does. Unlike the canvas's html layers this one unmounts\n\t// while no collaborators are visible, so the transform is written at two moments: on every\n\t// camera change (the reactor), and after every render (the layout effect, like useTransform\n\t// does per cursor) \u2014 the reactor's last run hit a null ref while the layer was unmounted,\n\t// and without the render-time write a reappearing layer would keep an identity transform\n\t// until the next camera move.\n\tconst rHtmlLayer = useRef<HTMLDivElement | null>(null)\n\tuseLayoutEffect(() => {\n\t\tconst elm = rHtmlLayer.current\n\t\tif (!elm) return\n\t\tsetStyleProperty(elm, 'transform', getHtmlLayerTransform(editor))\n\t})\n\tuseQuickReactor(\n\t\t'position collaborators layer',\n\t\tfunction positionCollaboratorsWhenCameraMoves() {\n\t\t\t// Reads the camera even while the layer is unmounted, keeping the subscription alive.\n\t\t\tconst transform = getHtmlLayerTransform(editor)\n\t\t\tsetStyleProperty(rHtmlLayer.current, 'transform', transform)\n\t\t},\n\t\t[editor]\n\t)\n\n\t// Visibility (activity state, following, highlighting) is handled by the editor.\n\tconst collaborators = editor.getVisibleCollaboratorsOnCurrentPage()\n\tif (collaborators.length === 0) return null\n\tif (!CollaboratorCursor) return null\n\n\treturn (\n\t\t<div className=\"tl-collaborators\">\n\t\t\t<svg className=\"tl-svg-context\" aria-hidden=\"true\">\n\t\t\t\t<defs>\n\t\t\t\t\t<CursorDef />\n\t\t\t\t</defs>\n\t\t\t</svg>\n\t\t\t<div ref={rHtmlLayer} className=\"tl-html-layer\">\n\t\t\t\t{collaborators.map((presence) => (\n\t\t\t\t\t<Collaborator key={presence.userId} latestPresence={presence} />\n\t\t\t\t))}\n\t\t\t</div>\n\t\t</div>\n\t)\n})\n\nconst Collaborator = track(function Collaborator({\n\tlatestPresence,\n}: {\n\tlatestPresence: TLInstancePresence\n}) {\n\tconst editor = useEditor()\n\tconst { CollaboratorCursor } = useEditorComponents()\n\n\tconst { userId, chatMessage, userName, cursor, color } = latestPresence\n\n\t// The viewport read lives inside this equality-gated computed rather than the tracked render:\n\t// pans move the viewport every frame, but this component only needs to know when the cursor\n\t// crosses the edge, so it subscribes to the boolean and re-renders only when it flips.\n\tconst cursorInViewport = useValue(\n\t\t'cursor in viewport',\n\t\t() =>\n\t\t\t!!cursor && isCursorInViewport(cursor, editor.getViewportPageBounds(), editor.getZoomLevel()),\n\t\t[editor, cursor]\n\t)\n\t// The zoom read is tracked directly: the cursor scales by 1/zoom, so zoom changes must\n\t// re-render it. Pure pans leave the zoom value unchanged, so they never invalidate this.\n\tconst zoomLevel = editor.getZoomLevel()\n\n\tif (!cursor) return null\n\n\t// Off-viewport collaborators show as the canvas-drawn hint arrows\n\t// (CollaboratorHintOverlayUtil), which shares this predicate \u2014 only the cursor itself is DOM.\n\tif (!cursorInViewport) return null\n\tif (!CollaboratorCursor) return null\n\treturn (\n\t\t<CollaboratorCursor\n\t\t\tclassName=\"tl-collaborator__cursor\"\n\t\t\tuserId={userId}\n\t\t\tpoint={cursor}\n\t\t\tcolor={color}\n\t\t\tzoom={zoomLevel}\n\t\t\tname={userName !== 'New User' ? userName : null}\n\t\t\tchatMessage={chatMessage ?? ''}\n\t\t/>\n\t)\n})\n\nfunction CursorDef() {\n\treturn (\n\t\t<g id={useSharedSafeId('cursor')}>\n\t\t\t<g fill=\"rgba(0,0,0,.2)\" transform=\"translate(-11,-
|
|
5
|
-
"mappings": "AA0DE,SAGG,KAHH;AA1DF,SAAS,OAAO,iBAAiB,gBAAgB;AAEjD,SAAS,iBAAiB,cAAc;AACxC,SAAS,2BAA2B;AACpC,SAAS,iBAAiB;AAC1B,SAAS,uBAAuB;AAChC,SAAS,0BAA0B;AACnC,SAAS,wBAAwB;AACjC,SAAS,6BAA6B;AAiB/B,MAAM,oBAAoB,MAAM,SAASA,qBAAoB;AACnE,QAAM,SAAS,UAAU;AACzB,QAAM,EAAE,mBAAmB,IAAI,oBAAoB;AASnD,QAAM,aAAa,OAA8B,IAAI;AACrD,kBAAgB,MAAM;AACrB,UAAM,MAAM,WAAW;AACvB,QAAI,CAAC,IAAK;AACV,qBAAiB,KAAK,aAAa,sBAAsB,MAAM,CAAC;AAAA,EACjE,CAAC;AACD;AAAA,IACC;AAAA,IACA,SAAS,uCAAuC;AAE/C,YAAM,YAAY,sBAAsB,MAAM;AAC9C,uBAAiB,WAAW,SAAS,aAAa,SAAS;AAAA,IAC5D;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AAGA,QAAM,gBAAgB,OAAO,qCAAqC;AAClE,MAAI,cAAc,WAAW,EAAG,QAAO;AACvC,MAAI,CAAC,mBAAoB,QAAO;AAEhC,SACC,qBAAC,SAAI,WAAU,oBACd;AAAA,wBAAC,SAAI,WAAU,kBAAiB,eAAY,QAC3C,8BAAC,UACA,8BAAC,aAAU,GACZ,GACD;AAAA,IACA,oBAAC,SAAI,KAAK,YAAY,WAAU,iBAC9B,wBAAc,IAAI,CAAC,aACnB,oBAAC,gBAAmC,gBAAgB,YAAjC,SAAS,MAAkC,CAC9D,GACF;AAAA,KACD;AAEF,CAAC;AAED,MAAM,eAAe,MAAM,SAASC,cAAa;AAAA,EAChD;AACD,GAEG;AACF,QAAM,SAAS,UAAU;AACzB,QAAM,EAAE,mBAAmB,IAAI,oBAAoB;AAEnD,QAAM,EAAE,QAAQ,aAAa,UAAU,QAAQ,MAAM,IAAI;AAKzD,QAAM,mBAAmB;AAAA,IACxB;AAAA,IACA,MACC,CAAC,CAAC,UAAU,mBAAmB,QAAQ,OAAO,sBAAsB,GAAG,OAAO,aAAa,CAAC;AAAA,IAC7F,CAAC,QAAQ,MAAM;AAAA,EAChB;AAGA,QAAM,YAAY,OAAO,aAAa;AAEtC,MAAI,CAAC,OAAQ,QAAO;AAIpB,MAAI,CAAC,iBAAkB,QAAO;AAC9B,MAAI,CAAC,mBAAoB,QAAO;AAChC,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA,MAAM;AAAA,MACN,MAAM,aAAa,aAAa,WAAW;AAAA,MAC3C,aAAa,eAAe;AAAA;AAAA,EAC7B;AAEF,CAAC;AAED,SAAS,YAAY;AACpB,SACC,qBAAC,OAAE,IAAI,gBAAgB,QAAQ,GAC9B;AAAA,yBAAC,OAAE,MAAK,kBAAiB,WAAU,
|
|
4
|
+
"sourcesContent": ["import { track, useQuickReactor, useValue } from '@tldraw/state-react'\nimport { TLInstancePresence } from '@tldraw/tlschema'\nimport { useLayoutEffect, useRef } from 'react'\nimport { useEditorComponents } from '../hooks/EditorComponentsContext'\nimport { useEditor } from '../hooks/useEditor'\nimport { useSharedSafeId } from '../hooks/useSafeId'\nimport { isCursorInViewport } from '../utils/collaborators'\nimport { setStyleProperty } from '../utils/dom'\nimport { getHtmlLayerTransform } from '../utils/getHtmlLayerTransform'\n\n/**\n * The collaborator cursor layer: a DOM layer stacked as a sibling of the canvas \u2014 above all canvas\n * content, below the in-front layer and the UI panels \u2014 hosting each visible collaborator's cursor\n * (arrow, name tag, chat message). Off-viewport collaborators are the canvas-drawn hint arrows' job\n * (CollaboratorHintOverlayUtil), not this layer's.\n *\n * Cursors are DOM rather than canvas-drawn so their chrome styles and composes like the rest of\n * the UI. Re-render traffic is kept narrow: per-cursor positioning writes `transform` directly\n * (see `useTransform`), so a pointer move re-renders only the moved cursor; the camera transform\n * is written imperatively below, so a pure pan re-renders only cursors whose viewport visibility\n * flips (an equality-gated boolean per cursor); a zoom change re-renders every visible cursor,\n * because each one rescales by `1/zoom`.\n *\n * @public @react\n */\nexport const LiveCollaborators = track(function LiveCollaborators() {\n\tconst editor = useEditor()\n\tconst { CollaboratorCursor } = useEditorComponents()\n\n\t// The inner layer carries the camera transform, so the cursor components position in page\n\t// space exactly as canvas content does. Unlike the canvas's html layers this one unmounts\n\t// while no collaborators are visible, so the transform is written at two moments: on every\n\t// camera change (the reactor), and after every render (the layout effect, like useTransform\n\t// does per cursor) \u2014 the reactor's last run hit a null ref while the layer was unmounted,\n\t// and without the render-time write a reappearing layer would keep an identity transform\n\t// until the next camera move.\n\tconst rHtmlLayer = useRef<HTMLDivElement | null>(null)\n\tuseLayoutEffect(() => {\n\t\tconst elm = rHtmlLayer.current\n\t\tif (!elm) return\n\t\tsetStyleProperty(elm, 'transform', getHtmlLayerTransform(editor))\n\t})\n\tuseQuickReactor(\n\t\t'position collaborators layer',\n\t\tfunction positionCollaboratorsWhenCameraMoves() {\n\t\t\t// Reads the camera even while the layer is unmounted, keeping the subscription alive.\n\t\t\tconst transform = getHtmlLayerTransform(editor)\n\t\t\tsetStyleProperty(rHtmlLayer.current, 'transform', transform)\n\t\t},\n\t\t[editor]\n\t)\n\n\t// Visibility (activity state, following, highlighting) is handled by the editor.\n\tconst collaborators = editor.getVisibleCollaboratorsOnCurrentPage()\n\tif (collaborators.length === 0) return null\n\tif (!CollaboratorCursor) return null\n\n\treturn (\n\t\t<div className=\"tl-collaborators\">\n\t\t\t<svg className=\"tl-svg-context\" aria-hidden=\"true\">\n\t\t\t\t<defs>\n\t\t\t\t\t<CursorDef />\n\t\t\t\t</defs>\n\t\t\t</svg>\n\t\t\t<div ref={rHtmlLayer} className=\"tl-html-layer\">\n\t\t\t\t{collaborators.map((presence) => (\n\t\t\t\t\t<Collaborator key={presence.userId} latestPresence={presence} />\n\t\t\t\t))}\n\t\t\t</div>\n\t\t</div>\n\t)\n})\n\nconst Collaborator = track(function Collaborator({\n\tlatestPresence,\n}: {\n\tlatestPresence: TLInstancePresence\n}) {\n\tconst editor = useEditor()\n\tconst { CollaboratorCursor } = useEditorComponents()\n\n\tconst { userId, chatMessage, userName, cursor, color } = latestPresence\n\n\t// The viewport read lives inside this equality-gated computed rather than the tracked render:\n\t// pans move the viewport every frame, but this component only needs to know when the cursor\n\t// crosses the edge, so it subscribes to the boolean and re-renders only when it flips.\n\tconst cursorInViewport = useValue(\n\t\t'cursor in viewport',\n\t\t() =>\n\t\t\t!!cursor && isCursorInViewport(cursor, editor.getViewportPageBounds(), editor.getZoomLevel()),\n\t\t[editor, cursor]\n\t)\n\t// The zoom read is tracked directly: the cursor scales by 1/zoom, so zoom changes must\n\t// re-render it. Pure pans leave the zoom value unchanged, so they never invalidate this.\n\tconst zoomLevel = editor.getZoomLevel()\n\n\tif (!cursor) return null\n\n\t// Off-viewport collaborators show as the canvas-drawn hint arrows\n\t// (CollaboratorHintOverlayUtil), which shares this predicate \u2014 only the cursor itself is DOM.\n\tif (!cursorInViewport) return null\n\tif (!CollaboratorCursor) return null\n\treturn (\n\t\t<CollaboratorCursor\n\t\t\tclassName=\"tl-collaborator__cursor\"\n\t\t\tuserId={userId}\n\t\t\tpoint={cursor}\n\t\t\tcolor={color}\n\t\t\tzoom={zoomLevel}\n\t\t\tname={userName !== 'New User' ? userName : null}\n\t\t\tchatMessage={chatMessage ?? ''}\n\t\t/>\n\t)\n})\n\nfunction CursorDef() {\n\treturn (\n\t\t<g id={useSharedSafeId('cursor')}>\n\t\t\t<g fill=\"rgba(0,0,0,.2)\" transform=\"translate(-11,-9)\">\n\t\t\t\t<path d=\"m12 24.4219v-16.015l11.591 11.619h-6.781l-.411.124z\" />\n\t\t\t\t<path d=\"m21.0845 25.0962-3.605 1.535-4.682-11.089 3.686-1.553z\" />\n\t\t\t</g>\n\t\t\t<g fill=\"white\" transform=\"translate(-12,-10)\">\n\t\t\t\t<path d=\"m12 24.4219v-16.015l11.591 11.619h-6.781l-.411.124z\" />\n\t\t\t\t<path d=\"m21.0845 25.0962-3.605 1.535-4.682-11.089 3.686-1.553z\" />\n\t\t\t</g>\n\t\t\t<g fill=\"currentColor\" transform=\"translate(-12,-10)\">\n\t\t\t\t<path d=\"m19.751 24.4155-1.844.774-3.1-7.374 1.841-.775z\" />\n\t\t\t\t<path d=\"m13 10.814v11.188l2.969-2.866.428-.139h4.768z\" />\n\t\t\t</g>\n\t\t</g>\n\t)\n}\n"],
|
|
5
|
+
"mappings": "AA0DE,SAGG,KAHH;AA1DF,SAAS,OAAO,iBAAiB,gBAAgB;AAEjD,SAAS,iBAAiB,cAAc;AACxC,SAAS,2BAA2B;AACpC,SAAS,iBAAiB;AAC1B,SAAS,uBAAuB;AAChC,SAAS,0BAA0B;AACnC,SAAS,wBAAwB;AACjC,SAAS,6BAA6B;AAiB/B,MAAM,oBAAoB,MAAM,SAASA,qBAAoB;AACnE,QAAM,SAAS,UAAU;AACzB,QAAM,EAAE,mBAAmB,IAAI,oBAAoB;AASnD,QAAM,aAAa,OAA8B,IAAI;AACrD,kBAAgB,MAAM;AACrB,UAAM,MAAM,WAAW;AACvB,QAAI,CAAC,IAAK;AACV,qBAAiB,KAAK,aAAa,sBAAsB,MAAM,CAAC;AAAA,EACjE,CAAC;AACD;AAAA,IACC;AAAA,IACA,SAAS,uCAAuC;AAE/C,YAAM,YAAY,sBAAsB,MAAM;AAC9C,uBAAiB,WAAW,SAAS,aAAa,SAAS;AAAA,IAC5D;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AAGA,QAAM,gBAAgB,OAAO,qCAAqC;AAClE,MAAI,cAAc,WAAW,EAAG,QAAO;AACvC,MAAI,CAAC,mBAAoB,QAAO;AAEhC,SACC,qBAAC,SAAI,WAAU,oBACd;AAAA,wBAAC,SAAI,WAAU,kBAAiB,eAAY,QAC3C,8BAAC,UACA,8BAAC,aAAU,GACZ,GACD;AAAA,IACA,oBAAC,SAAI,KAAK,YAAY,WAAU,iBAC9B,wBAAc,IAAI,CAAC,aACnB,oBAAC,gBAAmC,gBAAgB,YAAjC,SAAS,MAAkC,CAC9D,GACF;AAAA,KACD;AAEF,CAAC;AAED,MAAM,eAAe,MAAM,SAASC,cAAa;AAAA,EAChD;AACD,GAEG;AACF,QAAM,SAAS,UAAU;AACzB,QAAM,EAAE,mBAAmB,IAAI,oBAAoB;AAEnD,QAAM,EAAE,QAAQ,aAAa,UAAU,QAAQ,MAAM,IAAI;AAKzD,QAAM,mBAAmB;AAAA,IACxB;AAAA,IACA,MACC,CAAC,CAAC,UAAU,mBAAmB,QAAQ,OAAO,sBAAsB,GAAG,OAAO,aAAa,CAAC;AAAA,IAC7F,CAAC,QAAQ,MAAM;AAAA,EAChB;AAGA,QAAM,YAAY,OAAO,aAAa;AAEtC,MAAI,CAAC,OAAQ,QAAO;AAIpB,MAAI,CAAC,iBAAkB,QAAO;AAC9B,MAAI,CAAC,mBAAoB,QAAO;AAChC,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA,MAAM;AAAA,MACN,MAAM,aAAa,aAAa,WAAW;AAAA,MAC3C,aAAa,eAAe;AAAA;AAAA,EAC7B;AAEF,CAAC;AAED,SAAS,YAAY;AACpB,SACC,qBAAC,OAAE,IAAI,gBAAgB,QAAQ,GAC9B;AAAA,yBAAC,OAAE,MAAK,kBAAiB,WAAU,qBAClC;AAAA,0BAAC,UAAK,GAAE,uDAAsD;AAAA,MAC9D,oBAAC,UAAK,GAAE,0DAAyD;AAAA,OAClE;AAAA,IACA,qBAAC,OAAE,MAAK,SAAQ,WAAU,sBACzB;AAAA,0BAAC,UAAK,GAAE,uDAAsD;AAAA,MAC9D,oBAAC,UAAK,GAAE,0DAAyD;AAAA,OAClE;AAAA,IACA,qBAAC,OAAE,MAAK,gBAAe,WAAU,sBAChC;AAAA,0BAAC,UAAK,GAAE,mDAAkD;AAAA,MAC1D,oBAAC,UAAK,GAAE,iDAAgD;AAAA,OACzD;AAAA,KACD;AAEF;",
|
|
6
6
|
"names": ["LiveCollaborators", "Collaborator"]
|
|
7
7
|
}
|
package/dist-esm/version.mjs
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
const version = "5.6.0-canary.
|
|
1
|
+
const version = "5.6.0-canary.f2082e9fe322";
|
|
2
2
|
const publishDates = {
|
|
3
3
|
major: "2026-05-06T16:28:18.473Z",
|
|
4
|
-
minor: "2026-10-
|
|
5
|
-
patch: "2026-10-
|
|
4
|
+
minor: "2026-10-02T10:28:43.324Z",
|
|
5
|
+
patch: "2026-10-02T10:28:43.324Z"
|
|
6
6
|
};
|
|
7
7
|
export {
|
|
8
8
|
publishDates,
|
package/dist-esm/version.mjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/version.ts"],
|
|
4
|
-
"sourcesContent": ["// This file is automatically generated by internal/scripts/refresh-assets.ts.\n// Do not edit manually. Or do, I'm a comment, not a cop.\n\nexport const version = '5.6.0-canary.
|
|
4
|
+
"sourcesContent": ["// This file is automatically generated by internal/scripts/refresh-assets.ts.\n// Do not edit manually. Or do, I'm a comment, not a cop.\n\nexport const version = '5.6.0-canary.f2082e9fe322'\nexport const publishDates = {\n\tmajor: '2026-05-06T16:28:18.473Z',\n\tminor: '2026-10-02T10:28:43.324Z',\n\tpatch: '2026-10-02T10:28:43.324Z',\n}\n"],
|
|
5
5
|
"mappings": "AAGO,MAAM,UAAU;AAChB,MAAM,eAAe;AAAA,EAC3B,OAAO;AAAA,EACP,OAAO;AAAA,EACP,OAAO;AACR;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/editor.css
CHANGED
|
@@ -79,9 +79,10 @@
|
|
|
79
79
|
|
|
80
80
|
/* Cursor SVGs */
|
|
81
81
|
--tl-cursor-none: none;
|
|
82
|
+
/* Hotspot sits between the white outline tip and the black tip: on either tip alone, hit-testing feels offset from one direction (#10855) */
|
|
82
83
|
--tl-cursor-default:
|
|
83
84
|
url("data:image/svg+xml,<svg height='32' width='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' style='color: black;'><defs><filter id='shadow' y='-40%' x='-40%' width='180px' height='180%' color-interpolation-filters='sRGB'><feDropShadow dx='1' dy='1' stdDeviation='1.2' flood-opacity='.5'/></filter></defs><g fill='none' transform='rotate(0 16 16)' filter='url(%23shadow)'><path d='m12 24.4219v-16.015l11.591 11.619h-6.781l-.411.124z' fill='white'/><path d='m21.0845 25.0962-3.605 1.535-4.682-11.089 3.686-1.553z' fill='white'/><path d='m19.751 24.4155-1.844.774-3.1-7.374 1.841-.775z' fill='black'/><path d='m13 10.814v11.188l2.969-2.866.428-.139h4.768z' fill='black'/></g></svg>")
|
|
84
|
-
12
|
|
85
|
+
12 10,
|
|
85
86
|
default;
|
|
86
87
|
--tl-cursor-pointer:
|
|
87
88
|
url("data:image/svg+xml,<svg height='32' width='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' style='color: black;'><defs><filter id='shadow' y='-40%' x='-40%' width='180px' height='180%' color-interpolation-filters='sRGB'><feDropShadow dx='1' dy='1' stdDeviation='1.2' flood-opacity='.5'/></filter></defs><g fill='none' transform='rotate(0 16 16)' filter='url(%23shadow)'><path d='m13.3315 21.3799c-.284-.359-.629-1.093-1.243-1.984-.348-.504-1.211-1.453-1.468-1.935-.223-.426-.199-.617-.146-.97.094-.628.738-1.117 1.425-1.051.519.049.959.392 1.355.716.239.195.533.574.71.788.163.196.203.277.377.509.23.307.302.459.214.121-.071-.496-.187-1.343-.355-2.092-.128-.568-.159-.657-.281-1.093-.129-.464-.195-.789-.316-1.281-.084-.348-.235-1.059-.276-1.459-.057-.547-.087-1.439.264-1.849.275-.321.906-.418 1.297-.22.512.259.803 1.003.936 1.3.239.534.387 1.151.516 1.961.164 1.031.466 2.462.476 2.763.024-.369-.068-1.146-.004-1.5.058-.321.328-.694.666-.795.286-.085.621-.116.916-.055.313.064.643.288.766.499.362.624.369 1.899.384 1.831.086-.376.071-1.229.284-1.584.14-.234.497-.445.687-.479.294-.052.655-.068.964-.008.249.049.586.345.677.487.218.344.342 1.317.379 1.658.015.141.074-.392.293-.736.406-.639 1.843-.763 1.898.639.025.654.02.624.02 1.064 0 .517-.012.828-.04 1.202-.031.4-.117 1.304-.242 1.742-.086.301-.371.978-.652 1.384 0 0-1.074 1.25-1.191 1.813-.118.562-.079.566-.102.965-.023.398.121.922.121.922s-.802.104-1.234.035c-.391-.063-.875-.841-1-1.079-.172-.328-.539-.265-.682-.023-.225.383-.709 1.07-1.051 1.113-.668.084-2.054.031-3.139.02 0 0 .185-1.011-.227-1.358-.305-.259-.83-.784-1.144-1.06z' fill='white'/><g stroke='black' stroke-linecap='round' stroke-width='.75'><path d='m13.3315 21.3799c-.284-.359-.629-1.093-1.243-1.984-.348-.504-1.211-1.453-1.468-1.935-.223-.426-.199-.617-.146-.97.094-.628.738-1.117 1.425-1.051.519.049.959.392 1.355.716.239.195.533.574.71.788.163.196.203.277.377.509.23.307.302.459.214.121-.071-.496-.187-1.343-.355-2.092-.128-.568-.159-.657-.281-1.093-.129-.464-.195-.789-.316-1.281-.084-.348-.235-1.059-.276-1.459-.057-.547-.087-1.439.264-1.849.275-.321.906-.418 1.297-.22.512.259.803 1.003.936 1.3.239.534.387 1.151.516 1.961.164 1.031.466 2.462.476 2.763.024-.369-.068-1.146-.004-1.5.058-.321.328-.694.666-.795.286-.085.621-.116.916-.055.313.064.643.288.766.499.362.624.369 1.899.384 1.831.086-.376.071-1.229.284-1.584.14-.234.497-.445.687-.479.294-.052.655-.068.964-.008.249.049.586.345.677.487.218.344.342 1.317.379 1.658.015.141.074-.392.293-.736.406-.639 1.843-.763 1.898.639.025.654.02.624.02 1.064 0 .517-.012.828-.04 1.202-.031.4-.117 1.304-.242 1.742-.086.301-.371.978-.652 1.384 0 0-1.074 1.25-1.191 1.813-.118.562-.079.566-.102.965-.023.398.121.922.121.922s-.802.104-1.234.035c-.391-.063-.875-.841-1-1.079-.172-.328-.539-.265-.682-.023-.225.383-.709 1.07-1.051 1.113-.668.084-2.054.031-3.139.02 0 0 .185-1.011-.227-1.358-.305-.259-.83-.784-1.144-1.06z' stroke-linejoin='round'/><path d='m21.5664 21.7344v-3.459'/><path d='m19.5508 21.7461-.016-3.473'/><path d='m17.5547 18.3047.021 3.426'/></g></g></svg>")
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tldraw/editor",
|
|
3
3
|
"description": "tldraw infinite canvas SDK (editor).",
|
|
4
|
-
"version": "5.6.0-canary.
|
|
4
|
+
"version": "5.6.0-canary.f2082e9fe322",
|
|
5
5
|
"author": {
|
|
6
6
|
"name": "tldraw Inc.",
|
|
7
7
|
"email": "hello@tldraw.com"
|
|
@@ -43,12 +43,12 @@
|
|
|
43
43
|
"@tiptap/core": "^3.12.1",
|
|
44
44
|
"@tiptap/pm": "^3.12.1",
|
|
45
45
|
"@tiptap/react": "^3.12.1",
|
|
46
|
-
"@tldraw/state": "5.6.0-canary.
|
|
47
|
-
"@tldraw/state-react": "5.6.0-canary.
|
|
48
|
-
"@tldraw/store": "5.6.0-canary.
|
|
49
|
-
"@tldraw/tlschema": "5.6.0-canary.
|
|
50
|
-
"@tldraw/utils": "5.6.0-canary.
|
|
51
|
-
"@tldraw/validate": "5.6.0-canary.
|
|
46
|
+
"@tldraw/state": "5.6.0-canary.f2082e9fe322",
|
|
47
|
+
"@tldraw/state-react": "5.6.0-canary.f2082e9fe322",
|
|
48
|
+
"@tldraw/store": "5.6.0-canary.f2082e9fe322",
|
|
49
|
+
"@tldraw/tlschema": "5.6.0-canary.f2082e9fe322",
|
|
50
|
+
"@tldraw/utils": "5.6.0-canary.f2082e9fe322",
|
|
51
|
+
"@tldraw/validate": "5.6.0-canary.f2082e9fe322",
|
|
52
52
|
"classnames": "^2.5.1",
|
|
53
53
|
"eventemitter3": "^4.0.7",
|
|
54
54
|
"idb": "^7.1.1",
|
|
@@ -116,15 +116,15 @@ const Collaborator = track(function Collaborator({
|
|
|
116
116
|
function CursorDef() {
|
|
117
117
|
return (
|
|
118
118
|
<g id={useSharedSafeId('cursor')}>
|
|
119
|
-
<g fill="rgba(0,0,0,.2)" transform="translate(-11,-
|
|
119
|
+
<g fill="rgba(0,0,0,.2)" transform="translate(-11,-9)">
|
|
120
120
|
<path d="m12 24.4219v-16.015l11.591 11.619h-6.781l-.411.124z" />
|
|
121
121
|
<path d="m21.0845 25.0962-3.605 1.535-4.682-11.089 3.686-1.553z" />
|
|
122
122
|
</g>
|
|
123
|
-
<g fill="white" transform="translate(-12,-
|
|
123
|
+
<g fill="white" transform="translate(-12,-10)">
|
|
124
124
|
<path d="m12 24.4219v-16.015l11.591 11.619h-6.781l-.411.124z" />
|
|
125
125
|
<path d="m21.0845 25.0962-3.605 1.535-4.682-11.089 3.686-1.553z" />
|
|
126
126
|
</g>
|
|
127
|
-
<g fill="currentColor" transform="translate(-12,-
|
|
127
|
+
<g fill="currentColor" transform="translate(-12,-10)">
|
|
128
128
|
<path d="m19.751 24.4155-1.844.774-3.1-7.374 1.841-.775z" />
|
|
129
129
|
<path d="m13 10.814v11.188l2.969-2.866.428-.139h4.768z" />
|
|
130
130
|
</g>
|
package/src/version.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
// This file is automatically generated by internal/scripts/refresh-assets.ts.
|
|
2
2
|
// Do not edit manually. Or do, I'm a comment, not a cop.
|
|
3
3
|
|
|
4
|
-
export const version = '5.6.0-canary.
|
|
4
|
+
export const version = '5.6.0-canary.f2082e9fe322'
|
|
5
5
|
export const publishDates = {
|
|
6
6
|
major: '2026-05-06T16:28:18.473Z',
|
|
7
|
-
minor: '2026-10-
|
|
8
|
-
patch: '2026-10-
|
|
7
|
+
minor: '2026-10-02T10:28:43.324Z',
|
|
8
|
+
patch: '2026-10-02T10:28:43.324Z',
|
|
9
9
|
}
|