@tldraw/editor 3.13.0-canary.44a0b42690d2 → 3.13.0-canary.4887e1f52521
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 +128 -113
- package/dist-cjs/index.js +7 -22
- package/dist-cjs/index.js.map +2 -2
- package/dist-cjs/lib/TldrawEditor.js +2 -1
- package/dist-cjs/lib/TldrawEditor.js.map +2 -2
- package/dist-cjs/lib/components/Shape.js +12 -8
- package/dist-cjs/lib/components/Shape.js.map +2 -2
- package/dist-cjs/lib/components/default-components/DefaultCanvas.js +37 -8
- package/dist-cjs/lib/components/default-components/DefaultCanvas.js.map +2 -2
- package/dist-cjs/lib/components/default-components/DefaultShapeIndicator.js +17 -11
- package/dist-cjs/lib/components/default-components/DefaultShapeIndicator.js.map +2 -2
- package/dist-cjs/lib/components/default-components/DefaultSpinner.js +1 -1
- package/dist-cjs/lib/components/default-components/DefaultSpinner.js.map +2 -2
- package/dist-cjs/lib/editor/Editor.js +85 -24
- package/dist-cjs/lib/editor/Editor.js.map +2 -2
- package/dist-cjs/lib/editor/managers/SnapManager/HandleSnaps.js.map +2 -2
- package/dist-cjs/lib/editor/managers/TextManager.js +10 -0
- package/dist-cjs/lib/editor/managers/TextManager.js.map +2 -2
- package/dist-cjs/lib/editor/shapes/ShapeUtil.js +1 -1
- package/dist-cjs/lib/editor/shapes/ShapeUtil.js.map +2 -2
- package/dist-cjs/lib/editor/shapes/group/GroupShapeUtil.js +0 -3
- package/dist-cjs/lib/editor/shapes/group/GroupShapeUtil.js.map +2 -2
- package/dist-cjs/lib/editor/shapes/shared/getPerfectDashProps.js.map +2 -2
- package/dist-cjs/lib/exports/getSvgJsx.js +12 -3
- package/dist-cjs/lib/exports/getSvgJsx.js.map +2 -2
- package/dist-cjs/lib/hooks/useDocumentEvents.js +3 -2
- package/dist-cjs/lib/hooks/useDocumentEvents.js.map +2 -2
- package/dist-cjs/lib/hooks/useEditorComponents.js +16 -16
- package/dist-cjs/lib/hooks/useEditorComponents.js.map +2 -2
- package/dist-cjs/lib/options.js.map +2 -2
- package/dist-cjs/lib/primitives/Box.js +16 -0
- package/dist-cjs/lib/primitives/Box.js.map +2 -2
- package/dist-cjs/lib/primitives/Mat.js +1 -1
- package/dist-cjs/lib/primitives/Mat.js.map +2 -2
- package/dist-cjs/lib/primitives/Vec.js +20 -0
- package/dist-cjs/lib/primitives/Vec.js.map +2 -2
- package/dist-cjs/lib/primitives/geometry/Arc2d.js +2 -2
- package/dist-cjs/lib/primitives/geometry/Arc2d.js.map +2 -2
- package/dist-cjs/lib/primitives/geometry/Circle2d.js +1 -1
- package/dist-cjs/lib/primitives/geometry/Circle2d.js.map +2 -2
- package/dist-cjs/lib/primitives/geometry/CubicBezier2d.js +1 -1
- package/dist-cjs/lib/primitives/geometry/CubicBezier2d.js.map +2 -2
- package/dist-cjs/lib/primitives/geometry/CubicSpline2d.js.map +2 -2
- package/dist-cjs/lib/primitives/geometry/Edge2d.js +1 -1
- package/dist-cjs/lib/primitives/geometry/Edge2d.js.map +2 -2
- package/dist-cjs/lib/primitives/geometry/Ellipse2d.js.map +2 -2
- package/dist-cjs/lib/primitives/geometry/Geometry2d.js +91 -20
- package/dist-cjs/lib/primitives/geometry/Geometry2d.js.map +2 -2
- package/dist-cjs/lib/primitives/geometry/Group2d.js +55 -2
- package/dist-cjs/lib/primitives/geometry/Group2d.js.map +2 -2
- package/dist-cjs/lib/primitives/geometry/Point2d.js.map +2 -2
- package/dist-cjs/lib/primitives/geometry/Polyline2d.js.map +2 -2
- package/dist-cjs/lib/primitives/geometry/Stadium2d.js.map +2 -2
- package/dist-cjs/lib/utils/areShapesContentEqual.js +25 -0
- package/dist-cjs/lib/utils/areShapesContentEqual.js.map +7 -0
- package/dist-cjs/lib/utils/debug-flags.js +5 -2
- package/dist-cjs/lib/utils/debug-flags.js.map +2 -2
- package/dist-cjs/lib/utils/dom.js +3 -3
- package/dist-cjs/lib/utils/dom.js.map +2 -2
- package/dist-cjs/lib/utils/nearestMultiple.js +34 -0
- package/dist-cjs/lib/utils/nearestMultiple.js.map +7 -0
- package/dist-cjs/lib/utils/rotation.js +5 -5
- package/dist-cjs/lib/utils/rotation.js.map +2 -2
- package/dist-cjs/version.js +3 -3
- package/dist-cjs/version.js.map +1 -1
- package/dist-esm/index.d.mts +128 -113
- package/dist-esm/index.mjs +9 -41
- package/dist-esm/index.mjs.map +2 -2
- package/dist-esm/lib/TldrawEditor.mjs +2 -1
- package/dist-esm/lib/TldrawEditor.mjs.map +2 -2
- package/dist-esm/lib/components/Shape.mjs +12 -8
- package/dist-esm/lib/components/Shape.mjs.map +2 -2
- package/dist-esm/lib/components/default-components/DefaultCanvas.mjs +37 -8
- package/dist-esm/lib/components/default-components/DefaultCanvas.mjs.map +2 -2
- package/dist-esm/lib/components/default-components/DefaultShapeIndicator.mjs +17 -11
- package/dist-esm/lib/components/default-components/DefaultShapeIndicator.mjs.map +2 -2
- package/dist-esm/lib/components/default-components/DefaultSpinner.mjs +1 -1
- package/dist-esm/lib/components/default-components/DefaultSpinner.mjs.map +2 -2
- package/dist-esm/lib/editor/Editor.mjs +85 -24
- package/dist-esm/lib/editor/Editor.mjs.map +2 -2
- package/dist-esm/lib/editor/managers/SnapManager/HandleSnaps.mjs.map +2 -2
- package/dist-esm/lib/editor/managers/TextManager.mjs +10 -0
- package/dist-esm/lib/editor/managers/TextManager.mjs.map +2 -2
- package/dist-esm/lib/editor/shapes/ShapeUtil.mjs +1 -1
- package/dist-esm/lib/editor/shapes/ShapeUtil.mjs.map +2 -2
- package/dist-esm/lib/editor/shapes/group/GroupShapeUtil.mjs +0 -3
- package/dist-esm/lib/editor/shapes/group/GroupShapeUtil.mjs.map +2 -2
- package/dist-esm/lib/editor/shapes/shared/getPerfectDashProps.mjs.map +2 -2
- package/dist-esm/lib/exports/getSvgJsx.mjs +12 -3
- package/dist-esm/lib/exports/getSvgJsx.mjs.map +2 -2
- package/dist-esm/lib/hooks/useDocumentEvents.mjs +3 -2
- package/dist-esm/lib/hooks/useDocumentEvents.mjs.map +2 -2
- package/dist-esm/lib/hooks/useEditorComponents.mjs +16 -18
- package/dist-esm/lib/hooks/useEditorComponents.mjs.map +2 -2
- package/dist-esm/lib/options.mjs.map +2 -2
- package/dist-esm/lib/primitives/Box.mjs +16 -0
- package/dist-esm/lib/primitives/Box.mjs.map +2 -2
- package/dist-esm/lib/primitives/Mat.mjs +1 -1
- package/dist-esm/lib/primitives/Mat.mjs.map +2 -2
- package/dist-esm/lib/primitives/Vec.mjs +20 -0
- package/dist-esm/lib/primitives/Vec.mjs.map +2 -2
- package/dist-esm/lib/primitives/geometry/Arc2d.mjs +2 -2
- package/dist-esm/lib/primitives/geometry/Arc2d.mjs.map +2 -2
- package/dist-esm/lib/primitives/geometry/Circle2d.mjs +1 -1
- package/dist-esm/lib/primitives/geometry/Circle2d.mjs.map +2 -2
- package/dist-esm/lib/primitives/geometry/CubicBezier2d.mjs +1 -1
- package/dist-esm/lib/primitives/geometry/CubicBezier2d.mjs.map +2 -2
- package/dist-esm/lib/primitives/geometry/CubicSpline2d.mjs.map +2 -2
- package/dist-esm/lib/primitives/geometry/Edge2d.mjs +1 -1
- package/dist-esm/lib/primitives/geometry/Edge2d.mjs.map +2 -2
- package/dist-esm/lib/primitives/geometry/Ellipse2d.mjs.map +2 -2
- package/dist-esm/lib/primitives/geometry/Geometry2d.mjs +92 -21
- package/dist-esm/lib/primitives/geometry/Geometry2d.mjs.map +2 -2
- package/dist-esm/lib/primitives/geometry/Group2d.mjs +55 -2
- package/dist-esm/lib/primitives/geometry/Group2d.mjs.map +2 -2
- package/dist-esm/lib/primitives/geometry/Point2d.mjs.map +2 -2
- package/dist-esm/lib/primitives/geometry/Polyline2d.mjs.map +2 -2
- package/dist-esm/lib/primitives/geometry/Stadium2d.mjs.map +2 -2
- package/dist-esm/lib/utils/areShapesContentEqual.mjs +5 -0
- package/dist-esm/lib/utils/areShapesContentEqual.mjs.map +7 -0
- package/dist-esm/lib/utils/debug-flags.mjs +5 -2
- package/dist-esm/lib/utils/debug-flags.mjs.map +2 -2
- package/dist-esm/lib/utils/dom.mjs +3 -3
- package/dist-esm/lib/utils/dom.mjs.map +2 -2
- package/dist-esm/lib/utils/nearestMultiple.mjs +14 -0
- package/dist-esm/lib/utils/nearestMultiple.mjs.map +7 -0
- package/dist-esm/lib/utils/rotation.mjs +5 -5
- package/dist-esm/lib/utils/rotation.mjs.map +2 -2
- package/dist-esm/version.mjs +3 -3
- package/dist-esm/version.mjs.map +1 -1
- package/editor.css +41 -4
- package/package.json +7 -7
- package/src/index.ts +16 -31
- package/src/lib/TldrawEditor.tsx +6 -1
- package/src/lib/components/Shape.tsx +14 -10
- package/src/lib/components/default-components/DefaultCanvas.tsx +43 -8
- package/src/lib/components/default-components/DefaultShapeIndicator.tsx +17 -8
- package/src/lib/components/default-components/DefaultSpinner.tsx +1 -1
- package/src/lib/editor/Editor.test.ts +1 -1
- package/src/lib/editor/Editor.ts +96 -24
- package/src/lib/editor/managers/SnapManager/HandleSnaps.ts +0 -1
- package/src/lib/editor/managers/TextManager.ts +12 -0
- package/src/lib/editor/shapes/ShapeUtil.ts +23 -3
- package/src/lib/editor/shapes/group/GroupShapeUtil.tsx +0 -4
- package/src/lib/editor/shapes/shared/getPerfectDashProps.ts +9 -9
- package/src/lib/exports/getSvgJsx.tsx +16 -7
- package/src/lib/hooks/useDocumentEvents.ts +7 -2
- package/src/lib/hooks/useEditorComponents.tsx +33 -32
- package/src/lib/options.ts +4 -0
- package/src/lib/primitives/Box.ts +20 -0
- package/src/lib/primitives/Mat.ts +5 -4
- package/src/lib/primitives/Vec.ts +23 -0
- package/src/lib/primitives/geometry/Arc2d.ts +5 -5
- package/src/lib/primitives/geometry/Circle2d.ts +4 -4
- package/src/lib/primitives/geometry/CubicBezier2d.ts +4 -4
- package/src/lib/primitives/geometry/CubicSpline2d.ts +3 -3
- package/src/lib/primitives/geometry/Edge2d.ts +3 -3
- package/src/lib/primitives/geometry/Ellipse2d.ts +3 -3
- package/src/lib/primitives/geometry/Geometry2d.test.ts +42 -0
- package/src/lib/primitives/geometry/Geometry2d.ts +123 -35
- package/src/lib/primitives/geometry/Group2d.ts +70 -7
- package/src/lib/primitives/geometry/Point2d.ts +2 -2
- package/src/lib/primitives/geometry/Polyline2d.ts +3 -3
- package/src/lib/primitives/geometry/Stadium2d.ts +3 -3
- package/src/lib/test/currentToolIdMask.test.ts +1 -1
- package/src/lib/test/user.test.ts +1 -1
- package/src/lib/utils/areShapesContentEqual.ts +4 -0
- package/src/lib/utils/debug-flags.ts +7 -2
- package/src/lib/utils/dom.ts +4 -4
- package/src/lib/utils/nearestMultiple.ts +13 -0
- package/src/lib/utils/rotation.ts +8 -6
- package/src/lib/utils/sync/LocalIndexedDb.test.ts +1 -1
- package/src/lib/utils/sync/TLLocalSyncClient.test.ts +1 -1
- package/src/version.ts +3 -3
package/dist-cjs/index.js
CHANGED
|
@@ -50,13 +50,11 @@ __export(index_exports, {
|
|
|
50
50
|
DefaultSpinner: () => import_DefaultSpinner.DefaultSpinner,
|
|
51
51
|
DefaultSvgDefs: () => import_DefaultSvgDefs.DefaultSvgDefs,
|
|
52
52
|
EASINGS: () => import_easings.EASINGS,
|
|
53
|
-
EMPTY_ARRAY: () => import_state.EMPTY_ARRAY,
|
|
54
53
|
EVENT_NAME_MAP: () => import_event_types.EVENT_NAME_MAP,
|
|
55
54
|
Edge2d: () => import_Edge2d.Edge2d,
|
|
56
55
|
EdgeScrollManager: () => import_EdgeScrollManager.EdgeScrollManager,
|
|
57
56
|
Editor: () => import_Editor.Editor,
|
|
58
57
|
EditorContext: () => import_useEditor.EditorContext,
|
|
59
|
-
EffectScheduler: () => import_state.EffectScheduler,
|
|
60
58
|
Ellipse2d: () => import_Ellipse2d.Ellipse2d,
|
|
61
59
|
ErrorBoundary: () => import_ErrorBoundary.ErrorBoundary,
|
|
62
60
|
ErrorScreen: () => import_TldrawEditor.ErrorScreen,
|
|
@@ -105,7 +103,6 @@ __export(index_exports, {
|
|
|
105
103
|
applyRotationToSnapshotShapes: () => import_rotation.applyRotationToSnapshotShapes,
|
|
106
104
|
approximately: () => import_utils2.approximately,
|
|
107
105
|
areAnglesCompatible: () => import_utils2.areAnglesCompatible,
|
|
108
|
-
atom: () => import_state.atom,
|
|
109
106
|
average: () => import_utils2.average,
|
|
110
107
|
canonicalizeRotation: () => import_utils2.canonicalizeRotation,
|
|
111
108
|
centerOfCircleFromThreePoints: () => import_utils2.centerOfCircleFromThreePoints,
|
|
@@ -113,7 +110,6 @@ __export(index_exports, {
|
|
|
113
110
|
clampRadians: () => import_utils2.clampRadians,
|
|
114
111
|
clampToBrowserMaxCanvasSize: () => import_browserCanvasMaxSize.clampToBrowserMaxCanvasSize,
|
|
115
112
|
clockwiseAngleDist: () => import_utils2.clockwiseAngleDist,
|
|
116
|
-
computed: () => import_state.computed,
|
|
117
113
|
coreShapes: () => import_defaultShapes.coreShapes,
|
|
118
114
|
counterClockwiseAngleDist: () => import_utils2.counterClockwiseAngleDist,
|
|
119
115
|
createDeepLinkString: () => import_deepLinks.createDeepLinkString,
|
|
@@ -176,7 +172,6 @@ __export(index_exports, {
|
|
|
176
172
|
preventDefault: () => import_dom.preventDefault,
|
|
177
173
|
radiansToDegrees: () => import_utils2.radiansToDegrees,
|
|
178
174
|
rangeIntersection: () => import_utils2.rangeIntersection,
|
|
179
|
-
react: () => import_state.react,
|
|
180
175
|
refreshPage: () => import_refreshPage.refreshPage,
|
|
181
176
|
releasePointerCapture: () => import_dom.releasePointerCapture,
|
|
182
177
|
resizeBox: () => import_resizeBox.resizeBox,
|
|
@@ -197,12 +192,7 @@ __export(index_exports, {
|
|
|
197
192
|
toDomPrecision: () => import_utils2.toDomPrecision,
|
|
198
193
|
toFixed: () => import_utils2.toFixed,
|
|
199
194
|
toPrecision: () => import_utils2.toPrecision,
|
|
200
|
-
track: () => import_state_react.track,
|
|
201
|
-
transact: () => import_state.transact,
|
|
202
|
-
transaction: () => import_state.transaction,
|
|
203
195
|
uniq: () => import_uniq.uniq,
|
|
204
|
-
useAtom: () => import_state_react.useAtom,
|
|
205
|
-
useComputed: () => import_state_react.useComputed,
|
|
206
196
|
useContainer: () => import_useContainer.useContainer,
|
|
207
197
|
useContainerIfExists: () => import_useContainer.useContainerIfExists,
|
|
208
198
|
useDelaySvgExport: () => import_SvgExportContext.useDelaySvgExport,
|
|
@@ -220,25 +210,20 @@ __export(index_exports, {
|
|
|
220
210
|
usePassThroughWheelEvents: () => import_usePassThroughWheelEvents.usePassThroughWheelEvents,
|
|
221
211
|
usePeerIds: () => import_usePeerIds.usePeerIds,
|
|
222
212
|
usePresence: () => import_usePresence.usePresence,
|
|
223
|
-
useQuickReactor: () => import_state_react.useQuickReactor,
|
|
224
213
|
useReactiveEvent: () => import_useEvent.useReactiveEvent,
|
|
225
|
-
useReactor: () => import_state_react.useReactor,
|
|
226
214
|
useRefState: () => import_useRefState.useRefState,
|
|
227
215
|
useSelectionEvents: () => import_useSelectionEvents.useSelectionEvents,
|
|
228
216
|
useShallowArrayIdentity: () => import_useIdentity.useShallowArrayIdentity,
|
|
229
217
|
useShallowObjectIdentity: () => import_useIdentity.useShallowObjectIdentity,
|
|
230
218
|
useSharedSafeId: () => import_useSafeId.useSharedSafeId,
|
|
231
|
-
useStateTracking: () => import_state_react.useStateTracking,
|
|
232
219
|
useSvgExportContext: () => import_SvgExportContext.useSvgExportContext,
|
|
233
220
|
useTLSchemaFromUtils: () => import_useTLStore.useTLSchemaFromUtils,
|
|
234
221
|
useTLStore: () => import_useTLStore.useTLStore,
|
|
235
222
|
useTldrawUser: () => import_createTLUser.useTldrawUser,
|
|
236
223
|
useTransform: () => import_useTransform.useTransform,
|
|
237
224
|
useUniqueSafeId: () => import_useSafeId.useUniqueSafeId,
|
|
238
|
-
useValue: () => import_state_react.useValue,
|
|
239
225
|
useViewportHeight: () => import_useViewportHeight.useViewportHeight,
|
|
240
|
-
userTypeValidator: () => import_TLUserPreferences.userTypeValidator
|
|
241
|
-
whyAmIRunning: () => import_state.whyAmIRunning
|
|
226
|
+
userTypeValidator: () => import_TLUserPreferences.userTypeValidator
|
|
242
227
|
});
|
|
243
228
|
module.exports = __toCommonJS(index_exports);
|
|
244
229
|
var import_utils = require("@tldraw/utils");
|
|
@@ -247,11 +232,8 @@ var import_flat_map = require("core-js/stable/array/flat-map.js");
|
|
|
247
232
|
var import_flat = require("core-js/stable/array/flat.js");
|
|
248
233
|
var import_at2 = require("core-js/stable/string/at.js");
|
|
249
234
|
var import_replace_all = require("core-js/stable/string/replace-all.js");
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
var import_resizeScaled = require("./lib/editor/shapes/shared/resizeScaled");
|
|
253
|
-
var import_richText = require("./lib/utils/richText");
|
|
254
|
-
var import_LocalIndexedDb = require("./lib/utils/sync/LocalIndexedDb");
|
|
235
|
+
__reExport(index_exports, require("@tldraw/state"), module.exports);
|
|
236
|
+
__reExport(index_exports, require("@tldraw/state-react"), module.exports);
|
|
255
237
|
__reExport(index_exports, require("@tldraw/store"), module.exports);
|
|
256
238
|
__reExport(index_exports, require("@tldraw/tlschema"), module.exports);
|
|
257
239
|
__reExport(index_exports, require("@tldraw/utils"), module.exports);
|
|
@@ -302,6 +284,7 @@ var import_ShapeUtil = require("./lib/editor/shapes/ShapeUtil");
|
|
|
302
284
|
var import_GroupShapeUtil = require("./lib/editor/shapes/group/GroupShapeUtil");
|
|
303
285
|
var import_getPerfectDashProps = require("./lib/editor/shapes/shared/getPerfectDashProps");
|
|
304
286
|
var import_resizeBox = require("./lib/editor/shapes/shared/resizeBox");
|
|
287
|
+
var import_resizeScaled = require("./lib/editor/shapes/shared/resizeScaled");
|
|
305
288
|
var import_BaseBoxShapeTool = require("./lib/editor/tools/BaseBoxShapeTool/BaseBoxShapeTool");
|
|
306
289
|
var import_Pointing = require("./lib/editor/tools/BaseBoxShapeTool/children/Pointing");
|
|
307
290
|
var import_StateNode = require("./lib/editor/tools/StateNode");
|
|
@@ -366,8 +349,10 @@ var import_hardResetEditor = require("./lib/utils/hardResetEditor");
|
|
|
366
349
|
var import_keyboard = require("./lib/utils/keyboard");
|
|
367
350
|
var import_normalizeWheel = require("./lib/utils/normalizeWheel");
|
|
368
351
|
var import_refreshPage = require("./lib/utils/refreshPage");
|
|
352
|
+
var import_richText = require("./lib/utils/richText");
|
|
369
353
|
var import_rotation = require("./lib/utils/rotation");
|
|
370
354
|
var import_runtime = require("./lib/utils/runtime");
|
|
355
|
+
var import_LocalIndexedDb = require("./lib/utils/sync/LocalIndexedDb");
|
|
371
356
|
var import_hardReset = require("./lib/utils/sync/hardReset");
|
|
372
357
|
var import_uniq = require("./lib/utils/uniq");
|
|
373
358
|
var import_window_open = require("./lib/utils/window-open");
|
|
@@ -376,7 +361,7 @@ function debugEnableLicensing() {
|
|
|
376
361
|
}
|
|
377
362
|
(0, import_utils.registerTldrawLibraryVersion)(
|
|
378
363
|
"@tldraw/editor",
|
|
379
|
-
"3.13.0-canary.
|
|
364
|
+
"3.13.0-canary.4887e1f52521",
|
|
380
365
|
"cjs"
|
|
381
366
|
);
|
|
382
367
|
//# sourceMappingURL=index.js.map
|
package/dist-cjs/index.js.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'\nimport 'core-js/stable/array/at.js'\nimport 'core-js/stable/array/flat-map.js'\nimport 'core-js/stable/array/flat.js'\nimport 'core-js/stable/string/at.js'\nimport 'core-js/stable/string/replace-all.js'\nexport {\n\tEMPTY_ARRAY,\n\tEffectScheduler,\n\tatom,\n\tcomputed,\n\treact,\n\ttransact,\n\ttransaction,\n\twhyAmIRunning,\n\ttype Atom,\n\ttype Signal,\n} from '@tldraw/state'\nexport {\n\ttrack,\n\tuseAtom,\n\tuseComputed,\n\tuseQuickReactor,\n\tuseReactor,\n\tuseStateTracking,\n\tuseValue,\n} from '@tldraw/state-react'\nexport { resizeScaled } from './lib/editor/shapes/shared/resizeScaled'\nexport {\n\tgetFontsFromRichText,\n\ttype RichTextFontVisitor,\n\ttype RichTextFontVisitorState,\n\ttype TLTextOptions,\n\ttype TiptapEditor,\n\ttype TiptapNode,\n} from './lib/utils/richText'\nexport { LocalIndexedDb, Table, type StoreName } from './lib/utils/sync/LocalIndexedDb'\n// eslint-disable-next-line local/no-export-star\nexport * from '@tldraw/store'\n// eslint-disable-next-line local/no-export-star\nexport * from '@tldraw/tlschema'\n// eslint-disable-next-line local/no-export-star\nexport * from '@tldraw/utils'\n// eslint-disable-next-line local/no-export-star\nexport * from '@tldraw/validate'\nexport {\n\tErrorScreen,\n\tLoadingScreen,\n\tTldrawEditor,\n\tuseOnMount,\n\ttype LoadingScreenProps,\n\ttype TLOnMountHandler,\n\ttype TldrawEditorBaseProps,\n\ttype TldrawEditorProps,\n\ttype TldrawEditorStoreProps,\n\ttype TldrawEditorWithStoreProps,\n\ttype TldrawEditorWithoutStoreProps,\n} from './lib/TldrawEditor'\nexport {\n\tErrorBoundary,\n\tOptionalErrorBoundary,\n\ttype TLErrorBoundaryProps,\n} from './lib/components/ErrorBoundary'\nexport { HTMLContainer, type HTMLContainerProps } from './lib/components/HTMLContainer'\nexport { MenuClickCapture } from './lib/components/MenuClickCapture'\nexport { SVGContainer, type SVGContainerProps } from './lib/components/SVGContainer'\nexport { DefaultBackground } from './lib/components/default-components/DefaultBackground'\nexport { DefaultBrush, type TLBrushProps } from './lib/components/default-components/DefaultBrush'\nexport {\n\tDefaultCanvas,\n\ttype TLCanvasComponentProps,\n} from './lib/components/default-components/DefaultCanvas'\nexport {\n\tDefaultCollaboratorHint,\n\ttype TLCollaboratorHintProps,\n} from './lib/components/default-components/DefaultCollaboratorHint'\nexport {\n\tDefaultCursor,\n\ttype TLCursorProps,\n} from './lib/components/default-components/DefaultCursor'\nexport {\n\tDefaultErrorFallback,\n\ttype TLErrorFallbackComponent,\n} from './lib/components/default-components/DefaultErrorFallback'\nexport { DefaultGrid, type TLGridProps } from './lib/components/default-components/DefaultGrid'\nexport {\n\tDefaultHandle,\n\ttype TLHandleProps,\n} from './lib/components/default-components/DefaultHandle'\nexport {\n\tDefaultHandles,\n\ttype TLHandlesProps,\n} from './lib/components/default-components/DefaultHandles'\nexport {\n\tDefaultScribble,\n\ttype TLScribbleProps,\n} from './lib/components/default-components/DefaultScribble'\nexport {\n\tDefaultSelectionBackground,\n\ttype TLSelectionBackgroundProps,\n} from './lib/components/default-components/DefaultSelectionBackground'\nexport {\n\tDefaultSelectionForeground,\n\ttype TLSelectionForegroundProps,\n} from './lib/components/default-components/DefaultSelectionForeground'\nexport { type TLShapeErrorFallbackComponent } from './lib/components/default-components/DefaultShapeErrorFallback'\nexport {\n\tDefaultShapeIndicator,\n\ttype TLShapeIndicatorProps,\n} from './lib/components/default-components/DefaultShapeIndicator'\nexport { type TLShapeIndicatorErrorFallbackComponent } from './lib/components/default-components/DefaultShapeIndicatorErrorFallback'\nexport {\n\tDefaultShapeIndicators,\n\ttype TLShapeIndicatorsProps,\n} from './lib/components/default-components/DefaultShapeIndicators'\nexport {\n\tDefaultSnapIndicator,\n\ttype TLSnapIndicatorProps,\n} from './lib/components/default-components/DefaultSnapIndictor'\nexport { DefaultSpinner } from './lib/components/default-components/DefaultSpinner'\nexport { DefaultSvgDefs } from './lib/components/default-components/DefaultSvgDefs'\nexport {\n\tgetSnapshot,\n\tloadSnapshot,\n\ttype TLEditorSnapshot,\n\ttype TLLoadSnapshotOptions,\n} from './lib/config/TLEditorSnapshot'\nexport {\n\tTAB_ID,\n\tcreateSessionStateSnapshotSignal,\n\textractSessionStateFromLegacySnapshot,\n\tloadSessionStateSnapshotIntoStore,\n\ttype TLLoadSessionStateSnapshotOptions,\n\ttype TLSessionStateSnapshot,\n} from './lib/config/TLSessionStateSnapshot'\nexport {\n\tUSER_COLORS,\n\tdefaultUserPreferences,\n\tgetFreshUserPreferences,\n\tgetUserPreferences,\n\tsetUserPreferences,\n\tuserTypeValidator,\n\ttype TLUserPreferences,\n} from './lib/config/TLUserPreferences'\nexport {\n\tcreateTLSchemaFromUtils,\n\tcreateTLStore,\n\tinlineBase64AssetStore,\n\ttype TLStoreBaseOptions,\n\ttype TLStoreEventInfo,\n\ttype TLStoreOptions,\n\ttype TLStoreSchemaOptions,\n} from './lib/config/createTLStore'\nexport { createTLUser, useTldrawUser, type TLUser } from './lib/config/createTLUser'\nexport { type TLAnyBindingUtilConstructor } from './lib/config/defaultBindings'\nexport { coreShapes, type TLAnyShapeUtilConstructor } from './lib/config/defaultShapes'\nexport { DEFAULT_ANIMATION_OPTIONS, DEFAULT_CAMERA_OPTIONS, SIDES } from './lib/constants'\nexport {\n\tEditor,\n\ttype TLEditorOptions,\n\ttype TLEditorRunOptions,\n\ttype TLRenderingShape,\n\ttype TLResizeShapeOptions,\n} from './lib/editor/Editor'\nexport {\n\tBindingUtil,\n\ttype BindingOnChangeOptions,\n\ttype BindingOnCreateOptions,\n\ttype BindingOnDeleteOptions,\n\ttype BindingOnShapeChangeOptions,\n\ttype BindingOnShapeDeleteOptions,\n\ttype BindingOnShapeIsolateOptions,\n\ttype TLBindingUtilConstructor,\n} from './lib/editor/bindings/BindingUtil'\nexport { ClickManager, type TLClickState } from './lib/editor/managers/ClickManager'\nexport { EdgeScrollManager } from './lib/editor/managers/EdgeScrollManager'\nexport {\n\tFontManager,\n\ttype TLFontFace,\n\ttype TLFontFaceSource,\n} from './lib/editor/managers/FontManager'\nexport { HistoryManager } from './lib/editor/managers/HistoryManager'\nexport { ScribbleManager, type ScribbleItem } from './lib/editor/managers/ScribbleManager'\nexport {\n\tBoundsSnaps,\n\ttype BoundsSnapGeometry,\n\ttype BoundsSnapPoint,\n} from './lib/editor/managers/SnapManager/BoundsSnaps'\nexport { HandleSnaps, type HandleSnapGeometry } from './lib/editor/managers/SnapManager/HandleSnaps'\nexport {\n\tSnapManager,\n\ttype GapsSnapIndicator,\n\ttype PointsSnapIndicator,\n\ttype SnapData,\n\ttype SnapIndicator,\n} from './lib/editor/managers/SnapManager/SnapManager'\nexport { TextManager, type TLMeasureTextSpanOpts } from './lib/editor/managers/TextManager'\nexport { UserPreferencesManager } from './lib/editor/managers/UserPreferencesManager'\nexport { BaseBoxShapeUtil, type TLBaseBoxShape } from './lib/editor/shapes/BaseBoxShapeUtil'\nexport {\n\tShapeUtil,\n\ttype TLCropInfo,\n\ttype TLGeometryOpts,\n\ttype TLHandleDragInfo,\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 { GroupShapeUtil } from './lib/editor/shapes/group/GroupShapeUtil'\nexport { getPerfectDashProps } from './lib/editor/shapes/shared/getPerfectDashProps'\nexport { resizeBox, type ResizeBoxOptions } from './lib/editor/shapes/shared/resizeBox'\nexport { BaseBoxShapeTool } from './lib/editor/tools/BaseBoxShapeTool/BaseBoxShapeTool'\nexport { maybeSnapToGrid } from './lib/editor/tools/BaseBoxShapeTool/children/Pointing'\nexport { StateNode, type TLStateNodeConstructor } from './lib/editor/tools/StateNode'\nexport {\n\tuseDelaySvgExport,\n\tuseSvgExportContext,\n\ttype SvgExportContext,\n\ttype SvgExportDef,\n} from './lib/editor/types/SvgExportContext'\nexport { type TLContent } from './lib/editor/types/clipboard-types'\nexport { type TLEventMap, type TLEventMapHandler } from './lib/editor/types/emit-types'\nexport {\n\tEVENT_NAME_MAP,\n\ttype TLBaseEventInfo,\n\ttype TLCLickEventName,\n\ttype TLCancelEvent,\n\ttype TLCancelEventInfo,\n\ttype TLClickEvent,\n\ttype TLClickEventInfo,\n\ttype TLCompleteEvent,\n\ttype TLCompleteEventInfo,\n\ttype TLEnterEventHandler,\n\ttype TLEventHandlers,\n\ttype TLEventInfo,\n\ttype TLEventName,\n\ttype TLExitEventHandler,\n\ttype TLInterruptEvent,\n\ttype TLInterruptEventInfo,\n\ttype TLKeyboardEvent,\n\ttype TLKeyboardEventInfo,\n\ttype TLKeyboardEventName,\n\ttype TLPinchEvent,\n\ttype TLPinchEventInfo,\n\ttype TLPinchEventName,\n\ttype TLPointerEvent,\n\ttype TLPointerEventInfo,\n\ttype TLPointerEventName,\n\ttype TLPointerEventTarget,\n\ttype TLTickEvent,\n\ttype TLTickEventInfo,\n\ttype TLWheelEvent,\n\ttype TLWheelEventInfo,\n\ttype UiEvent,\n\ttype UiEventType,\n} from './lib/editor/types/event-types'\nexport {\n\ttype 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 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 TLImageExportOptions,\n\ttype TLSvgExportOptions,\n\ttype TLSvgOptions,\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 { getSvgAsImage } from './lib/exports/getSvgAsImage'\nexport { tlenv } from './lib/globals/environment'\nexport { tlmenus } from './lib/globals/menus'\nexport { tltime } from './lib/globals/time'\nexport {\n\tContainerProvider,\n\tuseContainer,\n\tuseContainerIfExists,\n\ttype ContainerProviderProps,\n} from './lib/hooks/useContainer'\nexport { getCursor } from './lib/hooks/useCursor'\nexport { EditorContext, useEditor, useMaybeEditor } from './lib/hooks/useEditor'\nexport { useEditorComponents } from './lib/hooks/useEditorComponents'\nexport type { TLEditorComponents } from './lib/hooks/useEditorComponents'\nexport { useEvent, useReactiveEvent } from './lib/hooks/useEvent'\nexport { useGlobalMenuIsOpen } from './lib/hooks/useGlobalMenuIsOpen'\nexport { useShallowArrayIdentity, useShallowObjectIdentity } from './lib/hooks/useIdentity'\nexport { useIsCropping } from './lib/hooks/useIsCropping'\nexport { useIsDarkMode } from './lib/hooks/useIsDarkMode'\nexport { useIsEditing } from './lib/hooks/useIsEditing'\nexport { useLocalStore } from './lib/hooks/useLocalStore'\nexport { 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 { useSelectionEvents } from './lib/hooks/useSelectionEvents'\nexport { useTLSchemaFromUtils, useTLStore } from './lib/hooks/useTLStore'\nexport { useTransform } from './lib/hooks/useTransform'\nexport { useViewportHeight } from './lib/hooks/useViewportHeight'\nexport {\n\tLicenseManager,\n\ttype InvalidLicenseKeyResult,\n\ttype InvalidLicenseReason,\n\ttype LicenseFromKeyResult,\n\ttype LicenseInfo,\n\ttype TestEnvironment,\n\ttype ValidLicenseKeyResult,\n} from './lib/license/LicenseManager'\nexport { defaultTldrawOptions, type TldrawOptions } from './lib/options'\nexport {\n\tBox,\n\tROTATE_CORNER_TO_SELECTION_CORNER,\n\trotateSelectionHandle,\n\ttype BoxLike,\n\ttype RotateCorner,\n\ttype SelectionCorner,\n\ttype SelectionEdge,\n\ttype SelectionHandle,\n} from './lib/primitives/Box'\nexport { Mat, type MatLike, type MatModel } from './lib/primitives/Mat'\nexport { Vec, type VecLike } from './lib/primitives/Vec'\nexport { EASINGS } from './lib/primitives/easings'\nexport { Arc2d } from './lib/primitives/geometry/Arc2d'\nexport { Circle2d } from './lib/primitives/geometry/Circle2d'\nexport { CubicBezier2d } from './lib/primitives/geometry/CubicBezier2d'\nexport { CubicSpline2d } from './lib/primitives/geometry/CubicSpline2d'\nexport { Edge2d } from './lib/primitives/geometry/Edge2d'\nexport { Ellipse2d } from './lib/primitives/geometry/Ellipse2d'\nexport {\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 {\n\tHALF_PI,\n\tPI,\n\tPI2,\n\tSIN,\n\tangleDistance,\n\tapproximately,\n\tareAnglesCompatible,\n\taverage,\n\tcanonicalizeRotation,\n\tcenterOfCircleFromThreePoints,\n\tclamp,\n\tclampRadians,\n\tclockwiseAngleDist,\n\tcounterClockwiseAngleDist,\n\tdegreesToRadians,\n\tgetArcMeasure,\n\tgetPointInArcT,\n\tgetPointOnCircle,\n\tgetPointsOnArc,\n\tgetPolygonVertices,\n\tisSafeFloat,\n\tperimeterOfEllipse,\n\tpointInPolygon,\n\tprecise,\n\tradiansToDegrees,\n\trangeIntersection,\n\tshortAngleDist,\n\tsnapAngle,\n\ttoDomPrecision,\n\ttoFixed,\n\ttoPrecision,\n} from './lib/primitives/utils'\nexport {\n\tReadonlySharedStyleMap,\n\tSharedStyleMap,\n\ttype SharedStyle,\n} from './lib/utils/SharedStylesMap'\nexport { dataUrlToFile, getDefaultCdnBaseUrl } from './lib/utils/assets'\nexport { clampToBrowserMaxCanvasSize, type CanvasMaxSize } from './lib/utils/browserCanvasMaxSize'\nexport {\n\tdebugFlags,\n\tfeatureFlags,\n\ttype DebugFlag,\n\ttype DebugFlagDef,\n\ttype DebugFlagDefaults,\n} from './lib/utils/debug-flags'\nexport {\n\tcreateDeepLinkString,\n\tparseDeepLinkString,\n\ttype TLDeepLink,\n\ttype TLDeepLinkOptions,\n} from './lib/utils/deepLinks'\nexport {\n\tactiveElementShouldCaptureKeys,\n\tloopToHtmlElement,\n\tpreventDefault,\n\treleasePointerCapture,\n\tsetPointerCapture,\n\tstopEventPropagation,\n} from './lib/utils/dom'\nexport { getIncrementedName } from './lib/utils/getIncrementedName'\nexport { getPointerInfo } from './lib/utils/getPointerInfo'\nexport { getSvgPathFromPoints } from './lib/utils/getSvgPathFromPoints'\nexport { hardResetEditor } from './lib/utils/hardResetEditor'\nexport { isAccelKey } from './lib/utils/keyboard'\nexport { normalizeWheel } from './lib/utils/normalizeWheel'\nexport { refreshPage } from './lib/utils/refreshPage'\nexport {\n\tapplyRotationToSnapshotShapes,\n\tgetRotationSnapshot,\n\ttype TLRotationSnapshot,\n} from './lib/utils/rotation'\nexport { runtime, setRuntimeOverrides } from './lib/utils/runtime'\nexport { type TLStoreWithStatus } from './lib/utils/sync/StoreWithStatus'\nexport { hardReset } from './lib/utils/sync/hardReset'\nexport { uniq } from './lib/utils/uniq'\nexport { openWindow } from './lib/utils/window-open'\n\n/**\n * @deprecated Licensing is now enabled in the tldraw SDK.\n * @public */\nexport function debugEnableLicensing() {\n\t// noop\n\treturn\n}\n\nregisterTldrawLibraryVersion(\n\t(globalThis as any).TLDRAW_LIBRARY_NAME,\n\t(globalThis as any).TLDRAW_LIBRARY_VERSION,\n\t(globalThis as any).TLDRAW_LIBRARY_MODULES\n)\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA
|
|
4
|
+
"sourcesContent": ["import { registerTldrawLibraryVersion } from '@tldraw/utils'\nimport 'core-js/stable/array/at.js'\nimport 'core-js/stable/array/flat-map.js'\nimport 'core-js/stable/array/flat.js'\nimport 'core-js/stable/string/at.js'\nimport 'core-js/stable/string/replace-all.js'\n\n// eslint-disable-next-line local/no-export-star\nexport * from '@tldraw/state'\n// eslint-disable-next-line local/no-export-star\nexport * from '@tldraw/state-react'\n// eslint-disable-next-line local/no-export-star\nexport * from '@tldraw/store'\n// eslint-disable-next-line local/no-export-star\nexport * from '@tldraw/tlschema'\n// eslint-disable-next-line local/no-export-star\nexport * from '@tldraw/utils'\n// eslint-disable-next-line local/no-export-star\nexport * from '@tldraw/validate'\n\nexport {\n\tErrorScreen,\n\tLoadingScreen,\n\tTldrawEditor,\n\tuseOnMount,\n\ttype LoadingScreenProps,\n\ttype TLOnMountHandler,\n\ttype TldrawEditorBaseProps,\n\ttype TldrawEditorProps,\n\ttype TldrawEditorStoreProps,\n\ttype TldrawEditorWithStoreProps,\n\ttype TldrawEditorWithoutStoreProps,\n} from './lib/TldrawEditor'\nexport {\n\tErrorBoundary,\n\tOptionalErrorBoundary,\n\ttype TLErrorBoundaryProps,\n} from './lib/components/ErrorBoundary'\nexport { HTMLContainer, type HTMLContainerProps } from './lib/components/HTMLContainer'\nexport { MenuClickCapture } from './lib/components/MenuClickCapture'\nexport { SVGContainer, type SVGContainerProps } from './lib/components/SVGContainer'\nexport { DefaultBackground } from './lib/components/default-components/DefaultBackground'\nexport { DefaultBrush, type TLBrushProps } from './lib/components/default-components/DefaultBrush'\nexport {\n\tDefaultCanvas,\n\ttype TLCanvasComponentProps,\n} from './lib/components/default-components/DefaultCanvas'\nexport {\n\tDefaultCollaboratorHint,\n\ttype TLCollaboratorHintProps,\n} from './lib/components/default-components/DefaultCollaboratorHint'\nexport {\n\tDefaultCursor,\n\ttype TLCursorProps,\n} from './lib/components/default-components/DefaultCursor'\nexport {\n\tDefaultErrorFallback,\n\ttype TLErrorFallbackComponent,\n} from './lib/components/default-components/DefaultErrorFallback'\nexport { DefaultGrid, type TLGridProps } from './lib/components/default-components/DefaultGrid'\nexport {\n\tDefaultHandle,\n\ttype TLHandleProps,\n} from './lib/components/default-components/DefaultHandle'\nexport {\n\tDefaultHandles,\n\ttype TLHandlesProps,\n} from './lib/components/default-components/DefaultHandles'\nexport {\n\tDefaultScribble,\n\ttype TLScribbleProps,\n} from './lib/components/default-components/DefaultScribble'\nexport {\n\tDefaultSelectionBackground,\n\ttype TLSelectionBackgroundProps,\n} from './lib/components/default-components/DefaultSelectionBackground'\nexport {\n\tDefaultSelectionForeground,\n\ttype TLSelectionForegroundProps,\n} from './lib/components/default-components/DefaultSelectionForeground'\nexport { type TLShapeErrorFallbackComponent } from './lib/components/default-components/DefaultShapeErrorFallback'\nexport {\n\tDefaultShapeIndicator,\n\ttype TLShapeIndicatorProps,\n} from './lib/components/default-components/DefaultShapeIndicator'\nexport { type TLShapeIndicatorErrorFallbackComponent } from './lib/components/default-components/DefaultShapeIndicatorErrorFallback'\nexport {\n\tDefaultShapeIndicators,\n\ttype TLShapeIndicatorsProps,\n} from './lib/components/default-components/DefaultShapeIndicators'\nexport {\n\tDefaultSnapIndicator,\n\ttype TLSnapIndicatorProps,\n} from './lib/components/default-components/DefaultSnapIndictor'\nexport { DefaultSpinner } from './lib/components/default-components/DefaultSpinner'\nexport { DefaultSvgDefs } from './lib/components/default-components/DefaultSvgDefs'\nexport {\n\tgetSnapshot,\n\tloadSnapshot,\n\ttype TLEditorSnapshot,\n\ttype TLLoadSnapshotOptions,\n} from './lib/config/TLEditorSnapshot'\nexport {\n\tTAB_ID,\n\tcreateSessionStateSnapshotSignal,\n\textractSessionStateFromLegacySnapshot,\n\tloadSessionStateSnapshotIntoStore,\n\ttype TLLoadSessionStateSnapshotOptions,\n\ttype TLSessionStateSnapshot,\n} from './lib/config/TLSessionStateSnapshot'\nexport {\n\tUSER_COLORS,\n\tdefaultUserPreferences,\n\tgetFreshUserPreferences,\n\tgetUserPreferences,\n\tsetUserPreferences,\n\tuserTypeValidator,\n\ttype TLUserPreferences,\n} from './lib/config/TLUserPreferences'\nexport {\n\tcreateTLSchemaFromUtils,\n\tcreateTLStore,\n\tinlineBase64AssetStore,\n\ttype TLStoreBaseOptions,\n\ttype TLStoreEventInfo,\n\ttype TLStoreOptions,\n\ttype TLStoreSchemaOptions,\n} from './lib/config/createTLStore'\nexport { createTLUser, useTldrawUser, type TLUser } from './lib/config/createTLUser'\nexport { type TLAnyBindingUtilConstructor } from './lib/config/defaultBindings'\nexport { coreShapes, type TLAnyShapeUtilConstructor } from './lib/config/defaultShapes'\nexport { DEFAULT_ANIMATION_OPTIONS, DEFAULT_CAMERA_OPTIONS, SIDES } from './lib/constants'\nexport {\n\tEditor,\n\ttype TLEditorOptions,\n\ttype TLEditorRunOptions,\n\ttype TLRenderingShape,\n\ttype TLResizeShapeOptions,\n} from './lib/editor/Editor'\nexport {\n\tBindingUtil,\n\ttype BindingOnChangeOptions,\n\ttype BindingOnCreateOptions,\n\ttype BindingOnDeleteOptions,\n\ttype BindingOnShapeChangeOptions,\n\ttype BindingOnShapeDeleteOptions,\n\ttype BindingOnShapeIsolateOptions,\n\ttype TLBindingUtilConstructor,\n} from './lib/editor/bindings/BindingUtil'\nexport { ClickManager, type TLClickState } from './lib/editor/managers/ClickManager'\nexport { EdgeScrollManager } from './lib/editor/managers/EdgeScrollManager'\nexport {\n\tFontManager,\n\ttype TLFontFace,\n\ttype TLFontFaceSource,\n} from './lib/editor/managers/FontManager'\nexport { HistoryManager } from './lib/editor/managers/HistoryManager'\nexport { ScribbleManager, type ScribbleItem } from './lib/editor/managers/ScribbleManager'\nexport {\n\tBoundsSnaps,\n\ttype BoundsSnapGeometry,\n\ttype BoundsSnapPoint,\n} from './lib/editor/managers/SnapManager/BoundsSnaps'\nexport { HandleSnaps, type HandleSnapGeometry } from './lib/editor/managers/SnapManager/HandleSnaps'\nexport {\n\tSnapManager,\n\ttype GapsSnapIndicator,\n\ttype PointsSnapIndicator,\n\ttype SnapData,\n\ttype SnapIndicator,\n} from './lib/editor/managers/SnapManager/SnapManager'\nexport { TextManager, type TLMeasureTextSpanOpts } from './lib/editor/managers/TextManager'\nexport { UserPreferencesManager } from './lib/editor/managers/UserPreferencesManager'\nexport { BaseBoxShapeUtil, type TLBaseBoxShape } from './lib/editor/shapes/BaseBoxShapeUtil'\nexport {\n\tShapeUtil,\n\ttype TLCropInfo,\n\ttype TLGeometryOpts,\n\ttype TLHandleDragInfo,\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 { GroupShapeUtil } from './lib/editor/shapes/group/GroupShapeUtil'\nexport { getPerfectDashProps } from './lib/editor/shapes/shared/getPerfectDashProps'\nexport { resizeBox, type ResizeBoxOptions } from './lib/editor/shapes/shared/resizeBox'\nexport { 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 {\n\tuseDelaySvgExport,\n\tuseSvgExportContext,\n\ttype SvgExportContext,\n\ttype SvgExportDef,\n} from './lib/editor/types/SvgExportContext'\nexport { type TLContent } from './lib/editor/types/clipboard-types'\nexport { type TLEventMap, type TLEventMapHandler } from './lib/editor/types/emit-types'\nexport {\n\tEVENT_NAME_MAP,\n\ttype TLBaseEventInfo,\n\ttype TLCLickEventName,\n\ttype TLCancelEvent,\n\ttype TLCancelEventInfo,\n\ttype TLClickEvent,\n\ttype TLClickEventInfo,\n\ttype TLCompleteEvent,\n\ttype TLCompleteEventInfo,\n\ttype TLEnterEventHandler,\n\ttype TLEventHandlers,\n\ttype TLEventInfo,\n\ttype TLEventName,\n\ttype TLExitEventHandler,\n\ttype TLInterruptEvent,\n\ttype TLInterruptEventInfo,\n\ttype TLKeyboardEvent,\n\ttype TLKeyboardEventInfo,\n\ttype TLKeyboardEventName,\n\ttype TLPinchEvent,\n\ttype TLPinchEventInfo,\n\ttype TLPinchEventName,\n\ttype TLPointerEvent,\n\ttype TLPointerEventInfo,\n\ttype TLPointerEventName,\n\ttype TLPointerEventTarget,\n\ttype TLTickEvent,\n\ttype TLTickEventInfo,\n\ttype TLWheelEvent,\n\ttype TLWheelEventInfo,\n\ttype UiEvent,\n\ttype UiEventType,\n} from './lib/editor/types/event-types'\nexport {\n\ttype 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 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 TLImageExportOptions,\n\ttype TLSvgExportOptions,\n\ttype TLSvgOptions,\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 { getSvgAsImage } from './lib/exports/getSvgAsImage'\nexport { tlenv } from './lib/globals/environment'\nexport { tlmenus } from './lib/globals/menus'\nexport { tltime } from './lib/globals/time'\nexport {\n\tContainerProvider,\n\tuseContainer,\n\tuseContainerIfExists,\n\ttype ContainerProviderProps,\n} from './lib/hooks/useContainer'\nexport { getCursor } from './lib/hooks/useCursor'\nexport { EditorContext, useEditor, useMaybeEditor } from './lib/hooks/useEditor'\nexport { useEditorComponents } from './lib/hooks/useEditorComponents'\nexport type { TLEditorComponents } from './lib/hooks/useEditorComponents'\nexport { useEvent, useReactiveEvent } from './lib/hooks/useEvent'\nexport { useGlobalMenuIsOpen } from './lib/hooks/useGlobalMenuIsOpen'\nexport { useShallowArrayIdentity, useShallowObjectIdentity } from './lib/hooks/useIdentity'\nexport { useIsCropping } from './lib/hooks/useIsCropping'\nexport { useIsDarkMode } from './lib/hooks/useIsDarkMode'\nexport { useIsEditing } from './lib/hooks/useIsEditing'\nexport { useLocalStore } from './lib/hooks/useLocalStore'\nexport { 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 { useSelectionEvents } from './lib/hooks/useSelectionEvents'\nexport { useTLSchemaFromUtils, useTLStore } from './lib/hooks/useTLStore'\nexport { useTransform } from './lib/hooks/useTransform'\nexport { useViewportHeight } from './lib/hooks/useViewportHeight'\nexport {\n\tLicenseManager,\n\ttype InvalidLicenseKeyResult,\n\ttype InvalidLicenseReason,\n\ttype LicenseFromKeyResult,\n\ttype LicenseInfo,\n\ttype TestEnvironment,\n\ttype ValidLicenseKeyResult,\n} from './lib/license/LicenseManager'\nexport { defaultTldrawOptions, type TldrawOptions } from './lib/options'\nexport {\n\tBox,\n\tROTATE_CORNER_TO_SELECTION_CORNER,\n\trotateSelectionHandle,\n\ttype BoxLike,\n\ttype RotateCorner,\n\ttype SelectionCorner,\n\ttype SelectionEdge,\n\ttype SelectionHandle,\n} from './lib/primitives/Box'\nexport { Mat, type MatLike, type MatModel } from './lib/primitives/Mat'\nexport { Vec, type VecLike } from './lib/primitives/Vec'\nexport { EASINGS } from './lib/primitives/easings'\nexport { Arc2d } from './lib/primitives/geometry/Arc2d'\nexport { Circle2d } from './lib/primitives/geometry/Circle2d'\nexport { CubicBezier2d } from './lib/primitives/geometry/CubicBezier2d'\nexport { CubicSpline2d } from './lib/primitives/geometry/CubicSpline2d'\nexport { Edge2d } from './lib/primitives/geometry/Edge2d'\nexport { Ellipse2d } from './lib/primitives/geometry/Ellipse2d'\nexport {\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 {\n\tHALF_PI,\n\tPI,\n\tPI2,\n\tSIN,\n\tangleDistance,\n\tapproximately,\n\tareAnglesCompatible,\n\taverage,\n\tcanonicalizeRotation,\n\tcenterOfCircleFromThreePoints,\n\tclamp,\n\tclampRadians,\n\tclockwiseAngleDist,\n\tcounterClockwiseAngleDist,\n\tdegreesToRadians,\n\tgetArcMeasure,\n\tgetPointInArcT,\n\tgetPointOnCircle,\n\tgetPointsOnArc,\n\tgetPolygonVertices,\n\tisSafeFloat,\n\tperimeterOfEllipse,\n\tpointInPolygon,\n\tprecise,\n\tradiansToDegrees,\n\trangeIntersection,\n\tshortAngleDist,\n\tsnapAngle,\n\ttoDomPrecision,\n\ttoFixed,\n\ttoPrecision,\n} from './lib/primitives/utils'\nexport {\n\tReadonlySharedStyleMap,\n\tSharedStyleMap,\n\ttype SharedStyle,\n} from './lib/utils/SharedStylesMap'\nexport { dataUrlToFile, getDefaultCdnBaseUrl } from './lib/utils/assets'\nexport { clampToBrowserMaxCanvasSize, type CanvasMaxSize } from './lib/utils/browserCanvasMaxSize'\nexport {\n\tdebugFlags,\n\tfeatureFlags,\n\ttype DebugFlag,\n\ttype DebugFlagDef,\n\ttype DebugFlagDefaults,\n} from './lib/utils/debug-flags'\nexport {\n\tcreateDeepLinkString,\n\tparseDeepLinkString,\n\ttype TLDeepLink,\n\ttype TLDeepLinkOptions,\n} from './lib/utils/deepLinks'\nexport {\n\tactiveElementShouldCaptureKeys,\n\tloopToHtmlElement,\n\tpreventDefault,\n\treleasePointerCapture,\n\tsetPointerCapture,\n\tstopEventPropagation,\n} from './lib/utils/dom'\nexport { getIncrementedName } from './lib/utils/getIncrementedName'\nexport { getPointerInfo } from './lib/utils/getPointerInfo'\nexport { getSvgPathFromPoints } from './lib/utils/getSvgPathFromPoints'\nexport { hardResetEditor } from './lib/utils/hardResetEditor'\nexport { isAccelKey } from './lib/utils/keyboard'\nexport { normalizeWheel } from './lib/utils/normalizeWheel'\nexport { refreshPage } from './lib/utils/refreshPage'\nexport {\n\tgetFontsFromRichText,\n\ttype RichTextFontVisitor,\n\ttype RichTextFontVisitorState,\n\ttype TLTextOptions,\n\ttype TiptapEditor,\n\ttype TiptapNode,\n} from './lib/utils/richText'\nexport {\n\tapplyRotationToSnapshotShapes,\n\tgetRotationSnapshot,\n\ttype TLRotationSnapshot,\n} from './lib/utils/rotation'\nexport { runtime, setRuntimeOverrides } from './lib/utils/runtime'\nexport { LocalIndexedDb, Table, type StoreName } from './lib/utils/sync/LocalIndexedDb'\nexport { type TLStoreWithStatus } from './lib/utils/sync/StoreWithStatus'\nexport { hardReset } from './lib/utils/sync/hardReset'\nexport { uniq } from './lib/utils/uniq'\nexport { openWindow } from './lib/utils/window-open'\n\n/**\n * @deprecated Licensing is now enabled in the tldraw SDK.\n * @public */\nexport function debugEnableLicensing() {\n\t// noop\n\treturn\n}\n\nregisterTldrawLibraryVersion(\n\t(globalThis as any).TLDRAW_LIBRARY_NAME,\n\t(globalThis as any).TLDRAW_LIBRARY_VERSION,\n\t(globalThis as any).TLDRAW_LIBRARY_MODULES\n)\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["import_at", "import_utils"]
|
|
7
7
|
}
|
|
@@ -95,6 +95,7 @@ const TldrawEditor = (0, import_react.memo)(function TldrawEditor2({
|
|
|
95
95
|
onPointerDown: import_dom.stopEventPropagation,
|
|
96
96
|
tabIndex: -1,
|
|
97
97
|
role: "application",
|
|
98
|
+
"aria-label": _options?.branding ?? "tldraw",
|
|
98
99
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
99
100
|
import_ErrorBoundary.OptionalErrorBoundary,
|
|
100
101
|
{
|
|
@@ -377,7 +378,7 @@ function Crash({ crashingError }) {
|
|
|
377
378
|
throw crashingError;
|
|
378
379
|
}
|
|
379
380
|
function LoadingScreen({ children }) {
|
|
380
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "tl-loading", children });
|
|
381
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "tl-loading", "aria-busy": "true", tabIndex: 0, children });
|
|
381
382
|
}
|
|
382
383
|
function ErrorScreen({ children }) {
|
|
383
384
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "tl-loading", children });
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/lib/TldrawEditor.tsx"],
|
|
4
|
-
"sourcesContent": ["import { MigrationSequence, Store } from '@tldraw/store'\nimport { TLShape, TLStore, TLStoreSnapshot } from '@tldraw/tlschema'\nimport { Required, annotateError } from '@tldraw/utils'\nimport React, {\n\tReactNode,\n\tmemo,\n\tuseCallback,\n\tuseEffect,\n\tuseLayoutEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n\tuseSyncExternalStore,\n} from 'react'\n\nimport classNames from 'classnames'\nimport { version } from '../version'\nimport { OptionalErrorBoundary } from './components/ErrorBoundary'\nimport { DefaultErrorFallback } from './components/default-components/DefaultErrorFallback'\nimport { TLEditorSnapshot } from './config/TLEditorSnapshot'\nimport { TLStoreBaseOptions } from './config/createTLStore'\nimport { TLUser, createTLUser } from './config/createTLUser'\nimport { TLAnyBindingUtilConstructor } from './config/defaultBindings'\nimport { TLAnyShapeUtilConstructor } from './config/defaultShapes'\nimport { Editor } from './editor/Editor'\nimport { TLStateNodeConstructor } from './editor/tools/StateNode'\nimport { TLCameraOptions } from './editor/types/misc-types'\nimport { ContainerProvider, useContainer } from './hooks/useContainer'\nimport { useCursor } from './hooks/useCursor'\nimport { useDarkMode } from './hooks/useDarkMode'\nimport { EditorProvider, useEditor } from './hooks/useEditor'\nimport {\n\tEditorComponentsProvider,\n\tTLEditorComponents,\n\tuseEditorComponents,\n} from './hooks/useEditorComponents'\nimport { useEvent } from './hooks/useEvent'\nimport { useForceUpdate } from './hooks/useForceUpdate'\nimport { useShallowObjectIdentity } from './hooks/useIdentity'\nimport { useLocalStore } from './hooks/useLocalStore'\nimport { useRefState } from './hooks/useRefState'\nimport { useZoomCss } from './hooks/useZoomCss'\nimport { LicenseProvider } from './license/LicenseProvider'\nimport { Watermark } from './license/Watermark'\nimport { TldrawOptions } from './options'\nimport { TLDeepLinkOptions } from './utils/deepLinks'\nimport { stopEventPropagation } from './utils/dom'\nimport { TLTextOptions } from './utils/richText'\nimport { TLStoreWithStatus } from './utils/sync/StoreWithStatus'\n\n/**\n * Props for the {@link tldraw#Tldraw} and {@link TldrawEditor} components, when passing in a\n * `TLStore` directly. If you would like tldraw to create a store for you, use\n * {@link TldrawEditorWithoutStoreProps}.\n *\n * @public\n */\nexport interface TldrawEditorWithStoreProps {\n\t/**\n\t * The store to use in the editor.\n\t */\n\tstore: TLStore | TLStoreWithStatus\n}\n\n/**\n * Props for the {@link tldraw#Tldraw} and {@link TldrawEditor} components, when not passing in a\n * `TLStore` directly. If you would like to pass in a store directly, use\n * {@link TldrawEditorWithStoreProps}.\n *\n * @public\n */\nexport interface TldrawEditorWithoutStoreProps extends TLStoreBaseOptions {\n\tstore?: undefined\n\n\t/**\n\t * Additional migrations to use in the store\n\t */\n\tmigrations?: readonly MigrationSequence[]\n\n\t/**\n\t * A starting snapshot of data to pre-populate the store. Do not supply both this and\n\t * `initialData`.\n\t */\n\tsnapshot?: TLEditorSnapshot | TLStoreSnapshot\n\n\t/**\n\t * If you would like to persist the store to the browser's local IndexedDB storage and sync it\n\t * across tabs, provide a key here. Each key represents a single tldraw document.\n\t */\n\tpersistenceKey?: string\n\n\tsessionId?: string\n}\n\n/** @public */\nexport type TldrawEditorStoreProps = TldrawEditorWithStoreProps | TldrawEditorWithoutStoreProps\n\n/**\n * Props for the {@link tldraw#Tldraw} and {@link TldrawEditor} components.\n *\n * @public\n **/\nexport type TldrawEditorProps = TldrawEditorBaseProps & TldrawEditorStoreProps\n\n/**\n * Base props for the {@link tldraw#Tldraw} and {@link TldrawEditor} components.\n *\n * @public\n */\nexport interface TldrawEditorBaseProps {\n\t/**\n\t * The component's children.\n\t */\n\tchildren?: ReactNode\n\n\t/**\n\t * An array of shape utils to use in the editor.\n\t */\n\tshapeUtils?: readonly TLAnyShapeUtilConstructor[]\n\n\t/**\n\t * An array of binding utils to use in the editor.\n\t */\n\tbindingUtils?: readonly TLAnyBindingUtilConstructor[]\n\n\t/**\n\t * An array of tools to add to the editor's state chart.\n\t */\n\ttools?: readonly TLStateNodeConstructor[]\n\n\t/**\n\t * Whether to automatically focus the editor when it mounts.\n\t */\n\tautoFocus?: boolean\n\n\t/**\n\t * Overrides for the editor's components, such as handles, collaborator cursors, etc.\n\t */\n\tcomponents?: TLEditorComponents\n\n\t/**\n\t * Called when the editor has mounted.\n\t */\n\tonMount?: TLOnMountHandler\n\n\t/**\n\t * The editor's initial state (usually the id of the first active tool).\n\t */\n\tinitialState?: string\n\n\t/**\n\t * A classname to pass to the editor's container.\n\t */\n\tclassName?: string\n\n\t/**\n\t * The user interacting with the editor.\n\t */\n\tuser?: TLUser\n\n\t/**\n\t * Whether to infer dark mode from the user's OS. Defaults to false.\n\t */\n\tinferDarkMode?: boolean\n\n\t/**\n\t * Camera options for the editor.\n\t */\n\tcameraOptions?: Partial<TLCameraOptions>\n\n\t/**\n\t * Text options for the editor.\n\t */\n\ttextOptions?: TLTextOptions\n\n\t/**\n\t * Options for the editor.\n\t */\n\toptions?: Partial<TldrawOptions>\n\n\t/**\n\t * The license key.\n\t */\n\tlicenseKey?: string\n\n\t/**\n\t * Options for syncing the editor's camera state with the URL.\n\t */\n\tdeepLinks?: true | TLDeepLinkOptions\n\n\t/**\n\t * Predicate for whether or not a shape should be hidden.\n\t *\n\t * @deprecated Use {@link TldrawEditorBaseProps#getShapeVisibility} instead.\n\t */\n\tisShapeHidden?(shape: TLShape, editor: Editor): boolean\n\n\t/**\n\t * Provides a way to hide shapes.\n\t *\n\t * Hidden shapes will not render in the editor, and they will not be eligible for hit test via\n\t * {@link Editor#getShapeAtPoint} and {@link Editor#getShapesAtPoint}. But otherwise they will\n\t * remain in the store and participate in all other operations.\n\t *\n\t * @example\n\t * ```ts\n\t * getShapeVisibility={(shape, editor) => shape.meta.hidden ? 'hidden' : 'inherit'}\n\t * ```\n\t *\n\t * - `'inherit' | undefined` - (default) The shape will be visible unless its parent is hidden.\n\t * - `'hidden'` - The shape will be hidden.\n\t * - `'visible'` - The shape will be visible.\n\t *\n\t * @param shape - The shape to check.\n\t * @param editor - The editor instance.\n\t */\n\tgetShapeVisibility?(\n\t\tshape: TLShape,\n\t\teditor: Editor\n\t): 'visible' | 'hidden' | 'inherit' | null | undefined\n\n\t/**\n\t * The URLs for the fonts to use in the editor.\n\t */\n\tassetUrls?: { fonts?: { [key: string]: string | undefined } }\n}\n\n/**\n * Called when the editor has mounted.\n * @example\n * ```ts\n * <Tldraw onMount={(editor) => editor.selectAll()} />\n * ```\n * @param editor - The editor instance.\n *\n * @public\n */\nexport type TLOnMountHandler = (editor: Editor) => (() => void | undefined) | undefined | void\n\ndeclare global {\n\tinterface Window {\n\t\ttldrawReady: boolean\n\t}\n}\n\nconst EMPTY_SHAPE_UTILS_ARRAY = [] as const\nconst EMPTY_BINDING_UTILS_ARRAY = [] as const\nconst EMPTY_TOOLS_ARRAY = [] as const\n/** @internal */\nexport const TL_CONTAINER_CLASS = 'tl-container'\n\n/** @public @react */\nexport const TldrawEditor = memo(function TldrawEditor({\n\tstore,\n\tcomponents,\n\tclassName,\n\tuser: _user,\n\toptions: _options,\n\t...rest\n}: TldrawEditorProps) {\n\tconst [container, setContainer] = useState<HTMLElement | null>(null)\n\tconst user = useMemo(() => _user ?? createTLUser(), [_user])\n\n\tconst ErrorFallback =\n\t\tcomponents?.ErrorFallback === undefined ? DefaultErrorFallback : components?.ErrorFallback\n\n\t// apply defaults. if you're using the bare @tldraw/editor package, we\n\t// default these to the \"tldraw zero\" configuration. We have different\n\t// defaults applied in tldraw.\n\tconst withDefaults = {\n\t\t...rest,\n\t\tshapeUtils: rest.shapeUtils ?? EMPTY_SHAPE_UTILS_ARRAY,\n\t\tbindingUtils: rest.bindingUtils ?? EMPTY_BINDING_UTILS_ARRAY,\n\t\ttools: rest.tools ?? EMPTY_TOOLS_ARRAY,\n\t\tcomponents,\n\t\toptions: useShallowObjectIdentity(_options),\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tref={setContainer}\n\t\t\tdata-tldraw={version}\n\t\t\tdraggable={false}\n\t\t\tclassName={classNames(`${TL_CONTAINER_CLASS} tl-theme__light`, className)}\n\t\t\tonPointerDown={stopEventPropagation}\n\t\t\ttabIndex={-1}\n\t\t\trole=\"application\"\n\t\t>\n\t\t\t<OptionalErrorBoundary\n\t\t\t\tfallback={ErrorFallback}\n\t\t\t\tonError={(error) => annotateError(error, { tags: { origin: 'react.tldraw-before-app' } })}\n\t\t\t>\n\t\t\t\t{container && (\n\t\t\t\t\t<LicenseProvider licenseKey={rest.licenseKey}>\n\t\t\t\t\t\t<ContainerProvider container={container}>\n\t\t\t\t\t\t\t<EditorComponentsProvider overrides={components}>\n\t\t\t\t\t\t\t\t{store ? (\n\t\t\t\t\t\t\t\t\tstore instanceof Store ? (\n\t\t\t\t\t\t\t\t\t\t// Store is ready to go, whether externally synced or not\n\t\t\t\t\t\t\t\t\t\t<TldrawEditorWithReadyStore {...withDefaults} store={store} user={user} />\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t// Store is a synced store, so handle syncing stages internally\n\t\t\t\t\t\t\t\t\t\t<TldrawEditorWithLoadingStore {...withDefaults} store={store} user={user} />\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t// We have no store (it's undefined) so create one and possibly sync it\n\t\t\t\t\t\t\t\t\t<TldrawEditorWithOwnStore {...withDefaults} store={store} user={user} />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</EditorComponentsProvider>\n\t\t\t\t\t\t</ContainerProvider>\n\t\t\t\t\t</LicenseProvider>\n\t\t\t\t)}\n\t\t\t</OptionalErrorBoundary>\n\t\t</div>\n\t)\n})\n\nfunction TldrawEditorWithOwnStore(\n\tprops: Required<\n\t\tTldrawEditorProps & { store: undefined; user: TLUser },\n\t\t'shapeUtils' | 'bindingUtils' | 'tools'\n\t>\n) {\n\tconst {\n\t\tdefaultName,\n\t\tsnapshot,\n\t\tinitialData,\n\t\tshapeUtils,\n\t\tbindingUtils,\n\t\tpersistenceKey,\n\t\tsessionId,\n\t\tuser,\n\t\tassets,\n\t\tmigrations,\n\t} = props\n\n\tconst syncedStore = useLocalStore({\n\t\tshapeUtils,\n\t\tbindingUtils,\n\t\tinitialData,\n\t\tpersistenceKey,\n\t\tsessionId,\n\t\tdefaultName,\n\t\tsnapshot,\n\t\tassets,\n\t\tmigrations,\n\t})\n\n\treturn <TldrawEditorWithLoadingStore {...props} store={syncedStore} user={user} />\n}\n\nconst TldrawEditorWithLoadingStore = memo(function TldrawEditorBeforeLoading({\n\tstore,\n\tuser,\n\t...rest\n}: Required<\n\tTldrawEditorProps & { store: TLStoreWithStatus; user: TLUser },\n\t'shapeUtils' | 'bindingUtils' | 'tools'\n>) {\n\tconst container = useContainer()\n\n\tuseLayoutEffect(() => {\n\t\tif (user.userPreferences.get().colorScheme === 'dark') {\n\t\t\tcontainer.classList.remove('tl-theme__light')\n\t\t\tcontainer.classList.add('tl-theme__dark')\n\t\t}\n\t}, [container, user])\n\n\tconst { LoadingScreen } = useEditorComponents()\n\n\tswitch (store.status) {\n\t\tcase 'error': {\n\t\t\t// for error handling, we fall back to the default error boundary.\n\t\t\t// if users want to handle this error differently, they can render\n\t\t\t// their own error screen before the TldrawEditor component\n\t\t\tthrow store.error\n\t\t}\n\t\tcase 'loading': {\n\t\t\treturn LoadingScreen ? <LoadingScreen /> : null\n\t\t}\n\t\tcase 'not-synced': {\n\t\t\tbreak\n\t\t}\n\t\tcase 'synced-local': {\n\t\t\tbreak\n\t\t}\n\t\tcase 'synced-remote': {\n\t\t\tbreak\n\t\t}\n\t}\n\n\treturn <TldrawEditorWithReadyStore {...rest} store={store.store} user={user} />\n})\n\nconst noAutoFocus = () => document.location.search.includes('tldraw_preserve_focus') // || !document.hasFocus() // breaks in nextjs\n\nfunction TldrawEditorWithReadyStore({\n\tonMount,\n\tchildren,\n\tstore,\n\ttools,\n\tshapeUtils,\n\tbindingUtils,\n\tuser,\n\tinitialState,\n\tautoFocus = true,\n\tinferDarkMode,\n\tcameraOptions,\n\ttextOptions,\n\toptions,\n\tlicenseKey,\n\tdeepLinks: _deepLinks,\n\t// eslint-disable-next-line @typescript-eslint/no-deprecated\n\tisShapeHidden,\n\tgetShapeVisibility,\n\tassetUrls,\n}: Required<\n\tTldrawEditorProps & {\n\t\tstore: TLStore\n\t\tuser: TLUser\n\t},\n\t'shapeUtils' | 'bindingUtils' | 'tools'\n>) {\n\tconst { ErrorFallback } = useEditorComponents()\n\tconst container = useContainer()\n\n\tconst [editor, setEditor] = useRefState<Editor | null>(null)\n\n\tconst canvasRef = useRef<HTMLDivElement | null>(null)\n\n\tconst deepLinks = useShallowObjectIdentity(_deepLinks === true ? {} : _deepLinks)\n\n\t// props in this ref can be changed without causing the editor to be recreated.\n\tconst editorOptionsRef = useRef({\n\t\t// for these, it's because they're only used when the editor first mounts:\n\t\tautoFocus: autoFocus && !noAutoFocus(),\n\t\tinferDarkMode,\n\t\tinitialState,\n\n\t\t// for these, it's because we keep them up to date in a separate effect:\n\t\tcameraOptions,\n\t\tdeepLinks,\n\t})\n\n\tuseLayoutEffect(() => {\n\t\teditorOptionsRef.current = {\n\t\t\tautoFocus: autoFocus && !noAutoFocus(),\n\t\t\tinferDarkMode,\n\t\t\tinitialState,\n\t\t\tcameraOptions,\n\t\t\tdeepLinks,\n\t\t}\n\t}, [autoFocus, inferDarkMode, initialState, cameraOptions, deepLinks])\n\n\tuseLayoutEffect(\n\t\t() => {\n\t\t\tconst { autoFocus, inferDarkMode, initialState, cameraOptions, deepLinks } =\n\t\t\t\teditorOptionsRef.current\n\t\t\tconst editor = new Editor({\n\t\t\t\tstore,\n\t\t\t\tshapeUtils,\n\t\t\t\tbindingUtils,\n\t\t\t\ttools,\n\t\t\t\tgetContainer: () => container,\n\t\t\t\tuser,\n\t\t\t\tinitialState,\n\t\t\t\t// we should check for some kind of query parameter that turns off autofocus\n\t\t\t\tautoFocus,\n\t\t\t\tinferDarkMode,\n\t\t\t\tcameraOptions,\n\t\t\t\ttextOptions,\n\t\t\t\toptions,\n\t\t\t\tlicenseKey,\n\t\t\t\tisShapeHidden,\n\t\t\t\tgetShapeVisibility,\n\t\t\t\tfontAssetUrls: assetUrls?.fonts,\n\t\t\t})\n\n\t\t\teditor.updateViewportScreenBounds(canvasRef.current ?? container)\n\n\t\t\t// Use the ref here because we only want to do this once when the editor is created.\n\t\t\t// We don't want changes to the urlStateSync prop to trigger creating new editors.\n\t\t\tif (deepLinks) {\n\t\t\t\tif (!deepLinks?.getUrl) {\n\t\t\t\t\t// load the state from window.location\n\t\t\t\t\teditor.navigateToDeepLink(deepLinks)\n\t\t\t\t} else {\n\t\t\t\t\t// load the state from the provided URL\n\t\t\t\t\teditor.navigateToDeepLink({ ...deepLinks, url: deepLinks.getUrl(editor) })\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tsetEditor(editor)\n\n\t\t\treturn () => {\n\t\t\t\teditor.dispose()\n\t\t\t}\n\t\t},\n\t\t// if any of these change, we need to recreate the editor.\n\t\t[\n\t\t\tbindingUtils,\n\t\t\tcontainer,\n\t\t\toptions,\n\t\t\tshapeUtils,\n\t\t\tstore,\n\t\t\ttools,\n\t\t\tuser,\n\t\t\tsetEditor,\n\t\t\tlicenseKey,\n\t\t\tisShapeHidden,\n\t\t\tgetShapeVisibility,\n\t\t\ttextOptions,\n\t\t\tassetUrls,\n\t\t]\n\t)\n\n\tuseLayoutEffect(() => {\n\t\tif (!editor) return\n\t\tif (deepLinks) {\n\t\t\treturn editor.registerDeepLinkListener(deepLinks)\n\t\t}\n\t}, [editor, deepLinks])\n\n\t// keep the editor up to date with the latest camera options\n\tuseLayoutEffect(() => {\n\t\tif (editor && cameraOptions) {\n\t\t\teditor.setCameraOptions(cameraOptions)\n\t\t}\n\t}, [editor, cameraOptions])\n\n\tconst crashingError = useSyncExternalStore(\n\t\tuseCallback(\n\t\t\t(onStoreChange) => {\n\t\t\t\tif (editor) {\n\t\t\t\t\teditor.on('crash', onStoreChange)\n\t\t\t\t\treturn () => editor.off('crash', onStoreChange)\n\t\t\t\t}\n\t\t\t\treturn () => {\n\t\t\t\t\t// noop\n\t\t\t\t}\n\t\t\t},\n\t\t\t[editor]\n\t\t),\n\t\t() => editor?.getCrashingError() ?? null\n\t)\n\n\t// For our examples site, we want autoFocus to be true on the examples site, but not\n\t// when embedded in our docs site. If present, the `tldraw_preserve_focus` search param\n\t// overrides the `autoFocus` prop and prevents the editor from focusing immediately,\n\t// however here we also add some logic to focus the editor when the user clicks\n\t// on it and unfocus it when the user clicks away from it.\n\tuseEffect(\n\t\tfunction handleFocusOnPointerDownForPreserveFocusMode() {\n\t\t\tif (!editor) return\n\n\t\t\tfunction handleFocusOnPointerDown() {\n\t\t\t\tif (!editor) return\n\t\t\t\teditor.focus()\n\t\t\t}\n\n\t\t\tfunction handleBlurOnPointerDown() {\n\t\t\t\tif (!editor) return\n\t\t\t\teditor.blur()\n\t\t\t}\n\n\t\t\tif (autoFocus && noAutoFocus()) {\n\t\t\t\teditor.getContainer().addEventListener('pointerdown', handleFocusOnPointerDown)\n\t\t\t\tdocument.body.addEventListener('pointerdown', handleBlurOnPointerDown)\n\n\t\t\t\treturn () => {\n\t\t\t\t\teditor.getContainer()?.removeEventListener('pointerdown', handleFocusOnPointerDown)\n\t\t\t\t\tdocument.body.removeEventListener('pointerdown', handleBlurOnPointerDown)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[editor, autoFocus]\n\t)\n\n\tconst [_fontLoadingState, setFontLoadingState] = useState<{\n\t\teditor: Editor\n\t\tisLoaded: boolean\n\t} | null>(null)\n\tlet fontLoadingState = _fontLoadingState\n\tif (editor !== fontLoadingState?.editor) {\n\t\tfontLoadingState = null\n\t}\n\tuseEffect(() => {\n\t\tif (!editor) return\n\t\tlet isCancelled = false\n\n\t\tsetFontLoadingState({ editor, isLoaded: false })\n\n\t\teditor.fonts\n\t\t\t.loadRequiredFontsForCurrentPage(editor.options.maxFontsToLoadBeforeRender)\n\t\t\t.finally(() => {\n\t\t\t\tif (isCancelled) return\n\t\t\t\tsetFontLoadingState({ editor, isLoaded: true })\n\t\t\t})\n\n\t\treturn () => {\n\t\t\tisCancelled = true\n\t\t}\n\t}, [editor])\n\n\tconst { Canvas, LoadingScreen } = useEditorComponents()\n\n\tif (!editor || !fontLoadingState?.isLoaded) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{LoadingScreen && <LoadingScreen />}\n\t\t\t\t<div className=\"tl-canvas\" ref={canvasRef} />\n\t\t\t</>\n\t\t)\n\t}\n\n\treturn (\n\t\t// the top-level tldraw component also renders an error boundary almost\n\t\t// identical to this one. the reason we have two is because this one has\n\t\t// access to `App`, which means that here we can enrich errors with data\n\t\t// from app for reporting, and also still attempt to render the user's\n\t\t// document in the event of an error to reassure them that their work is\n\t\t// not lost.\n\t\t<OptionalErrorBoundary\n\t\t\tfallback={ErrorFallback as any}\n\t\t\tonError={(error) =>\n\t\t\t\teditor.annotateError(error, { origin: 'react.tldraw', willCrashApp: true })\n\t\t\t}\n\t\t>\n\t\t\t{crashingError ? (\n\t\t\t\t<Crash crashingError={crashingError} />\n\t\t\t) : (\n\t\t\t\t<EditorProvider editor={editor}>\n\t\t\t\t\t<Layout onMount={onMount}>\n\t\t\t\t\t\t{children ?? (Canvas ? <Canvas key={editor.contextId} /> : null)}\n\t\t\t\t\t\t<Watermark />\n\t\t\t\t\t</Layout>\n\t\t\t\t</EditorProvider>\n\t\t\t)}\n\t\t</OptionalErrorBoundary>\n\t)\n}\n\nfunction Layout({ children, onMount }: { children: ReactNode; onMount?: TLOnMountHandler }) {\n\tuseZoomCss()\n\tuseCursor()\n\tuseDarkMode()\n\tuseForceUpdate()\n\tuseOnMount((editor) => {\n\t\tconst teardownStore = editor.store.props.onMount(editor)\n\t\tconst teardownCallback = onMount?.(editor)\n\n\t\treturn () => {\n\t\t\tteardownStore?.()\n\t\t\tteardownCallback?.()\n\t\t}\n\t})\n\n\treturn children\n}\n\nfunction Crash({ crashingError }: { crashingError: unknown }): null {\n\tthrow crashingError\n}\n\n/** @public */\nexport interface LoadingScreenProps {\n\tchildren: ReactNode\n}\n\n/** @public @react */\nexport function LoadingScreen({ children }: LoadingScreenProps) {\n\treturn <div className=\"tl-loading\">{children}</div>\n}\n\n/** @public @react */\nexport function ErrorScreen({ children }: LoadingScreenProps) {\n\treturn <div className=\"tl-loading\">{children}</div>\n}\n\n/** @internal */\nexport function useOnMount(onMount?: TLOnMountHandler) {\n\tconst editor = useEditor()\n\n\tconst onMountEvent = useEvent((editor: Editor) => {\n\t\tlet teardown: (() => void) | void = undefined\n\t\t// If the user wants to do something when the editor mounts, we make sure it doesn't effect the history.\n\t\t// todo: is this reeeeally what we want to do, or should we leave it up to the caller?\n\t\teditor.run(\n\t\t\t() => {\n\t\t\t\tteardown = onMount?.(editor)\n\t\t\t\teditor.emit('mount')\n\t\t\t},\n\t\t\t{ history: 'ignore' }\n\t\t)\n\t\twindow.tldrawReady = true\n\t\treturn teardown\n\t})\n\n\tReact.useLayoutEffect(() => {\n\t\tif (editor) return onMountEvent?.(editor)\n\t}, [editor, onMountEvent])\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["import { MigrationSequence, Store } from '@tldraw/store'\nimport { TLShape, TLStore, TLStoreSnapshot } from '@tldraw/tlschema'\nimport { Required, annotateError } from '@tldraw/utils'\nimport React, {\n\tReactNode,\n\tmemo,\n\tuseCallback,\n\tuseEffect,\n\tuseLayoutEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n\tuseSyncExternalStore,\n} from 'react'\n\nimport classNames from 'classnames'\nimport { version } from '../version'\nimport { OptionalErrorBoundary } from './components/ErrorBoundary'\nimport { DefaultErrorFallback } from './components/default-components/DefaultErrorFallback'\nimport { TLEditorSnapshot } from './config/TLEditorSnapshot'\nimport { TLStoreBaseOptions } from './config/createTLStore'\nimport { TLUser, createTLUser } from './config/createTLUser'\nimport { TLAnyBindingUtilConstructor } from './config/defaultBindings'\nimport { TLAnyShapeUtilConstructor } from './config/defaultShapes'\nimport { Editor } from './editor/Editor'\nimport { TLStateNodeConstructor } from './editor/tools/StateNode'\nimport { TLCameraOptions } from './editor/types/misc-types'\nimport { ContainerProvider, useContainer } from './hooks/useContainer'\nimport { useCursor } from './hooks/useCursor'\nimport { useDarkMode } from './hooks/useDarkMode'\nimport { EditorProvider, useEditor } from './hooks/useEditor'\nimport {\n\tEditorComponentsProvider,\n\tTLEditorComponents,\n\tuseEditorComponents,\n} from './hooks/useEditorComponents'\nimport { useEvent } from './hooks/useEvent'\nimport { useForceUpdate } from './hooks/useForceUpdate'\nimport { useShallowObjectIdentity } from './hooks/useIdentity'\nimport { useLocalStore } from './hooks/useLocalStore'\nimport { useRefState } from './hooks/useRefState'\nimport { useZoomCss } from './hooks/useZoomCss'\nimport { LicenseProvider } from './license/LicenseProvider'\nimport { Watermark } from './license/Watermark'\nimport { TldrawOptions } from './options'\nimport { TLDeepLinkOptions } from './utils/deepLinks'\nimport { stopEventPropagation } from './utils/dom'\nimport { TLTextOptions } from './utils/richText'\nimport { TLStoreWithStatus } from './utils/sync/StoreWithStatus'\n\n/**\n * Props for the {@link tldraw#Tldraw} and {@link TldrawEditor} components, when passing in a\n * `TLStore` directly. If you would like tldraw to create a store for you, use\n * {@link TldrawEditorWithoutStoreProps}.\n *\n * @public\n */\nexport interface TldrawEditorWithStoreProps {\n\t/**\n\t * The store to use in the editor.\n\t */\n\tstore: TLStore | TLStoreWithStatus\n}\n\n/**\n * Props for the {@link tldraw#Tldraw} and {@link TldrawEditor} components, when not passing in a\n * `TLStore` directly. If you would like to pass in a store directly, use\n * {@link TldrawEditorWithStoreProps}.\n *\n * @public\n */\nexport interface TldrawEditorWithoutStoreProps extends TLStoreBaseOptions {\n\tstore?: undefined\n\n\t/**\n\t * Additional migrations to use in the store\n\t */\n\tmigrations?: readonly MigrationSequence[]\n\n\t/**\n\t * A starting snapshot of data to pre-populate the store. Do not supply both this and\n\t * `initialData`.\n\t */\n\tsnapshot?: TLEditorSnapshot | TLStoreSnapshot\n\n\t/**\n\t * If you would like to persist the store to the browser's local IndexedDB storage and sync it\n\t * across tabs, provide a key here. Each key represents a single tldraw document.\n\t */\n\tpersistenceKey?: string\n\n\tsessionId?: string\n}\n\n/** @public */\nexport type TldrawEditorStoreProps = TldrawEditorWithStoreProps | TldrawEditorWithoutStoreProps\n\n/**\n * Props for the {@link tldraw#Tldraw} and {@link TldrawEditor} components.\n *\n * @public\n **/\nexport type TldrawEditorProps = TldrawEditorBaseProps & TldrawEditorStoreProps\n\n/**\n * Base props for the {@link tldraw#Tldraw} and {@link TldrawEditor} components.\n *\n * @public\n */\nexport interface TldrawEditorBaseProps {\n\t/**\n\t * The component's children.\n\t */\n\tchildren?: ReactNode\n\n\t/**\n\t * An array of shape utils to use in the editor.\n\t */\n\tshapeUtils?: readonly TLAnyShapeUtilConstructor[]\n\n\t/**\n\t * An array of binding utils to use in the editor.\n\t */\n\tbindingUtils?: readonly TLAnyBindingUtilConstructor[]\n\n\t/**\n\t * An array of tools to add to the editor's state chart.\n\t */\n\ttools?: readonly TLStateNodeConstructor[]\n\n\t/**\n\t * Whether to automatically focus the editor when it mounts.\n\t */\n\tautoFocus?: boolean\n\n\t/**\n\t * Overrides for the editor's components, such as handles, collaborator cursors, etc.\n\t */\n\tcomponents?: TLEditorComponents\n\n\t/**\n\t * Called when the editor has mounted.\n\t */\n\tonMount?: TLOnMountHandler\n\n\t/**\n\t * The editor's initial state (usually the id of the first active tool).\n\t */\n\tinitialState?: string\n\n\t/**\n\t * A classname to pass to the editor's container.\n\t */\n\tclassName?: string\n\n\t/**\n\t * The user interacting with the editor.\n\t */\n\tuser?: TLUser\n\n\t/**\n\t * Whether to infer dark mode from the user's OS. Defaults to false.\n\t */\n\tinferDarkMode?: boolean\n\n\t/**\n\t * Camera options for the editor.\n\t */\n\tcameraOptions?: Partial<TLCameraOptions>\n\n\t/**\n\t * Text options for the editor.\n\t */\n\ttextOptions?: TLTextOptions\n\n\t/**\n\t * Options for the editor.\n\t */\n\toptions?: Partial<TldrawOptions>\n\n\t/**\n\t * The license key.\n\t */\n\tlicenseKey?: string\n\n\t/**\n\t * Options for syncing the editor's camera state with the URL.\n\t */\n\tdeepLinks?: true | TLDeepLinkOptions\n\n\t/**\n\t * Predicate for whether or not a shape should be hidden.\n\t *\n\t * @deprecated Use {@link TldrawEditorBaseProps#getShapeVisibility} instead.\n\t */\n\tisShapeHidden?(shape: TLShape, editor: Editor): boolean\n\n\t/**\n\t * Provides a way to hide shapes.\n\t *\n\t * Hidden shapes will not render in the editor, and they will not be eligible for hit test via\n\t * {@link Editor#getShapeAtPoint} and {@link Editor#getShapesAtPoint}. But otherwise they will\n\t * remain in the store and participate in all other operations.\n\t *\n\t * @example\n\t * ```ts\n\t * getShapeVisibility={(shape, editor) => shape.meta.hidden ? 'hidden' : 'inherit'}\n\t * ```\n\t *\n\t * - `'inherit' | undefined` - (default) The shape will be visible unless its parent is hidden.\n\t * - `'hidden'` - The shape will be hidden.\n\t * - `'visible'` - The shape will be visible.\n\t *\n\t * @param shape - The shape to check.\n\t * @param editor - The editor instance.\n\t */\n\tgetShapeVisibility?(\n\t\tshape: TLShape,\n\t\teditor: Editor\n\t): 'visible' | 'hidden' | 'inherit' | null | undefined\n\n\t/**\n\t * The URLs for the fonts to use in the editor.\n\t */\n\tassetUrls?: { fonts?: { [key: string]: string | undefined } }\n}\n\n/**\n * Called when the editor has mounted.\n * @example\n * ```ts\n * <Tldraw onMount={(editor) => editor.selectAll()} />\n * ```\n * @param editor - The editor instance.\n *\n * @public\n */\nexport type TLOnMountHandler = (editor: Editor) => (() => void | undefined) | undefined | void\n\ndeclare global {\n\tinterface Window {\n\t\ttldrawReady: boolean\n\t}\n}\n\nconst EMPTY_SHAPE_UTILS_ARRAY = [] as const\nconst EMPTY_BINDING_UTILS_ARRAY = [] as const\nconst EMPTY_TOOLS_ARRAY = [] as const\n/** @internal */\nexport const TL_CONTAINER_CLASS = 'tl-container'\n\n/** @public @react */\nexport const TldrawEditor = memo(function TldrawEditor({\n\tstore,\n\tcomponents,\n\tclassName,\n\tuser: _user,\n\toptions: _options,\n\t...rest\n}: TldrawEditorProps) {\n\tconst [container, setContainer] = useState<HTMLElement | null>(null)\n\tconst user = useMemo(() => _user ?? createTLUser(), [_user])\n\n\tconst ErrorFallback =\n\t\tcomponents?.ErrorFallback === undefined ? DefaultErrorFallback : components?.ErrorFallback\n\n\t// apply defaults. if you're using the bare @tldraw/editor package, we\n\t// default these to the \"tldraw zero\" configuration. We have different\n\t// defaults applied in tldraw.\n\tconst withDefaults = {\n\t\t...rest,\n\t\tshapeUtils: rest.shapeUtils ?? EMPTY_SHAPE_UTILS_ARRAY,\n\t\tbindingUtils: rest.bindingUtils ?? EMPTY_BINDING_UTILS_ARRAY,\n\t\ttools: rest.tools ?? EMPTY_TOOLS_ARRAY,\n\t\tcomponents,\n\t\toptions: useShallowObjectIdentity(_options),\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tref={setContainer}\n\t\t\tdata-tldraw={version}\n\t\t\tdraggable={false}\n\t\t\tclassName={classNames(`${TL_CONTAINER_CLASS} tl-theme__light`, className)}\n\t\t\tonPointerDown={stopEventPropagation}\n\t\t\ttabIndex={-1}\n\t\t\trole=\"application\"\n\t\t\taria-label={_options?.branding ?? 'tldraw'}\n\t\t>\n\t\t\t<OptionalErrorBoundary\n\t\t\t\tfallback={ErrorFallback}\n\t\t\t\tonError={(error) => annotateError(error, { tags: { origin: 'react.tldraw-before-app' } })}\n\t\t\t>\n\t\t\t\t{container && (\n\t\t\t\t\t<LicenseProvider licenseKey={rest.licenseKey}>\n\t\t\t\t\t\t<ContainerProvider container={container}>\n\t\t\t\t\t\t\t<EditorComponentsProvider overrides={components}>\n\t\t\t\t\t\t\t\t{store ? (\n\t\t\t\t\t\t\t\t\tstore instanceof Store ? (\n\t\t\t\t\t\t\t\t\t\t// Store is ready to go, whether externally synced or not\n\t\t\t\t\t\t\t\t\t\t<TldrawEditorWithReadyStore {...withDefaults} store={store} user={user} />\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t// Store is a synced store, so handle syncing stages internally\n\t\t\t\t\t\t\t\t\t\t<TldrawEditorWithLoadingStore {...withDefaults} store={store} user={user} />\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t// We have no store (it's undefined) so create one and possibly sync it\n\t\t\t\t\t\t\t\t\t<TldrawEditorWithOwnStore {...withDefaults} store={store} user={user} />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</EditorComponentsProvider>\n\t\t\t\t\t\t</ContainerProvider>\n\t\t\t\t\t</LicenseProvider>\n\t\t\t\t)}\n\t\t\t</OptionalErrorBoundary>\n\t\t</div>\n\t)\n})\n\nfunction TldrawEditorWithOwnStore(\n\tprops: Required<\n\t\tTldrawEditorProps & { store: undefined; user: TLUser },\n\t\t'shapeUtils' | 'bindingUtils' | 'tools'\n\t>\n) {\n\tconst {\n\t\tdefaultName,\n\t\tsnapshot,\n\t\tinitialData,\n\t\tshapeUtils,\n\t\tbindingUtils,\n\t\tpersistenceKey,\n\t\tsessionId,\n\t\tuser,\n\t\tassets,\n\t\tmigrations,\n\t} = props\n\n\tconst syncedStore = useLocalStore({\n\t\tshapeUtils,\n\t\tbindingUtils,\n\t\tinitialData,\n\t\tpersistenceKey,\n\t\tsessionId,\n\t\tdefaultName,\n\t\tsnapshot,\n\t\tassets,\n\t\tmigrations,\n\t})\n\n\treturn <TldrawEditorWithLoadingStore {...props} store={syncedStore} user={user} />\n}\n\nconst TldrawEditorWithLoadingStore = memo(function TldrawEditorBeforeLoading({\n\tstore,\n\tuser,\n\t...rest\n}: Required<\n\tTldrawEditorProps & { store: TLStoreWithStatus; user: TLUser },\n\t'shapeUtils' | 'bindingUtils' | 'tools'\n>) {\n\tconst container = useContainer()\n\n\tuseLayoutEffect(() => {\n\t\tif (user.userPreferences.get().colorScheme === 'dark') {\n\t\t\tcontainer.classList.remove('tl-theme__light')\n\t\t\tcontainer.classList.add('tl-theme__dark')\n\t\t}\n\t}, [container, user])\n\n\tconst { LoadingScreen } = useEditorComponents()\n\n\tswitch (store.status) {\n\t\tcase 'error': {\n\t\t\t// for error handling, we fall back to the default error boundary.\n\t\t\t// if users want to handle this error differently, they can render\n\t\t\t// their own error screen before the TldrawEditor component\n\t\t\tthrow store.error\n\t\t}\n\t\tcase 'loading': {\n\t\t\treturn LoadingScreen ? <LoadingScreen /> : null\n\t\t}\n\t\tcase 'not-synced': {\n\t\t\tbreak\n\t\t}\n\t\tcase 'synced-local': {\n\t\t\tbreak\n\t\t}\n\t\tcase 'synced-remote': {\n\t\t\tbreak\n\t\t}\n\t}\n\n\treturn <TldrawEditorWithReadyStore {...rest} store={store.store} user={user} />\n})\n\nconst noAutoFocus = () => document.location.search.includes('tldraw_preserve_focus') // || !document.hasFocus() // breaks in nextjs\n\nfunction TldrawEditorWithReadyStore({\n\tonMount,\n\tchildren,\n\tstore,\n\ttools,\n\tshapeUtils,\n\tbindingUtils,\n\tuser,\n\tinitialState,\n\tautoFocus = true,\n\tinferDarkMode,\n\tcameraOptions,\n\ttextOptions,\n\toptions,\n\tlicenseKey,\n\tdeepLinks: _deepLinks,\n\t// eslint-disable-next-line @typescript-eslint/no-deprecated\n\tisShapeHidden,\n\tgetShapeVisibility,\n\tassetUrls,\n}: Required<\n\tTldrawEditorProps & {\n\t\tstore: TLStore\n\t\tuser: TLUser\n\t},\n\t'shapeUtils' | 'bindingUtils' | 'tools'\n>) {\n\tconst { ErrorFallback } = useEditorComponents()\n\tconst container = useContainer()\n\n\tconst [editor, setEditor] = useRefState<Editor | null>(null)\n\n\tconst canvasRef = useRef<HTMLDivElement | null>(null)\n\n\tconst deepLinks = useShallowObjectIdentity(_deepLinks === true ? {} : _deepLinks)\n\n\t// props in this ref can be changed without causing the editor to be recreated.\n\tconst editorOptionsRef = useRef({\n\t\t// for these, it's because they're only used when the editor first mounts:\n\t\tautoFocus: autoFocus && !noAutoFocus(),\n\t\tinferDarkMode,\n\t\tinitialState,\n\n\t\t// for these, it's because we keep them up to date in a separate effect:\n\t\tcameraOptions,\n\t\tdeepLinks,\n\t})\n\n\tuseLayoutEffect(() => {\n\t\teditorOptionsRef.current = {\n\t\t\tautoFocus: autoFocus && !noAutoFocus(),\n\t\t\tinferDarkMode,\n\t\t\tinitialState,\n\t\t\tcameraOptions,\n\t\t\tdeepLinks,\n\t\t}\n\t}, [autoFocus, inferDarkMode, initialState, cameraOptions, deepLinks])\n\n\tuseLayoutEffect(\n\t\t() => {\n\t\t\tconst { autoFocus, inferDarkMode, initialState, cameraOptions, deepLinks } =\n\t\t\t\teditorOptionsRef.current\n\t\t\tconst editor = new Editor({\n\t\t\t\tstore,\n\t\t\t\tshapeUtils,\n\t\t\t\tbindingUtils,\n\t\t\t\ttools,\n\t\t\t\tgetContainer: () => container,\n\t\t\t\tuser,\n\t\t\t\tinitialState,\n\t\t\t\t// we should check for some kind of query parameter that turns off autofocus\n\t\t\t\tautoFocus,\n\t\t\t\tinferDarkMode,\n\t\t\t\tcameraOptions,\n\t\t\t\ttextOptions,\n\t\t\t\toptions,\n\t\t\t\tlicenseKey,\n\t\t\t\tisShapeHidden,\n\t\t\t\tgetShapeVisibility,\n\t\t\t\tfontAssetUrls: assetUrls?.fonts,\n\t\t\t})\n\n\t\t\teditor.updateViewportScreenBounds(canvasRef.current ?? container)\n\n\t\t\t// Use the ref here because we only want to do this once when the editor is created.\n\t\t\t// We don't want changes to the urlStateSync prop to trigger creating new editors.\n\t\t\tif (deepLinks) {\n\t\t\t\tif (!deepLinks?.getUrl) {\n\t\t\t\t\t// load the state from window.location\n\t\t\t\t\teditor.navigateToDeepLink(deepLinks)\n\t\t\t\t} else {\n\t\t\t\t\t// load the state from the provided URL\n\t\t\t\t\teditor.navigateToDeepLink({ ...deepLinks, url: deepLinks.getUrl(editor) })\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tsetEditor(editor)\n\n\t\t\treturn () => {\n\t\t\t\teditor.dispose()\n\t\t\t}\n\t\t},\n\t\t// if any of these change, we need to recreate the editor.\n\t\t[\n\t\t\tbindingUtils,\n\t\t\tcontainer,\n\t\t\toptions,\n\t\t\tshapeUtils,\n\t\t\tstore,\n\t\t\ttools,\n\t\t\tuser,\n\t\t\tsetEditor,\n\t\t\tlicenseKey,\n\t\t\tisShapeHidden,\n\t\t\tgetShapeVisibility,\n\t\t\ttextOptions,\n\t\t\tassetUrls,\n\t\t]\n\t)\n\n\tuseLayoutEffect(() => {\n\t\tif (!editor) return\n\t\tif (deepLinks) {\n\t\t\treturn editor.registerDeepLinkListener(deepLinks)\n\t\t}\n\t}, [editor, deepLinks])\n\n\t// keep the editor up to date with the latest camera options\n\tuseLayoutEffect(() => {\n\t\tif (editor && cameraOptions) {\n\t\t\teditor.setCameraOptions(cameraOptions)\n\t\t}\n\t}, [editor, cameraOptions])\n\n\tconst crashingError = useSyncExternalStore(\n\t\tuseCallback(\n\t\t\t(onStoreChange) => {\n\t\t\t\tif (editor) {\n\t\t\t\t\teditor.on('crash', onStoreChange)\n\t\t\t\t\treturn () => editor.off('crash', onStoreChange)\n\t\t\t\t}\n\t\t\t\treturn () => {\n\t\t\t\t\t// noop\n\t\t\t\t}\n\t\t\t},\n\t\t\t[editor]\n\t\t),\n\t\t() => editor?.getCrashingError() ?? null\n\t)\n\n\t// For our examples site, we want autoFocus to be true on the examples site, but not\n\t// when embedded in our docs site. If present, the `tldraw_preserve_focus` search param\n\t// overrides the `autoFocus` prop and prevents the editor from focusing immediately,\n\t// however here we also add some logic to focus the editor when the user clicks\n\t// on it and unfocus it when the user clicks away from it.\n\tuseEffect(\n\t\tfunction handleFocusOnPointerDownForPreserveFocusMode() {\n\t\t\tif (!editor) return\n\n\t\t\tfunction handleFocusOnPointerDown() {\n\t\t\t\tif (!editor) return\n\t\t\t\teditor.focus()\n\t\t\t}\n\n\t\t\tfunction handleBlurOnPointerDown() {\n\t\t\t\tif (!editor) return\n\t\t\t\teditor.blur()\n\t\t\t}\n\n\t\t\tif (autoFocus && noAutoFocus()) {\n\t\t\t\teditor.getContainer().addEventListener('pointerdown', handleFocusOnPointerDown)\n\t\t\t\tdocument.body.addEventListener('pointerdown', handleBlurOnPointerDown)\n\n\t\t\t\treturn () => {\n\t\t\t\t\teditor.getContainer()?.removeEventListener('pointerdown', handleFocusOnPointerDown)\n\t\t\t\t\tdocument.body.removeEventListener('pointerdown', handleBlurOnPointerDown)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t[editor, autoFocus]\n\t)\n\n\tconst [_fontLoadingState, setFontLoadingState] = useState<{\n\t\teditor: Editor\n\t\tisLoaded: boolean\n\t} | null>(null)\n\tlet fontLoadingState = _fontLoadingState\n\tif (editor !== fontLoadingState?.editor) {\n\t\tfontLoadingState = null\n\t}\n\tuseEffect(() => {\n\t\tif (!editor) return\n\t\tlet isCancelled = false\n\n\t\tsetFontLoadingState({ editor, isLoaded: false })\n\n\t\teditor.fonts\n\t\t\t.loadRequiredFontsForCurrentPage(editor.options.maxFontsToLoadBeforeRender)\n\t\t\t.finally(() => {\n\t\t\t\tif (isCancelled) return\n\t\t\t\tsetFontLoadingState({ editor, isLoaded: true })\n\t\t\t})\n\n\t\treturn () => {\n\t\t\tisCancelled = true\n\t\t}\n\t}, [editor])\n\n\tconst { Canvas, LoadingScreen } = useEditorComponents()\n\n\tif (!editor || !fontLoadingState?.isLoaded) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{LoadingScreen && <LoadingScreen />}\n\t\t\t\t<div className=\"tl-canvas\" ref={canvasRef} />\n\t\t\t</>\n\t\t)\n\t}\n\n\treturn (\n\t\t// the top-level tldraw component also renders an error boundary almost\n\t\t// identical to this one. the reason we have two is because this one has\n\t\t// access to `App`, which means that here we can enrich errors with data\n\t\t// from app for reporting, and also still attempt to render the user's\n\t\t// document in the event of an error to reassure them that their work is\n\t\t// not lost.\n\t\t<OptionalErrorBoundary\n\t\t\tfallback={ErrorFallback as any}\n\t\t\tonError={(error) =>\n\t\t\t\teditor.annotateError(error, { origin: 'react.tldraw', willCrashApp: true })\n\t\t\t}\n\t\t>\n\t\t\t{crashingError ? (\n\t\t\t\t<Crash crashingError={crashingError} />\n\t\t\t) : (\n\t\t\t\t<EditorProvider editor={editor}>\n\t\t\t\t\t<Layout onMount={onMount}>\n\t\t\t\t\t\t{children ?? (Canvas ? <Canvas key={editor.contextId} /> : null)}\n\t\t\t\t\t\t<Watermark />\n\t\t\t\t\t</Layout>\n\t\t\t\t</EditorProvider>\n\t\t\t)}\n\t\t</OptionalErrorBoundary>\n\t)\n}\n\nfunction Layout({ children, onMount }: { children: ReactNode; onMount?: TLOnMountHandler }) {\n\tuseZoomCss()\n\tuseCursor()\n\tuseDarkMode()\n\tuseForceUpdate()\n\tuseOnMount((editor) => {\n\t\tconst teardownStore = editor.store.props.onMount(editor)\n\t\tconst teardownCallback = onMount?.(editor)\n\n\t\treturn () => {\n\t\t\tteardownStore?.()\n\t\t\tteardownCallback?.()\n\t\t}\n\t})\n\n\treturn children\n}\n\nfunction Crash({ crashingError }: { crashingError: unknown }): null {\n\tthrow crashingError\n}\n\n/** @public */\nexport interface LoadingScreenProps {\n\tchildren: ReactNode\n}\n\n/** @public @react */\nexport function LoadingScreen({ children }: LoadingScreenProps) {\n\treturn (\n\t\t<div className=\"tl-loading\" aria-busy=\"true\" tabIndex={0}>\n\t\t\t{children}\n\t\t</div>\n\t)\n}\n\n/** @public @react */\nexport function ErrorScreen({ children }: LoadingScreenProps) {\n\treturn <div className=\"tl-loading\">{children}</div>\n}\n\n/** @internal */\nexport function useOnMount(onMount?: TLOnMountHandler) {\n\tconst editor = useEditor()\n\n\tconst onMountEvent = useEvent((editor: Editor) => {\n\t\tlet teardown: (() => void) | void = undefined\n\t\t// If the user wants to do something when the editor mounts, we make sure it doesn't effect the history.\n\t\t// todo: is this reeeeally what we want to do, or should we leave it up to the caller?\n\t\teditor.run(\n\t\t\t() => {\n\t\t\t\tteardown = onMount?.(editor)\n\t\t\t\teditor.emit('mount')\n\t\t\t},\n\t\t\t{ history: 'ignore' }\n\t\t)\n\t\twindow.tldrawReady = true\n\t\treturn teardown\n\t})\n\n\tReact.useLayoutEffect(() => {\n\t\tif (editor) return onMountEvent?.(editor)\n\t}, [editor, onMountEvent])\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["TldrawEditor", "classNames", "LoadingScreen", "autoFocus", "inferDarkMode", "initialState", "cameraOptions", "deepLinks", "editor", "React"]
|
|
7
7
|
}
|
|
@@ -30,6 +30,7 @@ var import_react = require("react");
|
|
|
30
30
|
var import_useEditor = require("../hooks/useEditor");
|
|
31
31
|
var import_useEditorComponents = require("../hooks/useEditorComponents");
|
|
32
32
|
var import_Mat = require("../primitives/Mat");
|
|
33
|
+
var import_areShapesContentEqual = require("../utils/areShapesContentEqual");
|
|
33
34
|
var import_dom = require("../utils/dom");
|
|
34
35
|
var import_ErrorBoundary = require("./ErrorBoundary");
|
|
35
36
|
const Shape = (0, import_react.memo)(function Shape2({
|
|
@@ -38,7 +39,8 @@ const Shape = (0, import_react.memo)(function Shape2({
|
|
|
38
39
|
util,
|
|
39
40
|
index,
|
|
40
41
|
backgroundIndex,
|
|
41
|
-
opacity
|
|
42
|
+
opacity,
|
|
43
|
+
dprMultiple
|
|
42
44
|
}) {
|
|
43
45
|
const editor = (0, import_useEditor.useEditor)();
|
|
44
46
|
const { ShapeErrorFallback } = (0, import_useEditorComponents.useEditorComponents)();
|
|
@@ -79,13 +81,15 @@ const Shape = (0, import_react.memo)(function Shape2({
|
|
|
79
81
|
(0, import_dom.setStyleProperty)(bgContainerRef.current, "transform", transform);
|
|
80
82
|
prev.transform = transform;
|
|
81
83
|
}
|
|
82
|
-
const
|
|
83
|
-
const
|
|
84
|
+
const widthRemainder = bounds.w % dprMultiple;
|
|
85
|
+
const heightRemainder = bounds.h % dprMultiple;
|
|
86
|
+
const width = widthRemainder === 0 ? bounds.w : bounds.w + (dprMultiple - widthRemainder);
|
|
87
|
+
const height = heightRemainder === 0 ? bounds.h : bounds.h + (dprMultiple - heightRemainder);
|
|
84
88
|
if (width !== prev.width || height !== prev.height) {
|
|
85
|
-
(0, import_dom.setStyleProperty)(containerRef.current, "width", width + "px");
|
|
86
|
-
(0, import_dom.setStyleProperty)(containerRef.current, "height", height + "px");
|
|
87
|
-
(0, import_dom.setStyleProperty)(bgContainerRef.current, "width", width + "px");
|
|
88
|
-
(0, import_dom.setStyleProperty)(bgContainerRef.current, "height", height + "px");
|
|
89
|
+
(0, import_dom.setStyleProperty)(containerRef.current, "width", Math.max(width, dprMultiple) + "px");
|
|
90
|
+
(0, import_dom.setStyleProperty)(containerRef.current, "height", Math.max(height, dprMultiple) + "px");
|
|
91
|
+
(0, import_dom.setStyleProperty)(bgContainerRef.current, "width", Math.max(width, dprMultiple) + "px");
|
|
92
|
+
(0, import_dom.setStyleProperty)(bgContainerRef.current, "height", Math.max(height, dprMultiple) + "px");
|
|
89
93
|
prev.width = width;
|
|
90
94
|
prev.height = height;
|
|
91
95
|
}
|
|
@@ -159,7 +163,7 @@ const InnerShape = (0, import_react.memo)(
|
|
|
159
163
|
[util, shape.id]
|
|
160
164
|
);
|
|
161
165
|
},
|
|
162
|
-
(prev, next) =>
|
|
166
|
+
(prev, next) => (0, import_areShapesContentEqual.areShapesContentEqual)(prev.shape, next.shape) && prev.util === next.util
|
|
163
167
|
);
|
|
164
168
|
const InnerShapeBackground = (0, import_react.memo)(
|
|
165
169
|
function InnerShapeBackground2({
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/lib/components/Shape.tsx"],
|
|
4
|
-
"sourcesContent": ["import { react } from '@tldraw/state'\nimport { useQuickReactor, useStateTracking } from '@tldraw/state-react'\nimport { TLShape, TLShapeId } from '@tldraw/tlschema'\nimport { memo, useCallback, useEffect, useLayoutEffect, useRef } from 'react'\nimport { ShapeUtil } from '../editor/shapes/ShapeUtil'\nimport { useEditor } from '../hooks/useEditor'\nimport { useEditorComponents } from '../hooks/useEditorComponents'\nimport { Mat } from '../primitives/Mat'\nimport { setStyleProperty } from '../utils/dom'\nimport { OptionalErrorBoundary } from './ErrorBoundary'\n\n/*\nThis component renders shapes on the canvas. There are two stages: positioning\nand styling the shape's container using CSS, and then rendering the shape's \nJSX using its shape util's render method. Rendering the \"inside\" of a shape is\nmore expensive than positioning it or changing its color, so we use memo\nto wrap the inner shape and only re-render it when the shape's props change. \n\nThe shape also receives props for its index and opacity. The index is used to\ndetermine the z-index of the shape, and the opacity is used to set the shape's\nopacity based on its own opacity and that of its parent's.\n*/\nexport const Shape = memo(function Shape({\n\tid,\n\tshape,\n\tutil,\n\tindex,\n\tbackgroundIndex,\n\topacity,\n}: {\n\tid: TLShapeId\n\tshape: TLShape\n\tutil: ShapeUtil\n\tindex: number\n\tbackgroundIndex: number\n\topacity: number\n}) {\n\tconst editor = useEditor()\n\n\tconst { ShapeErrorFallback } = useEditorComponents()\n\n\tconst containerRef = useRef<HTMLDivElement>(null)\n\tconst bgContainerRef = useRef<HTMLDivElement>(null)\n\n\tuseEffect(() => {\n\t\treturn react('load fonts', () => {\n\t\t\tconst fonts = editor.fonts.getShapeFontFaces(id)\n\t\t\teditor.fonts.requestFonts(fonts)\n\t\t})\n\t}, [editor, id])\n\n\tconst memoizedStuffRef = useRef({\n\t\ttransform: '',\n\t\tclipPath: 'none',\n\t\twidth: 0,\n\t\theight: 0,\n\t\tx: 0,\n\t\ty: 0,\n\t\tisCulled: false,\n\t})\n\n\tuseQuickReactor(\n\t\t'set shape stuff',\n\t\t() => {\n\t\t\tconst shape = editor.getShape(id)\n\t\t\tif (!shape) return // probably the shape was just deleted\n\n\t\t\tconst prev = memoizedStuffRef.current\n\n\t\t\t// Clip path\n\t\t\tconst clipPath = editor.getShapeClipPath(id) ?? 'none'\n\t\t\tif (clipPath !== prev.clipPath) {\n\t\t\t\tsetStyleProperty(containerRef.current, 'clip-path', clipPath)\n\t\t\t\tsetStyleProperty(bgContainerRef.current, 'clip-path', clipPath)\n\t\t\t\tprev.clipPath = clipPath\n\t\t\t}\n\n\t\t\t// Page transform\n\t\t\tconst pageTransform = editor.getShapePageTransform(id)\n\t\t\tconst transform = Mat.toCssString(pageTransform)\n\t\t\tconst bounds = editor.getShapeGeometry(shape).bounds\n\n\t\t\t// Update if the tranform has changed\n\t\t\tif (transform !== prev.transform) {\n\t\t\t\tsetStyleProperty(containerRef.current, 'transform', transform)\n\t\t\t\tsetStyleProperty(bgContainerRef.current, 'transform', transform)\n\t\t\t\tprev.transform = transform\n\t\t\t}\n\n\t\t\t// Width / Height\n\t\t\
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["import { react } from '@tldraw/state'\nimport { useQuickReactor, useStateTracking } from '@tldraw/state-react'\nimport { TLShape, TLShapeId } from '@tldraw/tlschema'\nimport { memo, useCallback, useEffect, useLayoutEffect, useRef } from 'react'\nimport { ShapeUtil } from '../editor/shapes/ShapeUtil'\nimport { useEditor } from '../hooks/useEditor'\nimport { useEditorComponents } from '../hooks/useEditorComponents'\nimport { Mat } from '../primitives/Mat'\nimport { areShapesContentEqual } from '../utils/areShapesContentEqual'\nimport { setStyleProperty } from '../utils/dom'\nimport { OptionalErrorBoundary } from './ErrorBoundary'\n\n/*\nThis component renders shapes on the canvas. There are two stages: positioning\nand styling the shape's container using CSS, and then rendering the shape's \nJSX using its shape util's render method. Rendering the \"inside\" of a shape is\nmore expensive than positioning it or changing its color, so we use memo\nto wrap the inner shape and only re-render it when the shape's props change. \n\nThe shape also receives props for its index and opacity. The index is used to\ndetermine the z-index of the shape, and the opacity is used to set the shape's\nopacity based on its own opacity and that of its parent's.\n*/\nexport const Shape = memo(function Shape({\n\tid,\n\tshape,\n\tutil,\n\tindex,\n\tbackgroundIndex,\n\topacity,\n\tdprMultiple,\n}: {\n\tid: TLShapeId\n\tshape: TLShape\n\tutil: ShapeUtil\n\tindex: number\n\tbackgroundIndex: number\n\topacity: number\n\tdprMultiple: number\n}) {\n\tconst editor = useEditor()\n\n\tconst { ShapeErrorFallback } = useEditorComponents()\n\n\tconst containerRef = useRef<HTMLDivElement>(null)\n\tconst bgContainerRef = useRef<HTMLDivElement>(null)\n\n\tuseEffect(() => {\n\t\treturn react('load fonts', () => {\n\t\t\tconst fonts = editor.fonts.getShapeFontFaces(id)\n\t\t\teditor.fonts.requestFonts(fonts)\n\t\t})\n\t}, [editor, id])\n\n\tconst memoizedStuffRef = useRef({\n\t\ttransform: '',\n\t\tclipPath: 'none',\n\t\twidth: 0,\n\t\theight: 0,\n\t\tx: 0,\n\t\ty: 0,\n\t\tisCulled: false,\n\t})\n\n\tuseQuickReactor(\n\t\t'set shape stuff',\n\t\t() => {\n\t\t\tconst shape = editor.getShape(id)\n\t\t\tif (!shape) return // probably the shape was just deleted\n\n\t\t\tconst prev = memoizedStuffRef.current\n\n\t\t\t// Clip path\n\t\t\tconst clipPath = editor.getShapeClipPath(id) ?? 'none'\n\t\t\tif (clipPath !== prev.clipPath) {\n\t\t\t\tsetStyleProperty(containerRef.current, 'clip-path', clipPath)\n\t\t\t\tsetStyleProperty(bgContainerRef.current, 'clip-path', clipPath)\n\t\t\t\tprev.clipPath = clipPath\n\t\t\t}\n\n\t\t\t// Page transform\n\t\t\tconst pageTransform = editor.getShapePageTransform(id)\n\t\t\tconst transform = Mat.toCssString(pageTransform)\n\t\t\tconst bounds = editor.getShapeGeometry(shape).bounds\n\n\t\t\t// Update if the tranform has changed\n\t\t\tif (transform !== prev.transform) {\n\t\t\t\tsetStyleProperty(containerRef.current, 'transform', transform)\n\t\t\t\tsetStyleProperty(bgContainerRef.current, 'transform', transform)\n\t\t\t\tprev.transform = transform\n\t\t\t}\n\n\t\t\t// Width / Height\n\t\t\t// We round the shape width and height up to the nearest multiple of dprMultiple\n\t\t\t// to avoid the browser making miscalculations when applying the transform.\n\t\t\tconst widthRemainder = bounds.w % dprMultiple\n\t\t\tconst heightRemainder = bounds.h % dprMultiple\n\t\t\tconst width = widthRemainder === 0 ? bounds.w : bounds.w + (dprMultiple - widthRemainder)\n\t\t\tconst height = heightRemainder === 0 ? bounds.h : bounds.h + (dprMultiple - heightRemainder)\n\n\t\t\tif (width !== prev.width || height !== prev.height) {\n\t\t\t\tsetStyleProperty(containerRef.current, 'width', Math.max(width, dprMultiple) + 'px')\n\t\t\t\tsetStyleProperty(containerRef.current, 'height', Math.max(height, dprMultiple) + 'px')\n\t\t\t\tsetStyleProperty(bgContainerRef.current, 'width', Math.max(width, dprMultiple) + 'px')\n\t\t\t\tsetStyleProperty(bgContainerRef.current, 'height', Math.max(height, dprMultiple) + 'px')\n\t\t\t\tprev.width = width\n\t\t\t\tprev.height = height\n\t\t\t}\n\t\t},\n\t\t[editor]\n\t)\n\n\t// This stuff changes pretty infrequently, so we can change them together\n\tuseLayoutEffect(() => {\n\t\tconst container = containerRef.current\n\t\tconst bgContainer = bgContainerRef.current\n\n\t\t// Opacity\n\t\tsetStyleProperty(container, 'opacity', opacity)\n\t\tsetStyleProperty(bgContainer, 'opacity', opacity)\n\n\t\t// Z-Index\n\t\tsetStyleProperty(container, 'z-index', index)\n\t\tsetStyleProperty(bgContainer, 'z-index', backgroundIndex)\n\t}, [opacity, index, backgroundIndex])\n\n\tuseQuickReactor(\n\t\t'set display',\n\t\t() => {\n\t\t\tconst shape = editor.getShape(id)\n\t\t\tif (!shape) return // probably the shape was just deleted\n\n\t\t\tconst culledShapes = editor.getCulledShapes()\n\t\t\tconst isCulled = culledShapes.has(id)\n\t\t\tif (isCulled !== memoizedStuffRef.current.isCulled) {\n\t\t\t\tsetStyleProperty(containerRef.current, 'display', isCulled ? 'none' : 'block')\n\t\t\t\tsetStyleProperty(bgContainerRef.current, 'display', isCulled ? 'none' : 'block')\n\t\t\t\tmemoizedStuffRef.current.isCulled = isCulled\n\t\t\t}\n\t\t},\n\t\t[editor]\n\t)\n\tconst annotateError = useCallback(\n\t\t(error: any) => editor.annotateError(error, { origin: 'shape', willCrashApp: false }),\n\t\t[editor]\n\t)\n\n\tif (!shape) return null\n\n\tconst isFilledShape = 'fill' in shape.props && shape.props.fill !== 'none'\n\n\treturn (\n\t\t<>\n\t\t\t{util.backgroundComponent && (\n\t\t\t\t<div\n\t\t\t\t\tref={bgContainerRef}\n\t\t\t\t\tclassName=\"tl-shape tl-shape-background\"\n\t\t\t\t\tdata-shape-type={shape.type}\n\t\t\t\t\tdata-shape-id={shape.id}\n\t\t\t\t\tdraggable={false}\n\t\t\t\t>\n\t\t\t\t\t<OptionalErrorBoundary fallback={ShapeErrorFallback} onError={annotateError}>\n\t\t\t\t\t\t<InnerShapeBackground shape={shape} util={util} />\n\t\t\t\t\t</OptionalErrorBoundary>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div\n\t\t\t\tref={containerRef}\n\t\t\t\tclassName=\"tl-shape\"\n\t\t\t\tdata-shape-type={shape.type}\n\t\t\t\tdata-shape-is-filled={isFilledShape}\n\t\t\t\tdata-shape-id={shape.id}\n\t\t\t\tdraggable={false}\n\t\t\t>\n\t\t\t\t<OptionalErrorBoundary fallback={ShapeErrorFallback as any} onError={annotateError}>\n\t\t\t\t\t<InnerShape shape={shape} util={util} />\n\t\t\t\t</OptionalErrorBoundary>\n\t\t\t</div>\n\t\t</>\n\t)\n})\n\nexport const InnerShape = memo(\n\tfunction InnerShape<T extends TLShape>({ shape, util }: { shape: T; util: ShapeUtil<T> }) {\n\t\treturn useStateTracking(\n\t\t\t'InnerShape:' + shape.type,\n\t\t\t() =>\n\t\t\t\t// always fetch the latest shape from the store even if the props/meta have not changed, to avoid\n\t\t\t\t// calling the render method with stale data.\n\t\t\t\tutil.component(util.editor.store.unsafeGetWithoutCapture(shape.id) as T),\n\t\t\t[util, shape.id]\n\t\t)\n\t},\n\t(prev, next) => areShapesContentEqual(prev.shape, next.shape) && prev.util === next.util\n)\n\nexport const InnerShapeBackground = memo(\n\tfunction InnerShapeBackground<T extends TLShape>({\n\t\tshape,\n\t\tutil,\n\t}: {\n\t\tshape: T\n\t\tutil: ShapeUtil<T>\n\t}) {\n\t\treturn useStateTracking(\n\t\t\t'InnerShape:' + shape.type,\n\t\t\t() =>\n\t\t\t\t// always fetch the latest shape from the store even if the props/meta have not changed, to avoid\n\t\t\t\t// calling the render method with stale data.\n\t\t\t\tutil.backgroundComponent?.(util.editor.store.unsafeGetWithoutCapture(shape.id) as T),\n\t\t\t[util, shape.id]\n\t\t)\n\t},\n\t(prev, next) =>\n\t\tprev.shape.props === next.shape.props &&\n\t\tprev.shape.meta === next.shape.meta &&\n\t\tprev.util === next.util\n)\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["Shape", "shape", "InnerShape", "InnerShapeBackground"]
|
|
7
7
|
}
|
|
@@ -54,13 +54,14 @@ var import_Vec = require("../../primitives/Vec");
|
|
|
54
54
|
var import_utils2 = require("../../primitives/utils");
|
|
55
55
|
var import_debug_flags = require("../../utils/debug-flags");
|
|
56
56
|
var import_dom = require("../../utils/dom");
|
|
57
|
+
var import_nearestMultiple = require("../../utils/nearestMultiple");
|
|
57
58
|
var import_GeometryDebuggingView = require("../GeometryDebuggingView");
|
|
58
59
|
var import_LiveCollaborators = require("../LiveCollaborators");
|
|
59
60
|
var import_MenuClickCapture = require("../MenuClickCapture");
|
|
60
61
|
var import_Shape = require("../Shape");
|
|
61
62
|
function DefaultCanvas({ className }) {
|
|
62
63
|
const editor = (0, import_useEditor.useEditor)();
|
|
63
|
-
const { Background, SvgDefs, ShapeIndicators } = (0, import_useEditorComponents.useEditorComponents)();
|
|
64
|
+
const { SelectionBackground, Background, SvgDefs, ShapeIndicators } = (0, import_useEditorComponents.useEditorComponents)();
|
|
64
65
|
const rCanvas = (0, import_react.useRef)(null);
|
|
65
66
|
const rHtmlLayer = (0, import_react.useRef)(null);
|
|
66
67
|
const rHtmlLayer2 = (0, import_react.useRef)(null);
|
|
@@ -150,7 +151,7 @@ function DefaultCanvas({ className }) {
|
|
|
150
151
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(GridWrapper, {}),
|
|
151
152
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { ref: rHtmlLayer, className: "tl-html-layer tl-shapes", draggable: false, children: [
|
|
152
153
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(OnTheCanvasWrapper, {}),
|
|
153
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectionBackgroundWrapper, {}),
|
|
154
|
+
SelectionBackground && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectionBackgroundWrapper, {}),
|
|
154
155
|
hideShapes ? null : debugSvg ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ShapesWithSVGs, {}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ShapesToDisplay, {})
|
|
155
156
|
] }),
|
|
156
157
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "tl-overlays", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { ref: rHtmlLayer2, className: "tl-html-layer", children: [
|
|
@@ -163,6 +164,7 @@ function DefaultCanvas({ className }) {
|
|
|
163
164
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(SnapIndicatorWrapper, {}),
|
|
164
165
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectionForegroundWrapper, {}),
|
|
165
166
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(HandlesWrapper, {}),
|
|
167
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(OverlaysWrapper, {}),
|
|
166
168
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_LiveCollaborators.LiveCollaborators, {})
|
|
167
169
|
] }) }),
|
|
168
170
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(MovingCameraHitTestBlocker, {})
|
|
@@ -299,18 +301,32 @@ function HandleWrapper({
|
|
|
299
301
|
"g",
|
|
300
302
|
{
|
|
301
303
|
role: "button",
|
|
302
|
-
"aria-label": "handle",
|
|
304
|
+
"aria-label": handle.label || "handle",
|
|
303
305
|
transform: `translate(${handle.x}, ${handle.y})`,
|
|
304
306
|
...events,
|
|
305
307
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Handle, { shapeId, handle, zoom, isCoarse })
|
|
306
308
|
}
|
|
307
309
|
);
|
|
308
310
|
}
|
|
311
|
+
function OverlaysWrapper() {
|
|
312
|
+
const { Overlays } = (0, import_useEditorComponents.useEditorComponents)();
|
|
313
|
+
if (!Overlays) return null;
|
|
314
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "tl-custom-overlays tl-overlays__item", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Overlays, {}) });
|
|
315
|
+
}
|
|
309
316
|
function ShapesWithSVGs() {
|
|
310
317
|
const editor = (0, import_useEditor.useEditor)();
|
|
311
318
|
const renderingShapes = (0, import_state_react.useValue)("rendering shapes", () => editor.getRenderingShapes(), [editor]);
|
|
319
|
+
const dprMultiple = (0, import_state_react.useValue)(
|
|
320
|
+
"dpr multiple",
|
|
321
|
+
() => (
|
|
322
|
+
// dprMultiple is the smallest number we can multiply dpr by to get an integer
|
|
323
|
+
// it's usually 1, 2, or 4 (for e.g. dpr of 2, 2.5 and 2.25 respectively)
|
|
324
|
+
(0, import_nearestMultiple.nearestMultiple)(Math.floor(editor.getInstanceState().devicePixelRatio * 100) / 100)
|
|
325
|
+
),
|
|
326
|
+
[editor]
|
|
327
|
+
);
|
|
312
328
|
return renderingShapes.map((result) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react.Fragment, { children: [
|
|
313
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Shape.Shape, { ...result }),
|
|
329
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Shape.Shape, { ...result, dprMultiple }),
|
|
314
330
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(DebugSvgCopy, { id: result.id, mode: "iframe" })
|
|
315
331
|
] }, result.id + "_fragment"));
|
|
316
332
|
}
|
|
@@ -335,8 +351,17 @@ function ReflowIfNeeded() {
|
|
|
335
351
|
function ShapesToDisplay() {
|
|
336
352
|
const editor = (0, import_useEditor.useEditor)();
|
|
337
353
|
const renderingShapes = (0, import_state_react.useValue)("rendering shapes", () => editor.getRenderingShapes(), [editor]);
|
|
354
|
+
const dprMultiple = (0, import_state_react.useValue)(
|
|
355
|
+
"dpr multiple",
|
|
356
|
+
() => (
|
|
357
|
+
// dprMultiple is the smallest number we can multiply dpr by to get an integer
|
|
358
|
+
// it's usually 1, 2, or 4 (for e.g. dpr of 2, 2.5 and 2.25 respectively)
|
|
359
|
+
(0, import_nearestMultiple.nearestMultiple)(Math.floor(editor.getInstanceState().devicePixelRatio * 100) / 100)
|
|
360
|
+
),
|
|
361
|
+
[editor]
|
|
362
|
+
);
|
|
338
363
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
339
|
-
renderingShapes.map((result) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Shape.Shape, { ...result }, result.id + "_shape")),
|
|
364
|
+
renderingShapes.map((result) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Shape.Shape, { ...result, dprMultiple }, result.id + "_shape")),
|
|
340
365
|
import_environment.tlenv.isSafari && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ReflowIfNeeded, {})
|
|
341
366
|
] });
|
|
342
367
|
}
|
|
@@ -441,9 +466,13 @@ function DebugSvgCopy({ id, mode }) {
|
|
|
441
466
|
}
|
|
442
467
|
function SelectionForegroundWrapper() {
|
|
443
468
|
const editor = (0, import_useEditor.useEditor)();
|
|
444
|
-
const selectionRotation = (0, import_state_react.useValue)(
|
|
445
|
-
|
|
446
|
-
|
|
469
|
+
const selectionRotation = (0, import_state_react.useValue)(
|
|
470
|
+
"selection rotation",
|
|
471
|
+
function getSelectionRotation() {
|
|
472
|
+
return editor.getSelectionRotation();
|
|
473
|
+
},
|
|
474
|
+
[editor]
|
|
475
|
+
);
|
|
447
476
|
const selectionBounds = (0, import_state_react.useValue)(
|
|
448
477
|
"selection bounds",
|
|
449
478
|
() => editor.getSelectionRotatedPageBounds(),
|