@tldraw/editor 3.7.0-canary.9aeff86e695c → 3.7.0-canary.9e5acfe11f3d

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.
Files changed (43) hide show
  1. package/dist-cjs/index.d.ts +3 -1
  2. package/dist-cjs/index.js +2 -1
  3. package/dist-cjs/index.js.map +2 -2
  4. package/dist-cjs/lib/TldrawEditor.js +1 -1
  5. package/dist-cjs/lib/TldrawEditor.js.map +2 -2
  6. package/dist-cjs/lib/components/LiveCollaborators.js +2 -1
  7. package/dist-cjs/lib/components/LiveCollaborators.js.map +2 -2
  8. package/dist-cjs/lib/components/Shape.js +6 -4
  9. package/dist-cjs/lib/components/Shape.js.map +2 -2
  10. package/dist-cjs/lib/editor/Editor.js +8 -2
  11. package/dist-cjs/lib/editor/Editor.js.map +2 -2
  12. package/dist-cjs/lib/editor/managers/TextManager.js +9 -15
  13. package/dist-cjs/lib/editor/managers/TextManager.js.map +2 -2
  14. package/dist-cjs/lib/hooks/useEvent.js +18 -1
  15. package/dist-cjs/lib/hooks/useEvent.js.map +2 -2
  16. package/dist-cjs/version.js +3 -3
  17. package/dist-cjs/version.js.map +1 -1
  18. package/dist-esm/index.d.mts +3 -1
  19. package/dist-esm/index.mjs +3 -2
  20. package/dist-esm/index.mjs.map +2 -2
  21. package/dist-esm/lib/TldrawEditor.mjs +1 -1
  22. package/dist-esm/lib/TldrawEditor.mjs.map +2 -2
  23. package/dist-esm/lib/components/LiveCollaborators.mjs +2 -1
  24. package/dist-esm/lib/components/LiveCollaborators.mjs.map +2 -2
  25. package/dist-esm/lib/components/Shape.mjs +6 -4
  26. package/dist-esm/lib/components/Shape.mjs.map +2 -2
  27. package/dist-esm/lib/editor/Editor.mjs +9 -2
  28. package/dist-esm/lib/editor/Editor.mjs.map +2 -2
  29. package/dist-esm/lib/editor/managers/TextManager.mjs +9 -15
  30. package/dist-esm/lib/editor/managers/TextManager.mjs.map +2 -2
  31. package/dist-esm/lib/hooks/useEvent.mjs +18 -1
  32. package/dist-esm/lib/hooks/useEvent.mjs.map +2 -2
  33. package/dist-esm/version.mjs +3 -3
  34. package/dist-esm/version.mjs.map +1 -1
  35. package/package.json +7 -7
  36. package/src/index.ts +1 -1
  37. package/src/lib/TldrawEditor.tsx +1 -1
  38. package/src/lib/components/LiveCollaborators.tsx +3 -1
  39. package/src/lib/components/Shape.tsx +22 -10
  40. package/src/lib/editor/Editor.ts +12 -5
  41. package/src/lib/editor/managers/TextManager.ts +9 -17
  42. package/src/lib/hooks/useEvent.tsx +29 -0
  43. package/src/version.ts +3 -3
@@ -5429,7 +5429,7 @@ export declare const TAB_ID: string;
5429
5429
  /** @public */
5430
5430
  export declare class TextManager {
5431
5431
  editor: Editor;
5432
- baseElm: HTMLDivElement;
5432
+ private baseElem;
5433
5433
  constructor(editor: Editor);
5434
5434
  measureText(textToMeasure: string, opts: {
5435
5435
  /**
@@ -6883,6 +6883,8 @@ export declare function usePassThroughWheelEvents(ref: RefObject<HTMLElement>):
6883
6883
  export { useQuickReactor }
6884
6884
 
6885
6885
  /* Excluded from this release type: USER_COLORS */
6886
+
6887
+ /* Excluded from this release type: useReactiveEvent */
6886
6888
  export { useReactor }
6887
6889
 
6888
6890
  /* Excluded from this release type: useRefState */
package/dist-cjs/index.js CHANGED
@@ -212,6 +212,7 @@ __export(src_exports, {
212
212
  usePeerIds: () => import_usePeerIds.usePeerIds,
213
213
  usePresence: () => import_usePresence.usePresence,
214
214
  useQuickReactor: () => import_state_react.useQuickReactor,
215
+ useReactiveEvent: () => import_useEvent.useReactiveEvent,
215
216
  useReactor: () => import_state_react.useReactor,
216
217
  useRefState: () => import_useRefState.useRefState,
217
218
  useSelectionEvents: () => import_useSelectionEvents.useSelectionEvents,
@@ -358,7 +359,7 @@ function debugEnableLicensing() {
358
359
  }
359
360
  (0, import_utils.registerTldrawLibraryVersion)(
360
361
  "@tldraw/editor",
361
- "3.7.0-canary.9aeff86e695c",
362
+ "3.7.0-canary.9e5acfe11f3d",
362
363
  "cjs"
363
364
  );
364
365
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../src/index.ts"],
4
- "sourcesContent": ["import { registerTldrawLibraryVersion } from '@tldraw/utils'\nimport 'core-js/stable/array/at.js'\nimport 'core-js/stable/array/flat-map.js'\nimport 'core-js/stable/array/flat.js'\nimport 'core-js/stable/string/at.js'\nimport 'core-js/stable/string/replace-all.js'\nexport {\n\tEMPTY_ARRAY,\n\tEffectScheduler,\n\tatom,\n\tcomputed,\n\treact,\n\ttransact,\n\ttransaction,\n\twhyAmIRunning,\n\ttype Atom,\n\ttype Signal,\n} from '@tldraw/state'\nexport {\n\ttrack,\n\tuseAtom,\n\tuseComputed,\n\tuseQuickReactor,\n\tuseReactor,\n\tuseStateTracking,\n\tuseValue,\n} from '@tldraw/state-react'\nexport { LocalIndexedDb, Table, type StoreName } from './lib/utils/sync/LocalIndexedDb'\n// eslint-disable-next-line local/no-export-star\nexport * from '@tldraw/store'\n// eslint-disable-next-line local/no-export-star\nexport * from '@tldraw/tlschema'\n// eslint-disable-next-line local/no-export-star\nexport * from '@tldraw/utils'\n// eslint-disable-next-line local/no-export-star\nexport * from '@tldraw/validate'\nexport {\n\tErrorScreen,\n\tLoadingScreen,\n\tTldrawEditor,\n\tuseOnMount,\n\ttype LoadingScreenProps,\n\ttype TLOnMountHandler,\n\ttype TldrawEditorBaseProps,\n\ttype TldrawEditorProps,\n\ttype TldrawEditorStoreProps,\n\ttype TldrawEditorWithStoreProps,\n\ttype TldrawEditorWithoutStoreProps,\n} from './lib/TldrawEditor'\nexport {\n\tErrorBoundary,\n\tOptionalErrorBoundary,\n\ttype TLErrorBoundaryProps,\n} from './lib/components/ErrorBoundary'\nexport { HTMLContainer, type HTMLContainerProps } from './lib/components/HTMLContainer'\nexport { MenuClickCapture } from './lib/components/MenuClickCapture'\nexport { SVGContainer, type SVGContainerProps } from './lib/components/SVGContainer'\nexport { DefaultBackground } from './lib/components/default-components/DefaultBackground'\nexport { DefaultBrush, type TLBrushProps } from './lib/components/default-components/DefaultBrush'\nexport {\n\tDefaultCanvas,\n\ttype TLCanvasComponentProps,\n} from './lib/components/default-components/DefaultCanvas'\nexport {\n\tDefaultCollaboratorHint,\n\ttype TLCollaboratorHintProps,\n} from './lib/components/default-components/DefaultCollaboratorHint'\nexport {\n\tDefaultCursor,\n\ttype TLCursorProps,\n} from './lib/components/default-components/DefaultCursor'\nexport {\n\tDefaultErrorFallback,\n\ttype TLErrorFallbackComponent,\n} from './lib/components/default-components/DefaultErrorFallback'\nexport { DefaultGrid, type TLGridProps } from './lib/components/default-components/DefaultGrid'\nexport {\n\tDefaultHandle,\n\ttype TLHandleProps,\n} from './lib/components/default-components/DefaultHandle'\nexport {\n\tDefaultHandles,\n\ttype TLHandlesProps,\n} from './lib/components/default-components/DefaultHandles'\nexport {\n\tDefaultScribble,\n\ttype TLScribbleProps,\n} from './lib/components/default-components/DefaultScribble'\nexport {\n\tDefaultSelectionBackground,\n\ttype TLSelectionBackgroundProps,\n} from './lib/components/default-components/DefaultSelectionBackground'\nexport {\n\tDefaultSelectionForeground,\n\ttype TLSelectionForegroundProps,\n} from './lib/components/default-components/DefaultSelectionForeground'\nexport { type TLShapeErrorFallbackComponent } from './lib/components/default-components/DefaultShapeErrorFallback'\nexport {\n\tDefaultShapeIndicator,\n\ttype TLShapeIndicatorProps,\n} from './lib/components/default-components/DefaultShapeIndicator'\nexport { type TLShapeIndicatorErrorFallbackComponent } from './lib/components/default-components/DefaultShapeIndicatorErrorFallback'\nexport { DefaultShapeIndicators } from './lib/components/default-components/DefaultShapeIndicators'\nexport {\n\tDefaultSnapIndicator,\n\ttype TLSnapIndicatorProps,\n} from './lib/components/default-components/DefaultSnapIndictor'\nexport { DefaultSpinner } from './lib/components/default-components/DefaultSpinner'\nexport { DefaultSvgDefs } from './lib/components/default-components/DefaultSvgDefs'\nexport {\n\tgetSnapshot,\n\tloadSnapshot,\n\ttype TLEditorSnapshot,\n\ttype TLLoadSnapshotOptions,\n} from './lib/config/TLEditorSnapshot'\nexport {\n\tTAB_ID,\n\tcreateSessionStateSnapshotSignal,\n\textractSessionStateFromLegacySnapshot,\n\tloadSessionStateSnapshotIntoStore,\n\ttype TLLoadSessionStateSnapshotOptions,\n\ttype TLSessionStateSnapshot,\n} from './lib/config/TLSessionStateSnapshot'\nexport {\n\tUSER_COLORS,\n\tdefaultUserPreferences,\n\tgetFreshUserPreferences,\n\tgetUserPreferences,\n\tsetUserPreferences,\n\tuserTypeValidator,\n\ttype TLUserPreferences,\n} from './lib/config/TLUserPreferences'\nexport {\n\tcreateTLSchemaFromUtils,\n\tcreateTLStore,\n\tinlineBase64AssetStore,\n\ttype TLStoreBaseOptions,\n\ttype TLStoreEventInfo,\n\ttype TLStoreOptions,\n\ttype TLStoreSchemaOptions,\n} from './lib/config/createTLStore'\nexport { createTLUser, useTldrawUser, type TLUser } from './lib/config/createTLUser'\nexport { type TLAnyBindingUtilConstructor } from './lib/config/defaultBindings'\nexport { coreShapes, type TLAnyShapeUtilConstructor } from './lib/config/defaultShapes'\nexport { DEFAULT_ANIMATION_OPTIONS, DEFAULT_CAMERA_OPTIONS, SIDES } from './lib/constants'\nexport {\n\tEditor,\n\ttype TLEditorOptions,\n\ttype TLEditorRunOptions,\n\ttype TLRenderingShape,\n\ttype TLResizeShapeOptions,\n} from './lib/editor/Editor'\nexport {\n\tBindingUtil,\n\ttype BindingOnChangeOptions,\n\ttype BindingOnCreateOptions,\n\ttype BindingOnDeleteOptions,\n\ttype BindingOnShapeChangeOptions,\n\ttype BindingOnShapeDeleteOptions,\n\ttype BindingOnShapeIsolateOptions,\n\ttype TLBindingUtilConstructor,\n} from './lib/editor/bindings/BindingUtil'\nexport { ClickManager, type TLClickState } from './lib/editor/managers/ClickManager'\nexport { EdgeScrollManager } from './lib/editor/managers/EdgeScrollManager'\nexport { HistoryManager } from './lib/editor/managers/HistoryManager'\nexport { ScribbleManager, type ScribbleItem } from './lib/editor/managers/ScribbleManager'\nexport {\n\tBoundsSnaps,\n\ttype BoundsSnapGeometry,\n\ttype BoundsSnapPoint,\n} from './lib/editor/managers/SnapManager/BoundsSnaps'\nexport { HandleSnaps, type HandleSnapGeometry } from './lib/editor/managers/SnapManager/HandleSnaps'\nexport {\n\tSnapManager,\n\ttype GapsSnapIndicator,\n\ttype PointsSnapIndicator,\n\ttype SnapData,\n\ttype SnapIndicator,\n} from './lib/editor/managers/SnapManager/SnapManager'\nexport { TextManager, type TLMeasureTextSpanOpts } from './lib/editor/managers/TextManager'\nexport { UserPreferencesManager } from './lib/editor/managers/UserPreferencesManager'\nexport { BaseBoxShapeUtil, type TLBaseBoxShape } from './lib/editor/shapes/BaseBoxShapeUtil'\nexport {\n\tShapeUtil,\n\ttype TLHandleDragInfo,\n\ttype TLResizeInfo,\n\ttype TLResizeMode,\n\ttype TLShapeUtilCanBindOpts,\n\ttype TLShapeUtilCanvasSvgDef,\n\ttype TLShapeUtilConstructor,\n} from './lib/editor/shapes/ShapeUtil'\nexport { GroupShapeUtil } from './lib/editor/shapes/group/GroupShapeUtil'\nexport { getPerfectDashProps } from './lib/editor/shapes/shared/getPerfectDashProps'\nexport { resizeBox, type ResizeBoxOptions } from './lib/editor/shapes/shared/resizeBox'\nexport { BaseBoxShapeTool } from './lib/editor/tools/BaseBoxShapeTool/BaseBoxShapeTool'\nexport { maybeSnapToGrid } from './lib/editor/tools/BaseBoxShapeTool/children/Pointing'\nexport { StateNode, type TLStateNodeConstructor } from './lib/editor/tools/StateNode'\nexport {\n\tuseDelaySvgExport,\n\tuseSvgExportContext,\n\ttype SvgExportContext,\n\ttype SvgExportDef,\n} from './lib/editor/types/SvgExportContext'\nexport { type TLContent } from './lib/editor/types/clipboard-types'\nexport { type TLEventMap, type TLEventMapHandler } from './lib/editor/types/emit-types'\nexport {\n\tEVENT_NAME_MAP,\n\ttype TLBaseEventInfo,\n\ttype TLCLickEventName,\n\ttype TLCancelEvent,\n\ttype TLCancelEventInfo,\n\ttype TLClickEvent,\n\ttype TLClickEventInfo,\n\ttype TLCompleteEvent,\n\ttype TLCompleteEventInfo,\n\ttype TLEnterEventHandler,\n\ttype TLEventHandlers,\n\ttype TLEventInfo,\n\ttype TLEventName,\n\ttype TLExitEventHandler,\n\ttype TLInterruptEvent,\n\ttype TLInterruptEventInfo,\n\ttype TLKeyboardEvent,\n\ttype TLKeyboardEventInfo,\n\ttype TLKeyboardEventName,\n\ttype TLPinchEvent,\n\ttype TLPinchEventInfo,\n\ttype TLPinchEventName,\n\ttype TLPointerEvent,\n\ttype TLPointerEventInfo,\n\ttype TLPointerEventName,\n\ttype TLPointerEventTarget,\n\ttype TLTickEvent,\n\ttype TLTickEventInfo,\n\ttype TLWheelEvent,\n\ttype TLWheelEventInfo,\n\ttype UiEvent,\n\ttype UiEventType,\n} from './lib/editor/types/event-types'\nexport {\n\ttype TLExternalAssetContent,\n\ttype TLExternalContent,\n\ttype TLExternalContentSource,\n} from './lib/editor/types/external-content'\nexport {\n\ttype TLHistoryBatchOptions,\n\ttype TLHistoryDiff,\n\ttype TLHistoryEntry,\n\ttype TLHistoryMark,\n} from './lib/editor/types/history-types'\nexport {\n\ttype OptionalKeys,\n\ttype RequiredKeys,\n\ttype TLCameraConstraints,\n\ttype TLCameraMoveOptions,\n\ttype TLCameraOptions,\n\ttype TLImageExportOptions,\n\ttype TLSvgOptions,\n} from './lib/editor/types/misc-types'\nexport { type TLResizeHandle, type TLSelectionHandle } from './lib/editor/types/selection-types'\nexport { tlenv } from './lib/globals/environment'\nexport { tlmenus } from './lib/globals/menus'\nexport { tltime } from './lib/globals/time'\nexport {\n\tContainerProvider,\n\tuseContainer,\n\tuseContainerIfExists,\n\ttype ContainerProviderProps,\n} from './lib/hooks/useContainer'\nexport { getCursor } from './lib/hooks/useCursor'\nexport { EditorContext, useEditor, useMaybeEditor } from './lib/hooks/useEditor'\nexport { useEditorComponents } from './lib/hooks/useEditorComponents'\nexport type { TLEditorComponents } from './lib/hooks/useEditorComponents'\nexport { useEvent } from './lib/hooks/useEvent'\nexport { useGlobalMenuIsOpen } from './lib/hooks/useGlobalMenuIsOpen'\nexport { useShallowArrayIdentity, useShallowObjectIdentity } from './lib/hooks/useIdentity'\nexport { useIsCropping } from './lib/hooks/useIsCropping'\nexport { useIsDarkMode } from './lib/hooks/useIsDarkMode'\nexport { useIsEditing } from './lib/hooks/useIsEditing'\nexport { useLocalStore } from './lib/hooks/useLocalStore'\nexport { usePassThroughWheelEvents } from './lib/hooks/usePassThroughWheelEvents'\nexport { usePeerIds } from './lib/hooks/usePeerIds'\nexport { usePresence } from './lib/hooks/usePresence'\nexport { useRefState } from './lib/hooks/useRefState'\nexport {\n\tsanitizeId,\n\tsuffixSafeId,\n\tuseSharedSafeId,\n\tuseUniqueSafeId,\n\ttype SafeId,\n} from './lib/hooks/useSafeId'\nexport { useSelectionEvents } from './lib/hooks/useSelectionEvents'\nexport { useTLSchemaFromUtils, useTLStore } from './lib/hooks/useTLStore'\nexport { useTransform } from './lib/hooks/useTransform'\nexport {\n\tLicenseManager,\n\ttype InvalidLicenseKeyResult,\n\ttype InvalidLicenseReason,\n\ttype LicenseFromKeyResult,\n\ttype LicenseInfo,\n\ttype TestEnvironment,\n\ttype ValidLicenseKeyResult,\n} from './lib/license/LicenseManager'\nexport { defaultTldrawOptions, type TldrawOptions } from './lib/options'\nexport {\n\tBox,\n\tROTATE_CORNER_TO_SELECTION_CORNER,\n\trotateSelectionHandle,\n\ttype BoxLike,\n\ttype RotateCorner,\n\ttype SelectionCorner,\n\ttype SelectionEdge,\n\ttype SelectionHandle,\n} from './lib/primitives/Box'\nexport { Mat, type MatLike, type MatModel } from './lib/primitives/Mat'\nexport { Vec, type VecLike } from './lib/primitives/Vec'\nexport { EASINGS } from './lib/primitives/easings'\nexport { Arc2d } from './lib/primitives/geometry/Arc2d'\nexport { Circle2d } from './lib/primitives/geometry/Circle2d'\nexport { CubicBezier2d } from './lib/primitives/geometry/CubicBezier2d'\nexport { CubicSpline2d } from './lib/primitives/geometry/CubicSpline2d'\nexport { Edge2d } from './lib/primitives/geometry/Edge2d'\nexport { Ellipse2d } from './lib/primitives/geometry/Ellipse2d'\nexport { Geometry2d, type Geometry2dOptions } from './lib/primitives/geometry/Geometry2d'\nexport { Group2d } from './lib/primitives/geometry/Group2d'\nexport { Point2d } from './lib/primitives/geometry/Point2d'\nexport { Polygon2d } from './lib/primitives/geometry/Polygon2d'\nexport { Polyline2d } from './lib/primitives/geometry/Polyline2d'\nexport { Rectangle2d } from './lib/primitives/geometry/Rectangle2d'\nexport { Stadium2d } from './lib/primitives/geometry/Stadium2d'\nexport {\n\tintersectCircleCircle,\n\tintersectCirclePolygon,\n\tintersectCirclePolyline,\n\tintersectLineSegmentCircle,\n\tintersectLineSegmentLineSegment,\n\tintersectLineSegmentPolygon,\n\tintersectLineSegmentPolyline,\n\tintersectPolygonBounds,\n\tintersectPolygonPolygon,\n\tlinesIntersect,\n\tpolygonIntersectsPolyline,\n\tpolygonsIntersect,\n} from './lib/primitives/intersect'\nexport {\n\tHALF_PI,\n\tPI,\n\tPI2,\n\tSIN,\n\tangleDistance,\n\tapproximately,\n\tareAnglesCompatible,\n\taverage,\n\tcanonicalizeRotation,\n\tcenterOfCircleFromThreePoints,\n\tclamp,\n\tclampRadians,\n\tclockwiseAngleDist,\n\tcounterClockwiseAngleDist,\n\tdegreesToRadians,\n\tgetArcMeasure,\n\tgetPointInArcT,\n\tgetPointOnCircle,\n\tgetPointsOnArc,\n\tgetPolygonVertices,\n\tisSafeFloat,\n\tperimeterOfEllipse,\n\tpointInPolygon,\n\tprecise,\n\tradiansToDegrees,\n\trangeIntersection,\n\tshortAngleDist,\n\tsnapAngle,\n\ttoDomPrecision,\n\ttoFixed,\n\ttoPrecision,\n} from './lib/primitives/utils'\nexport {\n\tReadonlySharedStyleMap,\n\tSharedStyleMap,\n\ttype SharedStyle,\n} from './lib/utils/SharedStylesMap'\nexport { dataUrlToFile, getDefaultCdnBaseUrl } from './lib/utils/assets'\nexport {\n\tdebugFlags,\n\tfeatureFlags,\n\ttype DebugFlag,\n\ttype DebugFlagDef,\n\ttype DebugFlagDefaults,\n} from './lib/utils/debug-flags'\nexport {\n\tcreateDeepLinkString,\n\tparseDeepLinkString,\n\ttype TLDeepLink,\n\ttype TLDeepLinkOptions,\n} from './lib/utils/deepLinks'\nexport {\n\tloopToHtmlElement,\n\tpreventDefault,\n\treleasePointerCapture,\n\tsetPointerCapture,\n\tstopEventPropagation,\n} from './lib/utils/dom'\nexport { getIncrementedName } from './lib/utils/getIncrementedName'\nexport { getPointerInfo } from './lib/utils/getPointerInfo'\nexport { getSvgPathFromPoints } from './lib/utils/getSvgPathFromPoints'\nexport { hardResetEditor } from './lib/utils/hardResetEditor'\nexport { isAccelKey } from './lib/utils/keyboard'\nexport { normalizeWheel } from './lib/utils/normalizeWheel'\nexport { refreshPage } from './lib/utils/refreshPage'\nexport {\n\tapplyRotationToSnapshotShapes,\n\tgetRotationSnapshot,\n\ttype TLRotationSnapshot,\n} from './lib/utils/rotation'\nexport { runtime, setRuntimeOverrides } from './lib/utils/runtime'\nexport { type TLStoreWithStatus } from './lib/utils/sync/StoreWithStatus'\nexport { hardReset } from './lib/utils/sync/hardReset'\nexport { uniq } from './lib/utils/uniq'\nexport { openWindow } from './lib/utils/window-open'\n\n/**\n * @deprecated Licensing is now enabled in the tldraw SDK.\n * @public */\nexport function debugEnableLicensing() {\n\t// noop\n\treturn\n}\n\nregisterTldrawLibraryVersion(\n\t(globalThis as any).TLDRAW_LIBRARY_NAME,\n\t(globalThis as any).TLDRAW_LIBRARY_VERSION,\n\t(globalThis as any).TLDRAW_LIBRARY_MODULES\n)\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import { registerTldrawLibraryVersion } from '@tldraw/utils'\nimport 'core-js/stable/array/at.js'\nimport 'core-js/stable/array/flat-map.js'\nimport 'core-js/stable/array/flat.js'\nimport 'core-js/stable/string/at.js'\nimport 'core-js/stable/string/replace-all.js'\nexport {\n\tEMPTY_ARRAY,\n\tEffectScheduler,\n\tatom,\n\tcomputed,\n\treact,\n\ttransact,\n\ttransaction,\n\twhyAmIRunning,\n\ttype Atom,\n\ttype Signal,\n} from '@tldraw/state'\nexport {\n\ttrack,\n\tuseAtom,\n\tuseComputed,\n\tuseQuickReactor,\n\tuseReactor,\n\tuseStateTracking,\n\tuseValue,\n} from '@tldraw/state-react'\nexport { LocalIndexedDb, Table, type StoreName } from './lib/utils/sync/LocalIndexedDb'\n// eslint-disable-next-line local/no-export-star\nexport * from '@tldraw/store'\n// eslint-disable-next-line local/no-export-star\nexport * from '@tldraw/tlschema'\n// eslint-disable-next-line local/no-export-star\nexport * from '@tldraw/utils'\n// eslint-disable-next-line local/no-export-star\nexport * from '@tldraw/validate'\nexport {\n\tErrorScreen,\n\tLoadingScreen,\n\tTldrawEditor,\n\tuseOnMount,\n\ttype LoadingScreenProps,\n\ttype TLOnMountHandler,\n\ttype TldrawEditorBaseProps,\n\ttype TldrawEditorProps,\n\ttype TldrawEditorStoreProps,\n\ttype TldrawEditorWithStoreProps,\n\ttype TldrawEditorWithoutStoreProps,\n} from './lib/TldrawEditor'\nexport {\n\tErrorBoundary,\n\tOptionalErrorBoundary,\n\ttype TLErrorBoundaryProps,\n} from './lib/components/ErrorBoundary'\nexport { HTMLContainer, type HTMLContainerProps } from './lib/components/HTMLContainer'\nexport { MenuClickCapture } from './lib/components/MenuClickCapture'\nexport { SVGContainer, type SVGContainerProps } from './lib/components/SVGContainer'\nexport { DefaultBackground } from './lib/components/default-components/DefaultBackground'\nexport { DefaultBrush, type TLBrushProps } from './lib/components/default-components/DefaultBrush'\nexport {\n\tDefaultCanvas,\n\ttype TLCanvasComponentProps,\n} from './lib/components/default-components/DefaultCanvas'\nexport {\n\tDefaultCollaboratorHint,\n\ttype TLCollaboratorHintProps,\n} from './lib/components/default-components/DefaultCollaboratorHint'\nexport {\n\tDefaultCursor,\n\ttype TLCursorProps,\n} from './lib/components/default-components/DefaultCursor'\nexport {\n\tDefaultErrorFallback,\n\ttype TLErrorFallbackComponent,\n} from './lib/components/default-components/DefaultErrorFallback'\nexport { DefaultGrid, type TLGridProps } from './lib/components/default-components/DefaultGrid'\nexport {\n\tDefaultHandle,\n\ttype TLHandleProps,\n} from './lib/components/default-components/DefaultHandle'\nexport {\n\tDefaultHandles,\n\ttype TLHandlesProps,\n} from './lib/components/default-components/DefaultHandles'\nexport {\n\tDefaultScribble,\n\ttype TLScribbleProps,\n} from './lib/components/default-components/DefaultScribble'\nexport {\n\tDefaultSelectionBackground,\n\ttype TLSelectionBackgroundProps,\n} from './lib/components/default-components/DefaultSelectionBackground'\nexport {\n\tDefaultSelectionForeground,\n\ttype TLSelectionForegroundProps,\n} from './lib/components/default-components/DefaultSelectionForeground'\nexport { type TLShapeErrorFallbackComponent } from './lib/components/default-components/DefaultShapeErrorFallback'\nexport {\n\tDefaultShapeIndicator,\n\ttype TLShapeIndicatorProps,\n} from './lib/components/default-components/DefaultShapeIndicator'\nexport { type TLShapeIndicatorErrorFallbackComponent } from './lib/components/default-components/DefaultShapeIndicatorErrorFallback'\nexport { DefaultShapeIndicators } from './lib/components/default-components/DefaultShapeIndicators'\nexport {\n\tDefaultSnapIndicator,\n\ttype TLSnapIndicatorProps,\n} from './lib/components/default-components/DefaultSnapIndictor'\nexport { DefaultSpinner } from './lib/components/default-components/DefaultSpinner'\nexport { DefaultSvgDefs } from './lib/components/default-components/DefaultSvgDefs'\nexport {\n\tgetSnapshot,\n\tloadSnapshot,\n\ttype TLEditorSnapshot,\n\ttype TLLoadSnapshotOptions,\n} from './lib/config/TLEditorSnapshot'\nexport {\n\tTAB_ID,\n\tcreateSessionStateSnapshotSignal,\n\textractSessionStateFromLegacySnapshot,\n\tloadSessionStateSnapshotIntoStore,\n\ttype TLLoadSessionStateSnapshotOptions,\n\ttype TLSessionStateSnapshot,\n} from './lib/config/TLSessionStateSnapshot'\nexport {\n\tUSER_COLORS,\n\tdefaultUserPreferences,\n\tgetFreshUserPreferences,\n\tgetUserPreferences,\n\tsetUserPreferences,\n\tuserTypeValidator,\n\ttype TLUserPreferences,\n} from './lib/config/TLUserPreferences'\nexport {\n\tcreateTLSchemaFromUtils,\n\tcreateTLStore,\n\tinlineBase64AssetStore,\n\ttype TLStoreBaseOptions,\n\ttype TLStoreEventInfo,\n\ttype TLStoreOptions,\n\ttype TLStoreSchemaOptions,\n} from './lib/config/createTLStore'\nexport { createTLUser, useTldrawUser, type TLUser } from './lib/config/createTLUser'\nexport { type TLAnyBindingUtilConstructor } from './lib/config/defaultBindings'\nexport { coreShapes, type TLAnyShapeUtilConstructor } from './lib/config/defaultShapes'\nexport { DEFAULT_ANIMATION_OPTIONS, DEFAULT_CAMERA_OPTIONS, SIDES } from './lib/constants'\nexport {\n\tEditor,\n\ttype TLEditorOptions,\n\ttype TLEditorRunOptions,\n\ttype TLRenderingShape,\n\ttype TLResizeShapeOptions,\n} from './lib/editor/Editor'\nexport {\n\tBindingUtil,\n\ttype BindingOnChangeOptions,\n\ttype BindingOnCreateOptions,\n\ttype BindingOnDeleteOptions,\n\ttype BindingOnShapeChangeOptions,\n\ttype BindingOnShapeDeleteOptions,\n\ttype BindingOnShapeIsolateOptions,\n\ttype TLBindingUtilConstructor,\n} from './lib/editor/bindings/BindingUtil'\nexport { ClickManager, type TLClickState } from './lib/editor/managers/ClickManager'\nexport { EdgeScrollManager } from './lib/editor/managers/EdgeScrollManager'\nexport { HistoryManager } from './lib/editor/managers/HistoryManager'\nexport { ScribbleManager, type ScribbleItem } from './lib/editor/managers/ScribbleManager'\nexport {\n\tBoundsSnaps,\n\ttype BoundsSnapGeometry,\n\ttype BoundsSnapPoint,\n} from './lib/editor/managers/SnapManager/BoundsSnaps'\nexport { HandleSnaps, type HandleSnapGeometry } from './lib/editor/managers/SnapManager/HandleSnaps'\nexport {\n\tSnapManager,\n\ttype GapsSnapIndicator,\n\ttype PointsSnapIndicator,\n\ttype SnapData,\n\ttype SnapIndicator,\n} from './lib/editor/managers/SnapManager/SnapManager'\nexport { TextManager, type TLMeasureTextSpanOpts } from './lib/editor/managers/TextManager'\nexport { UserPreferencesManager } from './lib/editor/managers/UserPreferencesManager'\nexport { BaseBoxShapeUtil, type TLBaseBoxShape } from './lib/editor/shapes/BaseBoxShapeUtil'\nexport {\n\tShapeUtil,\n\ttype TLHandleDragInfo,\n\ttype TLResizeInfo,\n\ttype TLResizeMode,\n\ttype TLShapeUtilCanBindOpts,\n\ttype TLShapeUtilCanvasSvgDef,\n\ttype TLShapeUtilConstructor,\n} from './lib/editor/shapes/ShapeUtil'\nexport { GroupShapeUtil } from './lib/editor/shapes/group/GroupShapeUtil'\nexport { getPerfectDashProps } from './lib/editor/shapes/shared/getPerfectDashProps'\nexport { resizeBox, type ResizeBoxOptions } from './lib/editor/shapes/shared/resizeBox'\nexport { BaseBoxShapeTool } from './lib/editor/tools/BaseBoxShapeTool/BaseBoxShapeTool'\nexport { maybeSnapToGrid } from './lib/editor/tools/BaseBoxShapeTool/children/Pointing'\nexport { StateNode, type TLStateNodeConstructor } from './lib/editor/tools/StateNode'\nexport {\n\tuseDelaySvgExport,\n\tuseSvgExportContext,\n\ttype SvgExportContext,\n\ttype SvgExportDef,\n} from './lib/editor/types/SvgExportContext'\nexport { type TLContent } from './lib/editor/types/clipboard-types'\nexport { type TLEventMap, type TLEventMapHandler } from './lib/editor/types/emit-types'\nexport {\n\tEVENT_NAME_MAP,\n\ttype TLBaseEventInfo,\n\ttype TLCLickEventName,\n\ttype TLCancelEvent,\n\ttype TLCancelEventInfo,\n\ttype TLClickEvent,\n\ttype TLClickEventInfo,\n\ttype TLCompleteEvent,\n\ttype TLCompleteEventInfo,\n\ttype TLEnterEventHandler,\n\ttype TLEventHandlers,\n\ttype TLEventInfo,\n\ttype TLEventName,\n\ttype TLExitEventHandler,\n\ttype TLInterruptEvent,\n\ttype TLInterruptEventInfo,\n\ttype TLKeyboardEvent,\n\ttype TLKeyboardEventInfo,\n\ttype TLKeyboardEventName,\n\ttype TLPinchEvent,\n\ttype TLPinchEventInfo,\n\ttype TLPinchEventName,\n\ttype TLPointerEvent,\n\ttype TLPointerEventInfo,\n\ttype TLPointerEventName,\n\ttype TLPointerEventTarget,\n\ttype TLTickEvent,\n\ttype TLTickEventInfo,\n\ttype TLWheelEvent,\n\ttype TLWheelEventInfo,\n\ttype UiEvent,\n\ttype UiEventType,\n} from './lib/editor/types/event-types'\nexport {\n\ttype TLExternalAssetContent,\n\ttype TLExternalContent,\n\ttype TLExternalContentSource,\n} from './lib/editor/types/external-content'\nexport {\n\ttype TLHistoryBatchOptions,\n\ttype TLHistoryDiff,\n\ttype TLHistoryEntry,\n\ttype TLHistoryMark,\n} from './lib/editor/types/history-types'\nexport {\n\ttype OptionalKeys,\n\ttype RequiredKeys,\n\ttype TLCameraConstraints,\n\ttype TLCameraMoveOptions,\n\ttype TLCameraOptions,\n\ttype TLImageExportOptions,\n\ttype TLSvgOptions,\n} from './lib/editor/types/misc-types'\nexport { type TLResizeHandle, type TLSelectionHandle } from './lib/editor/types/selection-types'\nexport { tlenv } from './lib/globals/environment'\nexport { tlmenus } from './lib/globals/menus'\nexport { tltime } from './lib/globals/time'\nexport {\n\tContainerProvider,\n\tuseContainer,\n\tuseContainerIfExists,\n\ttype ContainerProviderProps,\n} from './lib/hooks/useContainer'\nexport { getCursor } from './lib/hooks/useCursor'\nexport { EditorContext, useEditor, useMaybeEditor } from './lib/hooks/useEditor'\nexport { useEditorComponents } from './lib/hooks/useEditorComponents'\nexport type { TLEditorComponents } from './lib/hooks/useEditorComponents'\nexport { useEvent, useReactiveEvent } from './lib/hooks/useEvent'\nexport { useGlobalMenuIsOpen } from './lib/hooks/useGlobalMenuIsOpen'\nexport { useShallowArrayIdentity, useShallowObjectIdentity } from './lib/hooks/useIdentity'\nexport { useIsCropping } from './lib/hooks/useIsCropping'\nexport { useIsDarkMode } from './lib/hooks/useIsDarkMode'\nexport { useIsEditing } from './lib/hooks/useIsEditing'\nexport { useLocalStore } from './lib/hooks/useLocalStore'\nexport { usePassThroughWheelEvents } from './lib/hooks/usePassThroughWheelEvents'\nexport { usePeerIds } from './lib/hooks/usePeerIds'\nexport { usePresence } from './lib/hooks/usePresence'\nexport { useRefState } from './lib/hooks/useRefState'\nexport {\n\tsanitizeId,\n\tsuffixSafeId,\n\tuseSharedSafeId,\n\tuseUniqueSafeId,\n\ttype SafeId,\n} from './lib/hooks/useSafeId'\nexport { useSelectionEvents } from './lib/hooks/useSelectionEvents'\nexport { useTLSchemaFromUtils, useTLStore } from './lib/hooks/useTLStore'\nexport { useTransform } from './lib/hooks/useTransform'\nexport {\n\tLicenseManager,\n\ttype InvalidLicenseKeyResult,\n\ttype InvalidLicenseReason,\n\ttype LicenseFromKeyResult,\n\ttype LicenseInfo,\n\ttype TestEnvironment,\n\ttype ValidLicenseKeyResult,\n} from './lib/license/LicenseManager'\nexport { defaultTldrawOptions, type TldrawOptions } from './lib/options'\nexport {\n\tBox,\n\tROTATE_CORNER_TO_SELECTION_CORNER,\n\trotateSelectionHandle,\n\ttype BoxLike,\n\ttype RotateCorner,\n\ttype SelectionCorner,\n\ttype SelectionEdge,\n\ttype SelectionHandle,\n} from './lib/primitives/Box'\nexport { Mat, type MatLike, type MatModel } from './lib/primitives/Mat'\nexport { Vec, type VecLike } from './lib/primitives/Vec'\nexport { EASINGS } from './lib/primitives/easings'\nexport { Arc2d } from './lib/primitives/geometry/Arc2d'\nexport { Circle2d } from './lib/primitives/geometry/Circle2d'\nexport { CubicBezier2d } from './lib/primitives/geometry/CubicBezier2d'\nexport { CubicSpline2d } from './lib/primitives/geometry/CubicSpline2d'\nexport { Edge2d } from './lib/primitives/geometry/Edge2d'\nexport { Ellipse2d } from './lib/primitives/geometry/Ellipse2d'\nexport { Geometry2d, type Geometry2dOptions } from './lib/primitives/geometry/Geometry2d'\nexport { Group2d } from './lib/primitives/geometry/Group2d'\nexport { Point2d } from './lib/primitives/geometry/Point2d'\nexport { Polygon2d } from './lib/primitives/geometry/Polygon2d'\nexport { Polyline2d } from './lib/primitives/geometry/Polyline2d'\nexport { Rectangle2d } from './lib/primitives/geometry/Rectangle2d'\nexport { Stadium2d } from './lib/primitives/geometry/Stadium2d'\nexport {\n\tintersectCircleCircle,\n\tintersectCirclePolygon,\n\tintersectCirclePolyline,\n\tintersectLineSegmentCircle,\n\tintersectLineSegmentLineSegment,\n\tintersectLineSegmentPolygon,\n\tintersectLineSegmentPolyline,\n\tintersectPolygonBounds,\n\tintersectPolygonPolygon,\n\tlinesIntersect,\n\tpolygonIntersectsPolyline,\n\tpolygonsIntersect,\n} from './lib/primitives/intersect'\nexport {\n\tHALF_PI,\n\tPI,\n\tPI2,\n\tSIN,\n\tangleDistance,\n\tapproximately,\n\tareAnglesCompatible,\n\taverage,\n\tcanonicalizeRotation,\n\tcenterOfCircleFromThreePoints,\n\tclamp,\n\tclampRadians,\n\tclockwiseAngleDist,\n\tcounterClockwiseAngleDist,\n\tdegreesToRadians,\n\tgetArcMeasure,\n\tgetPointInArcT,\n\tgetPointOnCircle,\n\tgetPointsOnArc,\n\tgetPolygonVertices,\n\tisSafeFloat,\n\tperimeterOfEllipse,\n\tpointInPolygon,\n\tprecise,\n\tradiansToDegrees,\n\trangeIntersection,\n\tshortAngleDist,\n\tsnapAngle,\n\ttoDomPrecision,\n\ttoFixed,\n\ttoPrecision,\n} from './lib/primitives/utils'\nexport {\n\tReadonlySharedStyleMap,\n\tSharedStyleMap,\n\ttype SharedStyle,\n} from './lib/utils/SharedStylesMap'\nexport { dataUrlToFile, getDefaultCdnBaseUrl } from './lib/utils/assets'\nexport {\n\tdebugFlags,\n\tfeatureFlags,\n\ttype DebugFlag,\n\ttype DebugFlagDef,\n\ttype DebugFlagDefaults,\n} from './lib/utils/debug-flags'\nexport {\n\tcreateDeepLinkString,\n\tparseDeepLinkString,\n\ttype TLDeepLink,\n\ttype TLDeepLinkOptions,\n} from './lib/utils/deepLinks'\nexport {\n\tloopToHtmlElement,\n\tpreventDefault,\n\treleasePointerCapture,\n\tsetPointerCapture,\n\tstopEventPropagation,\n} from './lib/utils/dom'\nexport { getIncrementedName } from './lib/utils/getIncrementedName'\nexport { getPointerInfo } from './lib/utils/getPointerInfo'\nexport { getSvgPathFromPoints } from './lib/utils/getSvgPathFromPoints'\nexport { hardResetEditor } from './lib/utils/hardResetEditor'\nexport { isAccelKey } from './lib/utils/keyboard'\nexport { normalizeWheel } from './lib/utils/normalizeWheel'\nexport { refreshPage } from './lib/utils/refreshPage'\nexport {\n\tapplyRotationToSnapshotShapes,\n\tgetRotationSnapshot,\n\ttype TLRotationSnapshot,\n} from './lib/utils/rotation'\nexport { runtime, setRuntimeOverrides } from './lib/utils/runtime'\nexport { type TLStoreWithStatus } from './lib/utils/sync/StoreWithStatus'\nexport { hardReset } from './lib/utils/sync/hardReset'\nexport { uniq } from './lib/utils/uniq'\nexport { openWindow } from './lib/utils/window-open'\n\n/**\n * @deprecated Licensing is now enabled in the tldraw SDK.\n * @public */\nexport function debugEnableLicensing() {\n\t// noop\n\treturn\n}\n\nregisterTldrawLibraryVersion(\n\t(globalThis as any).TLDRAW_LIBRARY_NAME,\n\t(globalThis as any).TLDRAW_LIBRARY_VERSION,\n\t(globalThis as any).TLDRAW_LIBRARY_MODULES\n)\n"],
5
+ "mappings": "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",
6
6
  "names": ["import_at", "import_utils"]
7
7
  }
@@ -318,7 +318,7 @@ function TldrawEditorWithReadyStore({
318
318
  fallback: ErrorFallback,
319
319
  onError: (error) => editor.annotateError(error, { origin: "react.tldraw", willCrashApp: true }),
320
320
  children: crashingError ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Crash, { crashingError }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_useEditor.EditorProvider, { editor, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Layout, { onMount, children: [
321
- children ?? (Canvas ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Canvas, {}) : null),
321
+ children ?? (Canvas ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Canvas, {}, editor.contextId) : null),
322
322
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Watermark.Watermark, {})
323
323
  ] }) })
324
324
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/lib/TldrawEditor.tsx"],
4
- "sourcesContent": ["import { MigrationSequence, Store } from '@tldraw/store'\nimport { TLShape, TLStore, TLStoreSnapshot } from '@tldraw/tlschema'\nimport { Required, annotateError } from '@tldraw/utils'\nimport React, {\n\tReactNode,\n\tmemo,\n\tuseCallback,\n\tuseEffect,\n\tuseLayoutEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n\tuseSyncExternalStore,\n} from 'react'\n\nimport classNames from 'classnames'\nimport { TLDeepLinkOptions } from '..'\nimport { version } from '../version'\nimport { OptionalErrorBoundary } from './components/ErrorBoundary'\nimport { DefaultErrorFallback } from './components/default-components/DefaultErrorFallback'\nimport { TLEditorSnapshot } from './config/TLEditorSnapshot'\nimport { TLStoreBaseOptions } from './config/createTLStore'\nimport { TLUser, createTLUser } from './config/createTLUser'\nimport { TLAnyBindingUtilConstructor } from './config/defaultBindings'\nimport { TLAnyShapeUtilConstructor } from './config/defaultShapes'\nimport { Editor } from './editor/Editor'\nimport { TLStateNodeConstructor } from './editor/tools/StateNode'\nimport { TLCameraOptions } from './editor/types/misc-types'\nimport { ContainerProvider, useContainer } from './hooks/useContainer'\nimport { useCursor } from './hooks/useCursor'\nimport { useDarkMode } from './hooks/useDarkMode'\nimport { EditorProvider, useEditor } from './hooks/useEditor'\nimport {\n\tEditorComponentsProvider,\n\tTLEditorComponents,\n\tuseEditorComponents,\n} from './hooks/useEditorComponents'\nimport { useEvent } from './hooks/useEvent'\nimport { useForceUpdate } from './hooks/useForceUpdate'\nimport { useShallowObjectIdentity } from './hooks/useIdentity'\nimport { useLocalStore } from './hooks/useLocalStore'\nimport { useRefState } from './hooks/useRefState'\nimport { useZoomCss } from './hooks/useZoomCss'\nimport { LicenseProvider } from './license/LicenseProvider'\nimport { Watermark } from './license/Watermark'\nimport { TldrawOptions } from './options'\nimport { stopEventPropagation } from './utils/dom'\nimport { TLStoreWithStatus } from './utils/sync/StoreWithStatus'\n\n/**\n * Props for the {@link tldraw#Tldraw} and {@link TldrawEditor} components, when passing in a\n * {@link store#TLStore} directly. If you would like tldraw to create a store for you, use\n * {@link TldrawEditorWithoutStoreProps}.\n *\n * @public\n */\nexport interface TldrawEditorWithStoreProps {\n\t/**\n\t * The store to use in the editor.\n\t */\n\tstore: TLStore | TLStoreWithStatus\n}\n\n/**\n * Props for the {@link tldraw#Tldraw} and {@link TldrawEditor} components, when not passing in a\n * {@link store#TLStore} directly. If you would like to pass in a store directly, use\n * {@link TldrawEditorWithStoreProps}.\n *\n * @public\n */\nexport interface TldrawEditorWithoutStoreProps extends TLStoreBaseOptions {\n\tstore?: undefined\n\n\t/**\n\t * Additional migrations to use in the store\n\t */\n\tmigrations?: readonly MigrationSequence[]\n\n\t/**\n\t * A starting snapshot of data to pre-populate the store. Do not supply both this and\n\t * `initialData`.\n\t */\n\tsnapshot?: TLEditorSnapshot | TLStoreSnapshot\n\n\t/**\n\t * If you would like to persist the store to the browser's local IndexedDB storage and sync it\n\t * across tabs, provide a key here. Each key represents a single tldraw document.\n\t */\n\tpersistenceKey?: string\n\n\tsessionId?: string\n}\n\n/** @public */\nexport type TldrawEditorStoreProps = TldrawEditorWithStoreProps | TldrawEditorWithoutStoreProps\n\n/**\n * Props for the {@link tldraw#Tldraw} and {@link TldrawEditor} components.\n *\n * @public\n **/\nexport type TldrawEditorProps = TldrawEditorBaseProps & TldrawEditorStoreProps\n\n/**\n * Base props for the {@link tldraw#Tldraw} and {@link TldrawEditor} components.\n *\n * @public\n */\nexport interface TldrawEditorBaseProps {\n\t/**\n\t * The component's children.\n\t */\n\tchildren?: ReactNode\n\n\t/**\n\t * An array of shape utils to use in the editor.\n\t */\n\tshapeUtils?: readonly TLAnyShapeUtilConstructor[]\n\n\t/**\n\t * An array of binding utils to use in the editor.\n\t */\n\tbindingUtils?: readonly TLAnyBindingUtilConstructor[]\n\n\t/**\n\t * An array of tools to add to the editor's state chart.\n\t */\n\ttools?: readonly TLStateNodeConstructor[]\n\n\t/**\n\t * Whether to automatically focus the editor when it mounts.\n\t */\n\tautoFocus?: boolean\n\n\t/**\n\t * Overrides for the editor's components, such as handles, collaborator cursors, etc.\n\t */\n\tcomponents?: TLEditorComponents\n\n\t/**\n\t * Called when the editor has mounted.\n\t */\n\tonMount?: TLOnMountHandler\n\n\t/**\n\t * The editor's initial state (usually the id of the first active tool).\n\t */\n\tinitialState?: string\n\n\t/**\n\t * A classname to pass to the editor's container.\n\t */\n\tclassName?: string\n\n\t/**\n\t * The user interacting with the editor.\n\t */\n\tuser?: TLUser\n\n\t/**\n\t * Whether to infer dark mode from the user's OS. Defaults to false.\n\t */\n\tinferDarkMode?: boolean\n\n\t/**\n\t * Camera options for the editor.\n\t */\n\tcameraOptions?: Partial<TLCameraOptions>\n\n\t/**\n\t * Options for the editor.\n\t */\n\toptions?: Partial<TldrawOptions>\n\n\t/**\n\t * The license key.\n\t */\n\tlicenseKey?: string\n\n\t/**\n\t * Options for syncing the editor's camera state with the URL.\n\t */\n\tdeepLinks?: true | TLDeepLinkOptions\n\n\t/**\n\t * Predicate for whether or not a shape should be hidden.\n\t *\n\t * Hidden shapes will not render in the editor, and they will not be eligible for hit test via\n\t * {@link Editor#getShapeAtPoint} and {@link Editor#getShapesAtPoint}. But otherwise they will\n\t * remain in the store and participate in all other operations.\n\t */\n\tisShapeHidden?(shape: TLShape, editor: Editor): boolean\n}\n\n/**\n * Called when the editor has mounted.\n * @example\n * ```ts\n * <Tldraw onMount={(editor) => editor.selectAll()} />\n * ```\n * @param editor - The editor instance.\n *\n * @public\n */\nexport type TLOnMountHandler = (editor: Editor) => (() => void | undefined) | undefined | void\n\ndeclare global {\n\tinterface Window {\n\t\ttldrawReady: boolean\n\t}\n}\n\nconst EMPTY_SHAPE_UTILS_ARRAY = [] as const\nconst EMPTY_BINDING_UTILS_ARRAY = [] as const\nconst EMPTY_TOOLS_ARRAY = [] as const\n/** @internal */\nexport const TL_CONTAINER_CLASS = 'tl-container'\n\n/** @public @react */\nexport const TldrawEditor = memo(function TldrawEditor({\n\tstore,\n\tcomponents,\n\tclassName,\n\tuser: _user,\n\toptions: _options,\n\t...rest\n}: TldrawEditorProps) {\n\tconst [container, setContainer] = useState<HTMLElement | null>(null)\n\tconst user = useMemo(() => _user ?? createTLUser(), [_user])\n\n\tconst ErrorFallback =\n\t\tcomponents?.ErrorFallback === undefined ? DefaultErrorFallback : components?.ErrorFallback\n\n\t// apply defaults. if you're using the bare @tldraw/editor package, we\n\t// default these to the \"tldraw zero\" configuration. We have different\n\t// defaults applied in tldraw.\n\tconst withDefaults = {\n\t\t...rest,\n\t\tshapeUtils: rest.shapeUtils ?? EMPTY_SHAPE_UTILS_ARRAY,\n\t\tbindingUtils: rest.bindingUtils ?? EMPTY_BINDING_UTILS_ARRAY,\n\t\ttools: rest.tools ?? EMPTY_TOOLS_ARRAY,\n\t\tcomponents,\n\t\toptions: useShallowObjectIdentity(_options),\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tref={setContainer}\n\t\t\tdata-tldraw={version}\n\t\t\tdraggable={false}\n\t\t\tclassName={classNames(`${TL_CONTAINER_CLASS} tl-theme__light`, className)}\n\t\t\tonPointerDown={stopEventPropagation}\n\t\t\ttabIndex={-1}\n\t\t>\n\t\t\t<OptionalErrorBoundary\n\t\t\t\tfallback={ErrorFallback}\n\t\t\t\tonError={(error) => annotateError(error, { tags: { origin: 'react.tldraw-before-app' } })}\n\t\t\t>\n\t\t\t\t{container && (\n\t\t\t\t\t<LicenseProvider licenseKey={rest.licenseKey}>\n\t\t\t\t\t\t<ContainerProvider container={container}>\n\t\t\t\t\t\t\t<EditorComponentsProvider overrides={components}>\n\t\t\t\t\t\t\t\t{store ? (\n\t\t\t\t\t\t\t\t\tstore instanceof Store ? (\n\t\t\t\t\t\t\t\t\t\t// Store is ready to go, whether externally synced or not\n\t\t\t\t\t\t\t\t\t\t<TldrawEditorWithReadyStore {...withDefaults} store={store} user={user} />\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t// Store is a synced store, so handle syncing stages internally\n\t\t\t\t\t\t\t\t\t\t<TldrawEditorWithLoadingStore {...withDefaults} store={store} user={user} />\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t// We have no store (it's undefined) so create one and possibly sync it\n\t\t\t\t\t\t\t\t\t<TldrawEditorWithOwnStore {...withDefaults} store={store} user={user} />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</EditorComponentsProvider>\n\t\t\t\t\t\t</ContainerProvider>\n\t\t\t\t\t</LicenseProvider>\n\t\t\t\t)}\n\t\t\t</OptionalErrorBoundary>\n\t\t</div>\n\t)\n})\n\nfunction TldrawEditorWithOwnStore(\n\tprops: Required<\n\t\tTldrawEditorProps & { store: undefined; user: TLUser },\n\t\t'shapeUtils' | 'bindingUtils' | 'tools'\n\t>\n) {\n\tconst {\n\t\tdefaultName,\n\t\tsnapshot,\n\t\tinitialData,\n\t\tshapeUtils,\n\t\tbindingUtils,\n\t\tpersistenceKey,\n\t\tsessionId,\n\t\tuser,\n\t\tassets,\n\t} = props\n\n\tconst syncedStore = useLocalStore({\n\t\tshapeUtils,\n\t\tbindingUtils,\n\t\tinitialData,\n\t\tpersistenceKey,\n\t\tsessionId,\n\t\tdefaultName,\n\t\tsnapshot,\n\t\tassets,\n\t})\n\n\treturn <TldrawEditorWithLoadingStore {...props} store={syncedStore} user={user} />\n}\n\nconst TldrawEditorWithLoadingStore = memo(function TldrawEditorBeforeLoading({\n\tstore,\n\tuser,\n\t...rest\n}: Required<\n\tTldrawEditorProps & { store: TLStoreWithStatus; user: TLUser },\n\t'shapeUtils' | 'bindingUtils' | 'tools'\n>) {\n\tconst container = useContainer()\n\n\tuseLayoutEffect(() => {\n\t\tif (user.userPreferences.get().colorScheme === 'dark') {\n\t\t\tcontainer.classList.remove('tl-theme__light')\n\t\t\tcontainer.classList.add('tl-theme__dark')\n\t\t}\n\t}, [container, user])\n\n\tconst { LoadingScreen } = useEditorComponents()\n\n\tswitch (store.status) {\n\t\tcase 'error': {\n\t\t\t// for error handling, we fall back to the default error boundary.\n\t\t\t// if users want to handle this error differently, they can render\n\t\t\t// their own error screen before the TldrawEditor component\n\t\t\tthrow store.error\n\t\t}\n\t\tcase 'loading': {\n\t\t\treturn LoadingScreen ? <LoadingScreen /> : null\n\t\t}\n\t\tcase 'not-synced': {\n\t\t\tbreak\n\t\t}\n\t\tcase 'synced-local': {\n\t\t\tbreak\n\t\t}\n\t\tcase 'synced-remote': {\n\t\t\tbreak\n\t\t}\n\t}\n\n\treturn <TldrawEditorWithReadyStore {...rest} store={store.store} user={user} />\n})\n\nconst noAutoFocus = () => document.location.search.includes('tldraw_preserve_focus') // || !document.hasFocus() // breaks in nextjs\n\nfunction TldrawEditorWithReadyStore({\n\tonMount,\n\tchildren,\n\tstore,\n\ttools,\n\tshapeUtils,\n\tbindingUtils,\n\tuser,\n\tinitialState,\n\tautoFocus = true,\n\tinferDarkMode,\n\tcameraOptions,\n\toptions,\n\tlicenseKey,\n\tdeepLinks: _deepLinks,\n\tisShapeHidden,\n}: Required<\n\tTldrawEditorProps & {\n\t\tstore: TLStore\n\t\tuser: TLUser\n\t},\n\t'shapeUtils' | 'bindingUtils' | 'tools'\n>) {\n\tconst { ErrorFallback } = useEditorComponents()\n\tconst container = useContainer()\n\n\tconst [editor, setEditor] = useRefState<Editor | null>(null)\n\n\tconst canvasRef = useRef<HTMLDivElement | null>(null)\n\n\tconst deepLinks = useShallowObjectIdentity(_deepLinks === true ? {} : _deepLinks)\n\n\t// props in this ref can be changed without causing the editor to be recreated.\n\tconst editorOptionsRef = useRef({\n\t\t// for these, it's because they're only used when the editor first mounts:\n\t\tautoFocus: autoFocus && !noAutoFocus(),\n\t\tinferDarkMode,\n\t\tinitialState,\n\n\t\t// for these, it's because we keep them up to date in a separate effect:\n\t\tcameraOptions,\n\t\tdeepLinks,\n\t})\n\n\tuseLayoutEffect(() => {\n\t\teditorOptionsRef.current = {\n\t\t\tautoFocus: autoFocus && !noAutoFocus(),\n\t\t\tinferDarkMode,\n\t\t\tinitialState,\n\t\t\tcameraOptions,\n\t\t\tdeepLinks,\n\t\t}\n\t}, [autoFocus, inferDarkMode, initialState, cameraOptions, deepLinks])\n\n\tuseLayoutEffect(\n\t\t() => {\n\t\t\tconst { autoFocus, inferDarkMode, initialState, cameraOptions, deepLinks } =\n\t\t\t\teditorOptionsRef.current\n\t\t\tconst editor = new Editor({\n\t\t\t\tstore,\n\t\t\t\tshapeUtils,\n\t\t\t\tbindingUtils,\n\t\t\t\ttools,\n\t\t\t\tgetContainer: () => container,\n\t\t\t\tuser,\n\t\t\t\tinitialState,\n\t\t\t\t// we should check for some kind of query parameter that turns off autofocus\n\t\t\t\tautoFocus,\n\t\t\t\tinferDarkMode,\n\t\t\t\tcameraOptions,\n\t\t\t\toptions,\n\t\t\t\tlicenseKey,\n\t\t\t\tisShapeHidden,\n\t\t\t})\n\n\t\t\teditor.updateViewportScreenBounds(canvasRef.current ?? container)\n\n\t\t\t// Use the ref here because we only want to do this once when the editor is created.\n\t\t\t// We don't want changes to the urlStateSync prop to trigger creating new editors.\n\t\t\tif (deepLinks) {\n\t\t\t\tif (!deepLinks?.getUrl) {\n\t\t\t\t\t// load the state from window.location\n\t\t\t\t\teditor.navigateToDeepLink(deepLinks)\n\t\t\t\t} else {\n\t\t\t\t\t// load the state from the provided URL\n\t\t\t\t\teditor.navigateToDeepLink({ ...deepLinks, url: deepLinks.getUrl(editor) })\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tsetEditor(editor)\n\n\t\t\treturn () => {\n\t\t\t\teditor.dispose()\n\t\t\t}\n\t\t},\n\t\t// if any of these change, we need to recreate the editor.\n\t\t[\n\t\t\tbindingUtils,\n\t\t\tcontainer,\n\t\t\toptions,\n\t\t\tshapeUtils,\n\t\t\tstore,\n\t\t\ttools,\n\t\t\tuser,\n\t\t\tsetEditor,\n\t\t\tlicenseKey,\n\t\t\tisShapeHidden,\n\t\t]\n\t)\n\n\tuseLayoutEffect(() => {\n\t\tif (!editor) return\n\t\tif (deepLinks) {\n\t\t\treturn editor.registerDeepLinkListener(deepLinks)\n\t\t}\n\t}, [editor, deepLinks])\n\n\t// keep the editor up to date with the latest camera options\n\tuseLayoutEffect(() => {\n\t\tif (editor && cameraOptions) {\n\t\t\teditor.setCameraOptions(cameraOptions)\n\t\t}\n\t}, [editor, cameraOptions])\n\n\tconst crashingError = useSyncExternalStore(\n\t\tuseCallback(\n\t\t\t(onStoreChange) => {\n\t\t\t\tif (editor) {\n\t\t\t\t\teditor.on('crash', onStoreChange)\n\t\t\t\t\treturn () => editor.off('crash', onStoreChange)\n\t\t\t\t}\n\t\t\t\treturn () => {\n\t\t\t\t\t// noop\n\t\t\t\t}\n\t\t\t},\n\t\t\t[editor]\n\t\t),\n\t\t() => editor?.getCrashingError() ?? null\n\t)\n\n\t// For our examples site, we want autoFocus to be true on the examples site, but not\n\t// when embedded in our docs site. If present, the `tldraw_preserve_focus` search param\n\t// overrides the `autoFocus` prop and prevents the editor from focusing immediately,\n\t// however here we also add some logic to focus the editor when the user clicks\n\t// on it and unfocus it when the user clicks away from it.\n\tuseEffect(\n\t\tfunction handleFocusOnPointerDownForPreserveFocusMode() {\n\t\t\tif (!editor) return\n\n\t\t\tfunction handleFocusOnPointerDown() {\n\t\t\t\tif (!editor) return\n\t\t\t\teditor.focus()\n\t\t\t}\n\n\t\t\tfunction handleBlurOnPointerDown() {\n\t\t\t\tif (!editor) return\n\t\t\t\teditor.blur()\n\t\t\t}\n\n\t\t\tif (autoFocus && noAutoFocus()) {\n\t\t\t\teditor.getContainer().addEventListener('pointerdown', handleFocusOnPointerDown)\n\t\t\t\tdocument.body.addEventListener('pointerdown', handleBlurOnPointerDown)\n\n\t\t\t\treturn () => {\n\t\t\t\t\teditor.getContainer()?.removeEventListener('pointerdown', handleFocusOnPointerDown)\n\t\t\t\t\tdocument.body.removeEventListener('pointerdown', handleBlurOnPointerDown)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[editor, autoFocus]\n\t)\n\n\tconst { Canvas } = useEditorComponents()\n\n\tif (!editor) {\n\t\treturn <div className=\"tl-canvas\" ref={canvasRef} />\n\t}\n\n\treturn (\n\t\t// the top-level tldraw component also renders an error boundary almost\n\t\t// identical to this one. the reason we have two is because this one has\n\t\t// access to `App`, which means that here we can enrich errors with data\n\t\t// from app for reporting, and also still attempt to render the user's\n\t\t// document in the event of an error to reassure them that their work is\n\t\t// not lost.\n\t\t<OptionalErrorBoundary\n\t\t\tfallback={ErrorFallback as any}\n\t\t\tonError={(error) =>\n\t\t\t\teditor.annotateError(error, { origin: 'react.tldraw', willCrashApp: true })\n\t\t\t}\n\t\t>\n\t\t\t{crashingError ? (\n\t\t\t\t<Crash crashingError={crashingError} />\n\t\t\t) : (\n\t\t\t\t<EditorProvider editor={editor}>\n\t\t\t\t\t<Layout onMount={onMount}>\n\t\t\t\t\t\t{children ?? (Canvas ? <Canvas /> : null)}\n\t\t\t\t\t\t<Watermark />\n\t\t\t\t\t</Layout>\n\t\t\t\t</EditorProvider>\n\t\t\t)}\n\t\t</OptionalErrorBoundary>\n\t)\n}\n\nfunction Layout({ children, onMount }: { children: ReactNode; onMount?: TLOnMountHandler }) {\n\tuseZoomCss()\n\tuseCursor()\n\tuseDarkMode()\n\tuseForceUpdate()\n\tuseOnMount((editor) => {\n\t\tconst teardownStore = editor.store.props.onMount(editor)\n\t\tconst teardownCallback = onMount?.(editor)\n\n\t\treturn () => {\n\t\t\tteardownStore?.()\n\t\t\tteardownCallback?.()\n\t\t}\n\t})\n\n\treturn children\n}\n\nfunction Crash({ crashingError }: { crashingError: unknown }): null {\n\tthrow crashingError\n}\n\n/** @public */\nexport interface LoadingScreenProps {\n\tchildren: ReactNode\n}\n\n/** @public @react */\nexport function LoadingScreen({ children }: LoadingScreenProps) {\n\treturn <div className=\"tl-loading\">{children}</div>\n}\n\n/** @public @react */\nexport function ErrorScreen({ children }: LoadingScreenProps) {\n\treturn <div className=\"tl-loading\">{children}</div>\n}\n\n/** @internal */\nexport function useOnMount(onMount?: TLOnMountHandler) {\n\tconst editor = useEditor()\n\n\tconst onMountEvent = useEvent((editor: Editor) => {\n\t\tlet teardown: (() => void) | void = undefined\n\t\t// If the user wants to do something when the editor mounts, we make sure it doesn't effect the history.\n\t\t// todo: is this reeeeally what we want to do, or should we leave it up to the caller?\n\t\teditor.run(\n\t\t\t() => {\n\t\t\t\tteardown = onMount?.(editor)\n\t\t\t\teditor.emit('mount')\n\t\t\t},\n\t\t\t{ history: 'ignore' }\n\t\t)\n\t\twindow.tldrawReady = true\n\t\treturn teardown\n\t})\n\n\tReact.useLayoutEffect(() => {\n\t\tif (editor) return onMountEvent?.(editor)\n\t}, [editor, onMountEvent])\n}\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import { MigrationSequence, Store } from '@tldraw/store'\nimport { TLShape, TLStore, TLStoreSnapshot } from '@tldraw/tlschema'\nimport { Required, annotateError } from '@tldraw/utils'\nimport React, {\n\tReactNode,\n\tmemo,\n\tuseCallback,\n\tuseEffect,\n\tuseLayoutEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n\tuseSyncExternalStore,\n} from 'react'\n\nimport classNames from 'classnames'\nimport { TLDeepLinkOptions } from '..'\nimport { version } from '../version'\nimport { OptionalErrorBoundary } from './components/ErrorBoundary'\nimport { DefaultErrorFallback } from './components/default-components/DefaultErrorFallback'\nimport { TLEditorSnapshot } from './config/TLEditorSnapshot'\nimport { TLStoreBaseOptions } from './config/createTLStore'\nimport { TLUser, createTLUser } from './config/createTLUser'\nimport { TLAnyBindingUtilConstructor } from './config/defaultBindings'\nimport { TLAnyShapeUtilConstructor } from './config/defaultShapes'\nimport { Editor } from './editor/Editor'\nimport { TLStateNodeConstructor } from './editor/tools/StateNode'\nimport { TLCameraOptions } from './editor/types/misc-types'\nimport { ContainerProvider, useContainer } from './hooks/useContainer'\nimport { useCursor } from './hooks/useCursor'\nimport { useDarkMode } from './hooks/useDarkMode'\nimport { EditorProvider, useEditor } from './hooks/useEditor'\nimport {\n\tEditorComponentsProvider,\n\tTLEditorComponents,\n\tuseEditorComponents,\n} from './hooks/useEditorComponents'\nimport { useEvent } from './hooks/useEvent'\nimport { useForceUpdate } from './hooks/useForceUpdate'\nimport { useShallowObjectIdentity } from './hooks/useIdentity'\nimport { useLocalStore } from './hooks/useLocalStore'\nimport { useRefState } from './hooks/useRefState'\nimport { useZoomCss } from './hooks/useZoomCss'\nimport { LicenseProvider } from './license/LicenseProvider'\nimport { Watermark } from './license/Watermark'\nimport { TldrawOptions } from './options'\nimport { stopEventPropagation } from './utils/dom'\nimport { TLStoreWithStatus } from './utils/sync/StoreWithStatus'\n\n/**\n * Props for the {@link tldraw#Tldraw} and {@link TldrawEditor} components, when passing in a\n * {@link store#TLStore} directly. If you would like tldraw to create a store for you, use\n * {@link TldrawEditorWithoutStoreProps}.\n *\n * @public\n */\nexport interface TldrawEditorWithStoreProps {\n\t/**\n\t * The store to use in the editor.\n\t */\n\tstore: TLStore | TLStoreWithStatus\n}\n\n/**\n * Props for the {@link tldraw#Tldraw} and {@link TldrawEditor} components, when not passing in a\n * {@link store#TLStore} directly. If you would like to pass in a store directly, use\n * {@link TldrawEditorWithStoreProps}.\n *\n * @public\n */\nexport interface TldrawEditorWithoutStoreProps extends TLStoreBaseOptions {\n\tstore?: undefined\n\n\t/**\n\t * Additional migrations to use in the store\n\t */\n\tmigrations?: readonly MigrationSequence[]\n\n\t/**\n\t * A starting snapshot of data to pre-populate the store. Do not supply both this and\n\t * `initialData`.\n\t */\n\tsnapshot?: TLEditorSnapshot | TLStoreSnapshot\n\n\t/**\n\t * If you would like to persist the store to the browser's local IndexedDB storage and sync it\n\t * across tabs, provide a key here. Each key represents a single tldraw document.\n\t */\n\tpersistenceKey?: string\n\n\tsessionId?: string\n}\n\n/** @public */\nexport type TldrawEditorStoreProps = TldrawEditorWithStoreProps | TldrawEditorWithoutStoreProps\n\n/**\n * Props for the {@link tldraw#Tldraw} and {@link TldrawEditor} components.\n *\n * @public\n **/\nexport type TldrawEditorProps = TldrawEditorBaseProps & TldrawEditorStoreProps\n\n/**\n * Base props for the {@link tldraw#Tldraw} and {@link TldrawEditor} components.\n *\n * @public\n */\nexport interface TldrawEditorBaseProps {\n\t/**\n\t * The component's children.\n\t */\n\tchildren?: ReactNode\n\n\t/**\n\t * An array of shape utils to use in the editor.\n\t */\n\tshapeUtils?: readonly TLAnyShapeUtilConstructor[]\n\n\t/**\n\t * An array of binding utils to use in the editor.\n\t */\n\tbindingUtils?: readonly TLAnyBindingUtilConstructor[]\n\n\t/**\n\t * An array of tools to add to the editor's state chart.\n\t */\n\ttools?: readonly TLStateNodeConstructor[]\n\n\t/**\n\t * Whether to automatically focus the editor when it mounts.\n\t */\n\tautoFocus?: boolean\n\n\t/**\n\t * Overrides for the editor's components, such as handles, collaborator cursors, etc.\n\t */\n\tcomponents?: TLEditorComponents\n\n\t/**\n\t * Called when the editor has mounted.\n\t */\n\tonMount?: TLOnMountHandler\n\n\t/**\n\t * The editor's initial state (usually the id of the first active tool).\n\t */\n\tinitialState?: string\n\n\t/**\n\t * A classname to pass to the editor's container.\n\t */\n\tclassName?: string\n\n\t/**\n\t * The user interacting with the editor.\n\t */\n\tuser?: TLUser\n\n\t/**\n\t * Whether to infer dark mode from the user's OS. Defaults to false.\n\t */\n\tinferDarkMode?: boolean\n\n\t/**\n\t * Camera options for the editor.\n\t */\n\tcameraOptions?: Partial<TLCameraOptions>\n\n\t/**\n\t * Options for the editor.\n\t */\n\toptions?: Partial<TldrawOptions>\n\n\t/**\n\t * The license key.\n\t */\n\tlicenseKey?: string\n\n\t/**\n\t * Options for syncing the editor's camera state with the URL.\n\t */\n\tdeepLinks?: true | TLDeepLinkOptions\n\n\t/**\n\t * Predicate for whether or not a shape should be hidden.\n\t *\n\t * Hidden shapes will not render in the editor, and they will not be eligible for hit test via\n\t * {@link Editor#getShapeAtPoint} and {@link Editor#getShapesAtPoint}. But otherwise they will\n\t * remain in the store and participate in all other operations.\n\t */\n\tisShapeHidden?(shape: TLShape, editor: Editor): boolean\n}\n\n/**\n * Called when the editor has mounted.\n * @example\n * ```ts\n * <Tldraw onMount={(editor) => editor.selectAll()} />\n * ```\n * @param editor - The editor instance.\n *\n * @public\n */\nexport type TLOnMountHandler = (editor: Editor) => (() => void | undefined) | undefined | void\n\ndeclare global {\n\tinterface Window {\n\t\ttldrawReady: boolean\n\t}\n}\n\nconst EMPTY_SHAPE_UTILS_ARRAY = [] as const\nconst EMPTY_BINDING_UTILS_ARRAY = [] as const\nconst EMPTY_TOOLS_ARRAY = [] as const\n/** @internal */\nexport const TL_CONTAINER_CLASS = 'tl-container'\n\n/** @public @react */\nexport const TldrawEditor = memo(function TldrawEditor({\n\tstore,\n\tcomponents,\n\tclassName,\n\tuser: _user,\n\toptions: _options,\n\t...rest\n}: TldrawEditorProps) {\n\tconst [container, setContainer] = useState<HTMLElement | null>(null)\n\tconst user = useMemo(() => _user ?? createTLUser(), [_user])\n\n\tconst ErrorFallback =\n\t\tcomponents?.ErrorFallback === undefined ? DefaultErrorFallback : components?.ErrorFallback\n\n\t// apply defaults. if you're using the bare @tldraw/editor package, we\n\t// default these to the \"tldraw zero\" configuration. We have different\n\t// defaults applied in tldraw.\n\tconst withDefaults = {\n\t\t...rest,\n\t\tshapeUtils: rest.shapeUtils ?? EMPTY_SHAPE_UTILS_ARRAY,\n\t\tbindingUtils: rest.bindingUtils ?? EMPTY_BINDING_UTILS_ARRAY,\n\t\ttools: rest.tools ?? EMPTY_TOOLS_ARRAY,\n\t\tcomponents,\n\t\toptions: useShallowObjectIdentity(_options),\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tref={setContainer}\n\t\t\tdata-tldraw={version}\n\t\t\tdraggable={false}\n\t\t\tclassName={classNames(`${TL_CONTAINER_CLASS} tl-theme__light`, className)}\n\t\t\tonPointerDown={stopEventPropagation}\n\t\t\ttabIndex={-1}\n\t\t>\n\t\t\t<OptionalErrorBoundary\n\t\t\t\tfallback={ErrorFallback}\n\t\t\t\tonError={(error) => annotateError(error, { tags: { origin: 'react.tldraw-before-app' } })}\n\t\t\t>\n\t\t\t\t{container && (\n\t\t\t\t\t<LicenseProvider licenseKey={rest.licenseKey}>\n\t\t\t\t\t\t<ContainerProvider container={container}>\n\t\t\t\t\t\t\t<EditorComponentsProvider overrides={components}>\n\t\t\t\t\t\t\t\t{store ? (\n\t\t\t\t\t\t\t\t\tstore instanceof Store ? (\n\t\t\t\t\t\t\t\t\t\t// Store is ready to go, whether externally synced or not\n\t\t\t\t\t\t\t\t\t\t<TldrawEditorWithReadyStore {...withDefaults} store={store} user={user} />\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t// Store is a synced store, so handle syncing stages internally\n\t\t\t\t\t\t\t\t\t\t<TldrawEditorWithLoadingStore {...withDefaults} store={store} user={user} />\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t// We have no store (it's undefined) so create one and possibly sync it\n\t\t\t\t\t\t\t\t\t<TldrawEditorWithOwnStore {...withDefaults} store={store} user={user} />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</EditorComponentsProvider>\n\t\t\t\t\t\t</ContainerProvider>\n\t\t\t\t\t</LicenseProvider>\n\t\t\t\t)}\n\t\t\t</OptionalErrorBoundary>\n\t\t</div>\n\t)\n})\n\nfunction TldrawEditorWithOwnStore(\n\tprops: Required<\n\t\tTldrawEditorProps & { store: undefined; user: TLUser },\n\t\t'shapeUtils' | 'bindingUtils' | 'tools'\n\t>\n) {\n\tconst {\n\t\tdefaultName,\n\t\tsnapshot,\n\t\tinitialData,\n\t\tshapeUtils,\n\t\tbindingUtils,\n\t\tpersistenceKey,\n\t\tsessionId,\n\t\tuser,\n\t\tassets,\n\t} = props\n\n\tconst syncedStore = useLocalStore({\n\t\tshapeUtils,\n\t\tbindingUtils,\n\t\tinitialData,\n\t\tpersistenceKey,\n\t\tsessionId,\n\t\tdefaultName,\n\t\tsnapshot,\n\t\tassets,\n\t})\n\n\treturn <TldrawEditorWithLoadingStore {...props} store={syncedStore} user={user} />\n}\n\nconst TldrawEditorWithLoadingStore = memo(function TldrawEditorBeforeLoading({\n\tstore,\n\tuser,\n\t...rest\n}: Required<\n\tTldrawEditorProps & { store: TLStoreWithStatus; user: TLUser },\n\t'shapeUtils' | 'bindingUtils' | 'tools'\n>) {\n\tconst container = useContainer()\n\n\tuseLayoutEffect(() => {\n\t\tif (user.userPreferences.get().colorScheme === 'dark') {\n\t\t\tcontainer.classList.remove('tl-theme__light')\n\t\t\tcontainer.classList.add('tl-theme__dark')\n\t\t}\n\t}, [container, user])\n\n\tconst { LoadingScreen } = useEditorComponents()\n\n\tswitch (store.status) {\n\t\tcase 'error': {\n\t\t\t// for error handling, we fall back to the default error boundary.\n\t\t\t// if users want to handle this error differently, they can render\n\t\t\t// their own error screen before the TldrawEditor component\n\t\t\tthrow store.error\n\t\t}\n\t\tcase 'loading': {\n\t\t\treturn LoadingScreen ? <LoadingScreen /> : null\n\t\t}\n\t\tcase 'not-synced': {\n\t\t\tbreak\n\t\t}\n\t\tcase 'synced-local': {\n\t\t\tbreak\n\t\t}\n\t\tcase 'synced-remote': {\n\t\t\tbreak\n\t\t}\n\t}\n\n\treturn <TldrawEditorWithReadyStore {...rest} store={store.store} user={user} />\n})\n\nconst noAutoFocus = () => document.location.search.includes('tldraw_preserve_focus') // || !document.hasFocus() // breaks in nextjs\n\nfunction TldrawEditorWithReadyStore({\n\tonMount,\n\tchildren,\n\tstore,\n\ttools,\n\tshapeUtils,\n\tbindingUtils,\n\tuser,\n\tinitialState,\n\tautoFocus = true,\n\tinferDarkMode,\n\tcameraOptions,\n\toptions,\n\tlicenseKey,\n\tdeepLinks: _deepLinks,\n\tisShapeHidden,\n}: Required<\n\tTldrawEditorProps & {\n\t\tstore: TLStore\n\t\tuser: TLUser\n\t},\n\t'shapeUtils' | 'bindingUtils' | 'tools'\n>) {\n\tconst { ErrorFallback } = useEditorComponents()\n\tconst container = useContainer()\n\n\tconst [editor, setEditor] = useRefState<Editor | null>(null)\n\n\tconst canvasRef = useRef<HTMLDivElement | null>(null)\n\n\tconst deepLinks = useShallowObjectIdentity(_deepLinks === true ? {} : _deepLinks)\n\n\t// props in this ref can be changed without causing the editor to be recreated.\n\tconst editorOptionsRef = useRef({\n\t\t// for these, it's because they're only used when the editor first mounts:\n\t\tautoFocus: autoFocus && !noAutoFocus(),\n\t\tinferDarkMode,\n\t\tinitialState,\n\n\t\t// for these, it's because we keep them up to date in a separate effect:\n\t\tcameraOptions,\n\t\tdeepLinks,\n\t})\n\n\tuseLayoutEffect(() => {\n\t\teditorOptionsRef.current = {\n\t\t\tautoFocus: autoFocus && !noAutoFocus(),\n\t\t\tinferDarkMode,\n\t\t\tinitialState,\n\t\t\tcameraOptions,\n\t\t\tdeepLinks,\n\t\t}\n\t}, [autoFocus, inferDarkMode, initialState, cameraOptions, deepLinks])\n\n\tuseLayoutEffect(\n\t\t() => {\n\t\t\tconst { autoFocus, inferDarkMode, initialState, cameraOptions, deepLinks } =\n\t\t\t\teditorOptionsRef.current\n\t\t\tconst editor = new Editor({\n\t\t\t\tstore,\n\t\t\t\tshapeUtils,\n\t\t\t\tbindingUtils,\n\t\t\t\ttools,\n\t\t\t\tgetContainer: () => container,\n\t\t\t\tuser,\n\t\t\t\tinitialState,\n\t\t\t\t// we should check for some kind of query parameter that turns off autofocus\n\t\t\t\tautoFocus,\n\t\t\t\tinferDarkMode,\n\t\t\t\tcameraOptions,\n\t\t\t\toptions,\n\t\t\t\tlicenseKey,\n\t\t\t\tisShapeHidden,\n\t\t\t})\n\n\t\t\teditor.updateViewportScreenBounds(canvasRef.current ?? container)\n\n\t\t\t// Use the ref here because we only want to do this once when the editor is created.\n\t\t\t// We don't want changes to the urlStateSync prop to trigger creating new editors.\n\t\t\tif (deepLinks) {\n\t\t\t\tif (!deepLinks?.getUrl) {\n\t\t\t\t\t// load the state from window.location\n\t\t\t\t\teditor.navigateToDeepLink(deepLinks)\n\t\t\t\t} else {\n\t\t\t\t\t// load the state from the provided URL\n\t\t\t\t\teditor.navigateToDeepLink({ ...deepLinks, url: deepLinks.getUrl(editor) })\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tsetEditor(editor)\n\n\t\t\treturn () => {\n\t\t\t\teditor.dispose()\n\t\t\t}\n\t\t},\n\t\t// if any of these change, we need to recreate the editor.\n\t\t[\n\t\t\tbindingUtils,\n\t\t\tcontainer,\n\t\t\toptions,\n\t\t\tshapeUtils,\n\t\t\tstore,\n\t\t\ttools,\n\t\t\tuser,\n\t\t\tsetEditor,\n\t\t\tlicenseKey,\n\t\t\tisShapeHidden,\n\t\t]\n\t)\n\n\tuseLayoutEffect(() => {\n\t\tif (!editor) return\n\t\tif (deepLinks) {\n\t\t\treturn editor.registerDeepLinkListener(deepLinks)\n\t\t}\n\t}, [editor, deepLinks])\n\n\t// keep the editor up to date with the latest camera options\n\tuseLayoutEffect(() => {\n\t\tif (editor && cameraOptions) {\n\t\t\teditor.setCameraOptions(cameraOptions)\n\t\t}\n\t}, [editor, cameraOptions])\n\n\tconst crashingError = useSyncExternalStore(\n\t\tuseCallback(\n\t\t\t(onStoreChange) => {\n\t\t\t\tif (editor) {\n\t\t\t\t\teditor.on('crash', onStoreChange)\n\t\t\t\t\treturn () => editor.off('crash', onStoreChange)\n\t\t\t\t}\n\t\t\t\treturn () => {\n\t\t\t\t\t// noop\n\t\t\t\t}\n\t\t\t},\n\t\t\t[editor]\n\t\t),\n\t\t() => editor?.getCrashingError() ?? null\n\t)\n\n\t// For our examples site, we want autoFocus to be true on the examples site, but not\n\t// when embedded in our docs site. If present, the `tldraw_preserve_focus` search param\n\t// overrides the `autoFocus` prop and prevents the editor from focusing immediately,\n\t// however here we also add some logic to focus the editor when the user clicks\n\t// on it and unfocus it when the user clicks away from it.\n\tuseEffect(\n\t\tfunction handleFocusOnPointerDownForPreserveFocusMode() {\n\t\t\tif (!editor) return\n\n\t\t\tfunction handleFocusOnPointerDown() {\n\t\t\t\tif (!editor) return\n\t\t\t\teditor.focus()\n\t\t\t}\n\n\t\t\tfunction handleBlurOnPointerDown() {\n\t\t\t\tif (!editor) return\n\t\t\t\teditor.blur()\n\t\t\t}\n\n\t\t\tif (autoFocus && noAutoFocus()) {\n\t\t\t\teditor.getContainer().addEventListener('pointerdown', handleFocusOnPointerDown)\n\t\t\t\tdocument.body.addEventListener('pointerdown', handleBlurOnPointerDown)\n\n\t\t\t\treturn () => {\n\t\t\t\t\teditor.getContainer()?.removeEventListener('pointerdown', handleFocusOnPointerDown)\n\t\t\t\t\tdocument.body.removeEventListener('pointerdown', handleBlurOnPointerDown)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[editor, autoFocus]\n\t)\n\n\tconst { Canvas } = useEditorComponents()\n\n\tif (!editor) {\n\t\treturn <div className=\"tl-canvas\" ref={canvasRef} />\n\t}\n\n\treturn (\n\t\t// the top-level tldraw component also renders an error boundary almost\n\t\t// identical to this one. the reason we have two is because this one has\n\t\t// access to `App`, which means that here we can enrich errors with data\n\t\t// from app for reporting, and also still attempt to render the user's\n\t\t// document in the event of an error to reassure them that their work is\n\t\t// not lost.\n\t\t<OptionalErrorBoundary\n\t\t\tfallback={ErrorFallback as any}\n\t\t\tonError={(error) =>\n\t\t\t\teditor.annotateError(error, { origin: 'react.tldraw', willCrashApp: true })\n\t\t\t}\n\t\t>\n\t\t\t{crashingError ? (\n\t\t\t\t<Crash crashingError={crashingError} />\n\t\t\t) : (\n\t\t\t\t<EditorProvider editor={editor}>\n\t\t\t\t\t<Layout onMount={onMount}>\n\t\t\t\t\t\t{children ?? (Canvas ? <Canvas key={editor.contextId} /> : null)}\n\t\t\t\t\t\t<Watermark />\n\t\t\t\t\t</Layout>\n\t\t\t\t</EditorProvider>\n\t\t\t)}\n\t\t</OptionalErrorBoundary>\n\t)\n}\n\nfunction Layout({ children, onMount }: { children: ReactNode; onMount?: TLOnMountHandler }) {\n\tuseZoomCss()\n\tuseCursor()\n\tuseDarkMode()\n\tuseForceUpdate()\n\tuseOnMount((editor) => {\n\t\tconst teardownStore = editor.store.props.onMount(editor)\n\t\tconst teardownCallback = onMount?.(editor)\n\n\t\treturn () => {\n\t\t\tteardownStore?.()\n\t\t\tteardownCallback?.()\n\t\t}\n\t})\n\n\treturn children\n}\n\nfunction Crash({ crashingError }: { crashingError: unknown }): null {\n\tthrow crashingError\n}\n\n/** @public */\nexport interface LoadingScreenProps {\n\tchildren: ReactNode\n}\n\n/** @public @react */\nexport function LoadingScreen({ children }: LoadingScreenProps) {\n\treturn <div className=\"tl-loading\">{children}</div>\n}\n\n/** @public @react */\nexport function ErrorScreen({ children }: LoadingScreenProps) {\n\treturn <div className=\"tl-loading\">{children}</div>\n}\n\n/** @internal */\nexport function useOnMount(onMount?: TLOnMountHandler) {\n\tconst editor = useEditor()\n\n\tconst onMountEvent = useEvent((editor: Editor) => {\n\t\tlet teardown: (() => void) | void = undefined\n\t\t// If the user wants to do something when the editor mounts, we make sure it doesn't effect the history.\n\t\t// todo: is this reeeeally what we want to do, or should we leave it up to the caller?\n\t\teditor.run(\n\t\t\t() => {\n\t\t\t\tteardown = onMount?.(editor)\n\t\t\t\teditor.emit('mount')\n\t\t\t},\n\t\t\t{ history: 'ignore' }\n\t\t)\n\t\twindow.tldrawReady = true\n\t\treturn teardown\n\t})\n\n\tReact.useLayoutEffect(() => {\n\t\tif (editor) return onMountEvent?.(editor)\n\t}, [editor, onMountEvent])\n}\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyQU;AAAA;AAAA;AAAA;AAzQV,mBAAyC;AAEzC,mBAAwC;AACxC,mBAUO;AAEP,wBAAuB;AAEvB,qBAAwB;AACxB,2BAAsC;AACtC,kCAAqC;AAGrC,0BAAqC;AAGrC,oBAAuB;AAGvB,0BAAgD;AAChD,uBAA0B;AAC1B,yBAA4B;AAC5B,uBAA0C;AAC1C,iCAIO;AACP,sBAAyB;AACzB,4BAA+B;AAC/B,yBAAyC;AACzC,2BAA8B;AAC9B,yBAA4B;AAC5B,wBAA2B;AAC3B,6BAAgC;AAChC,uBAA0B;AAE1B,iBAAqC;AAsKrC,MAAM,0BAA0B,CAAC;AACjC,MAAM,4BAA4B,CAAC;AACnC,MAAM,oBAAoB,CAAC;AAEpB,MAAM,qBAAqB;AAG3B,MAAM,mBAAe,mBAAK,SAASA,cAAa;AAAA,EACtD;AAAA,EACA;AAAA,EACA;AAAA,EACA,MAAM;AAAA,EACN,SAAS;AAAA,EACT,GAAG;AACJ,GAAsB;AACrB,QAAM,CAAC,WAAW,YAAY,QAAI,uBAA6B,IAAI;AACnE,QAAM,WAAO,sBAAQ,MAAM,aAAS,kCAAa,GAAG,CAAC,KAAK,CAAC;AAE3D,QAAM,gBACL,YAAY,kBAAkB,SAAY,mDAAuB,YAAY;AAK9E,QAAM,eAAe;AAAA,IACpB,GAAG;AAAA,IACH,YAAY,KAAK,cAAc;AAAA,IAC/B,cAAc,KAAK,gBAAgB;AAAA,IACnC,OAAO,KAAK,SAAS;AAAA,IACrB;AAAA,IACA,aAAS,6CAAyB,QAAQ;AAAA,EAC3C;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,KAAK;AAAA,MACL,eAAa;AAAA,MACb,WAAW;AAAA,MACX,eAAW,kBAAAC,SAAW,GAAG,kBAAkB,oBAAoB,SAAS;AAAA,MACxE,eAAe;AAAA,MACf,UAAU;AAAA,MAEV;AAAA,QAAC;AAAA;AAAA,UACA,UAAU;AAAA,UACV,SAAS,CAAC,cAAU,4BAAc,OAAO,EAAE,MAAM,EAAE,QAAQ,0BAA0B,EAAE,CAAC;AAAA,UAEvF,uBACA,4CAAC,0CAAgB,YAAY,KAAK,YACjC,sDAAC,yCAAkB,WAClB,sDAAC,uDAAyB,WAAW,YACnC,kBACA,iBAAiB,qBAEhB,4CAAC,8BAA4B,GAAG,cAAc,OAAc,MAAY;AAAA;AAAA,YAGxE,4CAAC,gCAA8B,GAAG,cAAc,OAAc,MAAY;AAAA;AAAA;AAAA,YAI3E,4CAAC,4BAA0B,GAAG,cAAc,OAAc,MAAY;AAAA,aAExE,GACD,GACD;AAAA;AAAA,MAEF;AAAA;AAAA,EACD;AAEF,CAAC;AAED,SAAS,yBACR,OAIC;AACD,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,IAAI;AAEJ,QAAM,kBAAc,oCAAc;AAAA,IACjC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAC;AAED,SAAO,4CAAC,gCAA8B,GAAG,OAAO,OAAO,aAAa,MAAY;AACjF;AAEA,MAAM,mCAA+B,mBAAK,SAAS,0BAA0B;AAAA,EAC5E;AAAA,EACA;AAAA,EACA,GAAG;AACJ,GAGG;AACF,QAAM,gBAAY,kCAAa;AAE/B,oCAAgB,MAAM;AACrB,QAAI,KAAK,gBAAgB,IAAI,EAAE,gBAAgB,QAAQ;AACtD,gBAAU,UAAU,OAAO,iBAAiB;AAC5C,gBAAU,UAAU,IAAI,gBAAgB;AAAA,IACzC;AAAA,EACD,GAAG,CAAC,WAAW,IAAI,CAAC;AAEpB,QAAM,EAAE,eAAAC,eAAc,QAAI,gDAAoB;AAE9C,UAAQ,MAAM,QAAQ;AAAA,IACrB,KAAK,SAAS;AAIb,YAAM,MAAM;AAAA,IACb;AAAA,IACA,KAAK,WAAW;AACf,aAAOA,iBAAgB,4CAACA,gBAAA,EAAc,IAAK;AAAA,IAC5C;AAAA,IACA,KAAK,cAAc;AAClB;AAAA,IACD;AAAA,IACA,KAAK,gBAAgB;AACpB;AAAA,IACD;AAAA,IACA,KAAK,iBAAiB;AACrB;AAAA,IACD;AAAA,EACD;AAEA,SAAO,4CAAC,8BAA4B,GAAG,MAAM,OAAO,MAAM,OAAO,MAAY;AAC9E,CAAC;AAED,MAAM,cAAc,MAAM,SAAS,SAAS,OAAO,SAAS,uBAAuB;AAEnF,SAAS,2BAA2B;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX;AACD,GAMG;AACF,QAAM,EAAE,cAAc,QAAI,gDAAoB;AAC9C,QAAM,gBAAY,kCAAa;AAE/B,QAAM,CAAC,QAAQ,SAAS,QAAI,gCAA2B,IAAI;AAE3D,QAAM,gBAAY,qBAA8B,IAAI;AAEpD,QAAM,gBAAY,6CAAyB,eAAe,OAAO,CAAC,IAAI,UAAU;AAGhF,QAAM,uBAAmB,qBAAO;AAAA;AAAA,IAE/B,WAAW,aAAa,CAAC,YAAY;AAAA,IACrC;AAAA,IACA;AAAA;AAAA,IAGA;AAAA,IACA;AAAA,EACD,CAAC;AAED,oCAAgB,MAAM;AACrB,qBAAiB,UAAU;AAAA,MAC1B,WAAW,aAAa,CAAC,YAAY;AAAA,MACrC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAAA,EACD,GAAG,CAAC,WAAW,eAAe,cAAc,eAAe,SAAS,CAAC;AAErE;AAAA,IACC,MAAM;AACL,YAAM,EAAE,WAAAC,YAAW,eAAAC,gBAAe,cAAAC,eAAc,eAAAC,gBAAe,WAAAC,WAAU,IACxE,iBAAiB;AAClB,YAAMC,UAAS,IAAI,qBAAO;AAAA,QACzB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,cAAc,MAAM;AAAA,QACpB;AAAA,QACA,cAAAH;AAAA;AAAA,QAEA,WAAAF;AAAA,QACA,eAAAC;AAAA,QACA,eAAAE;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACD,CAAC;AAED,MAAAE,QAAO,2BAA2B,UAAU,WAAW,SAAS;AAIhE,UAAID,YAAW;AACd,YAAI,CAACA,YAAW,QAAQ;AAEvB,UAAAC,QAAO,mBAAmBD,UAAS;AAAA,QACpC,OAAO;AAEN,UAAAC,QAAO,mBAAmB,EAAE,GAAGD,YAAW,KAAKA,WAAU,OAAOC,OAAM,EAAE,CAAC;AAAA,QAC1E;AAAA,MACD;AAEA,gBAAUA,OAAM;AAEhB,aAAO,MAAM;AACZ,QAAAA,QAAO,QAAQ;AAAA,MAChB;AAAA,IACD;AAAA;AAAA,IAEA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAAA,EACD;AAEA,oCAAgB,MAAM;AACrB,QAAI,CAAC,OAAQ;AACb,QAAI,WAAW;AACd,aAAO,OAAO,yBAAyB,SAAS;AAAA,IACjD;AAAA,EACD,GAAG,CAAC,QAAQ,SAAS,CAAC;AAGtB,oCAAgB,MAAM;AACrB,QAAI,UAAU,eAAe;AAC5B,aAAO,iBAAiB,aAAa;AAAA,IACtC;AAAA,EACD,GAAG,CAAC,QAAQ,aAAa,CAAC;AAE1B,QAAM,oBAAgB;AAAA,QACrB;AAAA,MACC,CAAC,kBAAkB;AAClB,YAAI,QAAQ;AACX,iBAAO,GAAG,SAAS,aAAa;AAChC,iBAAO,MAAM,OAAO,IAAI,SAAS,aAAa;AAAA,QAC/C;AACA,eAAO,MAAM;AAAA,QAEb;AAAA,MACD;AAAA,MACA,CAAC,MAAM;AAAA,IACR;AAAA,IACA,MAAM,QAAQ,iBAAiB,KAAK;AAAA,EACrC;AAOA;AAAA,IACC,SAAS,+CAA+C;AACvD,UAAI,CAAC,OAAQ;AAEb,eAAS,2BAA2B;AACnC,YAAI,CAAC,OAAQ;AACb,eAAO,MAAM;AAAA,MACd;AAEA,eAAS,0BAA0B;AAClC,YAAI,CAAC,OAAQ;AACb,eAAO,KAAK;AAAA,MACb;AAEA,UAAI,aAAa,YAAY,GAAG;AAC/B,eAAO,aAAa,EAAE,iBAAiB,eAAe,wBAAwB;AAC9E,iBAAS,KAAK,iBAAiB,eAAe,uBAAuB;AAErE,eAAO,MAAM;AACZ,iBAAO,aAAa,GAAG,oBAAoB,eAAe,wBAAwB;AAClF,mBAAS,KAAK,oBAAoB,eAAe,uBAAuB;AAAA,QACzE;AAAA,MACD;AAAA,IACD;AAAA,IACA,CAAC,QAAQ,SAAS;AAAA,EACnB;AAEA,QAAM,EAAE,OAAO,QAAI,gDAAoB;AAEvC,MAAI,CAAC,QAAQ;AACZ,WAAO,4CAAC,SAAI,WAAU,aAAY,KAAK,WAAW;AAAA,EACnD;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOC;AAAA,MAAC;AAAA;AAAA,QACA,UAAU;AAAA,QACV,SAAS,CAAC,UACT,OAAO,cAAc,OAAO,EAAE,QAAQ,gBAAgB,cAAc,KAAK,CAAC;AAAA,QAG1E,0BACA,4CAAC,SAAM,eAA8B,IAErC,4CAAC,mCAAe,QACf,uDAAC,UAAO,SACN;AAAA,uBAAa,SAAS,4CAAC,YAAY,OAAO,SAAW,IAAK;AAAA,UAC3D,4CAAC,8BAAU;AAAA,WACZ,GACD;AAAA;AAAA,IAEF;AAAA;AAEF;AAEA,SAAS,OAAO,EAAE,UAAU,QAAQ,GAAwD;AAC3F,oCAAW;AACX,kCAAU;AACV,sCAAY;AACZ,4CAAe;AACf,aAAW,CAAC,WAAW;AACtB,UAAM,gBAAgB,OAAO,MAAM,MAAM,QAAQ,MAAM;AACvD,UAAM,mBAAmB,UAAU,MAAM;AAEzC,WAAO,MAAM;AACZ,sBAAgB;AAChB,yBAAmB;AAAA,IACpB;AAAA,EACD,CAAC;AAED,SAAO;AACR;AAEA,SAAS,MAAM,EAAE,cAAc,GAAqC;AACnE,QAAM;AACP;AAQO,SAAS,cAAc,EAAE,SAAS,GAAuB;AAC/D,SAAO,4CAAC,SAAI,WAAU,cAAc,UAAS;AAC9C;AAGO,SAAS,YAAY,EAAE,SAAS,GAAuB;AAC7D,SAAO,4CAAC,SAAI,WAAU,cAAc,UAAS;AAC9C;AAGO,SAAS,WAAW,SAA4B;AACtD,QAAM,aAAS,4BAAU;AAEzB,QAAM,mBAAe,0BAAS,CAACA,YAAmB;AACjD,QAAI,WAAgC;AAGpC,IAAAA,QAAO;AAAA,MACN,MAAM;AACL,mBAAW,UAAUA,OAAM;AAC3B,QAAAA,QAAO,KAAK,OAAO;AAAA,MACpB;AAAA,MACA,EAAE,SAAS,SAAS;AAAA,IACrB;AACA,WAAO,cAAc;AACrB,WAAO;AAAA,EACR,CAAC;AAED,eAAAC,QAAM,gBAAgB,MAAM;AAC3B,QAAI,OAAQ,QAAO,eAAe,MAAM;AAAA,EACzC,GAAG,CAAC,QAAQ,YAAY,CAAC;AAC1B;",
6
6
  "names": ["TldrawEditor", "classNames", "LoadingScreen", "autoFocus", "inferDarkMode", "initialState", "cameraOptions", "deepLinks", "editor", "React"]
7
7
  }
@@ -76,6 +76,7 @@ const Collaborator = (0, import_state_react.track)(function Collaborator2({
76
76
  const zoomLevel = editor.getZoomLevel();
77
77
  const viewportPageBounds = editor.getViewportPageBounds();
78
78
  const { userId, chatMessage, brush, scribbles, selectedShapeIds, userName, cursor, color } = latestPresence;
79
+ if (!cursor) return null;
79
80
  const isCursorInViewport = !(cursor.x < viewportPageBounds.minX - 12 / zoomLevel || cursor.y < viewportPageBounds.minY - 16 / zoomLevel || cursor.x > viewportPageBounds.maxX - 12 / zoomLevel || cursor.y > viewportPageBounds.maxY - 16 / zoomLevel);
80
81
  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
81
82
  brush && CollaboratorBrush ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
@@ -148,7 +149,7 @@ function useCollaboratorState(editor, latestPresence) {
148
149
  return () => clearInterval(interval);
149
150
  }, [editor]);
150
151
  if (latestPresence) {
151
- rLastActivityTimestamp.current = latestPresence.lastActivityTimestamp;
152
+ rLastActivityTimestamp.current = latestPresence.lastActivityTimestamp ?? Infinity;
152
153
  }
153
154
  return state;
154
155
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/lib/components/LiveCollaborators.tsx"],
4
- "sourcesContent": ["import { track } from '@tldraw/state-react'\nimport { TLInstancePresence } from '@tldraw/tlschema'\nimport { useEffect, useRef, useState } from 'react'\nimport { Editor } from '../editor/Editor'\nimport { useEditor } from '../hooks/useEditor'\nimport { useEditorComponents } from '../hooks/useEditorComponents'\nimport { usePeerIds } from '../hooks/usePeerIds'\nimport { usePresence } from '../hooks/usePresence'\n\nexport const LiveCollaborators = track(function Collaborators() {\n\tconst peerIds = usePeerIds()\n\treturn peerIds.map((id) => <CollaboratorGuard key={id} collaboratorId={id} />)\n})\n\nconst CollaboratorGuard = track(function CollaboratorGuard({\n\tcollaboratorId,\n}: {\n\tcollaboratorId: string\n}) {\n\tconst editor = useEditor()\n\tconst presence = usePresence(collaboratorId)\n\tconst collaboratorState = useCollaboratorState(editor, presence)\n\n\tif (!(presence && presence.currentPageId === editor.getCurrentPageId())) {\n\t\t// No need to render if we don't have a presence or if they're on a different page\n\t\treturn null\n\t}\n\n\tswitch (collaboratorState) {\n\t\tcase 'inactive': {\n\t\t\tconst { followingUserId, highlightedUserIds } = editor.getInstanceState()\n\t\t\t// If they're inactive and unless we're following them or they're highlighted, hide them\n\t\t\tif (!(followingUserId === presence.userId || highlightedUserIds.includes(presence.userId))) {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\tbreak\n\t\t}\n\t\tcase 'idle': {\n\t\t\tconst { highlightedUserIds } = editor.getInstanceState()\n\t\t\t// If they're idle and following us and unless they have a chat message or are highlighted, hide them\n\t\t\tif (\n\t\t\t\tpresence.followingUserId === editor.user.getId() &&\n\t\t\t\t!(presence.chatMessage || highlightedUserIds.includes(presence.userId))\n\t\t\t) {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\tbreak\n\t\t}\n\t\tcase 'active': {\n\t\t\t// If they're active, show them\n\t\t\tbreak\n\t\t}\n\t}\n\n\treturn <Collaborator latestPresence={presence} />\n})\n\nconst Collaborator = track(function Collaborator({\n\tlatestPresence,\n}: {\n\tlatestPresence: TLInstancePresence\n}) {\n\tconst editor = useEditor()\n\n\tconst {\n\t\tCollaboratorBrush,\n\t\tCollaboratorScribble,\n\t\tCollaboratorCursor,\n\t\tCollaboratorHint,\n\t\tCollaboratorShapeIndicator,\n\t} = useEditorComponents()\n\n\tconst zoomLevel = editor.getZoomLevel()\n\tconst viewportPageBounds = editor.getViewportPageBounds()\n\tconst { userId, chatMessage, brush, scribbles, selectedShapeIds, userName, cursor, color } =\n\t\tlatestPresence\n\n\t// Add a little padding to the top-left of the viewport\n\t// so that the cursor doesn't get cut off\n\tconst isCursorInViewport = !(\n\t\tcursor.x < viewportPageBounds.minX - 12 / zoomLevel ||\n\t\tcursor.y < viewportPageBounds.minY - 16 / zoomLevel ||\n\t\tcursor.x > viewportPageBounds.maxX - 12 / zoomLevel ||\n\t\tcursor.y > viewportPageBounds.maxY - 16 / zoomLevel\n\t)\n\n\treturn (\n\t\t<>\n\t\t\t{brush && CollaboratorBrush ? (\n\t\t\t\t<CollaboratorBrush\n\t\t\t\t\tclassName=\"tl-collaborator__brush\"\n\t\t\t\t\tkey={userId + '_brush'}\n\t\t\t\t\tbrush={brush}\n\t\t\t\t\tcolor={color}\n\t\t\t\t\topacity={0.1}\n\t\t\t\t/>\n\t\t\t) : null}\n\t\t\t{isCursorInViewport && CollaboratorCursor ? (\n\t\t\t\t<CollaboratorCursor\n\t\t\t\t\tclassName=\"tl-collaborator__cursor\"\n\t\t\t\t\tkey={userId + '_cursor'}\n\t\t\t\t\tpoint={cursor}\n\t\t\t\t\tcolor={color}\n\t\t\t\t\tzoom={zoomLevel}\n\t\t\t\t\tname={userName !== 'New User' ? userName : null}\n\t\t\t\t\tchatMessage={chatMessage ?? ''}\n\t\t\t\t/>\n\t\t\t) : CollaboratorHint ? (\n\t\t\t\t<CollaboratorHint\n\t\t\t\t\tclassName=\"tl-collaborator__cursor-hint\"\n\t\t\t\t\tkey={userId + '_cursor_hint'}\n\t\t\t\t\tpoint={cursor}\n\t\t\t\t\tcolor={color}\n\t\t\t\t\tzoom={zoomLevel}\n\t\t\t\t\tviewport={viewportPageBounds}\n\t\t\t\t/>\n\t\t\t) : null}\n\t\t\t{CollaboratorScribble && scribbles.length ? (\n\t\t\t\t<>\n\t\t\t\t\t{scribbles.map((scribble) => (\n\t\t\t\t\t\t<CollaboratorScribble\n\t\t\t\t\t\t\tkey={userId + '_scribble_' + scribble.id}\n\t\t\t\t\t\t\tclassName=\"tl-collaborator__scribble\"\n\t\t\t\t\t\t\tscribble={scribble}\n\t\t\t\t\t\t\tcolor={color}\n\t\t\t\t\t\t\tzoom={zoomLevel}\n\t\t\t\t\t\t\topacity={scribble.color === 'laser' ? 0.5 : 0.1}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t\t\t</>\n\t\t\t) : null}\n\t\t\t{CollaboratorShapeIndicator &&\n\t\t\t\tselectedShapeIds\n\t\t\t\t\t.filter((id) => !editor.isShapeHidden(id))\n\t\t\t\t\t.map((shapeId) => (\n\t\t\t\t\t\t<CollaboratorShapeIndicator\n\t\t\t\t\t\t\tclassName=\"tl-collaborator__shape-indicator\"\n\t\t\t\t\t\t\tkey={userId + '_' + shapeId}\n\t\t\t\t\t\t\tshapeId={shapeId}\n\t\t\t\t\t\t\tcolor={color}\n\t\t\t\t\t\t\topacity={0.5}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t</>\n\t)\n})\n\nfunction getStateFromElapsedTime(editor: Editor, elapsed: number) {\n\treturn elapsed > editor.options.collaboratorInactiveTimeoutMs\n\t\t? 'inactive'\n\t\t: elapsed > editor.options.collaboratorIdleTimeoutMs\n\t\t\t? 'idle'\n\t\t\t: 'active'\n}\n\nfunction useCollaboratorState(editor: Editor, latestPresence: TLInstancePresence | null) {\n\tconst rLastActivityTimestamp = useRef(latestPresence?.lastActivityTimestamp ?? -1)\n\n\tconst [state, setState] = useState<'active' | 'idle' | 'inactive'>(() =>\n\t\tgetStateFromElapsedTime(editor, Date.now() - rLastActivityTimestamp.current)\n\t)\n\n\tuseEffect(() => {\n\t\tconst interval = editor.timers.setInterval(() => {\n\t\t\tsetState(getStateFromElapsedTime(editor, Date.now() - rLastActivityTimestamp.current))\n\t\t}, editor.options.collaboratorCheckIntervalMs)\n\n\t\treturn () => clearInterval(interval)\n\t}, [editor])\n\n\tif (latestPresence) {\n\t\t// We can do this on every render, it's free and cheaper than an effect\n\t\t// remember, there can be lots and lots of cursors moving around all the time\n\t\trLastActivityTimestamp.current = latestPresence.lastActivityTimestamp\n\t}\n\n\treturn state\n}\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import { track } from '@tldraw/state-react'\nimport { TLInstancePresence } from '@tldraw/tlschema'\nimport { useEffect, useRef, useState } from 'react'\nimport { Editor } from '../editor/Editor'\nimport { useEditor } from '../hooks/useEditor'\nimport { useEditorComponents } from '../hooks/useEditorComponents'\nimport { usePeerIds } from '../hooks/usePeerIds'\nimport { usePresence } from '../hooks/usePresence'\n\nexport const LiveCollaborators = track(function Collaborators() {\n\tconst peerIds = usePeerIds()\n\treturn peerIds.map((id) => <CollaboratorGuard key={id} collaboratorId={id} />)\n})\n\nconst CollaboratorGuard = track(function CollaboratorGuard({\n\tcollaboratorId,\n}: {\n\tcollaboratorId: string\n}) {\n\tconst editor = useEditor()\n\tconst presence = usePresence(collaboratorId)\n\tconst collaboratorState = useCollaboratorState(editor, presence)\n\n\tif (!(presence && presence.currentPageId === editor.getCurrentPageId())) {\n\t\t// No need to render if we don't have a presence or if they're on a different page\n\t\treturn null\n\t}\n\n\tswitch (collaboratorState) {\n\t\tcase 'inactive': {\n\t\t\tconst { followingUserId, highlightedUserIds } = editor.getInstanceState()\n\t\t\t// If they're inactive and unless we're following them or they're highlighted, hide them\n\t\t\tif (!(followingUserId === presence.userId || highlightedUserIds.includes(presence.userId))) {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\tbreak\n\t\t}\n\t\tcase 'idle': {\n\t\t\tconst { highlightedUserIds } = editor.getInstanceState()\n\t\t\t// If they're idle and following us and unless they have a chat message or are highlighted, hide them\n\t\t\tif (\n\t\t\t\tpresence.followingUserId === editor.user.getId() &&\n\t\t\t\t!(presence.chatMessage || highlightedUserIds.includes(presence.userId))\n\t\t\t) {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\tbreak\n\t\t}\n\t\tcase 'active': {\n\t\t\t// If they're active, show them\n\t\t\tbreak\n\t\t}\n\t}\n\n\treturn <Collaborator latestPresence={presence} />\n})\n\nconst Collaborator = track(function Collaborator({\n\tlatestPresence,\n}: {\n\tlatestPresence: TLInstancePresence\n}) {\n\tconst editor = useEditor()\n\n\tconst {\n\t\tCollaboratorBrush,\n\t\tCollaboratorScribble,\n\t\tCollaboratorCursor,\n\t\tCollaboratorHint,\n\t\tCollaboratorShapeIndicator,\n\t} = useEditorComponents()\n\n\tconst zoomLevel = editor.getZoomLevel()\n\tconst viewportPageBounds = editor.getViewportPageBounds()\n\tconst { userId, chatMessage, brush, scribbles, selectedShapeIds, userName, cursor, color } =\n\t\tlatestPresence\n\n\tif (!cursor) return null\n\n\t// Add a little padding to the top-left of the viewport\n\t// so that the cursor doesn't get cut off\n\tconst isCursorInViewport = !(\n\t\tcursor.x < viewportPageBounds.minX - 12 / zoomLevel ||\n\t\tcursor.y < viewportPageBounds.minY - 16 / zoomLevel ||\n\t\tcursor.x > viewportPageBounds.maxX - 12 / zoomLevel ||\n\t\tcursor.y > viewportPageBounds.maxY - 16 / zoomLevel\n\t)\n\n\treturn (\n\t\t<>\n\t\t\t{brush && CollaboratorBrush ? (\n\t\t\t\t<CollaboratorBrush\n\t\t\t\t\tclassName=\"tl-collaborator__brush\"\n\t\t\t\t\tkey={userId + '_brush'}\n\t\t\t\t\tbrush={brush}\n\t\t\t\t\tcolor={color}\n\t\t\t\t\topacity={0.1}\n\t\t\t\t/>\n\t\t\t) : null}\n\t\t\t{isCursorInViewport && CollaboratorCursor ? (\n\t\t\t\t<CollaboratorCursor\n\t\t\t\t\tclassName=\"tl-collaborator__cursor\"\n\t\t\t\t\tkey={userId + '_cursor'}\n\t\t\t\t\tpoint={cursor}\n\t\t\t\t\tcolor={color}\n\t\t\t\t\tzoom={zoomLevel}\n\t\t\t\t\tname={userName !== 'New User' ? userName : null}\n\t\t\t\t\tchatMessage={chatMessage ?? ''}\n\t\t\t\t/>\n\t\t\t) : CollaboratorHint ? (\n\t\t\t\t<CollaboratorHint\n\t\t\t\t\tclassName=\"tl-collaborator__cursor-hint\"\n\t\t\t\t\tkey={userId + '_cursor_hint'}\n\t\t\t\t\tpoint={cursor}\n\t\t\t\t\tcolor={color}\n\t\t\t\t\tzoom={zoomLevel}\n\t\t\t\t\tviewport={viewportPageBounds}\n\t\t\t\t/>\n\t\t\t) : null}\n\t\t\t{CollaboratorScribble && scribbles.length ? (\n\t\t\t\t<>\n\t\t\t\t\t{scribbles.map((scribble) => (\n\t\t\t\t\t\t<CollaboratorScribble\n\t\t\t\t\t\t\tkey={userId + '_scribble_' + scribble.id}\n\t\t\t\t\t\t\tclassName=\"tl-collaborator__scribble\"\n\t\t\t\t\t\t\tscribble={scribble}\n\t\t\t\t\t\t\tcolor={color}\n\t\t\t\t\t\t\tzoom={zoomLevel}\n\t\t\t\t\t\t\topacity={scribble.color === 'laser' ? 0.5 : 0.1}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t\t\t</>\n\t\t\t) : null}\n\t\t\t{CollaboratorShapeIndicator &&\n\t\t\t\tselectedShapeIds\n\t\t\t\t\t.filter((id) => !editor.isShapeHidden(id))\n\t\t\t\t\t.map((shapeId) => (\n\t\t\t\t\t\t<CollaboratorShapeIndicator\n\t\t\t\t\t\t\tclassName=\"tl-collaborator__shape-indicator\"\n\t\t\t\t\t\t\tkey={userId + '_' + shapeId}\n\t\t\t\t\t\t\tshapeId={shapeId}\n\t\t\t\t\t\t\tcolor={color}\n\t\t\t\t\t\t\topacity={0.5}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t</>\n\t)\n})\n\nfunction getStateFromElapsedTime(editor: Editor, elapsed: number) {\n\treturn elapsed > editor.options.collaboratorInactiveTimeoutMs\n\t\t? 'inactive'\n\t\t: elapsed > editor.options.collaboratorIdleTimeoutMs\n\t\t\t? 'idle'\n\t\t\t: 'active'\n}\n\nfunction useCollaboratorState(editor: Editor, latestPresence: TLInstancePresence | null) {\n\tconst rLastActivityTimestamp = useRef(latestPresence?.lastActivityTimestamp ?? -1)\n\n\tconst [state, setState] = useState<'active' | 'idle' | 'inactive'>(() =>\n\t\tgetStateFromElapsedTime(editor, Date.now() - rLastActivityTimestamp.current)\n\t)\n\n\tuseEffect(() => {\n\t\tconst interval = editor.timers.setInterval(() => {\n\t\t\tsetState(getStateFromElapsedTime(editor, Date.now() - rLastActivityTimestamp.current))\n\t\t}, editor.options.collaboratorCheckIntervalMs)\n\n\t\treturn () => clearInterval(interval)\n\t}, [editor])\n\n\tif (latestPresence) {\n\t\t// We can do this on every render, it's free and cheaper than an effect\n\t\t// remember, there can be lots and lots of cursors moving around all the time\n\t\trLastActivityTimestamp.current = latestPresence.lastActivityTimestamp ?? Infinity\n\t}\n\n\treturn state\n}\n"],
5
+ "mappings": "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",
6
6
  "names": ["CollaboratorGuard", "Collaborator"]
7
7
  }
@@ -152,10 +152,11 @@ const InnerShape = (0, import_react.memo)(
152
152
  // always fetch the latest shape from the store even if the props/meta have not changed, to avoid
153
153
  // calling the render method with stale data.
154
154
  util.component(util.editor.store.unsafeGetWithoutCapture(shape.id))
155
- )
155
+ ),
156
+ [util, shape.id]
156
157
  );
157
158
  },
158
- (prev, next) => prev.shape.props === next.shape.props && prev.shape.meta === next.shape.meta
159
+ (prev, next) => prev.shape.props === next.shape.props && prev.shape.meta === next.shape.meta && prev.util === next.util
159
160
  );
160
161
  const InnerShapeBackground = (0, import_react.memo)(
161
162
  function InnerShapeBackground2({
@@ -168,9 +169,10 @@ const InnerShapeBackground = (0, import_react.memo)(
168
169
  // always fetch the latest shape from the store even if the props/meta have not changed, to avoid
169
170
  // calling the render method with stale data.
170
171
  util.backgroundComponent?.(util.editor.store.unsafeGetWithoutCapture(shape.id))
171
- )
172
+ ),
173
+ [util, shape.id]
172
174
  );
173
175
  },
174
- (prev, next) => prev.shape.props === next.shape.props && prev.shape.meta === next.shape.meta
176
+ (prev, next) => prev.shape.props === next.shape.props && prev.shape.meta === next.shape.meta && prev.util === next.util
175
177
  );
176
178
  //# sourceMappingURL=Shape.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/lib/components/Shape.tsx"],
4
- "sourcesContent": ["import { useQuickReactor, useStateTracking } from '@tldraw/state-react'\nimport { TLShape, TLShapeId } from '@tldraw/tlschema'\nimport { memo, useCallback, useRef } from 'react'\nimport { ShapeUtil } from '../editor/shapes/ShapeUtil'\nimport { useEditor } from '../hooks/useEditor'\nimport { useEditorComponents } from '../hooks/useEditorComponents'\nimport { Mat } from '../primitives/Mat'\nimport { setStyleProperty } from '../utils/dom'\nimport { OptionalErrorBoundary } from './ErrorBoundary'\n\n/*\nThis component renders shapes on the canvas. There are two stages: positioning\nand styling the shape's container using CSS, and then rendering the shape's \nJSX using its shape util's render method. Rendering the \"inside\" of a shape is\nmore expensive than positioning it or changing its color, so we use memo\nto wrap the inner shape and only re-render it when the shape's props change. \n\nThe shape also receives props for its index and opacity. The index is used to\ndetermine the z-index of the shape, and the opacity is used to set the shape's\nopacity based on its own opacity and that of its parent's.\n*/\nexport const Shape = memo(function Shape({\n\tid,\n\tshape,\n\tutil,\n\tindex,\n\tbackgroundIndex,\n\topacity,\n}: {\n\tid: TLShapeId\n\tshape: TLShape\n\tutil: ShapeUtil\n\tindex: number\n\tbackgroundIndex: number\n\topacity: number\n}) {\n\tconst editor = useEditor()\n\n\tconst { ShapeErrorFallback } = useEditorComponents()\n\n\tconst containerRef = useRef<HTMLDivElement>(null)\n\tconst bgContainerRef = useRef<HTMLDivElement>(null)\n\n\tconst memoizedStuffRef = useRef({\n\t\ttransform: '',\n\t\tclipPath: 'none',\n\t\twidth: 0,\n\t\theight: 0,\n\t\tx: 0,\n\t\ty: 0,\n\t\tisCulled: false,\n\t})\n\n\tuseQuickReactor(\n\t\t'set shape stuff',\n\t\t() => {\n\t\t\tconst shape = editor.getShape(id)\n\t\t\tif (!shape) return // probably the shape was just deleted\n\n\t\t\tconst prev = memoizedStuffRef.current\n\n\t\t\t// Clip path\n\t\t\tconst clipPath = editor.getShapeClipPath(id) ?? 'none'\n\t\t\tif (clipPath !== prev.clipPath) {\n\t\t\t\tsetStyleProperty(containerRef.current, 'clip-path', clipPath)\n\t\t\t\tsetStyleProperty(bgContainerRef.current, 'clip-path', clipPath)\n\t\t\t\tprev.clipPath = clipPath\n\t\t\t}\n\n\t\t\t// Page transform\n\t\t\tconst pageTransform = editor.getShapePageTransform(id)\n\t\t\tconst transform = Mat.toCssString(pageTransform)\n\t\t\tconst bounds = editor.getShapeGeometry(shape).bounds\n\n\t\t\t// Update if the tranform has changed\n\t\t\tif (transform !== prev.transform) {\n\t\t\t\tsetStyleProperty(containerRef.current, 'transform', transform)\n\t\t\t\tsetStyleProperty(bgContainerRef.current, 'transform', transform)\n\t\t\t\tprev.transform = transform\n\t\t\t}\n\n\t\t\t// Width / Height\n\t\t\tconst width = Math.max(bounds.width, 1)\n\t\t\tconst height = Math.max(bounds.height, 1)\n\n\t\t\tif (width !== prev.width || height !== prev.height) {\n\t\t\t\tsetStyleProperty(containerRef.current, 'width', width + 'px')\n\t\t\t\tsetStyleProperty(containerRef.current, 'height', height + 'px')\n\t\t\t\tsetStyleProperty(bgContainerRef.current, 'width', width + 'px')\n\t\t\t\tsetStyleProperty(bgContainerRef.current, 'height', height + 'px')\n\t\t\t\tprev.width = width\n\t\t\t\tprev.height = height\n\t\t\t}\n\t\t},\n\t\t[editor]\n\t)\n\n\t// This stuff changes pretty infrequently, so we can change them together\n\tuseQuickReactor(\n\t\t'set opacity and z-index',\n\t\t() => {\n\t\t\tconst container = containerRef.current\n\t\t\tconst bgContainer = bgContainerRef.current\n\n\t\t\t// Opacity\n\t\t\tsetStyleProperty(container, 'opacity', opacity)\n\t\t\tsetStyleProperty(bgContainer, 'opacity', opacity)\n\n\t\t\t// Z-Index\n\t\t\tsetStyleProperty(container, 'z-index', index)\n\t\t\tsetStyleProperty(bgContainer, 'z-index', backgroundIndex)\n\t\t},\n\t\t[opacity, index, backgroundIndex]\n\t)\n\n\tuseQuickReactor(\n\t\t'set display',\n\t\t() => {\n\t\t\tconst shape = editor.getShape(id)\n\t\t\tif (!shape) return // probably the shape was just deleted\n\n\t\t\tconst culledShapes = editor.getCulledShapes()\n\t\t\tconst isCulled = culledShapes.has(id)\n\t\t\tif (isCulled !== memoizedStuffRef.current.isCulled) {\n\t\t\t\tsetStyleProperty(containerRef.current, 'display', isCulled ? 'none' : 'block')\n\t\t\t\tsetStyleProperty(bgContainerRef.current, 'display', isCulled ? 'none' : 'block')\n\t\t\t\tmemoizedStuffRef.current.isCulled = isCulled\n\t\t\t}\n\t\t},\n\t\t[editor]\n\t)\n\tconst annotateError = useCallback(\n\t\t(error: any) => editor.annotateError(error, { origin: 'shape', willCrashApp: false }),\n\t\t[editor]\n\t)\n\n\tif (!shape) return null\n\n\tconst isFilledShape = 'fill' in shape.props && shape.props.fill !== 'none'\n\n\treturn (\n\t\t<>\n\t\t\t{util.backgroundComponent && (\n\t\t\t\t<div\n\t\t\t\t\tref={bgContainerRef}\n\t\t\t\t\tclassName=\"tl-shape tl-shape-background\"\n\t\t\t\t\tdata-shape-type={shape.type}\n\t\t\t\t\tdata-shape-id={shape.id}\n\t\t\t\t\tdraggable={false}\n\t\t\t\t>\n\t\t\t\t\t<OptionalErrorBoundary fallback={ShapeErrorFallback} onError={annotateError}>\n\t\t\t\t\t\t<InnerShapeBackground shape={shape} util={util} />\n\t\t\t\t\t</OptionalErrorBoundary>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div\n\t\t\t\tref={containerRef}\n\t\t\t\tclassName=\"tl-shape\"\n\t\t\t\tdata-shape-type={shape.type}\n\t\t\t\tdata-shape-is-filled={isFilledShape}\n\t\t\t\tdata-shape-id={shape.id}\n\t\t\t\tdraggable={false}\n\t\t\t>\n\t\t\t\t<OptionalErrorBoundary fallback={ShapeErrorFallback as any} onError={annotateError}>\n\t\t\t\t\t<InnerShape shape={shape} util={util} />\n\t\t\t\t</OptionalErrorBoundary>\n\t\t\t</div>\n\t\t</>\n\t)\n})\n\nexport const InnerShape = memo(\n\tfunction InnerShape<T extends TLShape>({ shape, util }: { shape: T; util: ShapeUtil<T> }) {\n\t\treturn useStateTracking('InnerShape:' + shape.type, () =>\n\t\t\t// always fetch the latest shape from the store even if the props/meta have not changed, to avoid\n\t\t\t// calling the render method with stale data.\n\t\t\tutil.component(util.editor.store.unsafeGetWithoutCapture(shape.id) as T)\n\t\t)\n\t},\n\t(prev, next) => prev.shape.props === next.shape.props && prev.shape.meta === next.shape.meta\n)\n\nexport const InnerShapeBackground = memo(\n\tfunction InnerShapeBackground<T extends TLShape>({\n\t\tshape,\n\t\tutil,\n\t}: {\n\t\tshape: T\n\t\tutil: ShapeUtil<T>\n\t}) {\n\t\treturn useStateTracking('InnerShape:' + shape.type, () =>\n\t\t\t// always fetch the latest shape from the store even if the props/meta have not changed, to avoid\n\t\t\t// calling the render method with stale data.\n\t\t\tutil.backgroundComponent?.(util.editor.store.unsafeGetWithoutCapture(shape.id) as T)\n\t\t)\n\t},\n\t(prev, next) => prev.shape.props === next.shape.props && prev.shape.meta === next.shape.meta\n)\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA6IE;AA7IF,yBAAkD;AAElD,mBAA0C;AAE1C,uBAA0B;AAC1B,iCAAoC;AACpC,iBAAoB;AACpB,iBAAiC;AACjC,2BAAsC;AAa/B,MAAM,YAAQ,mBAAK,SAASA,OAAM;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAOG;AACF,QAAM,aAAS,4BAAU;AAEzB,QAAM,EAAE,mBAAmB,QAAI,gDAAoB;AAEnD,QAAM,mBAAe,qBAAuB,IAAI;AAChD,QAAM,qBAAiB,qBAAuB,IAAI;AAElD,QAAM,uBAAmB,qBAAO;AAAA,IAC/B,WAAW;AAAA,IACX,UAAU;AAAA,IACV,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,GAAG;AAAA,IACH,GAAG;AAAA,IACH,UAAU;AAAA,EACX,CAAC;AAED;AAAA,IACC;AAAA,IACA,MAAM;AACL,YAAMC,SAAQ,OAAO,SAAS,EAAE;AAChC,UAAI,CAACA,OAAO;AAEZ,YAAM,OAAO,iBAAiB;AAG9B,YAAM,WAAW,OAAO,iBAAiB,EAAE,KAAK;AAChD,UAAI,aAAa,KAAK,UAAU;AAC/B,yCAAiB,aAAa,SAAS,aAAa,QAAQ;AAC5D,yCAAiB,eAAe,SAAS,aAAa,QAAQ;AAC9D,aAAK,WAAW;AAAA,MACjB;AAGA,YAAM,gBAAgB,OAAO,sBAAsB,EAAE;AACrD,YAAM,YAAY,eAAI,YAAY,aAAa;AAC/C,YAAM,SAAS,OAAO,iBAAiBA,MAAK,EAAE;AAG9C,UAAI,cAAc,KAAK,WAAW;AACjC,yCAAiB,aAAa,SAAS,aAAa,SAAS;AAC7D,yCAAiB,eAAe,SAAS,aAAa,SAAS;AAC/D,aAAK,YAAY;AAAA,MAClB;AAGA,YAAM,QAAQ,KAAK,IAAI,OAAO,OAAO,CAAC;AACtC,YAAM,SAAS,KAAK,IAAI,OAAO,QAAQ,CAAC;AAExC,UAAI,UAAU,KAAK,SAAS,WAAW,KAAK,QAAQ;AACnD,yCAAiB,aAAa,SAAS,SAAS,QAAQ,IAAI;AAC5D,yCAAiB,aAAa,SAAS,UAAU,SAAS,IAAI;AAC9D,yCAAiB,eAAe,SAAS,SAAS,QAAQ,IAAI;AAC9D,yCAAiB,eAAe,SAAS,UAAU,SAAS,IAAI;AAChE,aAAK,QAAQ;AACb,aAAK,SAAS;AAAA,MACf;AAAA,IACD;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AAGA;AAAA,IACC;AAAA,IACA,MAAM;AACL,YAAM,YAAY,aAAa;AAC/B,YAAM,cAAc,eAAe;AAGnC,uCAAiB,WAAW,WAAW,OAAO;AAC9C,uCAAiB,aAAa,WAAW,OAAO;AAGhD,uCAAiB,WAAW,WAAW,KAAK;AAC5C,uCAAiB,aAAa,WAAW,eAAe;AAAA,IACzD;AAAA,IACA,CAAC,SAAS,OAAO,eAAe;AAAA,EACjC;AAEA;AAAA,IACC;AAAA,IACA,MAAM;AACL,YAAMA,SAAQ,OAAO,SAAS,EAAE;AAChC,UAAI,CAACA,OAAO;AAEZ,YAAM,eAAe,OAAO,gBAAgB;AAC5C,YAAM,WAAW,aAAa,IAAI,EAAE;AACpC,UAAI,aAAa,iBAAiB,QAAQ,UAAU;AACnD,yCAAiB,aAAa,SAAS,WAAW,WAAW,SAAS,OAAO;AAC7E,yCAAiB,eAAe,SAAS,WAAW,WAAW,SAAS,OAAO;AAC/E,yBAAiB,QAAQ,WAAW;AAAA,MACrC;AAAA,IACD;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AACA,QAAM,oBAAgB;AAAA,IACrB,CAAC,UAAe,OAAO,cAAc,OAAO,EAAE,QAAQ,SAAS,cAAc,MAAM,CAAC;AAAA,IACpF,CAAC,MAAM;AAAA,EACR;AAEA,MAAI,CAAC,MAAO,QAAO;AAEnB,QAAM,gBAAgB,UAAU,MAAM,SAAS,MAAM,MAAM,SAAS;AAEpE,SACC,4EACE;AAAA,SAAK,uBACL;AAAA,MAAC;AAAA;AAAA,QACA,KAAK;AAAA,QACL,WAAU;AAAA,QACV,mBAAiB,MAAM;AAAA,QACvB,iBAAe,MAAM;AAAA,QACrB,WAAW;AAAA,QAEX,sDAAC,8CAAsB,UAAU,oBAAoB,SAAS,eAC7D,sDAAC,wBAAqB,OAAc,MAAY,GACjD;AAAA;AAAA,IACD;AAAA,IAED;AAAA,MAAC;AAAA;AAAA,QACA,KAAK;AAAA,QACL,WAAU;AAAA,QACV,mBAAiB,MAAM;AAAA,QACvB,wBAAsB;AAAA,QACtB,iBAAe,MAAM;AAAA,QACrB,WAAW;AAAA,QAEX,sDAAC,8CAAsB,UAAU,oBAA2B,SAAS,eACpE,sDAAC,cAAW,OAAc,MAAY,GACvC;AAAA;AAAA,IACD;AAAA,KACD;AAEF,CAAC;AAEM,MAAM,iBAAa;AAAA,EACzB,SAASC,YAA8B,EAAE,OAAO,KAAK,GAAqC;AACzF,eAAO;AAAA,MAAiB,gBAAgB,MAAM;AAAA,MAAM;AAAA;AAAA;AAAA,QAGnD,KAAK,UAAU,KAAK,OAAO,MAAM,wBAAwB,MAAM,EAAE,CAAM;AAAA;AAAA,IACxE;AAAA,EACD;AAAA,EACA,CAAC,MAAM,SAAS,KAAK,MAAM,UAAU,KAAK,MAAM,SAAS,KAAK,MAAM,SAAS,KAAK,MAAM;AACzF;AAEO,MAAM,2BAAuB;AAAA,EACnC,SAASC,sBAAwC;AAAA,IAChD;AAAA,IACA;AAAA,EACD,GAGG;AACF,eAAO;AAAA,MAAiB,gBAAgB,MAAM;AAAA,MAAM;AAAA;AAAA;AAAA,QAGnD,KAAK,sBAAsB,KAAK,OAAO,MAAM,wBAAwB,MAAM,EAAE,CAAM;AAAA;AAAA,IACpF;AAAA,EACD;AAAA,EACA,CAAC,MAAM,SAAS,KAAK,MAAM,UAAU,KAAK,MAAM,SAAS,KAAK,MAAM,SAAS,KAAK,MAAM;AACzF;",
4
+ "sourcesContent": ["import { useQuickReactor, useStateTracking } from '@tldraw/state-react'\nimport { TLShape, TLShapeId } from '@tldraw/tlschema'\nimport { memo, useCallback, useRef } from 'react'\nimport { ShapeUtil } from '../editor/shapes/ShapeUtil'\nimport { useEditor } from '../hooks/useEditor'\nimport { useEditorComponents } from '../hooks/useEditorComponents'\nimport { Mat } from '../primitives/Mat'\nimport { setStyleProperty } from '../utils/dom'\nimport { OptionalErrorBoundary } from './ErrorBoundary'\n\n/*\nThis component renders shapes on the canvas. There are two stages: positioning\nand styling the shape's container using CSS, and then rendering the shape's \nJSX using its shape util's render method. Rendering the \"inside\" of a shape is\nmore expensive than positioning it or changing its color, so we use memo\nto wrap the inner shape and only re-render it when the shape's props change. \n\nThe shape also receives props for its index and opacity. The index is used to\ndetermine the z-index of the shape, and the opacity is used to set the shape's\nopacity based on its own opacity and that of its parent's.\n*/\nexport const Shape = memo(function Shape({\n\tid,\n\tshape,\n\tutil,\n\tindex,\n\tbackgroundIndex,\n\topacity,\n}: {\n\tid: TLShapeId\n\tshape: TLShape\n\tutil: ShapeUtil\n\tindex: number\n\tbackgroundIndex: number\n\topacity: number\n}) {\n\tconst editor = useEditor()\n\n\tconst { ShapeErrorFallback } = useEditorComponents()\n\n\tconst containerRef = useRef<HTMLDivElement>(null)\n\tconst bgContainerRef = useRef<HTMLDivElement>(null)\n\n\tconst memoizedStuffRef = useRef({\n\t\ttransform: '',\n\t\tclipPath: 'none',\n\t\twidth: 0,\n\t\theight: 0,\n\t\tx: 0,\n\t\ty: 0,\n\t\tisCulled: false,\n\t})\n\n\tuseQuickReactor(\n\t\t'set shape stuff',\n\t\t() => {\n\t\t\tconst shape = editor.getShape(id)\n\t\t\tif (!shape) return // probably the shape was just deleted\n\n\t\t\tconst prev = memoizedStuffRef.current\n\n\t\t\t// Clip path\n\t\t\tconst clipPath = editor.getShapeClipPath(id) ?? 'none'\n\t\t\tif (clipPath !== prev.clipPath) {\n\t\t\t\tsetStyleProperty(containerRef.current, 'clip-path', clipPath)\n\t\t\t\tsetStyleProperty(bgContainerRef.current, 'clip-path', clipPath)\n\t\t\t\tprev.clipPath = clipPath\n\t\t\t}\n\n\t\t\t// Page transform\n\t\t\tconst pageTransform = editor.getShapePageTransform(id)\n\t\t\tconst transform = Mat.toCssString(pageTransform)\n\t\t\tconst bounds = editor.getShapeGeometry(shape).bounds\n\n\t\t\t// Update if the tranform has changed\n\t\t\tif (transform !== prev.transform) {\n\t\t\t\tsetStyleProperty(containerRef.current, 'transform', transform)\n\t\t\t\tsetStyleProperty(bgContainerRef.current, 'transform', transform)\n\t\t\t\tprev.transform = transform\n\t\t\t}\n\n\t\t\t// Width / Height\n\t\t\tconst width = Math.max(bounds.width, 1)\n\t\t\tconst height = Math.max(bounds.height, 1)\n\n\t\t\tif (width !== prev.width || height !== prev.height) {\n\t\t\t\tsetStyleProperty(containerRef.current, 'width', width + 'px')\n\t\t\t\tsetStyleProperty(containerRef.current, 'height', height + 'px')\n\t\t\t\tsetStyleProperty(bgContainerRef.current, 'width', width + 'px')\n\t\t\t\tsetStyleProperty(bgContainerRef.current, 'height', height + 'px')\n\t\t\t\tprev.width = width\n\t\t\t\tprev.height = height\n\t\t\t}\n\t\t},\n\t\t[editor]\n\t)\n\n\t// This stuff changes pretty infrequently, so we can change them together\n\tuseQuickReactor(\n\t\t'set opacity and z-index',\n\t\t() => {\n\t\t\tconst container = containerRef.current\n\t\t\tconst bgContainer = bgContainerRef.current\n\n\t\t\t// Opacity\n\t\t\tsetStyleProperty(container, 'opacity', opacity)\n\t\t\tsetStyleProperty(bgContainer, 'opacity', opacity)\n\n\t\t\t// Z-Index\n\t\t\tsetStyleProperty(container, 'z-index', index)\n\t\t\tsetStyleProperty(bgContainer, 'z-index', backgroundIndex)\n\t\t},\n\t\t[opacity, index, backgroundIndex]\n\t)\n\n\tuseQuickReactor(\n\t\t'set display',\n\t\t() => {\n\t\t\tconst shape = editor.getShape(id)\n\t\t\tif (!shape) return // probably the shape was just deleted\n\n\t\t\tconst culledShapes = editor.getCulledShapes()\n\t\t\tconst isCulled = culledShapes.has(id)\n\t\t\tif (isCulled !== memoizedStuffRef.current.isCulled) {\n\t\t\t\tsetStyleProperty(containerRef.current, 'display', isCulled ? 'none' : 'block')\n\t\t\t\tsetStyleProperty(bgContainerRef.current, 'display', isCulled ? 'none' : 'block')\n\t\t\t\tmemoizedStuffRef.current.isCulled = isCulled\n\t\t\t}\n\t\t},\n\t\t[editor]\n\t)\n\tconst annotateError = useCallback(\n\t\t(error: any) => editor.annotateError(error, { origin: 'shape', willCrashApp: false }),\n\t\t[editor]\n\t)\n\n\tif (!shape) return null\n\n\tconst isFilledShape = 'fill' in shape.props && shape.props.fill !== 'none'\n\n\treturn (\n\t\t<>\n\t\t\t{util.backgroundComponent && (\n\t\t\t\t<div\n\t\t\t\t\tref={bgContainerRef}\n\t\t\t\t\tclassName=\"tl-shape tl-shape-background\"\n\t\t\t\t\tdata-shape-type={shape.type}\n\t\t\t\t\tdata-shape-id={shape.id}\n\t\t\t\t\tdraggable={false}\n\t\t\t\t>\n\t\t\t\t\t<OptionalErrorBoundary fallback={ShapeErrorFallback} onError={annotateError}>\n\t\t\t\t\t\t<InnerShapeBackground shape={shape} util={util} />\n\t\t\t\t\t</OptionalErrorBoundary>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div\n\t\t\t\tref={containerRef}\n\t\t\t\tclassName=\"tl-shape\"\n\t\t\t\tdata-shape-type={shape.type}\n\t\t\t\tdata-shape-is-filled={isFilledShape}\n\t\t\t\tdata-shape-id={shape.id}\n\t\t\t\tdraggable={false}\n\t\t\t>\n\t\t\t\t<OptionalErrorBoundary fallback={ShapeErrorFallback as any} onError={annotateError}>\n\t\t\t\t\t<InnerShape shape={shape} util={util} />\n\t\t\t\t</OptionalErrorBoundary>\n\t\t\t</div>\n\t\t</>\n\t)\n})\n\nexport const InnerShape = memo(\n\tfunction InnerShape<T extends TLShape>({ shape, util }: { shape: T; util: ShapeUtil<T> }) {\n\t\treturn useStateTracking(\n\t\t\t'InnerShape:' + shape.type,\n\t\t\t() =>\n\t\t\t\t// always fetch the latest shape from the store even if the props/meta have not changed, to avoid\n\t\t\t\t// calling the render method with stale data.\n\t\t\t\tutil.component(util.editor.store.unsafeGetWithoutCapture(shape.id) as T),\n\t\t\t[util, shape.id]\n\t\t)\n\t},\n\t(prev, next) =>\n\t\tprev.shape.props === next.shape.props &&\n\t\tprev.shape.meta === next.shape.meta &&\n\t\tprev.util === next.util\n)\n\nexport const InnerShapeBackground = memo(\n\tfunction InnerShapeBackground<T extends TLShape>({\n\t\tshape,\n\t\tutil,\n\t}: {\n\t\tshape: T\n\t\tutil: ShapeUtil<T>\n\t}) {\n\t\treturn useStateTracking(\n\t\t\t'InnerShape:' + shape.type,\n\t\t\t() =>\n\t\t\t\t// always fetch the latest shape from the store even if the props/meta have not changed, to avoid\n\t\t\t\t// calling the render method with stale data.\n\t\t\t\tutil.backgroundComponent?.(util.editor.store.unsafeGetWithoutCapture(shape.id) as T),\n\t\t\t[util, shape.id]\n\t\t)\n\t},\n\t(prev, next) =>\n\t\tprev.shape.props === next.shape.props &&\n\t\tprev.shape.meta === next.shape.meta &&\n\t\tprev.util === next.util\n)\n"],
5
+ "mappings": "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",
6
6
  "names": ["Shape", "shape", "InnerShape", "InnerShapeBackground"]
7
7
  }
@@ -1751,6 +1751,7 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
1751
1751
  if (!followingUserId) return null;
1752
1752
  const leaderPresence = this.getCollaborators().find((c) => c.userId === followingUserId);
1753
1753
  if (!leaderPresence) return null;
1754
+ if (!leaderPresence.camera || !leaderPresence.screenBounds) return null;
1754
1755
  const { w: lw, h: lh } = leaderPresence.screenBounds;
1755
1756
  const { x: lx, y: ly, z: lz } = leaderPresence.camera;
1756
1757
  const theirViewport = new import_Box.Box(-lx, -ly, lw / lz, lh / lz);
@@ -2445,6 +2446,8 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
2445
2446
  zoomToUser(userId, opts = { animation: { duration: 500 } }) {
2446
2447
  const presence = this.getCollaborators().find((c) => c.userId === userId);
2447
2448
  if (!presence) return this;
2449
+ const cursor = presence.cursor;
2450
+ if (!cursor) return this;
2448
2451
  this.run(() => {
2449
2452
  if (this.getInstanceState().followingUserId !== null) {
2450
2453
  this.stopFollowingUser();
@@ -2456,7 +2459,7 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
2456
2459
  if (opts && opts.animation && !isOnSamePage) {
2457
2460
  opts.animation = void 0;
2458
2461
  }
2459
- this.centerOnPoint(presence.cursor, opts);
2462
+ this.centerOnPoint(cursor, opts);
2460
2463
  const { highlightedUserIds } = this.getInstanceState();
2461
2464
  this.updateInstanceState({ highlightedUserIds: [...highlightedUserIds, userId] });
2462
2465
  this.timers.setTimeout(() => {
@@ -2613,7 +2616,10 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
2613
2616
  if (!allPresenceRecords.length) return import_state.EMPTY_ARRAY;
2614
2617
  const userIds = [...new Set(allPresenceRecords.map((c) => c.userId))].sort();
2615
2618
  return userIds.map((id) => {
2616
- const latestPresence = allPresenceRecords.filter((c) => c.userId === id).sort((a, b) => b.lastActivityTimestamp - a.lastActivityTimestamp)[0];
2619
+ const latestPresence = (0, import_utils.maxBy)(
2620
+ allPresenceRecords.filter((c) => c.userId === id),
2621
+ (p) => p.lastActivityTimestamp ?? 0
2622
+ );
2617
2623
  return latestPresence;
2618
2624
  });
2619
2625
  }