@tldraw/editor 3.14.0-internal.601adf6e424b → 3.14.0

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 (55) hide show
  1. package/dist-cjs/index.d.ts +92 -13
  2. package/dist-cjs/index.js +4 -1
  3. package/dist-cjs/index.js.map +2 -2
  4. package/dist-cjs/lib/editor/Editor.js +51 -24
  5. package/dist-cjs/lib/editor/Editor.js.map +2 -2
  6. package/dist-cjs/lib/editor/managers/HistoryManager/HistoryManager.js +3 -1
  7. package/dist-cjs/lib/editor/managers/HistoryManager/HistoryManager.js.map +2 -2
  8. package/dist-cjs/lib/editor/shapes/ShapeUtil.js +0 -10
  9. package/dist-cjs/lib/editor/shapes/ShapeUtil.js.map +2 -2
  10. package/dist-cjs/lib/editor/tools/BaseBoxShapeTool/children/Pointing.js +13 -6
  11. package/dist-cjs/lib/editor/tools/BaseBoxShapeTool/children/Pointing.js.map +3 -3
  12. package/dist-cjs/lib/primitives/geometry/Geometry2d.js +6 -2
  13. package/dist-cjs/lib/primitives/geometry/Geometry2d.js.map +2 -2
  14. package/dist-cjs/lib/primitives/geometry/Group2d.js +11 -6
  15. package/dist-cjs/lib/primitives/geometry/Group2d.js.map +2 -2
  16. package/dist-cjs/lib/utils/dom.js +1 -1
  17. package/dist-cjs/lib/utils/dom.js.map +2 -2
  18. package/dist-cjs/lib/utils/reparenting.js +232 -0
  19. package/dist-cjs/lib/utils/reparenting.js.map +7 -0
  20. package/dist-cjs/version.js +3 -3
  21. package/dist-cjs/version.js.map +1 -1
  22. package/dist-esm/index.d.mts +92 -13
  23. package/dist-esm/index.mjs +4 -1
  24. package/dist-esm/index.mjs.map +2 -2
  25. package/dist-esm/lib/editor/Editor.mjs +51 -24
  26. package/dist-esm/lib/editor/Editor.mjs.map +2 -2
  27. package/dist-esm/lib/editor/managers/HistoryManager/HistoryManager.mjs +3 -1
  28. package/dist-esm/lib/editor/managers/HistoryManager/HistoryManager.mjs.map +2 -2
  29. package/dist-esm/lib/editor/shapes/ShapeUtil.mjs +0 -10
  30. package/dist-esm/lib/editor/shapes/ShapeUtil.mjs.map +2 -2
  31. package/dist-esm/lib/editor/tools/BaseBoxShapeTool/children/Pointing.mjs +13 -6
  32. package/dist-esm/lib/editor/tools/BaseBoxShapeTool/children/Pointing.mjs.map +3 -3
  33. package/dist-esm/lib/primitives/geometry/Geometry2d.mjs +6 -2
  34. package/dist-esm/lib/primitives/geometry/Geometry2d.mjs.map +2 -2
  35. package/dist-esm/lib/primitives/geometry/Group2d.mjs +11 -6
  36. package/dist-esm/lib/primitives/geometry/Group2d.mjs.map +2 -2
  37. package/dist-esm/lib/utils/dom.mjs +1 -1
  38. package/dist-esm/lib/utils/dom.mjs.map +2 -2
  39. package/dist-esm/lib/utils/reparenting.mjs +216 -0
  40. package/dist-esm/lib/utils/reparenting.mjs.map +7 -0
  41. package/dist-esm/version.mjs +3 -3
  42. package/dist-esm/version.mjs.map +1 -1
  43. package/editor.css +17 -11
  44. package/package.json +7 -7
  45. package/src/index.ts +5 -0
  46. package/src/lib/editor/Editor.ts +68 -34
  47. package/src/lib/editor/managers/HistoryManager/HistoryManager.ts +3 -1
  48. package/src/lib/editor/shapes/ShapeUtil.ts +46 -15
  49. package/src/lib/editor/tools/BaseBoxShapeTool/children/Pointing.ts +25 -17
  50. package/src/lib/primitives/geometry/Geometry2d.ts +7 -2
  51. package/src/lib/primitives/geometry/Group2d.ts +11 -5
  52. package/src/lib/utils/dom.ts +1 -1
  53. package/src/lib/utils/reparenting.ts +383 -0
  54. package/src/version.ts +3 -3
  55. package/CHANGELOG.md +0 -4327
@@ -4,12 +4,15 @@ import { LegacyMigrations, MigrationSequence } from '@tldraw/store'
4
4
  import {
5
5
  RecordProps,
6
6
  TLHandle,
7
+ TLParentId,
7
8
  TLPropsMigrations,
8
9
  TLShape,
9
10
  TLShapeCrop,
11
+ TLShapeId,
10
12
  TLShapePartial,
11
13
  TLUnknownShape,
12
14
  } from '@tldraw/tlschema'
15
+ import { IndexKey } from '@tldraw/utils'
13
16
  import { ReactElement } from 'react'
14
17
  import { Box, SelectionHandle } from '../../primitives/Box'
15
18
  import { Vec } from '../../primitives/Vec'
@@ -387,17 +390,6 @@ export abstract class ShapeUtil<Shape extends TLUnknownShape = TLUnknownShape> {
387
390
  return false
388
391
  }
389
392
 
390
- /**
391
- * Get whether the shape can receive children of a given type.
392
- *
393
- * @param shape - The shape type.
394
- * @param shapes - The shapes that are being dropped.
395
- * @public
396
- */
397
- canDropShapes(_shape: Shape, _shapes: TLShape[]) {
398
- return false
399
- }
400
-
401
393
  /**
402
394
  * Get the shape as an SVG object.
403
395
  *
@@ -517,7 +509,16 @@ export abstract class ShapeUtil<Shape extends TLUnknownShape = TLUnknownShape> {
517
509
  ): Omit<TLShapePartial<Shape>, 'id' | 'type'> | undefined | void
518
510
 
519
511
  /**
520
- * A callback called when some other shapes are dragged over this one.
512
+ * A callback called when some other shapes are dragged into this one. This fires when the shapes are dragged over the shape for the first time.
513
+ *
514
+ * @param shape - The shape.
515
+ * @param shapes - The shapes that are being dragged in.
516
+ * @public
517
+ */
518
+ onDragShapesIn?(shape: Shape, shapes: TLShape[], info: TLDragShapesInInfo): void
519
+
520
+ /**
521
+ * A callback called when some other shapes are dragged over this one. This fires when the shapes are dragged over the shape for the first time (after the onDragShapesIn callback), and again on every update while the shapes are being dragged.
521
522
  *
522
523
  * @example
523
524
  *
@@ -531,7 +532,7 @@ export abstract class ShapeUtil<Shape extends TLUnknownShape = TLUnknownShape> {
531
532
  * @param shapes - The shapes that are being dragged over this one.
532
533
  * @public
533
534
  */
534
- onDragShapesOver?(shape: Shape, shapes: TLShape[]): void
535
+ onDragShapesOver?(shape: Shape, shapes: TLShape[], info: TLDragShapesOverInfo): void
535
536
 
536
537
  /**
537
538
  * A callback called when some other shapes are dragged out of this one.
@@ -540,7 +541,7 @@ export abstract class ShapeUtil<Shape extends TLUnknownShape = TLUnknownShape> {
540
541
  * @param shapes - The shapes that are being dragged out.
541
542
  * @public
542
543
  */
543
- onDragShapesOut?(shape: Shape, shapes: TLShape[]): void
544
+ onDragShapesOut?(shape: Shape, shapes: TLShape[], info: TLDragShapesOutInfo): void
544
545
 
545
546
  /**
546
547
  * A callback called when some other shapes are dropped over this one.
@@ -549,7 +550,7 @@ export abstract class ShapeUtil<Shape extends TLUnknownShape = TLUnknownShape> {
549
550
  * @param shapes - The shapes that are being dropped over this one.
550
551
  * @public
551
552
  */
552
- onDropShapesOver?(shape: Shape, shapes: TLShape[]): void
553
+ onDropShapesOver?(shape: Shape, shapes: TLShape[], info: TLDropShapesOverInfo): void
553
554
 
554
555
  /**
555
556
  * A callback called when a shape starts being resized.
@@ -748,6 +749,36 @@ export interface TLCropInfo<T extends TLShape> {
748
749
  aspectRatioLocked?: boolean
749
750
  }
750
751
 
752
+ /** @public */
753
+ export interface TLDragShapesInInfo {
754
+ initialDraggingOverShapeId: TLShapeId | null
755
+ prevDraggingOverShapeId: TLShapeId | null
756
+ initialParentIds: Map<TLShapeId, TLParentId>
757
+ initialIndices: Map<TLShapeId, IndexKey>
758
+ }
759
+
760
+ /** @public */
761
+ export interface TLDragShapesOverInfo {
762
+ initialDraggingOverShapeId: TLShapeId | null
763
+ initialParentIds: Map<TLShapeId, TLParentId>
764
+ initialIndices: Map<TLShapeId, IndexKey>
765
+ }
766
+
767
+ /** @public */
768
+ export interface TLDragShapesOutInfo {
769
+ nextDraggingOverShapeId: TLShapeId | null
770
+ initialDraggingOverShapeId: TLShapeId | null
771
+ initialParentIds: Map<TLShapeId, TLParentId>
772
+ initialIndices: Map<TLShapeId, IndexKey>
773
+ }
774
+
775
+ /** @public */
776
+ export interface TLDropShapesOverInfo {
777
+ initialDraggingOverShapeId: TLShapeId | null
778
+ initialParentIds: Map<TLShapeId, TLParentId>
779
+ initialIndices: Map<TLShapeId, IndexKey>
780
+ }
781
+
751
782
  /**
752
783
  * The type of resize.
753
784
  *
@@ -11,29 +11,36 @@ export class Pointing extends StateNode {
11
11
  static override id = 'pointing'
12
12
 
13
13
  override onPointerMove(info: TLPointerEventInfo) {
14
- if (this.editor.inputs.isDragging) {
15
- const { originPagePoint } = this.editor.inputs
14
+ const { editor } = this
15
+ if (editor.inputs.isDragging) {
16
+ const { originPagePoint } = editor.inputs
16
17
 
17
18
  const shapeType = (this.parent as BaseBoxShapeTool)!.shapeType
18
19
 
19
20
  const id = createShapeId()
20
21
 
21
- const creatingMarkId = this.editor.markHistoryStoppingPoint(`creating_box:${id}`)
22
- const newPoint = maybeSnapToGrid(originPagePoint, this.editor)
23
- this.editor
24
- .createShapes<TLBaseBoxShape>([
25
- {
26
- id,
27
- type: shapeType,
28
- x: newPoint.x,
29
- y: newPoint.y,
30
- props: {
31
- w: 1,
32
- h: 1,
33
- },
22
+ const creatingMarkId = editor.markHistoryStoppingPoint(`creating_box:${id}`)
23
+ const newPoint = maybeSnapToGrid(originPagePoint, editor)
24
+
25
+ // Allow this to trigger the max shapes reached alert
26
+ this.editor.createShapes<TLBaseBoxShape>([
27
+ {
28
+ id,
29
+ type: shapeType,
30
+ x: newPoint.x,
31
+ y: newPoint.y,
32
+ props: {
33
+ w: 1,
34
+ h: 1,
34
35
  },
35
- ])
36
- .select(id)
36
+ },
37
+ ])
38
+ const shape = editor.getShape(id)
39
+ if (!shape) {
40
+ this.cancel()
41
+ return
42
+ }
43
+ editor.select(id)
37
44
 
38
45
  const parent = this.parent as BaseBoxShapeTool
39
46
  this.editor.setCurrentTool(
@@ -79,6 +86,7 @@ export class Pointing extends StateNode {
79
86
 
80
87
  this.editor.markHistoryStoppingPoint(`creating_box:${id}`)
81
88
 
89
+ // Allow this to trigger the max shapes reached alert
82
90
  // todo: add scale here when dynamic size is enabled (is this still needed?)
83
91
  this.editor.createShapes<TLBaseBoxShape>([
84
92
  {
@@ -44,6 +44,7 @@ export const Geometry2dFilters: {
44
44
  /** @public */
45
45
  export interface TransformedGeometry2dOptions {
46
46
  isLabel?: boolean
47
+ isEmptyLabel?: boolean
47
48
  isInternal?: boolean
48
49
  debugColor?: string
49
50
  ignore?: boolean
@@ -57,20 +58,24 @@ export interface Geometry2dOptions extends TransformedGeometry2dOptions {
57
58
 
58
59
  /** @public */
59
60
  export abstract class Geometry2d {
61
+ // todo: consider making accessors for these too, so that they can be overridden in subclasses by geometries with more complex logic
60
62
  isFilled = false
61
63
  isClosed = true
62
64
  isLabel = false
65
+ isEmptyLabel = false
63
66
  isInternal = false
64
67
  debugColor?: string
65
68
  ignore?: boolean
66
69
 
67
70
  constructor(opts: Geometry2dOptions) {
71
+ const { isLabel = false, isEmptyLabel = false, isInternal = false } = opts
68
72
  this.isFilled = opts.isFilled
69
73
  this.isClosed = opts.isClosed
70
- this.isLabel = opts.isLabel ?? false
71
- this.isInternal = opts.isInternal ?? false
72
74
  this.debugColor = opts.debugColor
73
75
  this.ignore = opts.ignore
76
+ this.isLabel = isLabel
77
+ this.isEmptyLabel = isEmptyLabel
78
+ this.isInternal = isInternal
74
79
  }
75
80
 
76
81
  isExcludedByFilter(filters?: Geometry2dFilters) {
@@ -17,14 +17,20 @@ export class Group2d extends Geometry2d {
17
17
  ) {
18
18
  super({ ...config, isClosed: true, isFilled: false })
19
19
 
20
- for (const child of config.children) {
21
- if (child.ignore) {
22
- this.ignoredChildren.push(child)
23
- } else {
24
- this.children.push(child)
20
+ const addChildren = (children: Geometry2d[]) => {
21
+ for (const child of children) {
22
+ if (child instanceof Group2d) {
23
+ addChildren(child.children)
24
+ } else if (child.ignore) {
25
+ this.ignoredChildren.push(child)
26
+ } else {
27
+ this.children.push(child)
28
+ }
25
29
  }
26
30
  }
27
31
 
32
+ addChildren(config.children)
33
+
28
34
  if (this.children.length === 0) throw Error('Group2d must have at least one child')
29
35
  }
30
36
 
@@ -18,7 +18,7 @@ import { debugFlags, pointerCaptureTrackingObject } from './debug-flags'
18
18
 
19
19
  /** @public */
20
20
  export function loopToHtmlElement(elm: Element): HTMLElement {
21
- if (elm instanceof HTMLElement) return elm
21
+ if (elm.nodeType === Node.ELEMENT_NODE) return elm as HTMLElement
22
22
  if (elm.parentElement) return loopToHtmlElement(elm.parentElement)
23
23
  else throw Error('Could not find a parent element of an HTML type!')
24
24
  }
@@ -0,0 +1,383 @@
1
+ import { EMPTY_ARRAY } from '@tldraw/state'
2
+ import { TLGroupShape, TLParentId, TLShape, TLShapeId } from '@tldraw/tlschema'
3
+ import { IndexKey, compact, getIndexAbove, getIndexBetween } from '@tldraw/utils'
4
+ import { Editor } from '../editor/Editor'
5
+ import { Vec } from '../primitives/Vec'
6
+ import { Geometry2d } from '../primitives/geometry/Geometry2d'
7
+ import { Group2d } from '../primitives/geometry/Group2d'
8
+ import {
9
+ intersectPolygonPolygon,
10
+ polygonIntersectsPolyline,
11
+ polygonsIntersect,
12
+ } from '../primitives/intersect'
13
+ import { pointInPolygon } from '../primitives/utils'
14
+
15
+ /**
16
+ * Reparents shapes that are no longer contained within their parent shapes.
17
+ * todo: rename me to something more descriptive, like `reparentOccludedShapes` or `reparentAutoDroppedShapes`
18
+ *
19
+ * @param editor - The editor instance.
20
+ * @param shapeIds - The IDs of the shapes to reparent.
21
+ * @param opts - Optional options, including a callback to filter out certain parents, such as when removing a frame.
22
+ *
23
+ * @public
24
+ */
25
+ export function kickoutOccludedShapes(
26
+ editor: Editor,
27
+ shapeIds: TLShapeId[],
28
+ opts?: { filter?(parent: TLShape): boolean }
29
+ ) {
30
+ const parentsToCheck = new Set<TLShape>()
31
+
32
+ for (const id of shapeIds) {
33
+ const shape = editor.getShape(id)
34
+
35
+ if (!shape) continue
36
+ parentsToCheck.add(shape)
37
+
38
+ const parent = editor.getShape(shape.parentId)
39
+ if (!parent) continue
40
+ parentsToCheck.add(parent)
41
+ }
42
+
43
+ // Check all of the parents and gather up parents who have lost children
44
+ const parentsToLostChildren = new Map<TLShape, TLShapeId[]>()
45
+
46
+ for (const parent of parentsToCheck) {
47
+ const childIds = editor.getSortedChildIdsForParent(parent)
48
+ if (opts?.filter && !opts.filter(parent)) {
49
+ // If the shape is filtered out, we kick out all of its children
50
+ parentsToLostChildren.set(parent, childIds)
51
+ } else {
52
+ const overlappingChildren = getOverlappingShapes(editor, parent.id, childIds)
53
+ if (overlappingChildren.length < childIds.length) {
54
+ parentsToLostChildren.set(
55
+ parent,
56
+ childIds.filter((id) => !overlappingChildren.includes(id))
57
+ )
58
+ }
59
+ }
60
+ }
61
+
62
+ // Get all of the shapes on the current page, sorted by their index
63
+ const sortedShapeIds = editor.getCurrentPageShapesSorted().map((s) => s.id)
64
+
65
+ const parentsToNewChildren: Record<
66
+ TLParentId,
67
+ { parentId: TLParentId; shapeIds: TLShapeId[]; index?: IndexKey }
68
+ > = {}
69
+
70
+ for (const [prevParent, lostChildrenIds] of parentsToLostChildren) {
71
+ const lostChildren = compact(lostChildrenIds.map((id) => editor.getShape(id)))
72
+
73
+ // Don't fall "up" into frames in front of the shape
74
+ // if (pageShapes.indexOf(shape) < frameSortPosition) continue shapeCheck
75
+
76
+ // Otherwise, we have no next dropping shape under the cursor, so go find
77
+ // all the frames on the page where the moving shapes will fall into
78
+ const { reparenting, remainingShapesToReparent } = getDroppedShapesToNewParents(
79
+ editor,
80
+ lostChildren,
81
+ (shape, maybeNewParent) => {
82
+ // If we're filtering out a potential parent, don't reparent shapes to the filtered out shape
83
+ if (opts?.filter && !opts.filter(maybeNewParent)) return false
84
+ return (
85
+ maybeNewParent.id !== prevParent.id &&
86
+ sortedShapeIds.indexOf(maybeNewParent.id) < sortedShapeIds.indexOf(shape.id)
87
+ )
88
+ }
89
+ )
90
+
91
+ reparenting.forEach((childrenToReparent, newParentId) => {
92
+ if (childrenToReparent.length === 0) return
93
+ if (!parentsToNewChildren[newParentId]) {
94
+ parentsToNewChildren[newParentId] = {
95
+ parentId: newParentId,
96
+ shapeIds: [],
97
+ }
98
+ }
99
+ parentsToNewChildren[newParentId].shapeIds.push(...childrenToReparent.map((s) => s.id))
100
+ })
101
+
102
+ // Reparent the rest to the page (or containing group)
103
+ if (remainingShapesToReparent.size > 0) {
104
+ // The remaining shapes are going to be reparented to the old parent's containing group, if there was one, or else to the page
105
+ const newParentId =
106
+ editor.findShapeAncestor(prevParent, (s) => editor.isShapeOfType<TLGroupShape>(s, 'group'))
107
+ ?.id ?? editor.getCurrentPageId()
108
+
109
+ remainingShapesToReparent.forEach((shape) => {
110
+ if (!parentsToNewChildren[newParentId]) {
111
+ let insertIndexKey: IndexKey | undefined
112
+
113
+ const oldParentSiblingIds = editor.getSortedChildIdsForParent(newParentId)
114
+ const oldParentIndex = oldParentSiblingIds.indexOf(prevParent.id)
115
+ if (oldParentIndex > -1) {
116
+ // If the old parent is a direct child of the new parent, then we'll add them above the old parent but below the next sibling.
117
+ const siblingsIndexAbove = oldParentSiblingIds[oldParentIndex + 1]
118
+ const indexKeyAbove = siblingsIndexAbove
119
+ ? editor.getShape(siblingsIndexAbove)!.index
120
+ : getIndexAbove(prevParent.index)
121
+ insertIndexKey = getIndexBetween(prevParent.index, indexKeyAbove)
122
+ } else {
123
+ // If the old parent is not a direct child of the new parent, then we'll add them to the "top" of the new parent's children.
124
+ // This is done automatically if we leave the index undefined, so let's do that.
125
+ }
126
+
127
+ parentsToNewChildren[newParentId] = {
128
+ parentId: newParentId,
129
+ shapeIds: [],
130
+ index: insertIndexKey,
131
+ }
132
+ }
133
+
134
+ parentsToNewChildren[newParentId].shapeIds.push(shape.id)
135
+ })
136
+ }
137
+ }
138
+
139
+ editor.run(() => {
140
+ Object.values(parentsToNewChildren).forEach(({ parentId, shapeIds, index }) => {
141
+ if (shapeIds.length === 0) return
142
+ // Before we reparent, sort the new shape ids by their place in the original absolute order on the page
143
+ shapeIds.sort((a, b) => (sortedShapeIds.indexOf(a) < sortedShapeIds.indexOf(b) ? -1 : 1))
144
+ editor.reparentShapes(shapeIds, parentId, index)
145
+ })
146
+ })
147
+ }
148
+
149
+ /**
150
+ * Get the shapes that overlap with a given shape.
151
+ *
152
+ * @param editor - The editor instance.
153
+ * @param shape - The shapes or shape IDs to check against.
154
+ * @param otherShapes - The shapes or shape IDs to check for overlap.
155
+ * @returns An array of shapes or shape IDs that overlap with the given shape.
156
+ */
157
+ function getOverlappingShapes<T extends TLShape[] | TLShapeId[]>(
158
+ editor: Editor,
159
+ shape: T[number],
160
+ otherShapes: T
161
+ ) {
162
+ if (otherShapes.length === 0) {
163
+ return EMPTY_ARRAY
164
+ }
165
+
166
+ const parentPageBounds = editor.getShapePageBounds(shape)
167
+ if (!parentPageBounds) return EMPTY_ARRAY
168
+
169
+ const parentGeometry = editor.getShapeGeometry(shape)
170
+ const parentPageTransform = editor.getShapePageTransform(shape)
171
+ const parentPageCorners = parentPageTransform.applyToPoints(parentGeometry.vertices)
172
+
173
+ const parentPageMaskVertices = editor.getShapeMask(shape)
174
+ const parentPagePolygon = parentPageMaskVertices
175
+ ? intersectPolygonPolygon(parentPageMaskVertices, parentPageCorners)
176
+ : parentPageCorners
177
+
178
+ if (!parentPagePolygon) return EMPTY_ARRAY
179
+
180
+ return otherShapes.filter((childId) => {
181
+ const shapePageBounds = editor.getShapePageBounds(childId)
182
+ if (!shapePageBounds || !parentPageBounds.includes(shapePageBounds)) return false
183
+
184
+ const parentPolygonInShapeShape = editor
185
+ .getShapePageTransform(childId)
186
+ .clone()
187
+ .invert()
188
+ .applyToPoints(parentPagePolygon)
189
+
190
+ const geometry = editor.getShapeGeometry(childId)
191
+
192
+ return doesGeometryOverlapPolygon(geometry, parentPolygonInShapeShape)
193
+ })
194
+ }
195
+
196
+ /**
197
+ * @public
198
+ */
199
+ export function doesGeometryOverlapPolygon(
200
+ geometry: Geometry2d,
201
+ parentCornersInShapeSpace: Vec[]
202
+ ): boolean {
203
+ // If the child is a group, check if any of its children overlap the box
204
+ if (geometry instanceof Group2d) {
205
+ return geometry.children.some((childGeometry) =>
206
+ doesGeometryOverlapPolygon(childGeometry, parentCornersInShapeSpace)
207
+ )
208
+ }
209
+
210
+ // Otherwise, check if the geometry overlaps the box
211
+ const { vertices, center, isFilled, isEmptyLabel, isClosed } = geometry
212
+
213
+ // We'll do things in order of cheapest to most expensive checks
214
+
215
+ // Skip empty labels
216
+ if (isEmptyLabel) return false
217
+
218
+ // If any of the shape's vertices are inside the occluder, it's inside
219
+ if (vertices.some((v) => pointInPolygon(v, parentCornersInShapeSpace))) {
220
+ return true
221
+ }
222
+
223
+ // If the shape is filled and closed and its center is inside the parent, it's inside
224
+ if (isClosed) {
225
+ if (isFilled) {
226
+ // If closed and filled, check if the center is inside the parent
227
+ if (pointInPolygon(center, parentCornersInShapeSpace)) {
228
+ return true
229
+ }
230
+
231
+ // ..then, slightly more expensive check, see the shape covers the entire parent but not its center
232
+ if (parentCornersInShapeSpace.every((v) => pointInPolygon(v, vertices))) {
233
+ return true
234
+ }
235
+ }
236
+
237
+ // If any the shape's vertices intersect the edge of the occluder, it's inside.
238
+ // for example when a rotated rectangle is moved over the corner of a parent rectangle
239
+ // If the child shape is closed, intersect as a polygon
240
+ if (polygonsIntersect(parentCornersInShapeSpace, vertices)) {
241
+ return true
242
+ }
243
+ } else {
244
+ // if the child shape is not closed, intersect as a polyline
245
+ if (polygonIntersectsPolyline(parentCornersInShapeSpace, vertices)) {
246
+ return true
247
+ }
248
+ }
249
+
250
+ // If none of the above checks passed, the shape is outside the parent
251
+ return false
252
+ }
253
+
254
+ /**
255
+ * Get the shapes that will be reparented to new parents when the shapes are dropped.
256
+ *
257
+ * @param editor - The editor instance.
258
+ * @param shapes - The shapes to check.
259
+ * @param cb - A callback to filter out certain shapes.
260
+ * @returns An object with the shapes that will be reparented to new parents and the shapes that will be reparented to the page or their ancestral group.
261
+ *
262
+ * @public
263
+ */
264
+ export function getDroppedShapesToNewParents(
265
+ editor: Editor,
266
+ shapes: Set<TLShape> | TLShape[],
267
+ cb?: (shape: TLShape, parent: TLShape) => boolean
268
+ ) {
269
+ const shapesToActuallyCheck = new Set<TLShape>(shapes)
270
+ const movingGroups = new Set<TLGroupShape>()
271
+
272
+ for (const shape of shapes) {
273
+ const parent = editor.getShapeParent(shape)
274
+ if (parent && editor.isShapeOfType<TLGroupShape>(parent, 'group')) {
275
+ if (!movingGroups.has(parent)) {
276
+ movingGroups.add(parent)
277
+ }
278
+ }
279
+ }
280
+
281
+ // If all of a group's children are moving, then move the group instead
282
+ for (const movingGroup of movingGroups) {
283
+ const children = compact(
284
+ editor.getSortedChildIdsForParent(movingGroup).map((id) => editor.getShape(id))
285
+ )
286
+ for (const child of children) {
287
+ shapesToActuallyCheck.delete(child)
288
+ }
289
+ shapesToActuallyCheck.add(movingGroup)
290
+ }
291
+
292
+ // this could be cached and passed in
293
+ const shapeGroupIds = new Map<TLShapeId, TLShapeId | undefined>()
294
+
295
+ const reparenting = new Map<TLShapeId, TLShape[]>()
296
+
297
+ const remainingShapesToReparent = new Set(shapesToActuallyCheck)
298
+
299
+ const potentialParentShapes = editor
300
+ .getCurrentPageShapesSorted()
301
+ // filter out any shapes that aren't frames or that are included among the provided shapes
302
+ .filter(
303
+ (s) =>
304
+ editor.getShapeUtil(s).canReceiveNewChildrenOfType?.(s, s.type) &&
305
+ !remainingShapesToReparent.has(s)
306
+ )
307
+
308
+ parentCheck: for (let i = potentialParentShapes.length - 1; i >= 0; i--) {
309
+ const parentShape = potentialParentShapes[i]
310
+ const parentShapeContainingGroupId = editor.findShapeAncestor(parentShape, (s) =>
311
+ editor.isShapeOfType<TLGroupShape>(s, 'group')
312
+ )?.id
313
+
314
+ const parentGeometry = editor.getShapeGeometry(parentShape)
315
+ const parentPageTransform = editor.getShapePageTransform(parentShape)
316
+ const parentPageMaskVertices = editor.getShapeMask(parentShape)
317
+ const parentPageCorners = parentPageTransform.applyToPoints(parentGeometry.vertices)
318
+ const parentPagePolygon = parentPageMaskVertices
319
+ ? intersectPolygonPolygon(parentPageMaskVertices, parentPageCorners)
320
+ : parentPageCorners
321
+
322
+ if (!parentPagePolygon) continue parentCheck
323
+
324
+ const childrenToReparent = []
325
+
326
+ // For each of the dropping shapes...
327
+ shapeCheck: for (const shape of remainingShapesToReparent) {
328
+ // Don't reparent a frame to itself
329
+ if (parentShape.id === shape.id) continue shapeCheck
330
+
331
+ // Use the callback to filter out certain shapes
332
+ if (cb && !cb(shape, parentShape)) continue shapeCheck
333
+
334
+ if (!shapeGroupIds.has(shape.id)) {
335
+ shapeGroupIds.set(
336
+ shape.id,
337
+ editor.findShapeAncestor(shape, (s) => editor.isShapeOfType<TLGroupShape>(s, 'group'))?.id
338
+ )
339
+ }
340
+
341
+ const shapeGroupId = shapeGroupIds.get(shape.id)
342
+
343
+ // Are the shape and the parent part of different groups?
344
+ if (shapeGroupId !== parentShapeContainingGroupId) continue shapeCheck
345
+
346
+ // Is the shape is actually the ancestor of the parent?
347
+ if (editor.findShapeAncestor(parentShape, (s) => shape.id === s.id)) continue shapeCheck
348
+
349
+ // Convert the parent polygon to the shape's space
350
+ const parentPolygonInShapeSpace = editor
351
+ .getShapePageTransform(shape)
352
+ .clone()
353
+ .invert()
354
+ .applyToPoints(parentPagePolygon)
355
+
356
+ // If the shape overlaps the parent polygon, reparent it to that parent
357
+ if (doesGeometryOverlapPolygon(editor.getShapeGeometry(shape), parentPolygonInShapeSpace)) {
358
+ // Use the util to check if the shape can be reparented to the parent
359
+ if (
360
+ !editor.getShapeUtil(parentShape).canReceiveNewChildrenOfType?.(parentShape, shape.type)
361
+ )
362
+ continue shapeCheck
363
+
364
+ if (shape.parentId !== parentShape.id) {
365
+ childrenToReparent.push(shape)
366
+ }
367
+ remainingShapesToReparent.delete(shape)
368
+ continue shapeCheck
369
+ }
370
+ }
371
+
372
+ if (childrenToReparent.length) {
373
+ reparenting.set(parentShape.id, childrenToReparent)
374
+ }
375
+ }
376
+
377
+ return {
378
+ // these are the shapes that will be reparented to new parents
379
+ reparenting,
380
+ // these are the shapes that will be reparented to the page or their ancestral group
381
+ remainingShapesToReparent,
382
+ }
383
+ }
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.14.0-internal.601adf6e424b'
4
+ export const version = '3.14.0'
5
5
  export const publishDates = {
6
6
  major: '2024-09-13T14:36:29.063Z',
7
- minor: '2025-06-24T10:39:38.373Z',
8
- patch: '2025-06-24T10:39:38.373Z',
7
+ minor: '2025-07-03T08:34:52.269Z',
8
+ patch: '2025-07-03T08:34:52.269Z',
9
9
  }