@tldraw/editor 3.8.0-canary.dfac53c137bb → 3.8.0-canary.e6516a26404a

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (70) hide show
  1. package/dist-cjs/index.d.ts +48 -151
  2. package/dist-cjs/index.js +8 -11
  3. package/dist-cjs/index.js.map +2 -2
  4. package/dist-cjs/lib/components/default-components/DefaultCanvas.js +1 -1
  5. package/dist-cjs/lib/components/default-components/DefaultCanvas.js.map +2 -2
  6. package/dist-cjs/lib/config/TLSessionStateSnapshot.js.map +2 -2
  7. package/dist-cjs/lib/editor/Editor.js +16 -27
  8. package/dist-cjs/lib/editor/Editor.js.map +2 -2
  9. package/dist-cjs/lib/editor/managers/SnapManager/BoundsSnaps.js.map +2 -2
  10. package/dist-cjs/lib/editor/managers/TextManager.js +0 -1
  11. package/dist-cjs/lib/editor/managers/TextManager.js.map +2 -2
  12. package/dist-cjs/lib/editor/shapes/ShapeUtil.js.map +2 -2
  13. package/dist-cjs/lib/editor/types/emit-types.js.map +1 -1
  14. package/dist-cjs/lib/editor/types/external-content.js.map +1 -1
  15. package/dist-cjs/lib/exports/StyleEmbedder.js.map +2 -2
  16. package/dist-cjs/lib/hooks/useDocumentEvents.js +3 -1
  17. package/dist-cjs/lib/hooks/useDocumentEvents.js.map +2 -2
  18. package/dist-cjs/lib/hooks/usePassThroughWheelEvents.js +0 -4
  19. package/dist-cjs/lib/hooks/usePassThroughWheelEvents.js.map +3 -3
  20. package/dist-cjs/lib/options.js +1 -3
  21. package/dist-cjs/lib/options.js.map +2 -2
  22. package/dist-cjs/lib/utils/dom.js +0 -6
  23. package/dist-cjs/lib/utils/dom.js.map +2 -2
  24. package/dist-cjs/version.js +3 -3
  25. package/dist-cjs/version.js.map +1 -1
  26. package/dist-esm/index.d.mts +48 -151
  27. package/dist-esm/index.mjs +1 -5
  28. package/dist-esm/index.mjs.map +2 -2
  29. package/dist-esm/lib/components/default-components/DefaultCanvas.mjs +1 -1
  30. package/dist-esm/lib/components/default-components/DefaultCanvas.mjs.map +2 -2
  31. package/dist-esm/lib/config/TLSessionStateSnapshot.mjs.map +2 -2
  32. package/dist-esm/lib/editor/Editor.mjs +16 -27
  33. package/dist-esm/lib/editor/Editor.mjs.map +2 -2
  34. package/dist-esm/lib/editor/managers/SnapManager/BoundsSnaps.mjs.map +2 -2
  35. package/dist-esm/lib/editor/managers/TextManager.mjs +0 -1
  36. package/dist-esm/lib/editor/managers/TextManager.mjs.map +2 -2
  37. package/dist-esm/lib/editor/shapes/ShapeUtil.mjs.map +2 -2
  38. package/dist-esm/lib/exports/StyleEmbedder.mjs.map +2 -2
  39. package/dist-esm/lib/hooks/useDocumentEvents.mjs +4 -2
  40. package/dist-esm/lib/hooks/useDocumentEvents.mjs.map +2 -2
  41. package/dist-esm/lib/hooks/usePassThroughWheelEvents.mjs +0 -4
  42. package/dist-esm/lib/hooks/usePassThroughWheelEvents.mjs.map +3 -3
  43. package/dist-esm/lib/options.mjs +1 -3
  44. package/dist-esm/lib/options.mjs.map +2 -2
  45. package/dist-esm/lib/utils/dom.mjs +0 -6
  46. package/dist-esm/lib/utils/dom.mjs.map +2 -2
  47. package/dist-esm/version.mjs +3 -3
  48. package/dist-esm/version.mjs.map +1 -1
  49. package/editor.css +1 -2
  50. package/package.json +20 -20
  51. package/src/index.ts +1 -16
  52. package/src/lib/components/default-components/DefaultCanvas.tsx +1 -1
  53. package/src/lib/config/TLSessionStateSnapshot.ts +1 -3
  54. package/src/lib/editor/Editor.ts +32 -59
  55. package/src/lib/editor/managers/SnapManager/BoundsSnaps.ts +4 -4
  56. package/src/lib/editor/managers/TextManager.ts +0 -1
  57. package/src/lib/editor/shapes/ShapeUtil.ts +1 -30
  58. package/src/lib/editor/types/emit-types.ts +0 -1
  59. package/src/lib/editor/types/external-content.ts +50 -90
  60. package/src/lib/exports/StyleEmbedder.ts +1 -1
  61. package/src/lib/hooks/useDocumentEvents.ts +11 -2
  62. package/src/lib/hooks/usePassThroughWheelEvents.ts +0 -7
  63. package/src/lib/options.ts +0 -11
  64. package/src/lib/utils/dom.ts +0 -12
  65. package/src/version.ts +3 -3
  66. package/dist-cjs/lib/editor/shapes/shared/resizeScaled.js +0 -66
  67. package/dist-cjs/lib/editor/shapes/shared/resizeScaled.js.map +0 -7
  68. package/dist-esm/lib/editor/shapes/shared/resizeScaled.mjs +0 -46
  69. package/dist-esm/lib/editor/shapes/shared/resizeScaled.mjs.map +0 -7
  70. package/src/lib/editor/shapes/shared/resizeScaled.ts +0 -61
@@ -155,7 +155,7 @@ import {
155
155
  TLPointerEventInfo,
156
156
  TLWheelEventInfo,
157
157
  } from './types/event-types'
158
- import { TLExternalAsset, TLExternalContent } from './types/external-content'
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
- * editor.getStateDescendant('select')
1404
- * editor.getStateDescendant('select.brushing')
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 : (shape?.id ?? null)
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 : (shape?.id ?? null)
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 : (shape?.id ?? null)
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 : (shape?.id ?? null)
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 : (shape?.id ?? null)
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
- ...resizedShape,
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 TLExternalAsset['type']]: {
7979
- [Key in K]: null | ((info: TLExternalAsset & { type: Key }) => Promise<TLAsset | undefined>)
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 TLExternalAsset['type']>(
7983
+ registerExternalAssetHandler<T extends TLExternalAssetContent['type']>(
8009
7984
  type: T,
8010
- handler: null | ((info: TLExternalAsset & { type: T }) => Promise<TLAsset>)
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: TLExternalAsset): Promise<TLAsset | undefined> {
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: TLExternalAsset['type']): boolean {
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
- ? (this.store.unsafeGetWithoutCapture(TLPOINTER_ID)?.lastActivityTimestamp ??
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 : (nearestSnapsX[0]?.nudge ?? 0),
394
- lockedAxis === 'y' ? 0 : (nearestSnapsY[0]?.nudge ?? 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 : (nearestSnapsX[0]?.nudge ?? 0),
508
- isYLocked ? 0 : (nearestSnapsY[0]?.nudge ?? 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'
@@ -5,12 +5,11 @@ import {
5
5
  TLHandle,
6
6
  TLPropsMigrations,
7
7
  TLShape,
8
- TLShapeCrop,
9
8
  TLShapePartial,
10
9
  TLUnknownShape,
11
10
  } from '@tldraw/tlschema'
12
11
  import { ReactElement } from 'react'
13
- import { Box, SelectionHandle } from '../../primitives/Box'
12
+ import { Box } from '../../primitives/Box'
14
13
  import { Vec } from '../../primitives/Vec'
15
14
  import { Geometry2d } from '../../primitives/geometry/Geometry2d'
16
15
  import type { Editor } from '../Editor'
@@ -420,19 +419,6 @@ export abstract class ShapeUtil<Shape extends TLUnknownShape = TLUnknownShape> {
420
419
  */
421
420
  onBeforeUpdate?(prev: Shape, next: Shape): Shape | void
422
421
 
423
- /**
424
- * A callback called when a shape changes from a crop.
425
- *
426
- * @param shape - The shape at the start of the crop.
427
- * @param info - Info about the crop.
428
- * @returns A change to apply to the shape, or void.
429
- * @public
430
- */
431
- onCrop?(
432
- shape: Shape,
433
- info: TLCropInfo<Shape>
434
- ): Omit<TLShapePartial<Shape>, 'id' | 'type'> | undefined | void
435
-
436
422
  /**
437
423
  * A callback called when some other shapes are dragged over this one.
438
424
  *
@@ -630,21 +616,6 @@ export abstract class ShapeUtil<Shape extends TLUnknownShape = TLUnknownShape> {
630
616
  onEditEnd?(shape: Shape): void
631
617
  }
632
618
 
633
- /**
634
- * Info about a crop.
635
- * @param handle - The handle being dragged.
636
- * @param change - The distance the handle is moved.
637
- * @param initialShape - The shape at the start of the resize.
638
- * @public
639
- */
640
- export interface TLCropInfo<T extends TLShape> {
641
- handle: SelectionHandle
642
- change: Vec
643
- crop: TLShapeCrop
644
- uncroppedSize: { w: number; h: number }
645
- initialShape: T
646
- }
647
-
648
619
  /**
649
620
  * The type of resize.
650
621
  *
@@ -12,7 +12,6 @@ export interface TLEventMap {
12
12
  crash: [{ error: unknown }]
13
13
  'stop-camera-animation': []
14
14
  'stop-following': []
15
- 'before-event': [TLEventInfo]
16
15
  event: [TLEventInfo]
17
16
  tick: [number]
18
17
  frame: [number]
@@ -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
- | TLTldrawExternalContentSource
34
- | TLExcalidrawExternalContentSource
35
- | TLTextExternalContentSource
36
- | TLErrorExternalContentSource
37
-
38
- /** @public */
39
- export interface TLBaseExternalContent {
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
- /** @public */
45
- export interface TLTextExternalContent extends TLBaseExternalContent {
46
- type: 'text'
47
- text: string
48
- }
49
-
50
- /** @public */
51
- export interface TLFilesExternalContent extends TLBaseExternalContent {
52
- type: 'files'
53
- files: File[]
54
- ignoreParent: boolean
55
- }
56
-
57
- /** @public */
58
- export interface TLUrlExternalContent extends TLBaseExternalContent {
59
- type: 'url'
60
- url: string
61
- }
62
-
63
- /** @public */
64
- export interface TLSvgTextExternalContent extends TLBaseExternalContent {
65
- type: 'svg-text'
66
- text: string
67
- }
68
-
69
- /** @public */
70
- export interface TLEmbedExternalContent<EmbedDefinition> extends TLBaseExternalContent {
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
- ? (this.styles.get(element.parentElement as Element)?.self ?? NO_STYLES)
57
+ ? this.styles.get(element.parentElement as Element)?.self ?? NO_STYLES
58
58
  : NO_STYLES
59
59
 
60
60
  const info: ElementStyleInfo = {
@@ -2,7 +2,7 @@ import { useValue } from '@tldraw/state-react'
2
2
  import { useEffect } from 'react'
3
3
  import { Editor } from '../editor/Editor'
4
4
  import { TLKeyboardEventInfo } from '../editor/types/event-types'
5
- import { activeElementShouldCaptureKeys, preventDefault, stopEventPropagation } from '../utils/dom'
5
+ import { preventDefault, stopEventPropagation } from '../utils/dom'
6
6
  import { isAccelKey } from '../utils/keyboard'
7
7
  import { useContainer } from './useContainer'
8
8
  import { useEditor } from './useEditor'
@@ -274,6 +274,15 @@ export function useDocumentEvents() {
274
274
  }, [editor, container, isAppFocused])
275
275
  }
276
276
 
277
+ const INPUTS = ['input', 'select', 'button', 'textarea']
278
+
277
279
  function areShortcutsDisabled(editor: Editor) {
278
- return editor.menus.hasOpenMenus() || activeElementShouldCaptureKeys()
280
+ const { activeElement } = document
281
+
282
+ return (
283
+ editor.menus.hasOpenMenus() ||
284
+ (activeElement &&
285
+ (activeElement.getAttribute('contenteditable') ||
286
+ INPUTS.indexOf(activeElement.tagName.toLowerCase()) > -1))
287
+ )
279
288
  }
@@ -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
@@ -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
@@ -90,15 +90,3 @@ export const setStyleProperty = (
90
90
  if (!elm) return
91
91
  elm.style.setProperty(property, value as string)
92
92
  }
93
-
94
- const INPUTS = ['input', 'select', 'button', 'textarea']
95
-
96
- /** @internal */
97
- export function activeElementShouldCaptureKeys() {
98
- const { activeElement } = document
99
- return !!(
100
- activeElement &&
101
- (activeElement.getAttribute('contenteditable') ||
102
- INPUTS.indexOf(activeElement.tagName.toLowerCase()) > -1)
103
- )
104
- }
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.dfac53c137bb'
4
+ export const version = '3.8.0-canary.e6516a26404a'
5
5
  export const publishDates = {
6
6
  major: '2024-09-13T14:36:29.063Z',
7
- minor: '2025-02-07T14:42:00.437Z',
8
- patch: '2025-02-07T14:42:00.437Z',
7
+ minor: '2025-01-25T11:57:40.313Z',
8
+ patch: '2025-01-25T11:57:40.313Z',
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
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../src/lib/editor/shapes/shared/resizeScaled.ts"],
4
- "sourcesContent": ["import { TLBaseShape } from '@tldraw/tlschema'\nimport { exhaustiveSwitchError } from '@tldraw/utils'\nimport { Vec } from '../../../primitives/Vec'\nimport { TLResizeInfo } from '../ShapeUtil'\n\n/**\n * Resize a shape that has a scale prop.\n *\n * @param shape - The shape to resize\n * @param info - The resize info\n *\n * @public */\nexport function resizeScaled(\n\tshape: TLBaseShape<any, { scale: number }>,\n\t{ initialBounds, scaleX, scaleY, newPoint, handle }: TLResizeInfo<any>\n) {\n\tlet scaleDelta: number\n\tswitch (handle) {\n\t\tcase 'bottom_left':\n\t\tcase 'bottom_right':\n\t\tcase 'top_left':\n\t\tcase 'top_right': {\n\t\t\tscaleDelta = Math.max(0.01, Math.max(Math.abs(scaleX), Math.abs(scaleY)))\n\t\t\tbreak\n\t\t}\n\t\tcase 'left':\n\t\tcase 'right': {\n\t\t\tscaleDelta = Math.max(0.01, Math.abs(scaleX))\n\t\t\tbreak\n\t\t}\n\t\tcase 'bottom':\n\t\tcase 'top': {\n\t\t\tscaleDelta = Math.max(0.01, Math.abs(scaleY))\n\t\t\tbreak\n\t\t}\n\t\tdefault: {\n\t\t\tthrow exhaustiveSwitchError(handle)\n\t\t}\n\t}\n\n\t// Compute the offset (if flipped X or flipped Y)\n\tconst offset = new Vec(0, 0)\n\n\tif (scaleX < 0) {\n\t\toffset.x = -(initialBounds.width * scaleDelta)\n\t}\n\tif (scaleY < 0) {\n\t\toffset.y = -(initialBounds.height * scaleDelta)\n\t}\n\n\t// Apply the offset to the new point\n\tconst { x, y } = Vec.Add(newPoint, offset.rot(shape.rotation))\n\n\treturn {\n\t\tx,\n\t\ty,\n\t\tprops: {\n\t\t\tscale: scaleDelta * shape.props.scale,\n\t\t},\n\t}\n}\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAsC;AACtC,iBAAoB;AAUb,SAAS,aACf,OACA,EAAE,eAAe,QAAQ,QAAQ,UAAU,OAAO,GACjD;AACD,MAAI;AACJ,UAAQ,QAAQ;AAAA,IACf,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK,aAAa;AACjB,mBAAa,KAAK,IAAI,MAAM,KAAK,IAAI,KAAK,IAAI,MAAM,GAAG,KAAK,IAAI,MAAM,CAAC,CAAC;AACxE;AAAA,IACD;AAAA,IACA,KAAK;AAAA,IACL,KAAK,SAAS;AACb,mBAAa,KAAK,IAAI,MAAM,KAAK,IAAI,MAAM,CAAC;AAC5C;AAAA,IACD;AAAA,IACA,KAAK;AAAA,IACL,KAAK,OAAO;AACX,mBAAa,KAAK,IAAI,MAAM,KAAK,IAAI,MAAM,CAAC;AAC5C;AAAA,IACD;AAAA,IACA,SAAS;AACR,gBAAM,oCAAsB,MAAM;AAAA,IACnC;AAAA,EACD;AAGA,QAAM,SAAS,IAAI,eAAI,GAAG,CAAC;AAE3B,MAAI,SAAS,GAAG;AACf,WAAO,IAAI,EAAE,cAAc,QAAQ;AAAA,EACpC;AACA,MAAI,SAAS,GAAG;AACf,WAAO,IAAI,EAAE,cAAc,SAAS;AAAA,EACrC;AAGA,QAAM,EAAE,GAAG,EAAE,IAAI,eAAI,IAAI,UAAU,OAAO,IAAI,MAAM,QAAQ,CAAC;AAE7D,SAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA,OAAO;AAAA,MACN,OAAO,aAAa,MAAM,MAAM;AAAA,IACjC;AAAA,EACD;AACD;",
6
- "names": []
7
- }