@tldraw/editor 3.8.0-canary.7764274c3dd2 → 3.8.0-canary.7a17cab026a3
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 +48 -121
- package/dist-cjs/index.js +8 -10
- package/dist-cjs/index.js.map +2 -2
- package/dist-cjs/lib/components/default-components/DefaultCanvas.js +1 -1
- package/dist-cjs/lib/components/default-components/DefaultCanvas.js.map +2 -2
- package/dist-cjs/lib/config/TLSessionStateSnapshot.js.map +2 -2
- package/dist-cjs/lib/editor/Editor.js +16 -27
- package/dist-cjs/lib/editor/Editor.js.map +2 -2
- package/dist-cjs/lib/editor/managers/SnapManager/BoundsSnaps.js.map +2 -2
- package/dist-cjs/lib/editor/managers/TextManager.js +0 -1
- package/dist-cjs/lib/editor/managers/TextManager.js.map +2 -2
- package/dist-cjs/lib/editor/types/emit-types.js.map +1 -1
- package/dist-cjs/lib/editor/types/external-content.js.map +1 -1
- package/dist-cjs/lib/exports/StyleEmbedder.js.map +2 -2
- package/dist-cjs/lib/hooks/usePassThroughWheelEvents.js +0 -4
- package/dist-cjs/lib/hooks/usePassThroughWheelEvents.js.map +3 -3
- package/dist-cjs/lib/options.js +1 -3
- package/dist-cjs/lib/options.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 +48 -121
- package/dist-esm/index.mjs +1 -3
- package/dist-esm/index.mjs.map +2 -2
- package/dist-esm/lib/components/default-components/DefaultCanvas.mjs +1 -1
- package/dist-esm/lib/components/default-components/DefaultCanvas.mjs.map +2 -2
- package/dist-esm/lib/config/TLSessionStateSnapshot.mjs.map +2 -2
- package/dist-esm/lib/editor/Editor.mjs +16 -27
- package/dist-esm/lib/editor/Editor.mjs.map +2 -2
- package/dist-esm/lib/editor/managers/SnapManager/BoundsSnaps.mjs.map +2 -2
- package/dist-esm/lib/editor/managers/TextManager.mjs +0 -1
- package/dist-esm/lib/editor/managers/TextManager.mjs.map +2 -2
- package/dist-esm/lib/exports/StyleEmbedder.mjs.map +2 -2
- package/dist-esm/lib/hooks/usePassThroughWheelEvents.mjs +0 -4
- package/dist-esm/lib/hooks/usePassThroughWheelEvents.mjs.map +3 -3
- package/dist-esm/lib/options.mjs +1 -3
- package/dist-esm/lib/options.mjs.map +2 -2
- package/dist-esm/version.mjs +3 -3
- package/dist-esm/version.mjs.map +1 -1
- package/editor.css +1 -2
- package/package.json +20 -20
- package/src/index.ts +1 -14
- package/src/lib/components/default-components/DefaultCanvas.tsx +1 -1
- package/src/lib/config/TLSessionStateSnapshot.ts +1 -3
- package/src/lib/editor/Editor.ts +32 -59
- package/src/lib/editor/managers/SnapManager/BoundsSnaps.ts +4 -4
- package/src/lib/editor/managers/TextManager.ts +0 -1
- package/src/lib/editor/types/emit-types.ts +0 -1
- package/src/lib/editor/types/external-content.ts +50 -90
- package/src/lib/exports/StyleEmbedder.ts +1 -1
- package/src/lib/hooks/usePassThroughWheelEvents.ts +0 -7
- package/src/lib/options.ts +0 -11
- package/src/version.ts +3 -3
- package/dist-cjs/lib/editor/shapes/shared/resizeScaled.js +0 -66
- package/dist-cjs/lib/editor/shapes/shared/resizeScaled.js.map +0 -7
- package/dist-esm/lib/editor/shapes/shared/resizeScaled.mjs +0 -46
- package/dist-esm/lib/editor/shapes/shared/resizeScaled.mjs.map +0 -7
- package/src/lib/editor/shapes/shared/resizeScaled.ts +0 -61
package/editor.css
CHANGED
|
@@ -39,10 +39,9 @@
|
|
|
39
39
|
--layer-overlays-user-brush: 50;
|
|
40
40
|
--layer-overlays-user-indicator-selected: 60;
|
|
41
41
|
--layer-overlays-user-indicator-hovered: 70;
|
|
42
|
+
--layer-overlays-user-handles: 80;
|
|
42
43
|
--layer-overlays-user-snapline: 90;
|
|
43
44
|
--layer-overlays-selection-fg: 100;
|
|
44
|
-
/* User handles need to be above selection edges / corners, matters for sticky note clone handles */
|
|
45
|
-
--layer-overlays-user-handles: 105;
|
|
46
45
|
--layer-overlays-user-indicator-hint: 110;
|
|
47
46
|
--layer-overlays-collaborator-cursor-hint: 120;
|
|
48
47
|
--layer-overlays-collaborator-cursor: 130;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tldraw/editor",
|
|
3
3
|
"description": "A tiny little drawing app (editor).",
|
|
4
|
-
"version": "3.8.0-canary.
|
|
4
|
+
"version": "3.8.0-canary.7a17cab026a3",
|
|
5
5
|
"author": {
|
|
6
6
|
"name": "tldraw Inc.",
|
|
7
7
|
"email": "hello@tldraw.com"
|
|
@@ -45,37 +45,37 @@
|
|
|
45
45
|
"lint": "yarn run -T tsx ../../internal/scripts/lint.ts"
|
|
46
46
|
},
|
|
47
47
|
"dependencies": {
|
|
48
|
-
"@tldraw/state": "3.8.0-canary.
|
|
49
|
-
"@tldraw/state-react": "3.8.0-canary.
|
|
50
|
-
"@tldraw/store": "3.8.0-canary.
|
|
51
|
-
"@tldraw/tlschema": "3.8.0-canary.
|
|
52
|
-
"@tldraw/utils": "3.8.0-canary.
|
|
53
|
-
"@tldraw/validate": "3.8.0-canary.
|
|
54
|
-
"@types/core-js": "^2.5.
|
|
55
|
-
"@use-gesture/react": "^10.
|
|
48
|
+
"@tldraw/state": "3.8.0-canary.7a17cab026a3",
|
|
49
|
+
"@tldraw/state-react": "3.8.0-canary.7a17cab026a3",
|
|
50
|
+
"@tldraw/store": "3.8.0-canary.7a17cab026a3",
|
|
51
|
+
"@tldraw/tlschema": "3.8.0-canary.7a17cab026a3",
|
|
52
|
+
"@tldraw/utils": "3.8.0-canary.7a17cab026a3",
|
|
53
|
+
"@tldraw/validate": "3.8.0-canary.7a17cab026a3",
|
|
54
|
+
"@types/core-js": "^2.5.5",
|
|
55
|
+
"@use-gesture/react": "^10.2.27",
|
|
56
56
|
"canvas-size": "~2.0.0",
|
|
57
|
-
"classnames": "^2.
|
|
58
|
-
"core-js": "^3.
|
|
57
|
+
"classnames": "^2.3.2",
|
|
58
|
+
"core-js": "^3.31.1",
|
|
59
59
|
"eventemitter3": "^4.0.7",
|
|
60
60
|
"idb": "^7.1.1",
|
|
61
61
|
"is-plain-object": "^5.0.0",
|
|
62
62
|
"lodash.isequal": "^4.5.0"
|
|
63
63
|
},
|
|
64
64
|
"peerDependencies": {
|
|
65
|
-
"react": "^18.2.0
|
|
66
|
-
"react-dom": "^18.2.0
|
|
65
|
+
"react": "^18.2.0",
|
|
66
|
+
"react-dom": "^18.2.0"
|
|
67
67
|
},
|
|
68
68
|
"devDependencies": {
|
|
69
|
-
"@peculiar/webcrypto": "^1.
|
|
70
|
-
"@testing-library/jest-dom": "^5.
|
|
71
|
-
"@testing-library/react": "^15.0.
|
|
72
|
-
"@types/benchmark": "^2.1.
|
|
69
|
+
"@peculiar/webcrypto": "^1.4.0",
|
|
70
|
+
"@testing-library/jest-dom": "^5.16.5",
|
|
71
|
+
"@testing-library/react": "^15.0.6",
|
|
72
|
+
"@types/benchmark": "^2.1.2",
|
|
73
73
|
"@types/canvas-size": "^1.2.2",
|
|
74
|
-
"@types/wicg-file-system-access": "^2020.9.
|
|
74
|
+
"@types/wicg-file-system-access": "^2020.9.5",
|
|
75
75
|
"benchmark": "^2.1.4",
|
|
76
|
-
"fake-indexeddb": "^4.0.
|
|
76
|
+
"fake-indexeddb": "^4.0.0",
|
|
77
77
|
"jest-canvas-mock": "^2.5.2",
|
|
78
|
-
"jest-environment-jsdom": "^29.
|
|
78
|
+
"jest-environment-jsdom": "^29.4.3",
|
|
79
79
|
"lazyrepo": "0.0.0-alpha.27",
|
|
80
80
|
"resize-observer-polyfill": "^1.5.1"
|
|
81
81
|
},
|
package/src/index.ts
CHANGED
|
@@ -25,7 +25,6 @@ export {
|
|
|
25
25
|
useStateTracking,
|
|
26
26
|
useValue,
|
|
27
27
|
} from '@tldraw/state-react'
|
|
28
|
-
export { resizeScaled } from './lib/editor/shapes/shared/resizeScaled'
|
|
29
28
|
export { LocalIndexedDb, Table, type StoreName } from './lib/utils/sync/LocalIndexedDb'
|
|
30
29
|
// eslint-disable-next-line local/no-export-star
|
|
31
30
|
export * from '@tldraw/store'
|
|
@@ -240,21 +239,9 @@ export {
|
|
|
240
239
|
type UiEventType,
|
|
241
240
|
} from './lib/editor/types/event-types'
|
|
242
241
|
export {
|
|
243
|
-
type
|
|
244
|
-
type TLEmbedExternalContent,
|
|
245
|
-
type TLErrorExternalContentSource,
|
|
246
|
-
type TLExcalidrawExternalContentSource,
|
|
247
|
-
type TLExternalAsset,
|
|
242
|
+
type TLExternalAssetContent,
|
|
248
243
|
type TLExternalContent,
|
|
249
244
|
type TLExternalContentSource,
|
|
250
|
-
type TLFileExternalAsset,
|
|
251
|
-
type TLFilesExternalContent,
|
|
252
|
-
type TLSvgTextExternalContent,
|
|
253
|
-
type TLTextExternalContent,
|
|
254
|
-
type TLTextExternalContentSource,
|
|
255
|
-
type TLTldrawExternalContentSource,
|
|
256
|
-
type TLUrlExternalAsset,
|
|
257
|
-
type TLUrlExternalContent,
|
|
258
245
|
} from './lib/editor/types/external-content'
|
|
259
246
|
export {
|
|
260
247
|
type TLHistoryBatchOptions,
|
|
@@ -160,6 +160,7 @@ export function DefaultCanvas({ className }: TLCanvasComponentProps) {
|
|
|
160
160
|
<div className="tl-overlays">
|
|
161
161
|
<div ref={rHtmlLayer2} className="tl-html-layer">
|
|
162
162
|
{debugGeometry ? <GeometryDebuggingView /> : null}
|
|
163
|
+
<HandlesWrapper />
|
|
163
164
|
<BrushWrapper />
|
|
164
165
|
<ScribbleWrapper />
|
|
165
166
|
<ZoomBrushWrapper />
|
|
@@ -167,7 +168,6 @@ export function DefaultCanvas({ className }: TLCanvasComponentProps) {
|
|
|
167
168
|
<HintedShapeIndicator />
|
|
168
169
|
<SnapIndicatorWrapper />
|
|
169
170
|
<SelectionForegroundWrapper />
|
|
170
|
-
<HandlesWrapper />
|
|
171
171
|
<LiveCollaborators />
|
|
172
172
|
</div>
|
|
173
173
|
</div>
|
|
@@ -50,9 +50,7 @@ function iOS() {
|
|
|
50
50
|
* @public
|
|
51
51
|
*/
|
|
52
52
|
export const TAB_ID: string = window
|
|
53
|
-
?
|
|
54
|
-
getFromSessionStorage(tabIdKey) ??
|
|
55
|
-
`TLDRAW_INSTANCE_STATE_V1_` + uniqueId())
|
|
53
|
+
? window[tabIdKey] ?? getFromSessionStorage(tabIdKey) ?? `TLDRAW_INSTANCE_STATE_V1_` + uniqueId()
|
|
56
54
|
: '<error>'
|
|
57
55
|
if (window) {
|
|
58
56
|
window[tabIdKey] = TAB_ID
|
package/src/lib/editor/Editor.ts
CHANGED
|
@@ -155,7 +155,7 @@ import {
|
|
|
155
155
|
TLPointerEventInfo,
|
|
156
156
|
TLWheelEventInfo,
|
|
157
157
|
} from './types/event-types'
|
|
158
|
-
import {
|
|
158
|
+
import { TLExternalAssetContent, TLExternalContent } from './types/external-content'
|
|
159
159
|
import { TLHistoryBatchOptions } from './types/history-types'
|
|
160
160
|
import {
|
|
161
161
|
OptionalKeys,
|
|
@@ -929,21 +929,6 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|
|
929
929
|
return shapeUtil
|
|
930
930
|
}
|
|
931
931
|
|
|
932
|
-
/**
|
|
933
|
-
* Returns true if the editor has a shape util for the given shape / shape type.
|
|
934
|
-
*
|
|
935
|
-
* @param shape - A shape, shape partial, or shape type.
|
|
936
|
-
*/
|
|
937
|
-
hasShapeUtil<S extends TLUnknownShape>(shape: S | TLShapePartial<S>): boolean
|
|
938
|
-
hasShapeUtil<S extends TLUnknownShape>(type: S['type']): boolean
|
|
939
|
-
hasShapeUtil<T extends ShapeUtil>(
|
|
940
|
-
type: T extends ShapeUtil<infer R> ? R['type'] : string
|
|
941
|
-
): boolean
|
|
942
|
-
hasShapeUtil(arg: string | { type: string }): boolean {
|
|
943
|
-
const type = typeof arg === 'string' ? arg : arg.type
|
|
944
|
-
return hasOwnProperty(this.shapeUtils, type)
|
|
945
|
-
}
|
|
946
|
-
|
|
947
932
|
/* ------------------- Binding Utils ------------------ */
|
|
948
933
|
/**
|
|
949
934
|
* A map of shape utility classes (TLShapeUtils) by shape type.
|
|
@@ -1400,8 +1385,8 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|
|
1400
1385
|
*
|
|
1401
1386
|
* @example
|
|
1402
1387
|
* ```ts
|
|
1403
|
-
*
|
|
1404
|
-
*
|
|
1388
|
+
* state.getStateDescendant('select')
|
|
1389
|
+
* state.getStateDescendant('select.brushing')
|
|
1405
1390
|
* ```
|
|
1406
1391
|
*
|
|
1407
1392
|
* @param path - The descendant's path of state ids, separated by periods.
|
|
@@ -1681,7 +1666,7 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|
|
1681
1666
|
* @public
|
|
1682
1667
|
*/
|
|
1683
1668
|
isAncestorSelected(shape: TLShape | TLShapeId): boolean {
|
|
1684
|
-
const id = typeof shape === 'string' ? shape :
|
|
1669
|
+
const id = typeof shape === 'string' ? shape : shape?.id ?? null
|
|
1685
1670
|
const _shape = this.getShape(id)
|
|
1686
1671
|
if (!_shape) return false
|
|
1687
1672
|
const selectedShapeIds = this.getSelectedShapeIds()
|
|
@@ -1938,7 +1923,7 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|
|
1938
1923
|
* @public
|
|
1939
1924
|
*/
|
|
1940
1925
|
setFocusedGroup(shape: TLShapeId | TLGroupShape | null): this {
|
|
1941
|
-
const id = typeof shape === 'string' ? shape :
|
|
1926
|
+
const id = typeof shape === 'string' ? shape : shape?.id ?? null
|
|
1942
1927
|
|
|
1943
1928
|
if (id !== null) {
|
|
1944
1929
|
const shape = this.getShape(id)
|
|
@@ -2021,7 +2006,7 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|
|
2021
2006
|
* @public
|
|
2022
2007
|
*/
|
|
2023
2008
|
setEditingShape(shape: TLShapeId | TLShape | null): this {
|
|
2024
|
-
const id = typeof shape === 'string' ? shape :
|
|
2009
|
+
const id = typeof shape === 'string' ? shape : shape?.id ?? null
|
|
2025
2010
|
if (id !== this.getEditingShapeId()) {
|
|
2026
2011
|
if (id) {
|
|
2027
2012
|
const shape = this.getShape(id)
|
|
@@ -2082,7 +2067,7 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|
|
2082
2067
|
* @public
|
|
2083
2068
|
*/
|
|
2084
2069
|
setHoveredShape(shape: TLShapeId | TLShape | null): this {
|
|
2085
|
-
const id = typeof shape === 'string' ? shape :
|
|
2070
|
+
const id = typeof shape === 'string' ? shape : shape?.id ?? null
|
|
2086
2071
|
if (id === this.getHoveredShapeId()) return this
|
|
2087
2072
|
this.run(
|
|
2088
2073
|
() => {
|
|
@@ -2231,7 +2216,7 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|
|
2231
2216
|
* @public
|
|
2232
2217
|
*/
|
|
2233
2218
|
setCroppingShape(shape: TLShapeId | TLShape | null): this {
|
|
2234
|
-
const id = typeof shape === 'string' ? shape :
|
|
2219
|
+
const id = typeof shape === 'string' ? shape : shape?.id ?? null
|
|
2235
2220
|
if (id !== this.getCroppingShapeId()) {
|
|
2236
2221
|
this.run(
|
|
2237
2222
|
() => {
|
|
@@ -6775,8 +6760,6 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|
|
6775
6760
|
}
|
|
6776
6761
|
}
|
|
6777
6762
|
|
|
6778
|
-
let didResize = false
|
|
6779
|
-
|
|
6780
6763
|
if (util.onResize && util.canResize(initialShape)) {
|
|
6781
6764
|
// get the model changes from the shape util
|
|
6782
6765
|
const newPagePoint = this._scalePagePoint(
|
|
@@ -6815,30 +6798,24 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|
|
6815
6798
|
)
|
|
6816
6799
|
}
|
|
6817
6800
|
|
|
6818
|
-
const resizedShape = util.onResize(
|
|
6819
|
-
{ ...initialShape, x, y },
|
|
6820
|
-
{
|
|
6821
|
-
newPoint: newLocalPoint,
|
|
6822
|
-
handle: opts.dragHandle ?? 'bottom_right',
|
|
6823
|
-
// don't set isSingle to true for children
|
|
6824
|
-
mode: opts.mode ?? 'scale_shape',
|
|
6825
|
-
scaleX: myScale.x,
|
|
6826
|
-
scaleY: myScale.y,
|
|
6827
|
-
initialBounds,
|
|
6828
|
-
initialShape,
|
|
6829
|
-
}
|
|
6830
|
-
)
|
|
6831
|
-
|
|
6832
|
-
if (resizedShape) {
|
|
6833
|
-
didResize = true
|
|
6834
|
-
}
|
|
6835
|
-
|
|
6836
6801
|
workingShape = applyPartialToRecordWithProps(workingShape, {
|
|
6837
6802
|
id,
|
|
6838
6803
|
type: initialShape.type as any,
|
|
6839
6804
|
x: newLocalPoint.x,
|
|
6840
6805
|
y: newLocalPoint.y,
|
|
6841
|
-
...
|
|
6806
|
+
...util.onResize(
|
|
6807
|
+
{ ...initialShape, x, y },
|
|
6808
|
+
{
|
|
6809
|
+
newPoint: newLocalPoint,
|
|
6810
|
+
handle: opts.dragHandle ?? 'bottom_right',
|
|
6811
|
+
// don't set isSingle to true for children
|
|
6812
|
+
mode: opts.mode ?? 'scale_shape',
|
|
6813
|
+
scaleX: myScale.x,
|
|
6814
|
+
scaleY: myScale.y,
|
|
6815
|
+
initialBounds,
|
|
6816
|
+
initialShape,
|
|
6817
|
+
}
|
|
6818
|
+
),
|
|
6842
6819
|
})
|
|
6843
6820
|
|
|
6844
6821
|
if (!opts.skipStartAndEndCallbacks) {
|
|
@@ -6849,11 +6826,7 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|
|
6849
6826
|
}
|
|
6850
6827
|
|
|
6851
6828
|
this.updateShapes([workingShape])
|
|
6852
|
-
}
|
|
6853
|
-
|
|
6854
|
-
if (!didResize) {
|
|
6855
|
-
// reposition shape (rather than resizing it) based on where its resized center would be
|
|
6856
|
-
|
|
6829
|
+
} else {
|
|
6857
6830
|
const initialPageCenter = Mat.applyToPoint(pageTransform, initialBounds.center)
|
|
6858
6831
|
// get the model changes from the shape util
|
|
6859
6832
|
const newPageCenter = this._scalePagePoint(
|
|
@@ -7975,8 +7948,10 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|
|
7975
7948
|
|
|
7976
7949
|
/** @internal */
|
|
7977
7950
|
externalAssetContentHandlers: {
|
|
7978
|
-
[K in
|
|
7979
|
-
[Key in K]:
|
|
7951
|
+
[K in TLExternalAssetContent['type']]: {
|
|
7952
|
+
[Key in K]:
|
|
7953
|
+
| null
|
|
7954
|
+
| ((info: TLExternalAssetContent & { type: Key }) => Promise<TLAsset | undefined>)
|
|
7980
7955
|
}[K]
|
|
7981
7956
|
} = {
|
|
7982
7957
|
file: null,
|
|
@@ -8005,9 +7980,9 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|
|
8005
7980
|
*
|
|
8006
7981
|
* @public
|
|
8007
7982
|
*/
|
|
8008
|
-
registerExternalAssetHandler<T extends
|
|
7983
|
+
registerExternalAssetHandler<T extends TLExternalAssetContent['type']>(
|
|
8009
7984
|
type: T,
|
|
8010
|
-
handler: null | ((info:
|
|
7985
|
+
handler: null | ((info: TLExternalAssetContent & { type: T }) => Promise<TLAsset>)
|
|
8011
7986
|
): this {
|
|
8012
7987
|
this.externalAssetContentHandlers[type] = handler as any
|
|
8013
7988
|
return this
|
|
@@ -8075,11 +8050,11 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|
|
8075
8050
|
* @param info - Info about the external content.
|
|
8076
8051
|
* @returns The asset.
|
|
8077
8052
|
*/
|
|
8078
|
-
async getAssetForExternalContent(info:
|
|
8053
|
+
async getAssetForExternalContent(info: TLExternalAssetContent): Promise<TLAsset | undefined> {
|
|
8079
8054
|
return await this.externalAssetContentHandlers[info.type]?.(info as any)
|
|
8080
8055
|
}
|
|
8081
8056
|
|
|
8082
|
-
hasExternalAssetHandler(type:
|
|
8057
|
+
hasExternalAssetHandler(type: TLExternalAssetContent['type']): boolean {
|
|
8083
8058
|
return !!this.externalAssetContentHandlers[type]
|
|
8084
8059
|
}
|
|
8085
8060
|
|
|
@@ -8801,8 +8776,8 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|
|
8801
8776
|
// If our pointer moved only because we're following some other user, then don't
|
|
8802
8777
|
// update our last activity timestamp; otherwise, update it to the current timestamp.
|
|
8803
8778
|
info.type === 'pointer' && info.pointerId === INTERNAL_POINTER_IDS.CAMERA_MOVE
|
|
8804
|
-
?
|
|
8805
|
-
this._tickManager.now
|
|
8779
|
+
? this.store.unsafeGetWithoutCapture(TLPOINTER_ID)?.lastActivityTimestamp ??
|
|
8780
|
+
this._tickManager.now
|
|
8806
8781
|
: this._tickManager.now,
|
|
8807
8782
|
meta: {},
|
|
8808
8783
|
},
|
|
@@ -9367,8 +9342,6 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|
|
9367
9342
|
// todo: replace with new readonly mode?
|
|
9368
9343
|
if (this.getCrashingError()) return this
|
|
9369
9344
|
|
|
9370
|
-
this.emit('before-event', info)
|
|
9371
|
-
|
|
9372
9345
|
const { inputs } = this
|
|
9373
9346
|
const { type } = info
|
|
9374
9347
|
|
|
@@ -390,8 +390,8 @@ export class BoundsSnaps {
|
|
|
390
390
|
|
|
391
391
|
// at the same time, calculate how far we need to nudge the shape to 'snap' to the target point(s)
|
|
392
392
|
const nudge = new Vec(
|
|
393
|
-
lockedAxis === 'x' ? 0 :
|
|
394
|
-
lockedAxis === 'y' ? 0 :
|
|
393
|
+
lockedAxis === 'x' ? 0 : nearestSnapsX[0]?.nudge ?? 0,
|
|
394
|
+
lockedAxis === 'y' ? 0 : nearestSnapsY[0]?.nudge ?? 0
|
|
395
395
|
)
|
|
396
396
|
|
|
397
397
|
// ok we've figured out how much the box should be nudged, now let's find all the snap points
|
|
@@ -504,8 +504,8 @@ export class BoundsSnaps {
|
|
|
504
504
|
|
|
505
505
|
// at the same time, calculate how far we need to nudge the shape to 'snap' to the target point(s)
|
|
506
506
|
const nudge = new Vec(
|
|
507
|
-
isXLocked ? 0 :
|
|
508
|
-
isYLocked ? 0 :
|
|
507
|
+
isXLocked ? 0 : nearestSnapsX[0]?.nudge ?? 0,
|
|
508
|
+
isYLocked ? 0 : nearestSnapsY[0]?.nudge ?? 0
|
|
509
509
|
)
|
|
510
510
|
|
|
511
511
|
if (isAspectRatioLocked && isSelectionCorner(handle) && nudge.len() !== 0) {
|
|
@@ -230,7 +230,6 @@ export class TextManager {
|
|
|
230
230
|
elm.style.setProperty('font-weight', opts.fontWeight)
|
|
231
231
|
elm.style.setProperty('line-height', `${opts.lineHeight * opts.fontSize}px`)
|
|
232
232
|
elm.style.setProperty('text-align', textAlignmentsForLtr[opts.textAlign])
|
|
233
|
-
elm.style.setProperty('font-style', opts.fontStyle)
|
|
234
233
|
|
|
235
234
|
const shouldTruncateToFirstLine =
|
|
236
235
|
opts.overflow === 'truncate-ellipsis' || opts.overflow === 'truncate-clip'
|
|
@@ -2,97 +2,57 @@ import { TLAssetId } from '@tldraw/tlschema'
|
|
|
2
2
|
import { VecLike } from '../../primitives/Vec'
|
|
3
3
|
import { TLContent } from './clipboard-types'
|
|
4
4
|
|
|
5
|
-
/** @public */
|
|
6
|
-
export interface TLTldrawExternalContentSource {
|
|
7
|
-
type: 'tldraw'
|
|
8
|
-
data: TLContent
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
/** @public */
|
|
12
|
-
export interface TLExcalidrawExternalContentSource {
|
|
13
|
-
type: 'excalidraw'
|
|
14
|
-
data: any
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
/** @public */
|
|
18
|
-
export interface TLTextExternalContentSource {
|
|
19
|
-
type: 'text'
|
|
20
|
-
data: string
|
|
21
|
-
subtype: 'json' | 'html' | 'text' | 'url'
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
/** @public */
|
|
25
|
-
export interface TLErrorExternalContentSource {
|
|
26
|
-
type: 'error'
|
|
27
|
-
data: string | null
|
|
28
|
-
reason: string
|
|
29
|
-
}
|
|
30
|
-
|
|
31
5
|
/** @public */
|
|
32
6
|
export type TLExternalContentSource =
|
|
33
|
-
|
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
7
|
+
| {
|
|
8
|
+
type: 'tldraw'
|
|
9
|
+
data: TLContent
|
|
10
|
+
}
|
|
11
|
+
| {
|
|
12
|
+
type: 'excalidraw'
|
|
13
|
+
data: any
|
|
14
|
+
}
|
|
15
|
+
| {
|
|
16
|
+
type: 'text'
|
|
17
|
+
data: string
|
|
18
|
+
subtype: 'json' | 'html' | 'text' | 'url'
|
|
19
|
+
}
|
|
20
|
+
| {
|
|
21
|
+
type: 'error'
|
|
22
|
+
data: string | null
|
|
23
|
+
reason: string
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
/** @public */
|
|
27
|
+
export type TLExternalContent<EmbedDefinition> = {
|
|
40
28
|
sources?: TLExternalContentSource[]
|
|
41
29
|
point?: VecLike
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
type: 'embed'
|
|
72
|
-
url: string
|
|
73
|
-
embed: EmbedDefinition
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
/** @public */
|
|
77
|
-
export type TLExternalContent<EmbedDefinition> =
|
|
78
|
-
| TLTextExternalContent
|
|
79
|
-
| TLFilesExternalContent
|
|
80
|
-
| TLUrlExternalContent
|
|
81
|
-
| TLSvgTextExternalContent
|
|
82
|
-
| TLEmbedExternalContent<EmbedDefinition>
|
|
83
|
-
|
|
84
|
-
/** @public */
|
|
85
|
-
export interface TLFileExternalAsset {
|
|
86
|
-
type: 'file'
|
|
87
|
-
file: File
|
|
88
|
-
assetId?: TLAssetId
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
/** @public */
|
|
92
|
-
export interface TLUrlExternalAsset {
|
|
93
|
-
type: 'url'
|
|
94
|
-
url: string
|
|
95
|
-
}
|
|
96
|
-
|
|
97
|
-
/** @public */
|
|
98
|
-
export type TLExternalAsset = TLFileExternalAsset | TLUrlExternalAsset
|
|
30
|
+
} & (
|
|
31
|
+
| {
|
|
32
|
+
type: 'text'
|
|
33
|
+
text: string
|
|
34
|
+
}
|
|
35
|
+
| {
|
|
36
|
+
type: 'files'
|
|
37
|
+
files: File[]
|
|
38
|
+
ignoreParent: boolean
|
|
39
|
+
}
|
|
40
|
+
| {
|
|
41
|
+
type: 'url'
|
|
42
|
+
url: string
|
|
43
|
+
}
|
|
44
|
+
| {
|
|
45
|
+
type: 'svg-text'
|
|
46
|
+
text: string
|
|
47
|
+
}
|
|
48
|
+
| {
|
|
49
|
+
type: 'embed'
|
|
50
|
+
url: string
|
|
51
|
+
embed: EmbedDefinition
|
|
52
|
+
}
|
|
53
|
+
)
|
|
54
|
+
|
|
55
|
+
/** @public */
|
|
56
|
+
export type TLExternalAssetContent =
|
|
57
|
+
| { type: 'file'; file: File; assetId?: TLAssetId }
|
|
58
|
+
| { type: 'url'; url: string }
|
|
@@ -54,7 +54,7 @@ export class StyleEmbedder {
|
|
|
54
54
|
: NO_STYLES
|
|
55
55
|
|
|
56
56
|
const parentStyles = shouldSkipInheritedParentStyles
|
|
57
|
-
?
|
|
57
|
+
? this.styles.get(element.parentElement as Element)?.self ?? NO_STYLES
|
|
58
58
|
: NO_STYLES
|
|
59
59
|
|
|
60
60
|
const info: ElementStyleInfo = {
|
|
@@ -11,13 +11,6 @@ export function usePassThroughWheelEvents(ref: RefObject<HTMLElement>) {
|
|
|
11
11
|
useEffect(() => {
|
|
12
12
|
function onWheel(e: WheelEvent) {
|
|
13
13
|
if ((e as any).isSpecialRedispatchedEvent) return
|
|
14
|
-
|
|
15
|
-
// if the element is scrollable, don't redispatch the event
|
|
16
|
-
const elm = ref.current
|
|
17
|
-
if (elm && elm.scrollHeight > elm.clientHeight) {
|
|
18
|
-
return
|
|
19
|
-
}
|
|
20
|
-
|
|
21
14
|
preventDefault(e)
|
|
22
15
|
const cvs = container.querySelector('.tl-canvas')
|
|
23
16
|
if (!cvs) return
|
package/src/lib/options.ts
CHANGED
|
@@ -66,15 +66,6 @@ export interface TldrawOptions {
|
|
|
66
66
|
* external context providers. By default, this is `React.Fragment`.
|
|
67
67
|
*/
|
|
68
68
|
readonly exportProvider: ComponentType<{ children: React.ReactNode }>
|
|
69
|
-
/**
|
|
70
|
-
* How should the note shape resize? By default it does not resize (except automatically based on its text content),
|
|
71
|
-
* but you can set it to be user-resizable using scale.
|
|
72
|
-
*/
|
|
73
|
-
readonly noteShapeResizeMode: 'none' | 'scale'
|
|
74
|
-
/**
|
|
75
|
-
* By default, the toolbar items are accessible via number shortcuts according to their order. To disable this, set this option to false.
|
|
76
|
-
*/
|
|
77
|
-
readonly enableToolbarKeyboardShortcuts: boolean
|
|
78
69
|
}
|
|
79
70
|
|
|
80
71
|
/** @public */
|
|
@@ -120,6 +111,4 @@ export const defaultTldrawOptions = {
|
|
|
120
111
|
actionShortcutsLocation: 'swap',
|
|
121
112
|
createTextOnCanvasDoubleClick: true,
|
|
122
113
|
exportProvider: Fragment,
|
|
123
|
-
noteShapeResizeMode: 'none',
|
|
124
|
-
enableToolbarKeyboardShortcuts: true,
|
|
125
114
|
} as const satisfies TldrawOptions
|
package/src/version.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
// This file is automatically generated by internal/scripts/refresh-assets.ts.
|
|
2
2
|
// Do not edit manually. Or do, I'm a comment, not a cop.
|
|
3
3
|
|
|
4
|
-
export const version = '3.8.0-canary.
|
|
4
|
+
export const version = '3.8.0-canary.7a17cab026a3'
|
|
5
5
|
export const publishDates = {
|
|
6
6
|
major: '2024-09-13T14:36:29.063Z',
|
|
7
|
-
minor: '2025-
|
|
8
|
-
patch: '2025-
|
|
7
|
+
minor: '2025-01-28T10:43:47.114Z',
|
|
8
|
+
patch: '2025-01-28T10:43:47.114Z',
|
|
9
9
|
}
|
|
@@ -1,66 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __export = (target, all) => {
|
|
7
|
-
for (var name in all)
|
|
8
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
-
};
|
|
10
|
-
var __copyProps = (to, from, except, desc) => {
|
|
11
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
-
for (let key of __getOwnPropNames(from))
|
|
13
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
-
}
|
|
16
|
-
return to;
|
|
17
|
-
};
|
|
18
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
-
var resizeScaled_exports = {};
|
|
20
|
-
__export(resizeScaled_exports, {
|
|
21
|
-
resizeScaled: () => resizeScaled
|
|
22
|
-
});
|
|
23
|
-
module.exports = __toCommonJS(resizeScaled_exports);
|
|
24
|
-
var import_utils = require("@tldraw/utils");
|
|
25
|
-
var import_Vec = require("../../../primitives/Vec");
|
|
26
|
-
function resizeScaled(shape, { initialBounds, scaleX, scaleY, newPoint, handle }) {
|
|
27
|
-
let scaleDelta;
|
|
28
|
-
switch (handle) {
|
|
29
|
-
case "bottom_left":
|
|
30
|
-
case "bottom_right":
|
|
31
|
-
case "top_left":
|
|
32
|
-
case "top_right": {
|
|
33
|
-
scaleDelta = Math.max(0.01, Math.max(Math.abs(scaleX), Math.abs(scaleY)));
|
|
34
|
-
break;
|
|
35
|
-
}
|
|
36
|
-
case "left":
|
|
37
|
-
case "right": {
|
|
38
|
-
scaleDelta = Math.max(0.01, Math.abs(scaleX));
|
|
39
|
-
break;
|
|
40
|
-
}
|
|
41
|
-
case "bottom":
|
|
42
|
-
case "top": {
|
|
43
|
-
scaleDelta = Math.max(0.01, Math.abs(scaleY));
|
|
44
|
-
break;
|
|
45
|
-
}
|
|
46
|
-
default: {
|
|
47
|
-
throw (0, import_utils.exhaustiveSwitchError)(handle);
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
const offset = new import_Vec.Vec(0, 0);
|
|
51
|
-
if (scaleX < 0) {
|
|
52
|
-
offset.x = -(initialBounds.width * scaleDelta);
|
|
53
|
-
}
|
|
54
|
-
if (scaleY < 0) {
|
|
55
|
-
offset.y = -(initialBounds.height * scaleDelta);
|
|
56
|
-
}
|
|
57
|
-
const { x, y } = import_Vec.Vec.Add(newPoint, offset.rot(shape.rotation));
|
|
58
|
-
return {
|
|
59
|
-
x,
|
|
60
|
-
y,
|
|
61
|
-
props: {
|
|
62
|
-
scale: scaleDelta * shape.props.scale
|
|
63
|
-
}
|
|
64
|
-
};
|
|
65
|
-
}
|
|
66
|
-
//# sourceMappingURL=resizeScaled.js.map
|