@tldraw/editor 5.3.0-internal.fba91ed55f6c → 5.3.0-next.0362a8b4a246
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist-cjs/index.d.ts +75 -0
- package/dist-cjs/index.js +7 -1
- package/dist-cjs/index.js.map +2 -2
- package/dist-cjs/lib/components/LiveCollaborators.js +98 -0
- package/dist-cjs/lib/components/LiveCollaborators.js.map +7 -0
- package/dist-cjs/lib/components/default-components/DefaultCanvas.js +4 -10
- package/dist-cjs/lib/components/default-components/DefaultCanvas.js.map +3 -3
- package/dist-cjs/lib/components/default-components/DefaultCursor.js +59 -0
- package/dist-cjs/lib/components/default-components/DefaultCursor.js.map +7 -0
- package/dist-cjs/lib/editor/Editor.js +7 -2
- package/dist-cjs/lib/editor/Editor.js.map +2 -2
- package/dist-cjs/lib/editor/shapes/ShapeUtil.js.map +2 -2
- package/dist-cjs/lib/editor/types/external-content.js.map +1 -1
- package/dist-cjs/lib/hooks/EditorComponentsContext.js.map +2 -2
- package/dist-cjs/lib/hooks/useCursor.js +1 -0
- package/dist-cjs/lib/hooks/useCursor.js.map +2 -2
- package/dist-cjs/lib/hooks/useEditorComponents.js +2 -0
- package/dist-cjs/lib/hooks/useEditorComponents.js.map +2 -2
- package/dist-cjs/lib/hooks/usePassThroughWheelEvents.js +25 -1
- package/dist-cjs/lib/hooks/usePassThroughWheelEvents.js.map +2 -2
- package/dist-cjs/lib/hooks/useTransform.js +45 -0
- package/dist-cjs/lib/hooks/useTransform.js.map +7 -0
- package/dist-cjs/lib/utils/collaborators.js +27 -0
- package/dist-cjs/lib/utils/collaborators.js.map +7 -0
- package/dist-cjs/lib/utils/getHtmlLayerTransform.js +33 -0
- package/dist-cjs/lib/utils/getHtmlLayerTransform.js.map +7 -0
- package/dist-cjs/version.js +3 -3
- package/dist-cjs/version.js.map +1 -1
- package/dist-esm/index.d.mts +75 -0
- package/dist-esm/index.mjs +9 -1
- package/dist-esm/index.mjs.map +2 -2
- package/dist-esm/lib/components/LiveCollaborators.mjs +78 -0
- package/dist-esm/lib/components/LiveCollaborators.mjs.map +7 -0
- package/dist-esm/lib/components/default-components/DefaultCanvas.mjs +5 -11
- package/dist-esm/lib/components/default-components/DefaultCanvas.mjs.map +2 -2
- package/dist-esm/lib/components/default-components/DefaultCursor.mjs +29 -0
- package/dist-esm/lib/components/default-components/DefaultCursor.mjs.map +7 -0
- package/dist-esm/lib/editor/Editor.mjs +7 -2
- package/dist-esm/lib/editor/Editor.mjs.map +2 -2
- package/dist-esm/lib/editor/shapes/ShapeUtil.mjs.map +2 -2
- package/dist-esm/lib/hooks/EditorComponentsContext.mjs.map +2 -2
- package/dist-esm/lib/hooks/useCursor.mjs +1 -0
- package/dist-esm/lib/hooks/useCursor.mjs.map +2 -2
- package/dist-esm/lib/hooks/useEditorComponents.mjs +2 -0
- package/dist-esm/lib/hooks/useEditorComponents.mjs.map +2 -2
- package/dist-esm/lib/hooks/usePassThroughWheelEvents.mjs +25 -1
- package/dist-esm/lib/hooks/usePassThroughWheelEvents.mjs.map +2 -2
- package/dist-esm/lib/hooks/useTransform.mjs +25 -0
- package/dist-esm/lib/hooks/useTransform.mjs.map +7 -0
- package/dist-esm/lib/utils/collaborators.mjs +7 -0
- package/dist-esm/lib/utils/collaborators.mjs.map +7 -0
- package/dist-esm/lib/utils/getHtmlLayerTransform.mjs +13 -0
- package/dist-esm/lib/utils/getHtmlLayerTransform.mjs.map +7 -0
- package/dist-esm/version.mjs +3 -3
- package/dist-esm/version.mjs.map +1 -1
- package/editor.css +37 -4
- package/package.json +7 -7
- package/src/index.ts +6 -0
- package/src/lib/components/LiveCollaborators.tsx +119 -0
- package/src/lib/components/default-components/DefaultCanvas.tsx +5 -17
- package/src/lib/components/default-components/DefaultCursor.tsx +65 -0
- package/src/lib/editor/Editor.ts +14 -2
- package/src/lib/editor/shapes/ShapeUtil.ts +24 -0
- package/src/lib/editor/types/external-content.ts +5 -0
- package/src/lib/hooks/EditorComponentsContext.tsx +2 -0
- package/src/lib/hooks/useCursor.ts +1 -0
- package/src/lib/hooks/useEditorComponents.tsx +2 -0
- package/src/lib/hooks/usePassThroughWheelEvents.ts +44 -2
- package/src/lib/hooks/useTransform.ts +38 -0
- package/src/lib/utils/collaborators.test.ts +34 -0
- package/src/lib/utils/collaborators.ts +25 -0
- package/src/lib/utils/getHtmlLayerTransform.ts +22 -0
- package/src/version.ts +3 -3
package/dist-esm/index.d.mts
CHANGED
|
@@ -19,6 +19,7 @@ import { JsonObject } from '@tldraw/utils';
|
|
|
19
19
|
import { JSX } from 'react/jsx-runtime';
|
|
20
20
|
import { LegacyMigrations } from '@tldraw/store';
|
|
21
21
|
import { MigrationSequence } from '@tldraw/store';
|
|
22
|
+
import { NamedExoticComponent } from 'react';
|
|
22
23
|
import { Node as Node_2 } from '@tiptap/pm/model';
|
|
23
24
|
import { PerformanceTracker } from '@tldraw/utils';
|
|
24
25
|
import * as React_2 from 'react';
|
|
@@ -982,6 +983,15 @@ export declare function DefaultBackground(): JSX.Element;
|
|
|
982
983
|
/** @public @react */
|
|
983
984
|
export declare function DefaultCanvas({ className }: TLCanvasComponentProps): JSX.Element;
|
|
984
985
|
|
|
986
|
+
/**
|
|
987
|
+
* The default collaborator cursor: the arrow glyph plus a name tag or chat bubble. The arrow is a
|
|
988
|
+
* `<use>` of a shared `<defs>` symbol that `LiveCollaborators` renders, so a `DefaultCursor`
|
|
989
|
+
* used outside that layer draws no arrow.
|
|
990
|
+
*
|
|
991
|
+
* @public @react
|
|
992
|
+
*/
|
|
993
|
+
export declare const DefaultCursor: NamedExoticComponent<TLCursorProps>;
|
|
994
|
+
|
|
985
995
|
/** @public @react */
|
|
986
996
|
export declare const DefaultErrorFallback: TLErrorFallbackComponent;
|
|
987
997
|
|
|
@@ -5449,6 +5459,24 @@ export declare function intersectPolygonPolygon(polygonA: VecLike[], polygonB: V
|
|
|
5449
5459
|
|
|
5450
5460
|
/* Excluded from this release type: isAccelKey */
|
|
5451
5461
|
|
|
5462
|
+
/**
|
|
5463
|
+
* Whether a collaborator's cursor (page coords) is inside the viewport, with a small margin for the
|
|
5464
|
+
* cursor glyph so it isn't culled the instant its hotspot crosses the edge.
|
|
5465
|
+
*
|
|
5466
|
+
* Single source of truth for the cursor/hint split: the DOM cursor layer renders a collaborator
|
|
5467
|
+
* when this is true, and `CollaboratorHintOverlayUtil` draws the viewport-edge hint when it's
|
|
5468
|
+
* false. Sharing the predicate keeps those two exhaustive and mutually exclusive — a margin change
|
|
5469
|
+
* can't open a dead zone (neither renders) or a double-render (both).
|
|
5470
|
+
*
|
|
5471
|
+
* @public
|
|
5472
|
+
*/
|
|
5473
|
+
export declare function isCursorInViewport(cursor: VecLike, viewport: {
|
|
5474
|
+
maxX: number;
|
|
5475
|
+
maxY: number;
|
|
5476
|
+
minX: number;
|
|
5477
|
+
minY: number;
|
|
5478
|
+
}, zoom: number): boolean;
|
|
5479
|
+
|
|
5452
5480
|
/**
|
|
5453
5481
|
* Check if a float is safe to use. ie: Not too big or small.
|
|
5454
5482
|
* @public
|
|
@@ -6795,6 +6823,29 @@ export declare abstract class ShapeUtil<Shape extends TLShape = TLShape> {
|
|
|
6795
6823
|
* @public
|
|
6796
6824
|
*/
|
|
6797
6825
|
onBeforeCreate?(next: Shape): Shape | void;
|
|
6826
|
+
/**
|
|
6827
|
+
* A callback called when a shape is reproduced from an existing shape, either by duplicating
|
|
6828
|
+
* ({@link Editor.duplicateShapes}) or by pasting/putting content onto the page
|
|
6829
|
+
* ({@link Editor.putContentOntoCurrentPage}). This provides a last chance to modify the copy
|
|
6830
|
+
* before it's created — for example, to re-stamp attribution so the copy is credited to the
|
|
6831
|
+
* current user rather than the original author. It is not called when content is put with
|
|
6832
|
+
* `preserveIds` (e.g. {@link Editor.moveShapesToPage}), since the shape keeps its identity
|
|
6833
|
+
* and no copy is made.
|
|
6834
|
+
*
|
|
6835
|
+
* @example
|
|
6836
|
+
*
|
|
6837
|
+
* ```ts
|
|
6838
|
+
* onBeforeDuplicate = (source, duplicate) => {
|
|
6839
|
+
* return { ...duplicate, props: { ...duplicate.props, editedBy: this.editor.getAttributionUserId() } }
|
|
6840
|
+
* }
|
|
6841
|
+
* ```
|
|
6842
|
+
*
|
|
6843
|
+
* @param source - The shape being copied from.
|
|
6844
|
+
* @param duplicate - The new copy (with its own id), before it's created.
|
|
6845
|
+
* @returns The next shape or void.
|
|
6846
|
+
* @public
|
|
6847
|
+
*/
|
|
6848
|
+
onBeforeDuplicate?(source: Shape, duplicate: Shape): Shape | void;
|
|
6798
6849
|
/**
|
|
6799
6850
|
* A callback called just before a shape is updated. This method provides a last chance to modify
|
|
6800
6851
|
* the updated shape.
|
|
@@ -7527,6 +7578,11 @@ export declare interface TLBaseEventInfo {
|
|
|
7527
7578
|
|
|
7528
7579
|
/** @public */
|
|
7529
7580
|
export declare interface TLBaseExternalContent {
|
|
7581
|
+
/**
|
|
7582
|
+
* The other content sources found on the clipboard alongside this content. For example, when
|
|
7583
|
+
* pasting an image copied together with HTML and plain text, the `files` content will have
|
|
7584
|
+
* text sources for the HTML and plain text parts.
|
|
7585
|
+
*/
|
|
7530
7586
|
sources?: TLExternalContentSource[];
|
|
7531
7587
|
point?: VecLike;
|
|
7532
7588
|
}
|
|
@@ -7773,6 +7829,17 @@ export declare interface TLCurrentUser {
|
|
|
7773
7829
|
readonly setUserPreferences: (userPreferences: TLUserPreferences) => void;
|
|
7774
7830
|
}
|
|
7775
7831
|
|
|
7832
|
+
/** @public */
|
|
7833
|
+
export declare interface TLCursorProps {
|
|
7834
|
+
userId: string;
|
|
7835
|
+
className?: string;
|
|
7836
|
+
point: null | VecModel;
|
|
7837
|
+
zoom: number;
|
|
7838
|
+
color?: string;
|
|
7839
|
+
name: null | string;
|
|
7840
|
+
chatMessage: string;
|
|
7841
|
+
}
|
|
7842
|
+
|
|
7776
7843
|
/** @public */
|
|
7777
7844
|
export declare type TLDeepLink = {
|
|
7778
7845
|
bounds: BoxModel;
|
|
@@ -8275,6 +8342,7 @@ export declare interface TLDropShapesOverInfo {
|
|
|
8275
8342
|
export declare interface TLEditorComponents {
|
|
8276
8343
|
Background?: ComponentType | null;
|
|
8277
8344
|
Canvas?: ComponentType<TLCanvasComponentProps> | null;
|
|
8345
|
+
CollaboratorCursor?: ComponentType<TLCursorProps> | null;
|
|
8278
8346
|
Grid?: ComponentType<TLGridProps> | null;
|
|
8279
8347
|
InFrontOfTheCanvas?: ComponentType | null;
|
|
8280
8348
|
LoadingScreen?: ComponentType | null;
|
|
@@ -9881,6 +9949,13 @@ export declare function useTLSchemaFromUtils(opts: TLStoreSchemaOptions): StoreS
|
|
|
9881
9949
|
/** @public */
|
|
9882
9950
|
export declare function useTLStore(opts: TLStoreOptions): TLStore;
|
|
9883
9951
|
|
|
9952
|
+
/**
|
|
9953
|
+
* Position an element by writing its `transform` directly, outside React's render output — the
|
|
9954
|
+
* cheap path for elements that move at pointer/presence frequency.
|
|
9955
|
+
* @public
|
|
9956
|
+
*/
|
|
9957
|
+
export declare function useTransform(ref: React.RefObject<HTMLElement | null | SVGElement>, x?: number, y?: number, scale?: number, rotate?: number, additionalOffset?: VecLike): void;
|
|
9958
|
+
|
|
9884
9959
|
/**
|
|
9885
9960
|
* React's useId hook returns a unique id for the component. However, it uses a colon in the id,
|
|
9886
9961
|
* which is not valid for CSS selectors. This hook replaces the colon with an underscore.
|
package/dist-esm/index.mjs
CHANGED
|
@@ -9,6 +9,9 @@ import { DefaultBackground } from "./lib/components/default-components/DefaultBa
|
|
|
9
9
|
import {
|
|
10
10
|
DefaultCanvas
|
|
11
11
|
} from "./lib/components/default-components/DefaultCanvas.mjs";
|
|
12
|
+
import {
|
|
13
|
+
DefaultCursor
|
|
14
|
+
} from "./lib/components/default-components/DefaultCursor.mjs";
|
|
12
15
|
import {
|
|
13
16
|
DefaultErrorFallback
|
|
14
17
|
} from "./lib/components/default-components/DefaultErrorFallback.mjs";
|
|
@@ -155,6 +158,8 @@ import {
|
|
|
155
158
|
useSharedSafeId,
|
|
156
159
|
useUniqueSafeId
|
|
157
160
|
} from "./lib/hooks/useSafeId.mjs";
|
|
161
|
+
import { useTransform } from "./lib/hooks/useTransform.mjs";
|
|
162
|
+
import { isCursorInViewport } from "./lib/utils/collaborators.mjs";
|
|
158
163
|
import { useTLSchemaFromUtils, useTLStore } from "./lib/hooks/useTLStore.mjs";
|
|
159
164
|
import { useViewportHeight } from "./lib/hooks/useViewportHeight.mjs";
|
|
160
165
|
import {
|
|
@@ -297,7 +302,7 @@ import { LocalIndexedDb, Table } from "./lib/utils/sync/LocalIndexedDb.mjs";
|
|
|
297
302
|
import { uniq } from "./lib/utils/uniq.mjs";
|
|
298
303
|
registerTldrawLibraryVersion(
|
|
299
304
|
"@tldraw/editor",
|
|
300
|
-
"5.3.0-
|
|
305
|
+
"5.3.0-next.0362a8b4a246",
|
|
301
306
|
"esm"
|
|
302
307
|
);
|
|
303
308
|
import { getColorValue } from "./lib/editor/managers/ThemeManager/defaultThemes.mjs";
|
|
@@ -321,6 +326,7 @@ export {
|
|
|
321
326
|
DEFAULT_THEME,
|
|
322
327
|
DefaultBackground,
|
|
323
328
|
DefaultCanvas,
|
|
329
|
+
DefaultCursor,
|
|
324
330
|
DefaultErrorFallback,
|
|
325
331
|
DefaultGrid,
|
|
326
332
|
DefaultShapeWrapper,
|
|
@@ -454,6 +460,7 @@ export {
|
|
|
454
460
|
intersectPolygonBounds,
|
|
455
461
|
intersectPolygonPolygon,
|
|
456
462
|
isAccelKey,
|
|
463
|
+
isCursorInViewport,
|
|
457
464
|
isSafeFloat,
|
|
458
465
|
kickoutOccludedShapes,
|
|
459
466
|
linesIntersect,
|
|
@@ -526,6 +533,7 @@ export {
|
|
|
526
533
|
useTLSchemaFromUtils,
|
|
527
534
|
useTLStore,
|
|
528
535
|
useTldrawCurrentUser,
|
|
536
|
+
useTransform,
|
|
529
537
|
useUniqueSafeId,
|
|
530
538
|
useViewportHeight,
|
|
531
539
|
userTypeValidator
|
package/dist-esm/index.mjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/index.ts"],
|
|
4
|
-
"sourcesContent": ["import { registerTldrawLibraryVersion } from '@tldraw/utils'\n\n// eslint-disable-next-line tldraw/no-export-star\nexport * from '@tldraw/state'\n// eslint-disable-next-line tldraw/no-export-star\nexport * from '@tldraw/state-react'\n// eslint-disable-next-line tldraw/no-export-star\nexport * from '@tldraw/store'\n// eslint-disable-next-line tldraw/no-export-star\nexport * from '@tldraw/tlschema'\n// eslint-disable-next-line tldraw/no-export-star\nexport * from '@tldraw/utils'\n// eslint-disable-next-line tldraw/no-export-star\nexport * from '@tldraw/validate'\n\nexport { DefaultBackground } from './lib/components/default-components/DefaultBackground'\nexport {\n\tDefaultCanvas,\n\ttype TLCanvasComponentProps,\n} from './lib/components/default-components/DefaultCanvas'\nexport {\n\tDefaultErrorFallback,\n\ttype TLErrorFallbackComponent,\n} from './lib/components/default-components/DefaultErrorFallback'\nexport { DefaultGrid, type TLGridProps } from './lib/components/default-components/DefaultGrid'\nexport { type TLShapeErrorFallbackComponent } from './lib/components/default-components/DefaultShapeErrorFallback'\nexport {\n\tDefaultShapeWrapper,\n\ttype TLShapeWrapperProps,\n} from './lib/components/default-components/DefaultShapeWrapper'\nexport { DefaultSpinner } from './lib/components/default-components/DefaultSpinner'\nexport { DefaultSvgDefs } from './lib/components/default-components/DefaultSvgDefs'\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 {\n\tcreateTLCurrentUser,\n\tuseTldrawCurrentUser,\n\ttype TLCurrentUser,\n} from './lib/config/createTLCurrentUser'\nexport {\n\tcreateTLSchemaFromUtils,\n\tcreateTLStore,\n\tdefaultUserStore,\n\tinlineBase64AssetStore,\n\ttype TLStoreBaseOptions,\n\ttype TLStoreEventInfo,\n\ttype TLStoreOptions,\n\ttype TLStoreSchemaOptions,\n} from './lib/config/createTLStore'\nexport { type TLAnyAssetUtilConstructor } from './lib/config/defaultAssets'\nexport { type TLAnyBindingUtilConstructor } from './lib/config/defaultBindings'\nexport { coreShapes, type TLAnyShapeUtilConstructor } from './lib/config/defaultShapes'\nexport {\n\tgetSnapshot,\n\tloadSnapshot,\n\ttype TLEditorSnapshot,\n\ttype TLLoadSnapshotOptions,\n} from './lib/config/TLEditorSnapshot'\nexport {\n\tcreateSessionStateSnapshotSignal,\n\textractSessionStateFromLegacySnapshot,\n\tloadSessionStateSnapshotIntoStore,\n\tTAB_ID,\n\ttype TLLoadSessionStateSnapshotOptions,\n\ttype TLSessionStateSnapshot,\n} from './lib/config/TLSessionStateSnapshot'\nexport {\n\tdefaultUserPreferences,\n\tgetFreshUserPreferences,\n\tgetUserPreferences,\n\tsetUserPreferences,\n\tUSER_COLORS,\n\tuserTypeValidator,\n\ttype TLUserPreferences,\n} from './lib/config/TLUserPreferences'\nexport { DEFAULT_ANIMATION_OPTIONS, DEFAULT_CAMERA_OPTIONS, SIDES } from './lib/constants'\nexport { AssetUtil, type TLAssetUtilConstructor } from './lib/editor/assets/AssetUtil'\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 {\n\tEditor,\n\ttype TLEditorOptions,\n\ttype TLEditorRunOptions,\n\ttype TLRenderingShape,\n\ttype TLResizeShapeOptions,\n} from './lib/editor/Editor'\nexport { ClickManager, type TLClickState } from './lib/editor/managers/ClickManager/ClickManager'\nexport { EdgeScrollManager } from './lib/editor/managers/EdgeScrollManager/EdgeScrollManager'\nexport { FontManager } from './lib/editor/managers/FontManager/FontManager'\nexport { HistoryManager } from './lib/editor/managers/HistoryManager/HistoryManager'\nexport { EditorManager } from './lib/editor/managers/EditorManager'\nexport { InputsManager } from './lib/editor/managers/InputsManager/InputsManager'\nexport {\n\tScribbleManager,\n\ttype ScribbleItem,\n\ttype ScribbleSessionOptions,\n} from './lib/editor/managers/ScribbleManager/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 { SpatialIndexManager } from './lib/editor/managers/SpatialIndexManager/SpatialIndexManager'\nexport {\n\tTextManager,\n\tresolveLineHeightPx,\n\ttype BatchMeasurementRequest,\n\ttype TLMeasuredTextSize,\n\ttype TLMeasureTextOpts,\n\ttype TLMeasureTextSpanOpts,\n} from './lib/editor/managers/TextManager/TextManager'\nexport { DEFAULT_THEME } from './lib/editor/managers/ThemeManager/defaultThemes'\nexport { ThemeManager, resolveThemes } from './lib/editor/managers/ThemeManager/ThemeManager'\nexport { TickManager } from './lib/editor/managers/TickManager/TickManager'\nexport { CollaboratorsManager } from './lib/editor/managers/CollaboratorsManager/CollaboratorsManager'\nexport { PerformanceApiAdapter } from './lib/editor/managers/PerformanceManager/PerformanceApiAdapter'\nexport { PerformanceManager } from './lib/editor/managers/PerformanceManager/PerformanceManager'\nexport {\n\ttype TLCameraEndPerfEvent,\n\ttype TLCameraStartPerfEvent,\n\ttype TLFramePerfEvent,\n\ttype TLInteractionEndPerfEvent,\n\ttype TLInteractionStartPerfEvent,\n\ttype TLPerfEventMap,\n\ttype TLPerfFrameTimeStats,\n\ttype TLPerfLongAnimationFrame,\n\ttype TLPerfLongAnimationFrameScript,\n\ttype TLShapeOperationPerfEvent,\n\ttype TLUndoRedoPerfEvent,\n} from './lib/editor/managers/PerformanceManager/perf-types'\nexport { UserPreferencesManager } from './lib/editor/managers/UserPreferencesManager/UserPreferencesManager'\nexport { BaseBoxShapeUtil, type TLBaseBoxShape } from './lib/editor/shapes/BaseBoxShapeUtil'\nexport { BaseFrameLikeShapeUtil } from './lib/editor/shapes/BaseFrameLikeShapeUtil'\nexport { GroupShapeUtil } from './lib/editor/shapes/group/GroupShapeUtil'\nexport {\n\tShapeUtil,\n\ttype TLCropInfo,\n\ttype TLDragShapesInInfo,\n\ttype TLDragShapesOutInfo,\n\ttype TLDragShapesOverInfo,\n\ttype TLDropShapesOverInfo,\n\ttype TLEditStartInfo,\n\ttype TLGeometryOpts,\n\ttype TLHandleDragInfo,\n\ttype TLIndicatorPath,\n\ttype TLResizeInfo,\n\ttype TLResizeMode,\n\ttype TLShapeUtilCanBeLaidOutOpts,\n\ttype TLShapeUtilCanBindOpts,\n\ttype TLShapeUtilCanvasSvgDef,\n\ttype TLShapeUtilConstructor,\n} from './lib/editor/shapes/ShapeUtil'\nexport {\n\tgetOverlayDisplayValues,\n\ttype OverlayOptionsWithDisplayValues,\n} from './lib/editor/overlays/getOverlayDisplayValues'\nexport { OverlayManager, type TLOverlayEntry } from './lib/editor/overlays/OverlayManager'\nexport {\n\tOverlayUtil,\n\ttype TLAnyOverlayUtilConstructor,\n\ttype TLOverlay,\n\ttype TLOverlayUtilConstructor,\n} from './lib/editor/overlays/OverlayUtil'\nexport { strokeShapeIndicators } from './lib/editor/overlays/strokeShapeIndicators'\nexport {\n\tgetPerfectDashProps,\n\ttype PerfectDashTerminal,\n} from './lib/editor/shapes/shared/getPerfectDashProps'\nexport { resizeBox, type ResizeBoxOptions } from './lib/editor/shapes/shared/resizeBox'\nexport { resizeScaled } from './lib/editor/shapes/shared/resizeScaled'\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 { 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 TLCancelEvent,\n\ttype TLCancelEventInfo,\n\ttype TLClickEvent,\n\ttype TLClickEventInfo,\n\ttype TLCLickEventName,\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 TLBaseExternalContent,\n\ttype TLEmbedExternalContent,\n\ttype TLErrorExternalContentSource,\n\ttype TLExcalidrawExternalContent,\n\ttype TLExcalidrawExternalContentSource,\n\ttype TLExternalAsset,\n\ttype TLExternalContent,\n\ttype TLExternalContentSource,\n\ttype TLFileExternalAsset,\n\ttype TLFileReplaceExternalContent,\n\ttype TLFilesExternalContent,\n\ttype TLSvgTextExternalContent,\n\ttype TLTextExternalContent,\n\ttype TLTextExternalContentSource,\n\ttype TLTldrawExternalContent,\n\ttype TLTldrawExternalContentSource,\n\ttype TLUrlExternalAsset,\n\ttype TLUrlExternalContent,\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 TLExportType,\n\ttype TLGetShapeAtPointOptions,\n\ttype TLImageExportOptions,\n\ttype TLSvgExportOptions,\n\ttype TLUpdatePointerOptions,\n} from './lib/editor/types/misc-types'\nexport {\n\ttype TLAdjacentDirection,\n\ttype TLResizeHandle,\n\ttype TLSelectionHandle,\n} from './lib/editor/types/selection-types'\nexport {\n\tuseDelaySvgExport,\n\tuseSvgExportContext,\n\ttype SvgExportContext,\n\ttype SvgExportDef,\n} from './lib/editor/types/SvgExportContext'\nexport { getOwnerDocument, getOwnerWindow } from './lib/exports/domUtils'\nexport { getSvgAsImage } from './lib/exports/getSvgAsImage'\nexport { tlenv, tlenvReactive } 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 { useColorMode } from './lib/hooks/useColorMode'\nexport { getCursor } from './lib/hooks/useCursor'\nexport {\n\tEditorContext,\n\tEditorProvider,\n\tuseEditor,\n\tuseMaybeEditor,\n\ttype EditorProviderProps,\n} 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 { useIsEditing } from './lib/hooks/useIsEditing'\nexport { useLocalStore } from './lib/hooks/useLocalStore'\nexport { usePassThroughMouseOverEvents } from './lib/hooks/usePassThroughMouseOverEvents'\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 { useTLSchemaFromUtils, useTLStore } from './lib/hooks/useTLStore'\nexport { useViewportHeight } from './lib/hooks/useViewportHeight'\nexport {\n\tLicenseManager,\n\ttype InvalidLicenseKeyResult,\n\ttype InvalidLicenseReason,\n\ttype LicenseFeatureName,\n\ttype LicenseFromKeyResult,\n\ttype LicenseInfo,\n\ttype LicenseState,\n\ttype ValidLicenseKeyResult,\n} from './lib/license/LicenseManager'\nexport { LICENSE_TIMEOUT, useLicenseContext } from './lib/license/LicenseProvider'\nexport { useLicenseFeatureFlag } from './lib/license/useLicenseManagerState'\nexport {\n\tdefaultTldrawOptions,\n\ttype TLClipboardPasteRawInfo,\n\ttype TLClipboardWriteInfo,\n\ttype TldrawOptions,\n} 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 { 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 { getVerticesCountForArcLength } from './lib/primitives/geometry/geometry-constants'\nexport {\n\tGeometry2d,\n\tGeometry2dFilters,\n\tTransformedGeometry2d,\n\ttype Geometry2dOptions,\n\ttype TransformedGeometry2dOptions,\n} 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 { Mat, type MatLike, type MatModel } from './lib/primitives/Mat'\nexport {\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\tHALF_PI,\n\tisSafeFloat,\n\tperimeterOfEllipse,\n\tPI,\n\tPI2,\n\tpointInPolygon,\n\tprecise,\n\tradiansToDegrees,\n\trangeIntersection,\n\tshortAngleDist,\n\tSIN,\n\tsnapAngle,\n\ttoDomPrecision,\n\ttoFixed,\n\ttoPrecision,\n} from './lib/primitives/utils'\nexport { Vec, type VecLike } from './lib/primitives/Vec'\nexport {\n\tErrorScreen,\n\tLoadingScreen,\n\tTldrawEditor,\n\tuseOnMount,\n\ttype LoadingScreenProps,\n\ttype TldrawEditorBaseProps,\n\ttype TldrawEditorProps,\n\ttype TldrawEditorStoreProps,\n\ttype TldrawEditorWithoutStoreProps,\n\ttype TldrawEditorWithStoreProps,\n\ttype TLOnMountHandler,\n} from './lib/TldrawEditor'\nexport { dataUrlToFile, getDefaultCdnBaseUrl } from './lib/utils/assets'\nexport { clampToBrowserMaxCanvasSize, type CanvasMaxSize } from './lib/utils/browserCanvasMaxSize'\nexport {\n\tcreateDebugValue,\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\tactiveElementShouldCaptureKeys,\n\telementShouldCaptureKeys,\n\tgetGlobalDocument,\n\tgetGlobalWindow,\n\tloopToHtmlElement,\n\tmoveElementInto,\n\tpreventDefault,\n\treleasePointerCapture,\n\tsetPointerCapture,\n\t// eslint-disable-next-line @typescript-eslint/no-deprecated\n\tstopEventPropagation,\n} from './lib/utils/dom'\nexport { EditorAtom } from './lib/utils/EditorAtom'\nexport { getIncrementedName } from './lib/utils/getIncrementedName'\nexport { getPointerInfo } from './lib/utils/getPointerInfo'\nexport { getSvgPathFromPoints } from './lib/utils/getSvgPathFromPoints'\nexport { isAccelKey } from './lib/utils/keyboard'\nexport { normalizeWheel } from './lib/utils/normalizeWheel'\nexport { getDroppedShapesToNewParents, kickoutOccludedShapes } from './lib/utils/reparenting'\nexport {\n\tgetFontsFromRichText,\n\ttype RichTextFontVisitor,\n\ttype RichTextFontVisitorState,\n\ttype TiptapEditor,\n\ttype TiptapNode,\n\ttype TLTextOptions,\n} from './lib/utils/richText'\nexport {\n\tapplyRotationToSnapshotShapes,\n\tgetRotationSnapshot,\n\ttype TLRotationSnapshot,\n} from './lib/utils/rotation'\nexport {\n\thardResetEditor,\n\topenWindow,\n\trefreshPage,\n\truntime,\n\tsetRuntimeOverrides,\n} from './lib/utils/runtime'\nexport {\n\tReadonlySharedStyleMap,\n\tSharedStyleMap,\n\ttype SharedStyle,\n} from './lib/utils/SharedStylesMap'\nexport { hardReset } from './lib/utils/sync/hardReset'\nexport { LocalIndexedDb, Table, type StoreName } from './lib/utils/sync/LocalIndexedDb'\nexport { type TLStoreWithStatus } from './lib/utils/sync/StoreWithStatus'\nexport { uniq } from './lib/utils/uniq'\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\nexport { getColorValue } from './lib/editor/managers/ThemeManager/defaultThemes'\n"],
|
|
5
|
-
"mappings": "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",
|
|
4
|
+
"sourcesContent": ["import { registerTldrawLibraryVersion } from '@tldraw/utils'\n\n// eslint-disable-next-line tldraw/no-export-star\nexport * from '@tldraw/state'\n// eslint-disable-next-line tldraw/no-export-star\nexport * from '@tldraw/state-react'\n// eslint-disable-next-line tldraw/no-export-star\nexport * from '@tldraw/store'\n// eslint-disable-next-line tldraw/no-export-star\nexport * from '@tldraw/tlschema'\n// eslint-disable-next-line tldraw/no-export-star\nexport * from '@tldraw/utils'\n// eslint-disable-next-line tldraw/no-export-star\nexport * from '@tldraw/validate'\n\nexport { DefaultBackground } from './lib/components/default-components/DefaultBackground'\nexport {\n\tDefaultCanvas,\n\ttype TLCanvasComponentProps,\n} from './lib/components/default-components/DefaultCanvas'\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 { type TLShapeErrorFallbackComponent } from './lib/components/default-components/DefaultShapeErrorFallback'\nexport {\n\tDefaultShapeWrapper,\n\ttype TLShapeWrapperProps,\n} from './lib/components/default-components/DefaultShapeWrapper'\nexport { DefaultSpinner } from './lib/components/default-components/DefaultSpinner'\nexport { DefaultSvgDefs } from './lib/components/default-components/DefaultSvgDefs'\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 {\n\tcreateTLCurrentUser,\n\tuseTldrawCurrentUser,\n\ttype TLCurrentUser,\n} from './lib/config/createTLCurrentUser'\nexport {\n\tcreateTLSchemaFromUtils,\n\tcreateTLStore,\n\tdefaultUserStore,\n\tinlineBase64AssetStore,\n\ttype TLStoreBaseOptions,\n\ttype TLStoreEventInfo,\n\ttype TLStoreOptions,\n\ttype TLStoreSchemaOptions,\n} from './lib/config/createTLStore'\nexport { type TLAnyAssetUtilConstructor } from './lib/config/defaultAssets'\nexport { type TLAnyBindingUtilConstructor } from './lib/config/defaultBindings'\nexport { coreShapes, type TLAnyShapeUtilConstructor } from './lib/config/defaultShapes'\nexport {\n\tgetSnapshot,\n\tloadSnapshot,\n\ttype TLEditorSnapshot,\n\ttype TLLoadSnapshotOptions,\n} from './lib/config/TLEditorSnapshot'\nexport {\n\tcreateSessionStateSnapshotSignal,\n\textractSessionStateFromLegacySnapshot,\n\tloadSessionStateSnapshotIntoStore,\n\tTAB_ID,\n\ttype TLLoadSessionStateSnapshotOptions,\n\ttype TLSessionStateSnapshot,\n} from './lib/config/TLSessionStateSnapshot'\nexport {\n\tdefaultUserPreferences,\n\tgetFreshUserPreferences,\n\tgetUserPreferences,\n\tsetUserPreferences,\n\tUSER_COLORS,\n\tuserTypeValidator,\n\ttype TLUserPreferences,\n} from './lib/config/TLUserPreferences'\nexport { DEFAULT_ANIMATION_OPTIONS, DEFAULT_CAMERA_OPTIONS, SIDES } from './lib/constants'\nexport { AssetUtil, type TLAssetUtilConstructor } from './lib/editor/assets/AssetUtil'\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 {\n\tEditor,\n\ttype TLEditorOptions,\n\ttype TLEditorRunOptions,\n\ttype TLRenderingShape,\n\ttype TLResizeShapeOptions,\n} from './lib/editor/Editor'\nexport { ClickManager, type TLClickState } from './lib/editor/managers/ClickManager/ClickManager'\nexport { EdgeScrollManager } from './lib/editor/managers/EdgeScrollManager/EdgeScrollManager'\nexport { FontManager } from './lib/editor/managers/FontManager/FontManager'\nexport { HistoryManager } from './lib/editor/managers/HistoryManager/HistoryManager'\nexport { EditorManager } from './lib/editor/managers/EditorManager'\nexport { InputsManager } from './lib/editor/managers/InputsManager/InputsManager'\nexport {\n\tScribbleManager,\n\ttype ScribbleItem,\n\ttype ScribbleSessionOptions,\n} from './lib/editor/managers/ScribbleManager/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 { SpatialIndexManager } from './lib/editor/managers/SpatialIndexManager/SpatialIndexManager'\nexport {\n\tTextManager,\n\tresolveLineHeightPx,\n\ttype BatchMeasurementRequest,\n\ttype TLMeasuredTextSize,\n\ttype TLMeasureTextOpts,\n\ttype TLMeasureTextSpanOpts,\n} from './lib/editor/managers/TextManager/TextManager'\nexport { DEFAULT_THEME } from './lib/editor/managers/ThemeManager/defaultThemes'\nexport { ThemeManager, resolveThemes } from './lib/editor/managers/ThemeManager/ThemeManager'\nexport { TickManager } from './lib/editor/managers/TickManager/TickManager'\nexport { CollaboratorsManager } from './lib/editor/managers/CollaboratorsManager/CollaboratorsManager'\nexport { PerformanceApiAdapter } from './lib/editor/managers/PerformanceManager/PerformanceApiAdapter'\nexport { PerformanceManager } from './lib/editor/managers/PerformanceManager/PerformanceManager'\nexport {\n\ttype TLCameraEndPerfEvent,\n\ttype TLCameraStartPerfEvent,\n\ttype TLFramePerfEvent,\n\ttype TLInteractionEndPerfEvent,\n\ttype TLInteractionStartPerfEvent,\n\ttype TLPerfEventMap,\n\ttype TLPerfFrameTimeStats,\n\ttype TLPerfLongAnimationFrame,\n\ttype TLPerfLongAnimationFrameScript,\n\ttype TLShapeOperationPerfEvent,\n\ttype TLUndoRedoPerfEvent,\n} from './lib/editor/managers/PerformanceManager/perf-types'\nexport { UserPreferencesManager } from './lib/editor/managers/UserPreferencesManager/UserPreferencesManager'\nexport { BaseBoxShapeUtil, type TLBaseBoxShape } from './lib/editor/shapes/BaseBoxShapeUtil'\nexport { BaseFrameLikeShapeUtil } from './lib/editor/shapes/BaseFrameLikeShapeUtil'\nexport { GroupShapeUtil } from './lib/editor/shapes/group/GroupShapeUtil'\nexport {\n\tShapeUtil,\n\ttype TLCropInfo,\n\ttype TLDragShapesInInfo,\n\ttype TLDragShapesOutInfo,\n\ttype TLDragShapesOverInfo,\n\ttype TLDropShapesOverInfo,\n\ttype TLEditStartInfo,\n\ttype TLGeometryOpts,\n\ttype TLHandleDragInfo,\n\ttype TLIndicatorPath,\n\ttype TLResizeInfo,\n\ttype TLResizeMode,\n\ttype TLShapeUtilCanBeLaidOutOpts,\n\ttype TLShapeUtilCanBindOpts,\n\ttype TLShapeUtilCanvasSvgDef,\n\ttype TLShapeUtilConstructor,\n} from './lib/editor/shapes/ShapeUtil'\nexport {\n\tgetOverlayDisplayValues,\n\ttype OverlayOptionsWithDisplayValues,\n} from './lib/editor/overlays/getOverlayDisplayValues'\nexport { OverlayManager, type TLOverlayEntry } from './lib/editor/overlays/OverlayManager'\nexport {\n\tOverlayUtil,\n\ttype TLAnyOverlayUtilConstructor,\n\ttype TLOverlay,\n\ttype TLOverlayUtilConstructor,\n} from './lib/editor/overlays/OverlayUtil'\nexport { strokeShapeIndicators } from './lib/editor/overlays/strokeShapeIndicators'\nexport {\n\tgetPerfectDashProps,\n\ttype PerfectDashTerminal,\n} from './lib/editor/shapes/shared/getPerfectDashProps'\nexport { resizeBox, type ResizeBoxOptions } from './lib/editor/shapes/shared/resizeBox'\nexport { resizeScaled } from './lib/editor/shapes/shared/resizeScaled'\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 { 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 TLCancelEvent,\n\ttype TLCancelEventInfo,\n\ttype TLClickEvent,\n\ttype TLClickEventInfo,\n\ttype TLCLickEventName,\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 TLBaseExternalContent,\n\ttype TLEmbedExternalContent,\n\ttype TLErrorExternalContentSource,\n\ttype TLExcalidrawExternalContent,\n\ttype TLExcalidrawExternalContentSource,\n\ttype TLExternalAsset,\n\ttype TLExternalContent,\n\ttype TLExternalContentSource,\n\ttype TLFileExternalAsset,\n\ttype TLFileReplaceExternalContent,\n\ttype TLFilesExternalContent,\n\ttype TLSvgTextExternalContent,\n\ttype TLTextExternalContent,\n\ttype TLTextExternalContentSource,\n\ttype TLTldrawExternalContent,\n\ttype TLTldrawExternalContentSource,\n\ttype TLUrlExternalAsset,\n\ttype TLUrlExternalContent,\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 TLExportType,\n\ttype TLGetShapeAtPointOptions,\n\ttype TLImageExportOptions,\n\ttype TLSvgExportOptions,\n\ttype TLUpdatePointerOptions,\n} from './lib/editor/types/misc-types'\nexport {\n\ttype TLAdjacentDirection,\n\ttype TLResizeHandle,\n\ttype TLSelectionHandle,\n} from './lib/editor/types/selection-types'\nexport {\n\tuseDelaySvgExport,\n\tuseSvgExportContext,\n\ttype SvgExportContext,\n\ttype SvgExportDef,\n} from './lib/editor/types/SvgExportContext'\nexport { getOwnerDocument, getOwnerWindow } from './lib/exports/domUtils'\nexport { getSvgAsImage } from './lib/exports/getSvgAsImage'\nexport { tlenv, tlenvReactive } 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 { useColorMode } from './lib/hooks/useColorMode'\nexport { getCursor } from './lib/hooks/useCursor'\nexport {\n\tEditorContext,\n\tEditorProvider,\n\tuseEditor,\n\tuseMaybeEditor,\n\ttype EditorProviderProps,\n} 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 { useIsEditing } from './lib/hooks/useIsEditing'\nexport { useLocalStore } from './lib/hooks/useLocalStore'\nexport { usePassThroughMouseOverEvents } from './lib/hooks/usePassThroughMouseOverEvents'\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 { useTransform } from './lib/hooks/useTransform'\nexport { isCursorInViewport } from './lib/utils/collaborators'\nexport { useTLSchemaFromUtils, useTLStore } from './lib/hooks/useTLStore'\nexport { useViewportHeight } from './lib/hooks/useViewportHeight'\nexport {\n\tLicenseManager,\n\ttype InvalidLicenseKeyResult,\n\ttype InvalidLicenseReason,\n\ttype LicenseFeatureName,\n\ttype LicenseFromKeyResult,\n\ttype LicenseInfo,\n\ttype LicenseState,\n\ttype ValidLicenseKeyResult,\n} from './lib/license/LicenseManager'\nexport { LICENSE_TIMEOUT, useLicenseContext } from './lib/license/LicenseProvider'\nexport { useLicenseFeatureFlag } from './lib/license/useLicenseManagerState'\nexport {\n\tdefaultTldrawOptions,\n\ttype TLClipboardPasteRawInfo,\n\ttype TLClipboardWriteInfo,\n\ttype TldrawOptions,\n} 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 { 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 { getVerticesCountForArcLength } from './lib/primitives/geometry/geometry-constants'\nexport {\n\tGeometry2d,\n\tGeometry2dFilters,\n\tTransformedGeometry2d,\n\ttype Geometry2dOptions,\n\ttype TransformedGeometry2dOptions,\n} 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 { Mat, type MatLike, type MatModel } from './lib/primitives/Mat'\nexport {\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\tHALF_PI,\n\tisSafeFloat,\n\tperimeterOfEllipse,\n\tPI,\n\tPI2,\n\tpointInPolygon,\n\tprecise,\n\tradiansToDegrees,\n\trangeIntersection,\n\tshortAngleDist,\n\tSIN,\n\tsnapAngle,\n\ttoDomPrecision,\n\ttoFixed,\n\ttoPrecision,\n} from './lib/primitives/utils'\nexport { Vec, type VecLike } from './lib/primitives/Vec'\nexport {\n\tErrorScreen,\n\tLoadingScreen,\n\tTldrawEditor,\n\tuseOnMount,\n\ttype LoadingScreenProps,\n\ttype TldrawEditorBaseProps,\n\ttype TldrawEditorProps,\n\ttype TldrawEditorStoreProps,\n\ttype TldrawEditorWithoutStoreProps,\n\ttype TldrawEditorWithStoreProps,\n\ttype TLOnMountHandler,\n} from './lib/TldrawEditor'\nexport { dataUrlToFile, getDefaultCdnBaseUrl } from './lib/utils/assets'\nexport { clampToBrowserMaxCanvasSize, type CanvasMaxSize } from './lib/utils/browserCanvasMaxSize'\nexport {\n\tcreateDebugValue,\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\tactiveElementShouldCaptureKeys,\n\telementShouldCaptureKeys,\n\tgetGlobalDocument,\n\tgetGlobalWindow,\n\tloopToHtmlElement,\n\tmoveElementInto,\n\tpreventDefault,\n\treleasePointerCapture,\n\tsetPointerCapture,\n\t// eslint-disable-next-line @typescript-eslint/no-deprecated\n\tstopEventPropagation,\n} from './lib/utils/dom'\nexport { EditorAtom } from './lib/utils/EditorAtom'\nexport { getIncrementedName } from './lib/utils/getIncrementedName'\nexport { getPointerInfo } from './lib/utils/getPointerInfo'\nexport { getSvgPathFromPoints } from './lib/utils/getSvgPathFromPoints'\nexport { isAccelKey } from './lib/utils/keyboard'\nexport { normalizeWheel } from './lib/utils/normalizeWheel'\nexport { getDroppedShapesToNewParents, kickoutOccludedShapes } from './lib/utils/reparenting'\nexport {\n\tgetFontsFromRichText,\n\ttype RichTextFontVisitor,\n\ttype RichTextFontVisitorState,\n\ttype TiptapEditor,\n\ttype TiptapNode,\n\ttype TLTextOptions,\n} from './lib/utils/richText'\nexport {\n\tapplyRotationToSnapshotShapes,\n\tgetRotationSnapshot,\n\ttype TLRotationSnapshot,\n} from './lib/utils/rotation'\nexport {\n\thardResetEditor,\n\topenWindow,\n\trefreshPage,\n\truntime,\n\tsetRuntimeOverrides,\n} from './lib/utils/runtime'\nexport {\n\tReadonlySharedStyleMap,\n\tSharedStyleMap,\n\ttype SharedStyle,\n} from './lib/utils/SharedStylesMap'\nexport { hardReset } from './lib/utils/sync/hardReset'\nexport { LocalIndexedDb, Table, type StoreName } from './lib/utils/sync/LocalIndexedDb'\nexport { type TLStoreWithStatus } from './lib/utils/sync/StoreWithStatus'\nexport { uniq } from './lib/utils/uniq'\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\nexport { getColorValue } from './lib/editor/managers/ThemeManager/defaultThemes'\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { track, useQuickReactor } from "@tldraw/state-react";
|
|
3
|
+
import { useLayoutEffect, useRef } from "react";
|
|
4
|
+
import { useEditorComponents } from "../hooks/EditorComponentsContext.mjs";
|
|
5
|
+
import { useEditor } from "../hooks/useEditor.mjs";
|
|
6
|
+
import { useSharedSafeId } from "../hooks/useSafeId.mjs";
|
|
7
|
+
import { isCursorInViewport } from "../utils/collaborators.mjs";
|
|
8
|
+
import { setStyleProperty } from "../utils/dom.mjs";
|
|
9
|
+
import { getHtmlLayerTransform } from "../utils/getHtmlLayerTransform.mjs";
|
|
10
|
+
const LiveCollaborators = track(function LiveCollaborators2() {
|
|
11
|
+
const editor = useEditor();
|
|
12
|
+
const { CollaboratorCursor } = useEditorComponents();
|
|
13
|
+
const rHtmlLayer = useRef(null);
|
|
14
|
+
useLayoutEffect(() => {
|
|
15
|
+
const elm = rHtmlLayer.current;
|
|
16
|
+
if (!elm) return;
|
|
17
|
+
setStyleProperty(elm, "transform", getHtmlLayerTransform(editor));
|
|
18
|
+
});
|
|
19
|
+
useQuickReactor(
|
|
20
|
+
"position collaborators layer",
|
|
21
|
+
function positionCollaboratorsWhenCameraMoves() {
|
|
22
|
+
const transform = getHtmlLayerTransform(editor);
|
|
23
|
+
setStyleProperty(rHtmlLayer.current, "transform", transform);
|
|
24
|
+
},
|
|
25
|
+
[editor]
|
|
26
|
+
);
|
|
27
|
+
const collaborators = editor.getVisibleCollaboratorsOnCurrentPage();
|
|
28
|
+
if (collaborators.length === 0) return null;
|
|
29
|
+
if (!CollaboratorCursor) return null;
|
|
30
|
+
return /* @__PURE__ */ jsxs("div", { className: "tl-collaborators", children: [
|
|
31
|
+
/* @__PURE__ */ jsx("svg", { className: "tl-svg-context", "aria-hidden": "true", children: /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx(CursorDef, {}) }) }),
|
|
32
|
+
/* @__PURE__ */ jsx("div", { ref: rHtmlLayer, className: "tl-html-layer", children: collaborators.map((presence) => /* @__PURE__ */ jsx(Collaborator, { latestPresence: presence }, presence.userId)) })
|
|
33
|
+
] });
|
|
34
|
+
});
|
|
35
|
+
const Collaborator = track(function Collaborator2({
|
|
36
|
+
latestPresence
|
|
37
|
+
}) {
|
|
38
|
+
const editor = useEditor();
|
|
39
|
+
const { CollaboratorCursor } = useEditorComponents();
|
|
40
|
+
const zoomLevel = editor.getZoomLevel();
|
|
41
|
+
const viewportPageBounds = editor.getViewportPageBounds();
|
|
42
|
+
const { userId, chatMessage, userName, cursor, color } = latestPresence;
|
|
43
|
+
if (!cursor) return null;
|
|
44
|
+
if (!isCursorInViewport(cursor, viewportPageBounds, zoomLevel)) return null;
|
|
45
|
+
if (!CollaboratorCursor) return null;
|
|
46
|
+
return /* @__PURE__ */ jsx(
|
|
47
|
+
CollaboratorCursor,
|
|
48
|
+
{
|
|
49
|
+
className: "tl-collaborator__cursor",
|
|
50
|
+
userId,
|
|
51
|
+
point: cursor,
|
|
52
|
+
color,
|
|
53
|
+
zoom: zoomLevel,
|
|
54
|
+
name: userName !== "New User" ? userName : null,
|
|
55
|
+
chatMessage: chatMessage ?? ""
|
|
56
|
+
}
|
|
57
|
+
);
|
|
58
|
+
});
|
|
59
|
+
function CursorDef() {
|
|
60
|
+
return /* @__PURE__ */ jsxs("g", { id: useSharedSafeId("cursor"), children: [
|
|
61
|
+
/* @__PURE__ */ jsxs("g", { fill: "rgba(0,0,0,.2)", transform: "translate(-11,-11)", children: [
|
|
62
|
+
/* @__PURE__ */ jsx("path", { d: "m12 24.4219v-16.015l11.591 11.619h-6.781l-.411.124z" }),
|
|
63
|
+
/* @__PURE__ */ jsx("path", { d: "m21.0845 25.0962-3.605 1.535-4.682-11.089 3.686-1.553z" })
|
|
64
|
+
] }),
|
|
65
|
+
/* @__PURE__ */ jsxs("g", { fill: "white", transform: "translate(-12,-12)", children: [
|
|
66
|
+
/* @__PURE__ */ jsx("path", { d: "m12 24.4219v-16.015l11.591 11.619h-6.781l-.411.124z" }),
|
|
67
|
+
/* @__PURE__ */ jsx("path", { d: "m21.0845 25.0962-3.605 1.535-4.682-11.089 3.686-1.553z" })
|
|
68
|
+
] }),
|
|
69
|
+
/* @__PURE__ */ jsxs("g", { fill: "currentColor", transform: "translate(-12,-12)", children: [
|
|
70
|
+
/* @__PURE__ */ jsx("path", { d: "m19.751 24.4155-1.844.774-3.1-7.374 1.841-.775z" }),
|
|
71
|
+
/* @__PURE__ */ jsx("path", { d: "m13 10.814v11.188l2.969-2.866.428-.139h4.768z" })
|
|
72
|
+
] })
|
|
73
|
+
] });
|
|
74
|
+
}
|
|
75
|
+
export {
|
|
76
|
+
LiveCollaborators
|
|
77
|
+
};
|
|
78
|
+
//# sourceMappingURL=LiveCollaborators.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/lib/components/LiveCollaborators.tsx"],
|
|
4
|
+
"sourcesContent": ["import { track, useQuickReactor } from '@tldraw/state-react'\nimport { TLInstancePresence } from '@tldraw/tlschema'\nimport { useLayoutEffect, useRef } from 'react'\nimport { useEditorComponents } from '../hooks/EditorComponentsContext'\nimport { useEditor } from '../hooks/useEditor'\nimport { useSharedSafeId } from '../hooks/useSafeId'\nimport { isCursorInViewport } from '../utils/collaborators'\nimport { setStyleProperty } from '../utils/dom'\nimport { getHtmlLayerTransform } from '../utils/getHtmlLayerTransform'\n\n/**\n * The collaborator cursor layer: a DOM layer stacked as a sibling of the canvas \u2014 above all canvas\n * content, below the in-front layer and the UI panels \u2014 hosting each visible collaborator's cursor\n * (arrow, name tag, chat message). Off-viewport collaborators are the canvas-drawn hint arrows' job\n * (CollaboratorHintOverlayUtil), not this layer's.\n *\n * Cursors are DOM rather than canvas-drawn so their chrome styles and composes like the rest of\n * the UI; per-cursor positioning writes `transform` directly (see `useTransform`), so pointer- and\n * camera-frequency updates never re-render more than the moved cursor.\n *\n * @public @react\n */\nexport const LiveCollaborators = track(function LiveCollaborators() {\n\tconst editor = useEditor()\n\tconst { CollaboratorCursor } = useEditorComponents()\n\n\t// The inner layer carries the camera transform, so the cursor components position in page\n\t// space exactly as canvas content does. Unlike the canvas's html layers this one unmounts\n\t// while no collaborators are visible, so the transform is written at two moments: on every\n\t// camera change (the reactor), and after every render (the layout effect, like useTransform\n\t// does per cursor) \u2014 the reactor's last run hit a null ref while the layer was unmounted,\n\t// and without the render-time write a reappearing layer would keep an identity transform\n\t// until the next camera move.\n\tconst rHtmlLayer = useRef<HTMLDivElement | null>(null)\n\tuseLayoutEffect(() => {\n\t\tconst elm = rHtmlLayer.current\n\t\tif (!elm) return\n\t\tsetStyleProperty(elm, 'transform', getHtmlLayerTransform(editor))\n\t})\n\tuseQuickReactor(\n\t\t'position collaborators layer',\n\t\tfunction positionCollaboratorsWhenCameraMoves() {\n\t\t\t// Reads the camera even while the layer is unmounted, keeping the subscription alive.\n\t\t\tconst transform = getHtmlLayerTransform(editor)\n\t\t\tsetStyleProperty(rHtmlLayer.current, 'transform', transform)\n\t\t},\n\t\t[editor]\n\t)\n\n\t// Visibility (activity state, following, highlighting) is handled by the editor.\n\tconst collaborators = editor.getVisibleCollaboratorsOnCurrentPage()\n\tif (collaborators.length === 0) return null\n\tif (!CollaboratorCursor) return null\n\n\treturn (\n\t\t<div className=\"tl-collaborators\">\n\t\t\t<svg className=\"tl-svg-context\" aria-hidden=\"true\">\n\t\t\t\t<defs>\n\t\t\t\t\t<CursorDef />\n\t\t\t\t</defs>\n\t\t\t</svg>\n\t\t\t<div ref={rHtmlLayer} className=\"tl-html-layer\">\n\t\t\t\t{collaborators.map((presence) => (\n\t\t\t\t\t<Collaborator key={presence.userId} latestPresence={presence} />\n\t\t\t\t))}\n\t\t\t</div>\n\t\t</div>\n\t)\n})\n\nconst Collaborator = track(function Collaborator({\n\tlatestPresence,\n}: {\n\tlatestPresence: TLInstancePresence\n}) {\n\tconst editor = useEditor()\n\tconst { CollaboratorCursor } = useEditorComponents()\n\n\tconst zoomLevel = editor.getZoomLevel()\n\tconst viewportPageBounds = editor.getViewportPageBounds()\n\tconst { userId, chatMessage, userName, cursor, color } = latestPresence\n\n\tif (!cursor) return null\n\n\t// Off-viewport collaborators show as the canvas-drawn hint arrows\n\t// (CollaboratorHintOverlayUtil), which shares this predicate \u2014 only the cursor itself is DOM.\n\tif (!isCursorInViewport(cursor, viewportPageBounds, zoomLevel)) return null\n\tif (!CollaboratorCursor) return null\n\treturn (\n\t\t<CollaboratorCursor\n\t\t\tclassName=\"tl-collaborator__cursor\"\n\t\t\tuserId={userId}\n\t\t\tpoint={cursor}\n\t\t\tcolor={color}\n\t\t\tzoom={zoomLevel}\n\t\t\tname={userName !== 'New User' ? userName : null}\n\t\t\tchatMessage={chatMessage ?? ''}\n\t\t/>\n\t)\n})\n\nfunction CursorDef() {\n\treturn (\n\t\t<g id={useSharedSafeId('cursor')}>\n\t\t\t<g fill=\"rgba(0,0,0,.2)\" transform=\"translate(-11,-11)\">\n\t\t\t\t<path d=\"m12 24.4219v-16.015l11.591 11.619h-6.781l-.411.124z\" />\n\t\t\t\t<path d=\"m21.0845 25.0962-3.605 1.535-4.682-11.089 3.686-1.553z\" />\n\t\t\t</g>\n\t\t\t<g fill=\"white\" transform=\"translate(-12,-12)\">\n\t\t\t\t<path d=\"m12 24.4219v-16.015l11.591 11.619h-6.781l-.411.124z\" />\n\t\t\t\t<path d=\"m21.0845 25.0962-3.605 1.535-4.682-11.089 3.686-1.553z\" />\n\t\t\t</g>\n\t\t\t<g fill=\"currentColor\" transform=\"translate(-12,-12)\">\n\t\t\t\t<path d=\"m19.751 24.4155-1.844.774-3.1-7.374 1.841-.775z\" />\n\t\t\t\t<path d=\"m13 10.814v11.188l2.969-2.866.428-.139h4.768z\" />\n\t\t\t</g>\n\t\t</g>\n\t)\n}\n"],
|
|
5
|
+
"mappings": "AAuDE,SAGG,KAHH;AAvDF,SAAS,OAAO,uBAAuB;AAEvC,SAAS,iBAAiB,cAAc;AACxC,SAAS,2BAA2B;AACpC,SAAS,iBAAiB;AAC1B,SAAS,uBAAuB;AAChC,SAAS,0BAA0B;AACnC,SAAS,wBAAwB;AACjC,SAAS,6BAA6B;AAc/B,MAAM,oBAAoB,MAAM,SAASA,qBAAoB;AACnE,QAAM,SAAS,UAAU;AACzB,QAAM,EAAE,mBAAmB,IAAI,oBAAoB;AASnD,QAAM,aAAa,OAA8B,IAAI;AACrD,kBAAgB,MAAM;AACrB,UAAM,MAAM,WAAW;AACvB,QAAI,CAAC,IAAK;AACV,qBAAiB,KAAK,aAAa,sBAAsB,MAAM,CAAC;AAAA,EACjE,CAAC;AACD;AAAA,IACC;AAAA,IACA,SAAS,uCAAuC;AAE/C,YAAM,YAAY,sBAAsB,MAAM;AAC9C,uBAAiB,WAAW,SAAS,aAAa,SAAS;AAAA,IAC5D;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AAGA,QAAM,gBAAgB,OAAO,qCAAqC;AAClE,MAAI,cAAc,WAAW,EAAG,QAAO;AACvC,MAAI,CAAC,mBAAoB,QAAO;AAEhC,SACC,qBAAC,SAAI,WAAU,oBACd;AAAA,wBAAC,SAAI,WAAU,kBAAiB,eAAY,QAC3C,8BAAC,UACA,8BAAC,aAAU,GACZ,GACD;AAAA,IACA,oBAAC,SAAI,KAAK,YAAY,WAAU,iBAC9B,wBAAc,IAAI,CAAC,aACnB,oBAAC,gBAAmC,gBAAgB,YAAjC,SAAS,MAAkC,CAC9D,GACF;AAAA,KACD;AAEF,CAAC;AAED,MAAM,eAAe,MAAM,SAASC,cAAa;AAAA,EAChD;AACD,GAEG;AACF,QAAM,SAAS,UAAU;AACzB,QAAM,EAAE,mBAAmB,IAAI,oBAAoB;AAEnD,QAAM,YAAY,OAAO,aAAa;AACtC,QAAM,qBAAqB,OAAO,sBAAsB;AACxD,QAAM,EAAE,QAAQ,aAAa,UAAU,QAAQ,MAAM,IAAI;AAEzD,MAAI,CAAC,OAAQ,QAAO;AAIpB,MAAI,CAAC,mBAAmB,QAAQ,oBAAoB,SAAS,EAAG,QAAO;AACvE,MAAI,CAAC,mBAAoB,QAAO;AAChC,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA,MAAM;AAAA,MACN,MAAM,aAAa,aAAa,WAAW;AAAA,MAC3C,aAAa,eAAe;AAAA;AAAA,EAC7B;AAEF,CAAC;AAED,SAAS,YAAY;AACpB,SACC,qBAAC,OAAE,IAAI,gBAAgB,QAAQ,GAC9B;AAAA,yBAAC,OAAE,MAAK,kBAAiB,WAAU,sBAClC;AAAA,0BAAC,UAAK,GAAE,uDAAsD;AAAA,MAC9D,oBAAC,UAAK,GAAE,0DAAyD;AAAA,OAClE;AAAA,IACA,qBAAC,OAAE,MAAK,SAAQ,WAAU,sBACzB;AAAA,0BAAC,UAAK,GAAE,uDAAsD;AAAA,MAC9D,oBAAC,UAAK,GAAE,0DAAyD;AAAA,OAClE;AAAA,IACA,qBAAC,OAAE,MAAK,gBAAe,WAAU,sBAChC;AAAA,0BAAC,UAAK,GAAE,mDAAkD;AAAA,MAC1D,oBAAC,UAAK,GAAE,iDAAgD;AAAA,OACzD;AAAA,KACD;AAEF;",
|
|
6
|
+
"names": ["LiveCollaborators", "Collaborator"]
|
|
7
|
+
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { react } from "@tldraw/state";
|
|
3
3
|
import { useQuickReactor, useValue } from "@tldraw/state-react";
|
|
4
|
-
import {
|
|
4
|
+
import { objectMapValues } from "@tldraw/utils";
|
|
5
5
|
import classNames from "classnames";
|
|
6
6
|
import { Fragment as Fragment2, useEffect, useRef, useState } from "react";
|
|
7
7
|
import { tlenv } from "../../globals/environment.mjs";
|
|
@@ -15,9 +15,10 @@ import { useFixSafariDoubleTapZoomPencilEvents } from "../../hooks/useFixSafariD
|
|
|
15
15
|
import { useGestureEvents } from "../../hooks/useGestureEvents.mjs";
|
|
16
16
|
import { useScreenBounds } from "../../hooks/useScreenBounds.mjs";
|
|
17
17
|
import { ShapeCullingProvider, useShapeCulling } from "../../hooks/useShapeCulling.mjs";
|
|
18
|
-
import { toDomPrecision } from "../../primitives/utils.mjs";
|
|
19
18
|
import { debugFlags } from "../../utils/debug-flags.mjs";
|
|
20
19
|
import { setStyleProperty } from "../../utils/dom.mjs";
|
|
20
|
+
import { getHtmlLayerTransform } from "../../utils/getHtmlLayerTransform.mjs";
|
|
21
|
+
import { LiveCollaborators } from "../LiveCollaborators.mjs";
|
|
21
22
|
import { MenuClickCapture } from "../MenuClickCapture.mjs";
|
|
22
23
|
import { Shape } from "../Shape.mjs";
|
|
23
24
|
import { CanvasOverlays } from "./CanvasOverlays.mjs";
|
|
@@ -74,15 +75,7 @@ function DefaultCanvas({ className }) {
|
|
|
74
75
|
useQuickReactor(
|
|
75
76
|
"position layers",
|
|
76
77
|
function positionLayersWhenCameraMoves() {
|
|
77
|
-
|
|
78
|
-
const offset = z >= 1 ? modulate(z, [1, 8], [0.125, 0.5], true) : modulate(z, [0.1, 1], [-2, 0.125], true);
|
|
79
|
-
setStyleProperty(
|
|
80
|
-
rHtmlLayer.current,
|
|
81
|
-
"transform",
|
|
82
|
-
`scale(${toDomPrecision(z)}) translate(${toDomPrecision(
|
|
83
|
-
x + offset
|
|
84
|
-
)}px,${toDomPrecision(y + offset)}px)`
|
|
85
|
-
);
|
|
78
|
+
setStyleProperty(rHtmlLayer.current, "transform", getHtmlLayerTransform(editor));
|
|
86
79
|
},
|
|
87
80
|
[editor, container]
|
|
88
81
|
);
|
|
@@ -132,6 +125,7 @@ function DefaultCanvas({ className }) {
|
|
|
132
125
|
}
|
|
133
126
|
),
|
|
134
127
|
/* @__PURE__ */ jsx(InFrontOfTheCanvasWrapper, {}),
|
|
128
|
+
/* @__PURE__ */ jsx(LiveCollaborators, {}),
|
|
135
129
|
/* @__PURE__ */ jsx(MenuClickCapture, {})
|
|
136
130
|
] });
|
|
137
131
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/lib/components/default-components/DefaultCanvas.tsx"],
|
|
4
|
-
"sourcesContent": ["import { react } from '@tldraw/state'\nimport { useQuickReactor, useValue } from '@tldraw/state-react'\nimport { TLShapeId } from '@tldraw/tlschema'\nimport { modulate, objectMapValues } from '@tldraw/utils'\nimport classNames from 'classnames'\nimport { Fragment, JSX, useEffect, useRef, useState } from 'react'\nimport { tlenv } from '../../globals/environment'\nimport { useEditorComponents } from '../../hooks/EditorComponentsContext'\nimport { useCanvasEvents } from '../../hooks/useCanvasEvents'\nimport { useCoarsePointer } from '../../hooks/useCoarsePointer'\nimport { useContainer } from '../../hooks/useContainer'\nimport { useDocumentEvents } from '../../hooks/useDocumentEvents'\nimport { useEditor } from '../../hooks/useEditor'\nimport { useFixSafariDoubleTapZoomPencilEvents } from '../../hooks/useFixSafariDoubleTapZoomPencilEvents'\nimport { useGestureEvents } from '../../hooks/useGestureEvents'\nimport { useScreenBounds } from '../../hooks/useScreenBounds'\nimport { ShapeCullingProvider, useShapeCulling } from '../../hooks/useShapeCulling'\nimport { Box } from '../../primitives/Box'\nimport { toDomPrecision } from '../../primitives/utils'\nimport { debugFlags } from '../../utils/debug-flags'\nimport { setStyleProperty } from '../../utils/dom'\nimport { MenuClickCapture } from '../MenuClickCapture'\nimport { Shape } from '../Shape'\nimport { CanvasOverlays } from './CanvasOverlays'\n\n/** @public */\nexport interface TLCanvasComponentProps {\n\tclassName?: string\n}\n\n/** @public @react */\nexport function DefaultCanvas({ className }: TLCanvasComponentProps) {\n\tconst editor = useEditor()\n\n\tconst { Background, SvgDefs } = useEditorComponents()\n\n\tconst rCanvas = useRef<HTMLDivElement>(null)\n\tconst rHtmlLayer = useRef<HTMLDivElement>(null)\n\tconst container = useContainer()\n\n\tuseScreenBounds(rCanvas)\n\tuseDocumentEvents()\n\tuseCoarsePointer()\n\n\tuseGestureEvents(rCanvas)\n\tuseFixSafariDoubleTapZoomPencilEvents(rCanvas)\n\n\tuseQuickReactor(\n\t\t'update canvas state data attributes',\n\t\t() => {\n\t\t\tconst canvas = rCanvas.current\n\t\t\tif (!canvas) return\n\n\t\t\tcanvas.setAttribute(\n\t\t\t\t'data-iseditinganything',\n\t\t\t\teditor.getEditingShapeId() === null ? 'false' : 'true'\n\t\t\t)\n\t\t\tcanvas.setAttribute(\n\t\t\t\t'data-isselectinganything',\n\t\t\t\teditor.getSelectedShapeIds().length === 0 ? 'false' : 'true'\n\t\t\t)\n\t\t},\n\t\t[editor]\n\t)\n\n\tconst rMemoizedStuff = useRef({ lodDisableTextOutline: false, canUpdateTextOutline: true })\n\n\tuseQuickReactor(\n\t\t'set text outline',\n\t\tfunction setTextOutline() {\n\t\t\tif (rMemoizedStuff.current.canUpdateTextOutline) {\n\t\t\t\tif (tlenv.isSafari) {\n\t\t\t\t\t// We don't allow text outlines on safari for performance reasons\n\t\t\t\t\tcontainer.style.setProperty('--tl-text-outline', 'none')\n\t\t\t\t\trMemoizedStuff.current.canUpdateTextOutline = false // will prevent this check in the future\n\t\t\t\t} else {\n\t\t\t\t\tconst efficientZoom = editor.getEfficientZoomLevel()\n\t\t\t\t\t// If we're zoomed way out, and have this option enabled, then we hide text outline\n\t\t\t\t\tconst lodDisableTextOutline = efficientZoom < editor.options.textShadowLod\n\t\t\t\t\t// Skip the style update if the property is the same as it was before\n\t\t\t\t\tif (lodDisableTextOutline !== rMemoizedStuff.current.lodDisableTextOutline) {\n\t\t\t\t\t\tcontainer.style.setProperty(\n\t\t\t\t\t\t\t'--tl-text-outline',\n\t\t\t\t\t\t\tlodDisableTextOutline ? 'none' : `var(--tl-text-outline-reference)`\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t\trMemoizedStuff.current.lodDisableTextOutline = lodDisableTextOutline\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[editor, container]\n\t)\n\n\tuseQuickReactor(\n\t\t'position layers',\n\t\tfunction positionLayersWhenCameraMoves() {\n\t\t\tconst { x, y, z } = editor.getCamera()\n\n\t\t\t// Because the html container has a width/height of 1px, we\n\t\t\t// need to create a small offset when zoomed to ensure that\n\t\t\t// the html container and svg container are lined up exactly.\n\t\t\tconst offset =\n\t\t\t\tz >= 1 ? modulate(z, [1, 8], [0.125, 0.5], true) : modulate(z, [0.1, 1], [-2, 0.125], true)\n\n\t\t\tsetStyleProperty(\n\t\t\t\trHtmlLayer.current,\n\t\t\t\t'transform',\n\t\t\t\t`scale(${toDomPrecision(z)}) translate(${toDomPrecision(\n\t\t\t\t\tx + offset\n\t\t\t\t)}px,${toDomPrecision(y + offset)}px)`\n\t\t\t)\n\t\t},\n\t\t[editor, container]\n\t)\n\n\tconst events = useCanvasEvents()\n\n\tconst shapeSvgDefs = useValue(\n\t\t'shapeSvgDefs',\n\t\t() => {\n\t\t\tconst shapeSvgDefsByKey = new Map<string, JSX.Element>()\n\t\t\tfor (const util of objectMapValues(editor.shapeUtils)) {\n\t\t\t\tif (!util) return\n\t\t\t\tconst defs = util.getCanvasSvgDefs()\n\t\t\t\tfor (const { key, component: Component } of defs) {\n\t\t\t\t\tif (shapeSvgDefsByKey.has(key)) continue\n\t\t\t\t\tshapeSvgDefsByKey.set(key, <Component key={key} />)\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn [...shapeSvgDefsByKey.values()]\n\t\t},\n\t\t[editor]\n\t)\n\n\tconst hideShapes = useValue('debug_shapes', () => debugFlags.hideShapes.get(), [debugFlags])\n\n\tconst isGridMode = useValue('isGridMode', () => editor.getInstanceState().isGridMode, [editor])\n\tconst { Grid } = useEditorComponents()\n\n\treturn (\n\t\t<>\n\t\t\t<div\n\t\t\t\tref={rCanvas}\n\t\t\t\tdraggable={false}\n\t\t\t\tclassName={classNames('tl-canvas', className)}\n\t\t\t\tdata-testid=\"canvas\"\n\t\t\t\t{...events}\n\t\t\t>\n\t\t\t\t<svg className=\"tl-svg-context\" aria-hidden=\"true\">\n\t\t\t\t\t<defs>\n\t\t\t\t\t\t{shapeSvgDefs}\n\t\t\t\t\t\t{SvgDefs && <SvgDefs />}\n\t\t\t\t\t</defs>\n\t\t\t\t</svg>\n\t\t\t\t{Background && (\n\t\t\t\t\t<div className=\"tl-background__wrapper\">\n\t\t\t\t\t\t<Background />\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t{isGridMode && Grid && <GridWrapper />}\n\t\t\t\t<div ref={rHtmlLayer} className=\"tl-html-layer tl-shapes\" draggable={false}>\n\t\t\t\t\t<OnTheCanvasWrapper />\n\t\t\t\t\t{hideShapes ? null : <ShapesLayer canvasRef={rCanvas} />}\n\t\t\t\t</div>\n\t\t\t\t<CanvasOverlays />\n\t\t\t\t<MovingCameraHitTestBlocker />\n\t\t\t</div>\n\t\t\t<InFrontOfTheCanvasWrapper />\n\t\t\t<MenuClickCapture />\n\t\t</>\n\t)\n}\n\nfunction InFrontOfTheCanvasWrapper() {\n\tconst editor = useEditor()\n\tconst { InFrontOfTheCanvas } = useEditorComponents()\n\tif (!InFrontOfTheCanvas) return null\n\treturn (\n\t\t<div\n\t\t\tclassName=\"tl-canvas__in-front\"\n\t\t\tonPointerDown={editor.markEventAsHandled}\n\t\t\tonPointerUp={editor.markEventAsHandled}\n\t\t\tonTouchStart={editor.markEventAsHandled}\n\t\t\tonTouchEnd={editor.markEventAsHandled}\n\t\t>\n\t\t\t<InFrontOfTheCanvas />\n\t\t</div>\n\t)\n}\n\nfunction GridWrapper() {\n\tconst editor = useEditor()\n\tconst gridSize = useValue('gridSize', () => editor.getDocumentSettings().gridSize, [editor])\n\tconst { x, y, z } = useValue('camera', () => editor.getCamera(), [editor])\n\tconst { Grid } = useEditorComponents()\n\n\tif (!Grid) return null\n\n\treturn <Grid x={x} y={y} z={z} size={gridSize} />\n}\n\nfunction ShapesLayer({ canvasRef }: { canvasRef: { readonly current: HTMLDivElement | null } }) {\n\tconst editor = useEditor()\n\tconst debugSvg = useValue('debug svg', () => debugFlags.debugSvg.get(), [debugFlags])\n\tconst renderingShapes = useValue('rendering shapes', () => editor.getRenderingShapes(), [editor])\n\n\treturn (\n\t\t<ShapeCullingProvider>\n\t\t\t{renderingShapes.map((result) =>\n\t\t\t\tdebugSvg ? (\n\t\t\t\t\t<Fragment key={result.id + '_fragment'}>\n\t\t\t\t\t\t<Shape {...result} />\n\t\t\t\t\t\t<DebugSvgCopy id={result.id} mode=\"iframe\" />\n\t\t\t\t\t</Fragment>\n\t\t\t\t) : (\n\t\t\t\t\t<Shape key={result.id + '_shape'} {...result} />\n\t\t\t\t)\n\t\t\t)}\n\t\t\t<CullingController />\n\t\t\t{tlenv.isSafari && <ReflowIfNeeded canvasRef={canvasRef} />}\n\t\t</ShapeCullingProvider>\n\t)\n}\nfunction ReflowIfNeeded({ canvasRef }: { canvasRef: { readonly current: HTMLDivElement | null } }) {\n\tconst editor = useEditor()\n\tconst culledShapesRef = useRef<Set<TLShapeId>>(new Set())\n\tuseQuickReactor(\n\t\t'reflow for culled shapes',\n\t\t() => {\n\t\t\tconst culledShapes = editor.getCulledShapes()\n\t\t\tif (culledShapesRef.current === culledShapes) return\n\n\t\t\tculledShapesRef.current = culledShapes\n\t\t\tconst canvas = canvasRef.current\n\t\t\tif (!canvas) return\n\t\t\t// This causes a reflow\n\t\t\t// https://gist.github.com/paulirish/5d52fb081b3570c81e3a\n\t\t\tconst _height = canvas.offsetHeight\n\t\t},\n\t\t[editor, canvasRef]\n\t)\n\treturn null\n}\n\n/**\n * Centralized culling controller that updates shape container visibility.\n * This single reactor replaces per-shape subscriptions for O(1) instead of O(N) subscriptions.\n */\nfunction CullingController() {\n\tconst editor = useEditor()\n\tconst { updateCulling } = useShapeCulling()\n\n\tuseQuickReactor(\n\t\t'update shape culling',\n\t\t() => {\n\t\t\tconst culledShapes = editor.getCulledShapes()\n\t\t\tupdateCulling(culledShapes)\n\t\t},\n\t\t[editor, updateCulling]\n\t)\n\n\treturn null\n}\n\nfunction DebugSvgCopy({ id, mode }: { id: TLShapeId; mode: 'img' | 'iframe' }) {\n\tconst editor = useEditor()\n\n\tconst [image, setImage] = useState<{ src: string; bounds: Box } | null>(null)\n\n\tconst isInRoot = useValue(\n\t\t'is in root',\n\t\t() => {\n\t\t\tconst shape = editor.getShape(id)\n\t\t\treturn shape?.parentId === editor.getCurrentPageId()\n\t\t},\n\t\t[editor, id]\n\t)\n\n\tuseEffect(() => {\n\t\tif (!isInRoot) return\n\n\t\tlet latest = null\n\t\tconst unsubscribe = react('shape to svg', async () => {\n\t\t\tconst renderId = Math.random()\n\t\t\tlatest = renderId\n\n\t\t\tconst shape = editor.getShape(id)\n\t\t\tconst isSingleFrame = !!shape && editor.isShapeFrameLike(shape)\n\t\t\tconst padding = isSingleFrame ? 0 : 10\n\t\t\tlet bounds = editor.getShapePageBounds(id)\n\t\t\tif (!bounds) return\n\t\t\tbounds = bounds.clone().expandBy(padding)\n\n\t\t\tconst result = await editor.getSvgString([id], { padding })\n\n\t\t\tif (latest !== renderId || !result) return\n\n\t\t\tconst svgDataUrl = `data:image/svg+xml;utf8,${encodeURIComponent(result.svg)}`\n\t\t\tsetImage({ src: svgDataUrl, bounds })\n\t\t})\n\n\t\treturn () => {\n\t\t\tlatest = null\n\t\t\tunsubscribe()\n\t\t}\n\t}, [editor, id, isInRoot])\n\n\tif (!isInRoot || !image) return null\n\n\tif (mode === 'iframe') {\n\t\treturn (\n\t\t\t<iframe\n\t\t\t\tsrc={image.src}\n\t\t\t\twidth={image.bounds.width}\n\t\t\t\theight={image.bounds.height}\n\t\t\t\treferrerPolicy=\"no-referrer\"\n\t\t\t\tstyle={{\n\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\ttop: 0,\n\t\t\t\t\tleft: 0,\n\t\t\t\t\tborder: 'none',\n\t\t\t\t\ttransform: `translate(${image.bounds.x}px, ${image.bounds.maxY + 12}px)`,\n\t\t\t\t\toutline: '1px solid black',\n\t\t\t\t\tmaxWidth: 'none',\n\t\t\t\t}}\n\t\t\t/>\n\t\t)\n\t}\n\treturn (\n\t\t<img\n\t\t\tsrc={image.src}\n\t\t\twidth={image.bounds.width}\n\t\t\theight={image.bounds.height}\n\t\t\treferrerPolicy=\"no-referrer\"\n\t\t\tstyle={{\n\t\t\t\tposition: 'absolute',\n\t\t\t\ttop: 0,\n\t\t\t\tleft: 0,\n\t\t\t\ttransform: `translate(${image.bounds.x}px, ${image.bounds.maxY + 12}px)`,\n\t\t\t\toutline: '1px solid black',\n\t\t\t\tmaxWidth: 'none',\n\t\t\t}}\n\t\t/>\n\t)\n}\n\nfunction OnTheCanvasWrapper() {\n\tconst { OnTheCanvas } = useEditorComponents()\n\tif (!OnTheCanvas) return null\n\treturn <OnTheCanvas />\n}\n\nfunction MovingCameraHitTestBlocker() {\n\tconst editor = useEditor()\n\tconst cameraState = useValue('camera state', () => editor.getCameraState(), [editor])\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classNames('tl-hit-test-blocker', {\n\t\t\t\t'tl-hit-test-blocker__hidden': cameraState === 'idle',\n\t\t\t})}\n\t\t/>\n\t)\n}\n"],
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import { react } from '@tldraw/state'\nimport { useQuickReactor, useValue } from '@tldraw/state-react'\nimport { TLShapeId } from '@tldraw/tlschema'\nimport { objectMapValues } from '@tldraw/utils'\nimport classNames from 'classnames'\nimport { Fragment, JSX, useEffect, useRef, useState } from 'react'\nimport { tlenv } from '../../globals/environment'\nimport { useEditorComponents } from '../../hooks/EditorComponentsContext'\nimport { useCanvasEvents } from '../../hooks/useCanvasEvents'\nimport { useCoarsePointer } from '../../hooks/useCoarsePointer'\nimport { useContainer } from '../../hooks/useContainer'\nimport { useDocumentEvents } from '../../hooks/useDocumentEvents'\nimport { useEditor } from '../../hooks/useEditor'\nimport { useFixSafariDoubleTapZoomPencilEvents } from '../../hooks/useFixSafariDoubleTapZoomPencilEvents'\nimport { useGestureEvents } from '../../hooks/useGestureEvents'\nimport { useScreenBounds } from '../../hooks/useScreenBounds'\nimport { ShapeCullingProvider, useShapeCulling } from '../../hooks/useShapeCulling'\nimport { Box } from '../../primitives/Box'\nimport { debugFlags } from '../../utils/debug-flags'\nimport { setStyleProperty } from '../../utils/dom'\nimport { getHtmlLayerTransform } from '../../utils/getHtmlLayerTransform'\nimport { LiveCollaborators } from '../LiveCollaborators'\nimport { MenuClickCapture } from '../MenuClickCapture'\nimport { Shape } from '../Shape'\nimport { CanvasOverlays } from './CanvasOverlays'\n\n/** @public */\nexport interface TLCanvasComponentProps {\n\tclassName?: string\n}\n\n/** @public @react */\nexport function DefaultCanvas({ className }: TLCanvasComponentProps) {\n\tconst editor = useEditor()\n\n\tconst { Background, SvgDefs } = useEditorComponents()\n\n\tconst rCanvas = useRef<HTMLDivElement>(null)\n\tconst rHtmlLayer = useRef<HTMLDivElement>(null)\n\tconst container = useContainer()\n\n\tuseScreenBounds(rCanvas)\n\tuseDocumentEvents()\n\tuseCoarsePointer()\n\n\tuseGestureEvents(rCanvas)\n\tuseFixSafariDoubleTapZoomPencilEvents(rCanvas)\n\n\tuseQuickReactor(\n\t\t'update canvas state data attributes',\n\t\t() => {\n\t\t\tconst canvas = rCanvas.current\n\t\t\tif (!canvas) return\n\n\t\t\tcanvas.setAttribute(\n\t\t\t\t'data-iseditinganything',\n\t\t\t\teditor.getEditingShapeId() === null ? 'false' : 'true'\n\t\t\t)\n\t\t\tcanvas.setAttribute(\n\t\t\t\t'data-isselectinganything',\n\t\t\t\teditor.getSelectedShapeIds().length === 0 ? 'false' : 'true'\n\t\t\t)\n\t\t},\n\t\t[editor]\n\t)\n\n\tconst rMemoizedStuff = useRef({ lodDisableTextOutline: false, canUpdateTextOutline: true })\n\n\tuseQuickReactor(\n\t\t'set text outline',\n\t\tfunction setTextOutline() {\n\t\t\tif (rMemoizedStuff.current.canUpdateTextOutline) {\n\t\t\t\tif (tlenv.isSafari) {\n\t\t\t\t\t// We don't allow text outlines on safari for performance reasons\n\t\t\t\t\tcontainer.style.setProperty('--tl-text-outline', 'none')\n\t\t\t\t\trMemoizedStuff.current.canUpdateTextOutline = false // will prevent this check in the future\n\t\t\t\t} else {\n\t\t\t\t\tconst efficientZoom = editor.getEfficientZoomLevel()\n\t\t\t\t\t// If we're zoomed way out, and have this option enabled, then we hide text outline\n\t\t\t\t\tconst lodDisableTextOutline = efficientZoom < editor.options.textShadowLod\n\t\t\t\t\t// Skip the style update if the property is the same as it was before\n\t\t\t\t\tif (lodDisableTextOutline !== rMemoizedStuff.current.lodDisableTextOutline) {\n\t\t\t\t\t\tcontainer.style.setProperty(\n\t\t\t\t\t\t\t'--tl-text-outline',\n\t\t\t\t\t\t\tlodDisableTextOutline ? 'none' : `var(--tl-text-outline-reference)`\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t\trMemoizedStuff.current.lodDisableTextOutline = lodDisableTextOutline\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[editor, container]\n\t)\n\n\tuseQuickReactor(\n\t\t'position layers',\n\t\tfunction positionLayersWhenCameraMoves() {\n\t\t\tsetStyleProperty(rHtmlLayer.current, 'transform', getHtmlLayerTransform(editor))\n\t\t},\n\t\t[editor, container]\n\t)\n\n\tconst events = useCanvasEvents()\n\n\tconst shapeSvgDefs = useValue(\n\t\t'shapeSvgDefs',\n\t\t() => {\n\t\t\tconst shapeSvgDefsByKey = new Map<string, JSX.Element>()\n\t\t\tfor (const util of objectMapValues(editor.shapeUtils)) {\n\t\t\t\tif (!util) return\n\t\t\t\tconst defs = util.getCanvasSvgDefs()\n\t\t\t\tfor (const { key, component: Component } of defs) {\n\t\t\t\t\tif (shapeSvgDefsByKey.has(key)) continue\n\t\t\t\t\tshapeSvgDefsByKey.set(key, <Component key={key} />)\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn [...shapeSvgDefsByKey.values()]\n\t\t},\n\t\t[editor]\n\t)\n\n\tconst hideShapes = useValue('debug_shapes', () => debugFlags.hideShapes.get(), [debugFlags])\n\n\tconst isGridMode = useValue('isGridMode', () => editor.getInstanceState().isGridMode, [editor])\n\tconst { Grid } = useEditorComponents()\n\n\treturn (\n\t\t<>\n\t\t\t<div\n\t\t\t\tref={rCanvas}\n\t\t\t\tdraggable={false}\n\t\t\t\tclassName={classNames('tl-canvas', className)}\n\t\t\t\tdata-testid=\"canvas\"\n\t\t\t\t{...events}\n\t\t\t>\n\t\t\t\t<svg className=\"tl-svg-context\" aria-hidden=\"true\">\n\t\t\t\t\t<defs>\n\t\t\t\t\t\t{shapeSvgDefs}\n\t\t\t\t\t\t{SvgDefs && <SvgDefs />}\n\t\t\t\t\t</defs>\n\t\t\t\t</svg>\n\t\t\t\t{Background && (\n\t\t\t\t\t<div className=\"tl-background__wrapper\">\n\t\t\t\t\t\t<Background />\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t{isGridMode && Grid && <GridWrapper />}\n\t\t\t\t<div ref={rHtmlLayer} className=\"tl-html-layer tl-shapes\" draggable={false}>\n\t\t\t\t\t<OnTheCanvasWrapper />\n\t\t\t\t\t{hideShapes ? null : <ShapesLayer canvasRef={rCanvas} />}\n\t\t\t\t</div>\n\t\t\t\t<CanvasOverlays />\n\t\t\t\t<MovingCameraHitTestBlocker />\n\t\t\t</div>\n\t\t\t<InFrontOfTheCanvasWrapper />\n\t\t\t<LiveCollaborators />\n\t\t\t<MenuClickCapture />\n\t\t</>\n\t)\n}\n\nfunction InFrontOfTheCanvasWrapper() {\n\tconst editor = useEditor()\n\tconst { InFrontOfTheCanvas } = useEditorComponents()\n\tif (!InFrontOfTheCanvas) return null\n\treturn (\n\t\t<div\n\t\t\tclassName=\"tl-canvas__in-front\"\n\t\t\tonPointerDown={editor.markEventAsHandled}\n\t\t\tonPointerUp={editor.markEventAsHandled}\n\t\t\tonTouchStart={editor.markEventAsHandled}\n\t\t\tonTouchEnd={editor.markEventAsHandled}\n\t\t>\n\t\t\t<InFrontOfTheCanvas />\n\t\t</div>\n\t)\n}\n\nfunction GridWrapper() {\n\tconst editor = useEditor()\n\tconst gridSize = useValue('gridSize', () => editor.getDocumentSettings().gridSize, [editor])\n\tconst { x, y, z } = useValue('camera', () => editor.getCamera(), [editor])\n\tconst { Grid } = useEditorComponents()\n\n\tif (!Grid) return null\n\n\treturn <Grid x={x} y={y} z={z} size={gridSize} />\n}\n\nfunction ShapesLayer({ canvasRef }: { canvasRef: { readonly current: HTMLDivElement | null } }) {\n\tconst editor = useEditor()\n\tconst debugSvg = useValue('debug svg', () => debugFlags.debugSvg.get(), [debugFlags])\n\tconst renderingShapes = useValue('rendering shapes', () => editor.getRenderingShapes(), [editor])\n\n\treturn (\n\t\t<ShapeCullingProvider>\n\t\t\t{renderingShapes.map((result) =>\n\t\t\t\tdebugSvg ? (\n\t\t\t\t\t<Fragment key={result.id + '_fragment'}>\n\t\t\t\t\t\t<Shape {...result} />\n\t\t\t\t\t\t<DebugSvgCopy id={result.id} mode=\"iframe\" />\n\t\t\t\t\t</Fragment>\n\t\t\t\t) : (\n\t\t\t\t\t<Shape key={result.id + '_shape'} {...result} />\n\t\t\t\t)\n\t\t\t)}\n\t\t\t<CullingController />\n\t\t\t{tlenv.isSafari && <ReflowIfNeeded canvasRef={canvasRef} />}\n\t\t</ShapeCullingProvider>\n\t)\n}\nfunction ReflowIfNeeded({ canvasRef }: { canvasRef: { readonly current: HTMLDivElement | null } }) {\n\tconst editor = useEditor()\n\tconst culledShapesRef = useRef<Set<TLShapeId>>(new Set())\n\tuseQuickReactor(\n\t\t'reflow for culled shapes',\n\t\t() => {\n\t\t\tconst culledShapes = editor.getCulledShapes()\n\t\t\tif (culledShapesRef.current === culledShapes) return\n\n\t\t\tculledShapesRef.current = culledShapes\n\t\t\tconst canvas = canvasRef.current\n\t\t\tif (!canvas) return\n\t\t\t// This causes a reflow\n\t\t\t// https://gist.github.com/paulirish/5d52fb081b3570c81e3a\n\t\t\tconst _height = canvas.offsetHeight\n\t\t},\n\t\t[editor, canvasRef]\n\t)\n\treturn null\n}\n\n/**\n * Centralized culling controller that updates shape container visibility.\n * This single reactor replaces per-shape subscriptions for O(1) instead of O(N) subscriptions.\n */\nfunction CullingController() {\n\tconst editor = useEditor()\n\tconst { updateCulling } = useShapeCulling()\n\n\tuseQuickReactor(\n\t\t'update shape culling',\n\t\t() => {\n\t\t\tconst culledShapes = editor.getCulledShapes()\n\t\t\tupdateCulling(culledShapes)\n\t\t},\n\t\t[editor, updateCulling]\n\t)\n\n\treturn null\n}\n\nfunction DebugSvgCopy({ id, mode }: { id: TLShapeId; mode: 'img' | 'iframe' }) {\n\tconst editor = useEditor()\n\n\tconst [image, setImage] = useState<{ src: string; bounds: Box } | null>(null)\n\n\tconst isInRoot = useValue(\n\t\t'is in root',\n\t\t() => {\n\t\t\tconst shape = editor.getShape(id)\n\t\t\treturn shape?.parentId === editor.getCurrentPageId()\n\t\t},\n\t\t[editor, id]\n\t)\n\n\tuseEffect(() => {\n\t\tif (!isInRoot) return\n\n\t\tlet latest = null\n\t\tconst unsubscribe = react('shape to svg', async () => {\n\t\t\tconst renderId = Math.random()\n\t\t\tlatest = renderId\n\n\t\t\tconst shape = editor.getShape(id)\n\t\t\tconst isSingleFrame = !!shape && editor.isShapeFrameLike(shape)\n\t\t\tconst padding = isSingleFrame ? 0 : 10\n\t\t\tlet bounds = editor.getShapePageBounds(id)\n\t\t\tif (!bounds) return\n\t\t\tbounds = bounds.clone().expandBy(padding)\n\n\t\t\tconst result = await editor.getSvgString([id], { padding })\n\n\t\t\tif (latest !== renderId || !result) return\n\n\t\t\tconst svgDataUrl = `data:image/svg+xml;utf8,${encodeURIComponent(result.svg)}`\n\t\t\tsetImage({ src: svgDataUrl, bounds })\n\t\t})\n\n\t\treturn () => {\n\t\t\tlatest = null\n\t\t\tunsubscribe()\n\t\t}\n\t}, [editor, id, isInRoot])\n\n\tif (!isInRoot || !image) return null\n\n\tif (mode === 'iframe') {\n\t\treturn (\n\t\t\t<iframe\n\t\t\t\tsrc={image.src}\n\t\t\t\twidth={image.bounds.width}\n\t\t\t\theight={image.bounds.height}\n\t\t\t\treferrerPolicy=\"no-referrer\"\n\t\t\t\tstyle={{\n\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\ttop: 0,\n\t\t\t\t\tleft: 0,\n\t\t\t\t\tborder: 'none',\n\t\t\t\t\ttransform: `translate(${image.bounds.x}px, ${image.bounds.maxY + 12}px)`,\n\t\t\t\t\toutline: '1px solid black',\n\t\t\t\t\tmaxWidth: 'none',\n\t\t\t\t}}\n\t\t\t/>\n\t\t)\n\t}\n\treturn (\n\t\t<img\n\t\t\tsrc={image.src}\n\t\t\twidth={image.bounds.width}\n\t\t\theight={image.bounds.height}\n\t\t\treferrerPolicy=\"no-referrer\"\n\t\t\tstyle={{\n\t\t\t\tposition: 'absolute',\n\t\t\t\ttop: 0,\n\t\t\t\tleft: 0,\n\t\t\t\ttransform: `translate(${image.bounds.x}px, ${image.bounds.maxY + 12}px)`,\n\t\t\t\toutline: '1px solid black',\n\t\t\t\tmaxWidth: 'none',\n\t\t\t}}\n\t\t/>\n\t)\n}\n\nfunction OnTheCanvasWrapper() {\n\tconst { OnTheCanvas } = useEditorComponents()\n\tif (!OnTheCanvas) return null\n\treturn <OnTheCanvas />\n}\n\nfunction MovingCameraHitTestBlocker() {\n\tconst editor = useEditor()\n\tconst cameraState = useValue('camera state', () => editor.getCameraState(), [editor])\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classNames('tl-hit-test-blocker', {\n\t\t\t\t'tl-hit-test-blocker__hidden': cameraState === 'idle',\n\t\t\t})}\n\t\t/>\n\t)\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["Fragment"]
|
|
7
7
|
}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import classNames from "classnames";
|
|
3
|
+
import { memo, useRef } from "react";
|
|
4
|
+
import { useSharedSafeId } from "../../hooks/useSafeId.mjs";
|
|
5
|
+
import { useTransform } from "../../hooks/useTransform.mjs";
|
|
6
|
+
const DefaultCursor = memo(function DefaultCursor2({
|
|
7
|
+
className,
|
|
8
|
+
zoom,
|
|
9
|
+
point,
|
|
10
|
+
color,
|
|
11
|
+
name,
|
|
12
|
+
chatMessage
|
|
13
|
+
}) {
|
|
14
|
+
const rCursor = useRef(null);
|
|
15
|
+
useTransform(rCursor, point?.x, point?.y, 1 / zoom);
|
|
16
|
+
const cursorId = useSharedSafeId("cursor");
|
|
17
|
+
if (!point) return null;
|
|
18
|
+
return /* @__PURE__ */ jsxs("div", { ref: rCursor, className: classNames("tl-collaborators__item", className), children: [
|
|
19
|
+
/* @__PURE__ */ jsx("svg", { className: "tl-cursor", "aria-hidden": "true", children: /* @__PURE__ */ jsx("use", { href: `#${cursorId}`, color }) }),
|
|
20
|
+
chatMessage ? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
21
|
+
name && /* @__PURE__ */ jsx("div", { className: "tl-nametag-title", style: { color }, children: name }),
|
|
22
|
+
/* @__PURE__ */ jsx("div", { className: "tl-nametag-chat", style: { backgroundColor: color }, children: chatMessage })
|
|
23
|
+
] }) : name && /* @__PURE__ */ jsx("div", { className: "tl-nametag", style: { backgroundColor: color }, children: name })
|
|
24
|
+
] });
|
|
25
|
+
});
|
|
26
|
+
export {
|
|
27
|
+
DefaultCursor
|
|
28
|
+
};
|
|
29
|
+
//# sourceMappingURL=DefaultCursor.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/lib/components/default-components/DefaultCursor.tsx"],
|
|
4
|
+
"sourcesContent": ["import { VecModel } from '@tldraw/tlschema'\nimport classNames from 'classnames'\nimport { memo, useRef } from 'react'\nimport { useSharedSafeId } from '../../hooks/useSafeId'\nimport { useTransform } from '../../hooks/useTransform'\n\n/** @public */\nexport interface TLCursorProps {\n\tuserId: string\n\tclassName?: string\n\tpoint: VecModel | null\n\tzoom: number\n\tcolor?: string\n\tname: string | null\n\tchatMessage: string\n}\n\n/**\n * The default collaborator cursor: the arrow glyph plus a name tag or chat bubble. The arrow is a\n * `<use>` of a shared `<defs>` symbol that `LiveCollaborators` renders, so a `DefaultCursor`\n * used outside that layer draws no arrow.\n *\n * @public @react\n */\nexport const DefaultCursor = memo(function DefaultCursor({\n\tclassName,\n\tzoom,\n\tpoint,\n\tcolor,\n\tname,\n\tchatMessage,\n}: TLCursorProps) {\n\tconst rCursor = useRef<HTMLDivElement>(null)\n\tuseTransform(rCursor, point?.x, point?.y, 1 / zoom)\n\n\tconst cursorId = useSharedSafeId('cursor')\n\n\tif (!point) return null\n\n\treturn (\n\t\t<div ref={rCursor} className={classNames('tl-collaborators__item', className)}>\n\t\t\t<svg className=\"tl-cursor\" aria-hidden=\"true\">\n\t\t\t\t<use href={`#${cursorId}`} color={color} />\n\t\t\t</svg>\n\t\t\t{chatMessage ? (\n\t\t\t\t<>\n\t\t\t\t\t{name && (\n\t\t\t\t\t\t<div className=\"tl-nametag-title\" style={{ color }}>\n\t\t\t\t\t\t\t{name}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t\t<div className=\"tl-nametag-chat\" style={{ backgroundColor: color }}>\n\t\t\t\t\t\t{chatMessage}\n\t\t\t\t\t</div>\n\t\t\t\t</>\n\t\t\t) : (\n\t\t\t\tname && (\n\t\t\t\t\t<div className=\"tl-nametag\" style={{ backgroundColor: color }}>\n\t\t\t\t\t\t{name}\n\t\t\t\t\t</div>\n\t\t\t\t)\n\t\t\t)}\n\t\t</div>\n\t)\n})\n"],
|
|
5
|
+
"mappings": "AA0CI,SAGA,UAHA,KAGA,YAHA;AAzCJ,OAAO,gBAAgB;AACvB,SAAS,MAAM,cAAc;AAC7B,SAAS,uBAAuB;AAChC,SAAS,oBAAoB;AAoBtB,MAAM,gBAAgB,KAAK,SAASA,eAAc;AAAA,EACxD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAkB;AACjB,QAAM,UAAU,OAAuB,IAAI;AAC3C,eAAa,SAAS,OAAO,GAAG,OAAO,GAAG,IAAI,IAAI;AAElD,QAAM,WAAW,gBAAgB,QAAQ;AAEzC,MAAI,CAAC,MAAO,QAAO;AAEnB,SACC,qBAAC,SAAI,KAAK,SAAS,WAAW,WAAW,0BAA0B,SAAS,GAC3E;AAAA,wBAAC,SAAI,WAAU,aAAY,eAAY,QACtC,8BAAC,SAAI,MAAM,IAAI,QAAQ,IAAI,OAAc,GAC1C;AAAA,IACC,cACA,iCACE;AAAA,cACA,oBAAC,SAAI,WAAU,oBAAmB,OAAO,EAAE,MAAM,GAC/C,gBACF;AAAA,MAED,oBAAC,SAAI,WAAU,mBAAkB,OAAO,EAAE,iBAAiB,MAAM,GAC/D,uBACF;AAAA,OACD,IAEA,QACC,oBAAC,SAAI,WAAU,cAAa,OAAO,EAAE,iBAAiB,MAAM,GAC1D,gBACF;AAAA,KAGH;AAEF,CAAC;",
|
|
6
|
+
"names": ["DefaultCursor"]
|
|
7
|
+
}
|
|
@@ -5204,7 +5204,9 @@ class Editor extends EventEmitter {
|
|
|
5204
5204
|
const index = getIndexBetween(originalShape.index, siblingAbove?.index);
|
|
5205
5205
|
shape.index = index;
|
|
5206
5206
|
});
|
|
5207
|
-
const shapesToCreate = shapesToCreateWithOriginals.map(({ shape }) =>
|
|
5207
|
+
const shapesToCreate = shapesToCreateWithOriginals.map(({ shape, originalShape }) => {
|
|
5208
|
+
return this.getShapeUtil(shape).onBeforeDuplicate?.(originalShape, shape) ?? shape;
|
|
5209
|
+
});
|
|
5208
5210
|
if (!this.canCreateShapes(shapesToCreate)) {
|
|
5209
5211
|
alertMaxShapes(this);
|
|
5210
5212
|
return;
|
|
@@ -7230,7 +7232,10 @@ class Editor extends EventEmitter {
|
|
|
7230
7232
|
const rootShapes = [];
|
|
7231
7233
|
const newShapes = shapes.map((oldShape) => {
|
|
7232
7234
|
const newId = shapeIdMap.get(oldShape.id);
|
|
7233
|
-
|
|
7235
|
+
let newShape = { ...oldShape, id: newId };
|
|
7236
|
+
if (!preserveIds) {
|
|
7237
|
+
newShape = this.getShapeUtil(newShape).onBeforeDuplicate?.(oldShape, newShape) ?? newShape;
|
|
7238
|
+
}
|
|
7234
7239
|
if (rootShapeIds.includes(oldShape.id)) {
|
|
7235
7240
|
newShape.parentId = currentPageId;
|
|
7236
7241
|
rootShapes.push(newShape);
|