@excalidraw/element 0.18.0-6d75c4b34 → 0.18.0-8fc71066d

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 (46) hide show
  1. package/dist/dev/index.js +233 -132
  2. package/dist/dev/index.js.map +2 -2
  3. package/dist/prod/index.js +9 -9
  4. package/dist/types/common/src/constants.d.ts +1 -0
  5. package/dist/types/element/src/Scene.d.ts +6 -2
  6. package/dist/types/element/src/align.d.ts +2 -1
  7. package/dist/types/element/src/delta.d.ts +17 -4
  8. package/dist/types/element/src/distribute.d.ts +2 -1
  9. package/dist/types/element/src/groups.d.ts +1 -0
  10. package/dist/types/element/src/linearElementEditor.d.ts +2 -1
  11. package/dist/types/element/src/store.d.ts +1 -1
  12. package/dist/types/excalidraw/actions/actionAddToLibrary.d.ts +0 -3
  13. package/dist/types/excalidraw/actions/actionBoundText.d.ts +0 -2
  14. package/dist/types/excalidraw/actions/actionCanvas.d.ts +0 -13
  15. package/dist/types/excalidraw/actions/actionClipboard.d.ts +3 -8
  16. package/dist/types/excalidraw/actions/actionCropEditor.d.ts +0 -1
  17. package/dist/types/excalidraw/actions/actionDeleteSelected.d.ts +3 -6
  18. package/dist/types/excalidraw/actions/actionElementLink.d.ts +0 -1
  19. package/dist/types/excalidraw/actions/actionElementLock.d.ts +0 -2
  20. package/dist/types/excalidraw/actions/actionEmbeddable.d.ts +0 -1
  21. package/dist/types/excalidraw/actions/actionExport.d.ts +0 -9
  22. package/dist/types/excalidraw/actions/actionFinalize.d.ts +2 -3
  23. package/dist/types/excalidraw/actions/actionFrame.d.ts +0 -4
  24. package/dist/types/excalidraw/actions/actionGroup.d.ts +0 -2
  25. package/dist/types/excalidraw/actions/actionLinearEditor.d.ts +33 -3
  26. package/dist/types/excalidraw/actions/actionLink.d.ts +0 -1
  27. package/dist/types/excalidraw/actions/actionMenu.d.ts +0 -3
  28. package/dist/types/excalidraw/actions/actionNavigate.d.ts +0 -2
  29. package/dist/types/excalidraw/actions/actionProperties.d.ts +0 -15
  30. package/dist/types/excalidraw/actions/actionSelectAll.d.ts +0 -1
  31. package/dist/types/excalidraw/actions/actionStyles.d.ts +0 -1
  32. package/dist/types/excalidraw/actions/actionToggleGridMode.d.ts +0 -1
  33. package/dist/types/excalidraw/actions/actionToggleObjectsSnapMode.d.ts +0 -1
  34. package/dist/types/excalidraw/actions/actionToggleSearchMenu.d.ts +0 -1
  35. package/dist/types/excalidraw/actions/actionToggleStats.d.ts +0 -1
  36. package/dist/types/excalidraw/actions/actionToggleViewMode.d.ts +0 -1
  37. package/dist/types/excalidraw/actions/actionToggleZenMode.d.ts +0 -1
  38. package/dist/types/excalidraw/components/Actions.d.ts +0 -4
  39. package/dist/types/excalidraw/components/App.d.ts +5 -4
  40. package/dist/types/excalidraw/components/Ellipsify.d.ts +4 -0
  41. package/dist/types/excalidraw/data/reconcile.d.ts +1 -0
  42. package/dist/types/excalidraw/data/restore.d.ts +6 -1
  43. package/dist/types/excalidraw/index.d.ts +2 -1
  44. package/dist/types/excalidraw/renderer/staticScene.d.ts +4 -1
  45. package/dist/types/excalidraw/types.d.ts +7 -5
  46. package/package.json +3 -3
package/dist/dev/index.js CHANGED
@@ -3825,9 +3825,6 @@ var getTextWidth = (text, font) => {
3825
3825
  return width;
3826
3826
  };
3827
3827
  var getTextHeight = (text, fontSize, lineHeight) => {
3828
- if (text.trim() === "") {
3829
- return 0;
3830
- }
3831
3828
  const lineCount = splitIntoLines(text).length;
3832
3829
  return getLineHeightInPx(fontSize, lineHeight) * lineCount;
3833
3830
  };
@@ -8130,7 +8127,8 @@ var LinearElementEditor = class _LinearElementEditor {
8130
8127
  segmentMidPointHoveredCoords;
8131
8128
  elbowed;
8132
8129
  customLineAngle;
8133
- constructor(element, elementsMap) {
8130
+ isEditing;
8131
+ constructor(element, elementsMap, isEditing = false) {
8134
8132
  this.elementId = element.id;
8135
8133
  if (!pointsEqual6(element.points[0], pointFrom8(0, 0))) {
8136
8134
  console.error("Linear element is not normalized", Error().stack);
@@ -8161,6 +8159,7 @@ var LinearElementEditor = class _LinearElementEditor {
8161
8159
  this.segmentMidPointHoveredCoords = null;
8162
8160
  this.elbowed = isElbowArrow(element) && element.elbowed;
8163
8161
  this.customLineAngle = null;
8162
+ this.isEditing = isEditing;
8164
8163
  }
8165
8164
  // ---------------------------------------------------------------------------
8166
8165
  // static methods
@@ -8178,11 +8177,11 @@ var LinearElementEditor = class _LinearElementEditor {
8178
8177
  return null;
8179
8178
  }
8180
8179
  static handleBoxSelection(event, appState, setState, elementsMap) {
8181
- if (!appState.editingLinearElement || !appState.selectionElement) {
8180
+ if (!appState.selectedLinearElement?.isEditing || !appState.selectionElement) {
8182
8181
  return false;
8183
8182
  }
8184
- const { editingLinearElement } = appState;
8185
- const { selectedPointsIndices, elementId } = editingLinearElement;
8183
+ const { selectedLinearElement } = appState;
8184
+ const { selectedPointsIndices, elementId } = selectedLinearElement;
8186
8185
  const element = _LinearElementEditor.getElement(elementId, elementsMap);
8187
8186
  if (!element) {
8188
8187
  return false;
@@ -8204,8 +8203,8 @@ var LinearElementEditor = class _LinearElementEditor {
8204
8203
  return true;
8205
8204
  });
8206
8205
  setState({
8207
- editingLinearElement: {
8208
- ...editingLinearElement,
8206
+ selectedLinearElement: {
8207
+ ...selectedLinearElement,
8209
8208
  selectedPointsIndices: nextSelectedPoints.length ? nextSelectedPoints : null
8210
8209
  }
8211
8210
  });
@@ -8359,7 +8358,6 @@ var LinearElementEditor = class _LinearElementEditor {
8359
8358
  };
8360
8359
  return {
8361
8360
  ...app.state,
8362
- editingLinearElement: app.state.editingLinearElement ? newLinearElementEditor : null,
8363
8361
  selectedLinearElement: newLinearElementEditor,
8364
8362
  suggestedBindings
8365
8363
  };
@@ -8443,7 +8441,7 @@ var LinearElementEditor = class _LinearElementEditor {
8443
8441
  }
8444
8442
  static getEditorMidPoints = (element, elementsMap, appState) => {
8445
8443
  const boundText = getBoundTextElement(element, elementsMap);
8446
- if (!isElbowArrow(element) && !appState.editingLinearElement && element.points.length > 2 && !boundText) {
8444
+ if (!isElbowArrow(element) && !appState.selectedLinearElement?.isEditing && element.points.length > 2 && !boundText) {
8447
8445
  return [];
8448
8446
  }
8449
8447
  const points = _LinearElementEditor.getPointsGlobalCoordinates(
@@ -8493,7 +8491,7 @@ var LinearElementEditor = class _LinearElementEditor {
8493
8491
  element,
8494
8492
  elementsMap
8495
8493
  );
8496
- if (points.length >= 3 && !appState.editingLinearElement && !isElbowArrow(element)) {
8494
+ if (points.length >= 3 && !appState.selectedLinearElement?.isEditing && !isElbowArrow(element)) {
8497
8495
  return null;
8498
8496
  }
8499
8497
  const threshold = (_LinearElementEditor.POINT_HANDLE_SIZE + 1) / appState.zoom.value;
@@ -8633,7 +8631,7 @@ var LinearElementEditor = class _LinearElementEditor {
8633
8631
  segmentMidpoint,
8634
8632
  elementsMap
8635
8633
  );
8636
- } else if (event.altKey && appState.editingLinearElement) {
8634
+ } else if (event.altKey && appState.selectedLinearElement?.isEditing) {
8637
8635
  if (linearElementEditor.lastUncommittedPoint == null) {
8638
8636
  scene.mutateElement(element, {
8639
8637
  points: [
@@ -8743,14 +8741,14 @@ var LinearElementEditor = class _LinearElementEditor {
8743
8741
  }
8744
8742
  static handlePointerMove(event, scenePointerX, scenePointerY, app) {
8745
8743
  const appState = app.state;
8746
- if (!appState.editingLinearElement) {
8744
+ if (!appState.selectedLinearElement?.isEditing) {
8747
8745
  return null;
8748
8746
  }
8749
- const { elementId, lastUncommittedPoint } = appState.editingLinearElement;
8747
+ const { elementId, lastUncommittedPoint } = appState.selectedLinearElement;
8750
8748
  const elementsMap = app.scene.getNonDeletedElementsMap();
8751
8749
  const element = _LinearElementEditor.getElement(elementId, elementsMap);
8752
8750
  if (!element) {
8753
- return appState.editingLinearElement;
8751
+ return appState.selectedLinearElement;
8754
8752
  }
8755
8753
  const { points } = element;
8756
8754
  const lastPoint = points[points.length - 1];
@@ -8758,10 +8756,10 @@ var LinearElementEditor = class _LinearElementEditor {
8758
8756
  if (lastPoint === lastUncommittedPoint) {
8759
8757
  _LinearElementEditor.deletePoints(element, app, [points.length - 1]);
8760
8758
  }
8761
- return {
8762
- ...appState.editingLinearElement,
8759
+ return appState.selectedLinearElement?.lastUncommittedPoint ? {
8760
+ ...appState.selectedLinearElement,
8763
8761
  lastUncommittedPoint: null
8764
- };
8762
+ } : appState.selectedLinearElement;
8765
8763
  }
8766
8764
  let newPoint;
8767
8765
  if (shouldRotateWithDiscreteAngle(event) && points.length >= 2) {
@@ -8781,8 +8779,8 @@ var LinearElementEditor = class _LinearElementEditor {
8781
8779
  newPoint = _LinearElementEditor.createPointAt(
8782
8780
  element,
8783
8781
  elementsMap,
8784
- scenePointerX - appState.editingLinearElement.pointerOffset.x,
8785
- scenePointerY - appState.editingLinearElement.pointerOffset.y,
8782
+ scenePointerX - appState.selectedLinearElement.pointerOffset.x,
8783
+ scenePointerY - appState.selectedLinearElement.pointerOffset.y,
8786
8784
  event[KEYS2.CTRL_OR_CMD] || isElbowArrow(element) ? null : app.getEffectiveGridSize()
8787
8785
  );
8788
8786
  }
@@ -8803,7 +8801,7 @@ var LinearElementEditor = class _LinearElementEditor {
8803
8801
  _LinearElementEditor.addPoints(element, app.scene, [newPoint]);
8804
8802
  }
8805
8803
  return {
8806
- ...appState.editingLinearElement,
8804
+ ...appState.selectedLinearElement,
8807
8805
  lastUncommittedPoint: element.points[element.points.length - 1]
8808
8806
  };
8809
8807
  }
@@ -8909,11 +8907,11 @@ var LinearElementEditor = class _LinearElementEditor {
8909
8907
  // ---------------------------------------------------------------------------
8910
8908
  static duplicateSelectedPoints(appState, scene) {
8911
8909
  invariant6(
8912
- appState.editingLinearElement,
8910
+ appState.selectedLinearElement?.isEditing,
8913
8911
  "Not currently editing a linear element"
8914
8912
  );
8915
8913
  const elementsMap = scene.getNonDeletedElementsMap();
8916
- const { selectedPointsIndices, elementId } = appState.editingLinearElement;
8914
+ const { selectedPointsIndices, elementId } = appState.selectedLinearElement;
8917
8915
  const element = _LinearElementEditor.getElement(elementId, elementsMap);
8918
8916
  invariant6(
8919
8917
  element,
@@ -8960,14 +8958,14 @@ var LinearElementEditor = class _LinearElementEditor {
8960
8958
  }
8961
8959
  return {
8962
8960
  ...appState,
8963
- editingLinearElement: {
8964
- ...appState.editingLinearElement,
8961
+ selectedLinearElement: {
8962
+ ...appState.selectedLinearElement,
8965
8963
  selectedPointsIndices: nextSelectedIndices
8966
8964
  }
8967
8965
  };
8968
8966
  }
8969
8967
  static deletePoints(element, app, pointIndices) {
8970
- const isUncommittedPoint = app.state.editingLinearElement?.lastUncommittedPoint === element.points[element.points.length - 1];
8968
+ const isUncommittedPoint = app.state.selectedLinearElement?.isEditing && app.state.selectedLinearElement?.lastUncommittedPoint === element.points[element.points.length - 1];
8971
8969
  const nextPoints = element.points.filter((_, idx) => {
8972
8970
  return !pointIndices.includes(idx);
8973
8971
  });
@@ -9076,7 +9074,7 @@ var LinearElementEditor = class _LinearElementEditor {
9076
9074
  pointFrom8(origin.x, origin.y),
9077
9075
  pointFrom8(pointerCoords.x, pointerCoords.y)
9078
9076
  );
9079
- if (!appState.editingLinearElement && dist < DRAGGING_THRESHOLD / appState.zoom.value) {
9077
+ if (!appState.selectedLinearElement?.isEditing && dist < DRAGGING_THRESHOLD / appState.zoom.value) {
9080
9078
  return false;
9081
9079
  }
9082
9080
  return true;
@@ -9829,6 +9827,55 @@ var getNewGroupIdsForDuplication = (groupIds, editingGroupId, mapper) => {
9829
9827
  }
9830
9828
  return copy;
9831
9829
  };
9830
+ var getSelectedElementsByGroup = (selectedElements, elementsMap, appState) => {
9831
+ const selectedGroupIds = getSelectedGroupIds(appState);
9832
+ const unboundElements = selectedElements.filter(
9833
+ (element) => !isBoundToContainer(element)
9834
+ );
9835
+ const groups = /* @__PURE__ */ new Map();
9836
+ const elements = /* @__PURE__ */ new Map();
9837
+ const addToElementsMap = (element) => {
9838
+ const currentElementMembers = elements.get(element.id) || [];
9839
+ const boundTextElement = getBoundTextElement(element, elementsMap);
9840
+ if (boundTextElement) {
9841
+ currentElementMembers.push(boundTextElement);
9842
+ }
9843
+ elements.set(element.id, [...currentElementMembers, element]);
9844
+ };
9845
+ const addToGroupsMap = (element, groupId) => {
9846
+ const currentGroupMembers = groups.get(groupId) || [];
9847
+ const boundTextElement = getBoundTextElement(element, elementsMap);
9848
+ if (boundTextElement) {
9849
+ currentGroupMembers.push(boundTextElement);
9850
+ }
9851
+ groups.set(groupId, [...currentGroupMembers, element]);
9852
+ };
9853
+ const handleSingleSelectedGroupCase = (element, selectedGroupId) => {
9854
+ const indexOfSelectedGroupId = element.groupIds.indexOf(selectedGroupId, 0);
9855
+ const nestedGroupCount = element.groupIds.slice(
9856
+ 0,
9857
+ indexOfSelectedGroupId
9858
+ ).length;
9859
+ return nestedGroupCount > 0 ? addToGroupsMap(element, element.groupIds[indexOfSelectedGroupId - 1]) : addToElementsMap(element);
9860
+ };
9861
+ const isAllInSameGroup = selectedElements.every(
9862
+ (element) => isSelectedViaGroup(appState, element)
9863
+ );
9864
+ unboundElements.forEach((element) => {
9865
+ const selectedGroupId = getSelectedGroupIdForElement(
9866
+ element,
9867
+ appState.selectedGroupIds
9868
+ );
9869
+ if (!selectedGroupId) {
9870
+ addToElementsMap(element);
9871
+ } else if (selectedGroupIds.length === 1 && isAllInSameGroup) {
9872
+ handleSingleSelectedGroupCase(element, selectedGroupId);
9873
+ } else {
9874
+ addToGroupsMap(element, selectedGroupId);
9875
+ }
9876
+ });
9877
+ return Array.from(groups.values()).concat(Array.from(elements.values()));
9878
+ };
9832
9879
 
9833
9880
  // src/selection.ts
9834
9881
  var excludeElementsInFramesFromSelection = (selectedElements) => {
@@ -10516,6 +10563,11 @@ var getCanvasPadding = (element) => {
10516
10563
  return element.strokeWidth * 12;
10517
10564
  case "text":
10518
10565
  return element.fontSize / 2;
10566
+ case "arrow":
10567
+ if (element.endArrowhead || element.endArrowhead) {
10568
+ return 40;
10569
+ }
10570
+ return 20;
10519
10571
  default:
10520
10572
  return 20;
10521
10573
  }
@@ -12745,11 +12797,11 @@ var getNormalizedDimensions = (element) => {
12745
12797
 
12746
12798
  // src/align.ts
12747
12799
  init_define_import_meta_env();
12748
- var alignElements = (selectedElements, alignment, scene) => {
12749
- const elementsMap = scene.getNonDeletedElementsMap();
12750
- const groups = getMaximumGroups(
12800
+ var alignElements = (selectedElements, alignment, scene, appState) => {
12801
+ const groups = getSelectedElementsByGroup(
12751
12802
  selectedElements,
12752
- elementsMap
12803
+ scene.getNonDeletedElementsMap(),
12804
+ appState
12753
12805
  );
12754
12806
  const selectionBoundingBox = getCommonBoundingBox(selectedElements);
12755
12807
  return groups.flatMap((group) => {
@@ -13185,8 +13237,9 @@ var Store = class {
13185
13237
  constructor(app) {
13186
13238
  this.app = app;
13187
13239
  }
13188
- // internally used by history
13240
+ // for internal use by history
13189
13241
  onDurableIncrementEmitter = new Emitter();
13242
+ // for public use as part of onIncrement API
13190
13243
  onStoreIncrementEmitter = new Emitter();
13191
13244
  scheduledMacroActions = /* @__PURE__ */ new Set();
13192
13245
  scheduledMicroActions = [];
@@ -13480,10 +13533,12 @@ var StoreDelta = class {
13480
13533
  */
13481
13534
  static load({
13482
13535
  id,
13483
- elements: { added, removed, updated }
13536
+ elements: { added, removed, updated },
13537
+ appState: { delta: appStateDelta }
13484
13538
  }) {
13485
13539
  const elements = ElementsDelta.create(added, removed, updated);
13486
- return new this(id, elements, AppStateDelta.empty());
13540
+ const appState = AppStateDelta.create(appStateDelta);
13541
+ return new this(id, elements, appState);
13487
13542
  }
13488
13543
  /**
13489
13544
  * Inverse store delta, creates new instance of `StoreDelta`.
@@ -13494,9 +13549,7 @@ var StoreDelta = class {
13494
13549
  /**
13495
13550
  * Apply the delta to the passed elements and appState, does not modify the snapshot.
13496
13551
  */
13497
- static applyTo(delta, elements, appState, options = {
13498
- excludedProperties: /* @__PURE__ */ new Set()
13499
- }) {
13552
+ static applyTo(delta, elements, appState, options) {
13500
13553
  const [nextElements, elementsContainVisibleChange] = delta.elements.applyTo(
13501
13554
  elements,
13502
13555
  StoreSnapshot.empty().elements,
@@ -13762,8 +13815,7 @@ var getDefaultObservedAppState = () => {
13762
13815
  viewBackgroundColor: COLOR_PALETTE2.white,
13763
13816
  selectedElementIds: {},
13764
13817
  selectedGroupIds: {},
13765
- editingLinearElementId: null,
13766
- selectedLinearElementId: null,
13818
+ selectedLinearElement: null,
13767
13819
  croppingElementId: null,
13768
13820
  activeLockedId: null,
13769
13821
  lockedMultiSelections: {}
@@ -13779,10 +13831,10 @@ var getObservedAppState = (appState) => {
13779
13831
  croppingElementId: appState.croppingElementId,
13780
13832
  activeLockedId: appState.activeLockedId,
13781
13833
  lockedMultiSelections: appState.lockedMultiSelections,
13782
- editingLinearElementId: appState.editingLinearElement?.elementId ?? // prefer app state, as it's likely newer
13783
- appState.editingLinearElementId ?? // fallback to observed app state, as it's likely older coming from a previous snapshot
13784
- null,
13785
- selectedLinearElementId: appState.selectedLinearElement?.elementId ?? appState.selectedLinearElementId ?? null
13834
+ selectedLinearElement: appState.selectedLinearElement ? {
13835
+ elementId: appState.selectedLinearElement.elementId,
13836
+ isEditing: !!appState.selectedLinearElement.isEditing
13837
+ } : null
13786
13838
  };
13787
13839
  Reflect.defineProperty(observedAppState, hiddenObservedAppStateProp, {
13788
13840
  value: true,
@@ -14346,9 +14398,9 @@ var Scene = class {
14346
14398
  getFramesIncludingDeleted() {
14347
14399
  return this.frames;
14348
14400
  }
14349
- constructor(elements = null) {
14401
+ constructor(elements = null, options) {
14350
14402
  if (elements) {
14351
- this.replaceAllElements(elements);
14403
+ this.replaceAllElements(elements, options);
14352
14404
  }
14353
14405
  }
14354
14406
  getSelectedElements(opts) {
@@ -14413,10 +14465,12 @@ var Scene = class {
14413
14465
  }
14414
14466
  return didChange;
14415
14467
  }
14416
- replaceAllElements(nextElements) {
14468
+ replaceAllElements(nextElements, options) {
14417
14469
  const _nextElements = toArray(nextElements);
14418
14470
  const nextFrameLikes = [];
14419
- validateIndicesThrottled(_nextElements);
14471
+ if (!options?.skipValidation) {
14472
+ validateIndicesThrottled(_nextElements);
14473
+ }
14420
14474
  this.elements = syncInvalidIndices2(_nextElements);
14421
14475
  this.elementsMap.clear();
14422
14476
  this.elements.forEach((element) => {
@@ -14586,6 +14640,15 @@ var Delta = class _Delta {
14586
14640
  static isEmpty(delta) {
14587
14641
  return !Object.keys(delta.deleted).length && !Object.keys(delta.inserted).length;
14588
14642
  }
14643
+ /**
14644
+ * Merges two deltas into a new one.
14645
+ */
14646
+ static merge(delta1, delta2) {
14647
+ return _Delta.create(
14648
+ { ...delta1.deleted, ...delta2.deleted },
14649
+ { ...delta1.inserted, ...delta2.inserted }
14650
+ );
14651
+ }
14589
14652
  /**
14590
14653
  * Merges deleted and inserted object partials.
14591
14654
  */
@@ -14810,6 +14873,9 @@ var AppStateDelta = class _AppStateDelta {
14810
14873
  constructor(delta) {
14811
14874
  this.delta = delta;
14812
14875
  }
14876
+ static create(delta) {
14877
+ return new _AppStateDelta(delta);
14878
+ }
14813
14879
  static calculate(prevAppState, nextAppState) {
14814
14880
  const delta = Delta.calculate(
14815
14881
  prevAppState,
@@ -14831,50 +14897,45 @@ var AppStateDelta = class _AppStateDelta {
14831
14897
  const inversedDelta = Delta.create(this.delta.inserted, this.delta.deleted);
14832
14898
  return new _AppStateDelta(inversedDelta);
14833
14899
  }
14900
+ squash(delta) {
14901
+ this.delta = Delta.merge(this.delta, delta.delta);
14902
+ return this;
14903
+ }
14834
14904
  applyTo(appState, nextElements) {
14835
14905
  try {
14836
14906
  const {
14837
- selectedElementIds: removedSelectedElementIds = {},
14838
- selectedGroupIds: removedSelectedGroupIds = {}
14907
+ selectedElementIds: deletedSelectedElementIds = {},
14908
+ selectedGroupIds: deletedSelectedGroupIds = {}
14839
14909
  } = this.delta.deleted;
14840
14910
  const {
14841
- selectedElementIds: addedSelectedElementIds = {},
14842
- selectedGroupIds: addedSelectedGroupIds = {},
14843
- selectedLinearElementId,
14844
- editingLinearElementId,
14911
+ selectedElementIds: insertedSelectedElementIds = {},
14912
+ selectedGroupIds: insertedSelectedGroupIds = {},
14913
+ selectedLinearElement: insertedSelectedLinearElement,
14845
14914
  ...directlyApplicablePartial
14846
14915
  } = this.delta.inserted;
14847
14916
  const mergedSelectedElementIds = Delta.mergeObjects(
14848
14917
  appState.selectedElementIds,
14849
- addedSelectedElementIds,
14850
- removedSelectedElementIds
14918
+ insertedSelectedElementIds,
14919
+ deletedSelectedElementIds
14851
14920
  );
14852
14921
  const mergedSelectedGroupIds = Delta.mergeObjects(
14853
14922
  appState.selectedGroupIds,
14854
- addedSelectedGroupIds,
14855
- removedSelectedGroupIds
14923
+ insertedSelectedGroupIds,
14924
+ deletedSelectedGroupIds
14856
14925
  );
14857
- const selectedLinearElement = selectedLinearElementId && nextElements.has(selectedLinearElementId) ? new LinearElementEditor(
14858
- nextElements.get(
14859
- selectedLinearElementId
14860
- ),
14861
- nextElements
14862
- ) : null;
14863
- const editingLinearElement = editingLinearElementId && nextElements.has(editingLinearElementId) ? new LinearElementEditor(
14926
+ const selectedLinearElement = insertedSelectedLinearElement && nextElements.has(insertedSelectedLinearElement.elementId) ? new LinearElementEditor(
14864
14927
  nextElements.get(
14865
- editingLinearElementId
14928
+ insertedSelectedLinearElement.elementId
14866
14929
  ),
14867
- nextElements
14930
+ nextElements,
14931
+ insertedSelectedLinearElement.isEditing
14868
14932
  ) : null;
14869
14933
  const nextAppState = {
14870
14934
  ...appState,
14871
14935
  ...directlyApplicablePartial,
14872
14936
  selectedElementIds: mergedSelectedElementIds,
14873
14937
  selectedGroupIds: mergedSelectedGroupIds,
14874
- selectedLinearElement: typeof selectedLinearElementId !== "undefined" ? selectedLinearElement : appState.selectedLinearElement,
14875
- // otherwise assign what we had before
14876
- editingLinearElement: typeof editingLinearElementId !== "undefined" ? editingLinearElement : appState.editingLinearElement
14877
- // otherwise assign what we had before
14938
+ selectedLinearElement: typeof insertedSelectedLinearElement !== "undefined" ? selectedLinearElement : appState.selectedLinearElement
14878
14939
  };
14879
14940
  const constainsVisibleChanges = this.filterInvisibleChanges(
14880
14941
  appState,
@@ -14964,57 +15025,44 @@ var AppStateDelta = class _AppStateDelta {
14964
15025
  nextAppState[key] = null;
14965
15026
  }
14966
15027
  break;
14967
- case "selectedLinearElementId":
14968
- case "editingLinearElementId":
14969
- const appStateKey = _AppStateDelta.convertToAppStateKey(key);
14970
- const linearElement = nextAppState[appStateKey];
14971
- if (!linearElement) {
15028
+ case "selectedLinearElement":
15029
+ const nextLinearElement = nextAppState[key];
15030
+ if (!nextLinearElement) {
14972
15031
  visibleDifferenceFlag.value = true;
14973
15032
  } else {
14974
- const element = nextElements.get(linearElement.elementId);
15033
+ const element = nextElements.get(nextLinearElement.elementId);
14975
15034
  if (element && !element.isDeleted) {
14976
15035
  visibleDifferenceFlag.value = true;
14977
15036
  } else {
14978
- nextAppState[appStateKey] = null;
15037
+ nextAppState[key] = null;
14979
15038
  }
14980
15039
  }
14981
15040
  break;
14982
- case "lockedMultiSelections": {
15041
+ case "lockedMultiSelections":
14983
15042
  const prevLockedUnits = prevAppState[key] || {};
14984
15043
  const nextLockedUnits = nextAppState[key] || {};
14985
15044
  if (!isShallowEqual2(prevLockedUnits, nextLockedUnits)) {
14986
15045
  visibleDifferenceFlag.value = true;
14987
15046
  }
14988
15047
  break;
14989
- }
14990
- case "activeLockedId": {
15048
+ case "activeLockedId":
14991
15049
  const prevHitLockedId = prevAppState[key] || null;
14992
15050
  const nextHitLockedId = nextAppState[key] || null;
14993
15051
  if (prevHitLockedId !== nextHitLockedId) {
14994
15052
  visibleDifferenceFlag.value = true;
14995
15053
  }
14996
15054
  break;
14997
- }
14998
- default: {
15055
+ default:
14999
15056
  assertNever4(
15000
15057
  key,
15001
15058
  `Unknown ObservedElementsAppState's key "${key}"`,
15002
15059
  true
15003
15060
  );
15004
- }
15005
15061
  }
15006
15062
  }
15007
15063
  }
15008
15064
  return visibleDifferenceFlag.value;
15009
15065
  }
15010
- static convertToAppStateKey(key) {
15011
- switch (key) {
15012
- case "selectedLinearElementId":
15013
- return "selectedLinearElement";
15014
- case "editingLinearElementId":
15015
- return "editingLinearElement";
15016
- }
15017
- }
15018
15066
  static filterSelectedElements(selectedElementIds, elements, visibleDifferenceFlag) {
15019
15067
  const ids = Object.keys(selectedElementIds);
15020
15068
  if (!ids.length) {
@@ -15053,8 +15101,7 @@ var AppStateDelta = class _AppStateDelta {
15053
15101
  editingGroupId,
15054
15102
  selectedGroupIds,
15055
15103
  selectedElementIds,
15056
- editingLinearElementId,
15057
- selectedLinearElementId,
15104
+ selectedLinearElement,
15058
15105
  croppingElementId,
15059
15106
  lockedMultiSelections,
15060
15107
  activeLockedId,
@@ -15208,7 +15255,7 @@ var ElementsDelta = class _ElementsDelta {
15208
15255
  for (const prevElement of prevElements.values()) {
15209
15256
  const nextElement = nextElements.get(prevElement.id);
15210
15257
  if (!nextElement) {
15211
- const deleted = { ...prevElement, isDeleted: false };
15258
+ const deleted = { ...prevElement };
15212
15259
  const inserted = {
15213
15260
  isDeleted: true,
15214
15261
  version: prevElement.version + 1,
@@ -15219,7 +15266,9 @@ var ElementsDelta = class _ElementsDelta {
15219
15266
  inserted,
15220
15267
  _ElementsDelta.stripIrrelevantProps
15221
15268
  );
15222
- removed[prevElement.id] = delta;
15269
+ if (!prevElement.isDeleted) {
15270
+ removed[prevElement.id] = delta;
15271
+ }
15223
15272
  }
15224
15273
  }
15225
15274
  for (const nextElement of nextElements.values()) {
@@ -15231,15 +15280,16 @@ var ElementsDelta = class _ElementsDelta {
15231
15280
  versionNonce: randomInteger4()
15232
15281
  };
15233
15282
  const inserted = {
15234
- ...nextElement,
15235
- isDeleted: false
15283
+ ...nextElement
15236
15284
  };
15237
15285
  const delta = Delta.create(
15238
15286
  deleted,
15239
15287
  inserted,
15240
15288
  _ElementsDelta.stripIrrelevantProps
15241
15289
  );
15242
- added[nextElement.id] = delta;
15290
+ if (!nextElement.isDeleted) {
15291
+ added[nextElement.id] = delta;
15292
+ }
15243
15293
  continue;
15244
15294
  }
15245
15295
  if (prevElement.versionNonce !== nextElement.versionNonce) {
@@ -15260,7 +15310,11 @@ var ElementsDelta = class _ElementsDelta {
15260
15310
  }
15261
15311
  continue;
15262
15312
  }
15263
- if (!Delta.isEmpty(delta)) {
15313
+ const strippedDeleted = _ElementsDelta.stripVersionProps(delta.deleted);
15314
+ const strippedInserted = _ElementsDelta.stripVersionProps(
15315
+ delta.inserted
15316
+ );
15317
+ if (Delta.isInnerDifferent(strippedDeleted, strippedInserted, true)) {
15264
15318
  updated[nextElement.id] = delta;
15265
15319
  }
15266
15320
  }
@@ -15273,8 +15327,8 @@ var ElementsDelta = class _ElementsDelta {
15273
15327
  inverse() {
15274
15328
  const inverseInternal = (deltas) => {
15275
15329
  const inversedDeltas = {};
15276
- for (const [id, delta] of Object.entries(deltas)) {
15277
- inversedDeltas[id] = Delta.create(delta.inserted, delta.deleted);
15330
+ for (const [id, { inserted, deleted }] of Object.entries(deltas)) {
15331
+ inversedDeltas[id] = Delta.create({ ...inserted }, { ...deleted });
15278
15332
  }
15279
15333
  return inversedDeltas;
15280
15334
  };
@@ -15338,7 +15392,13 @@ var ElementsDelta = class _ElementsDelta {
15338
15392
  } else {
15339
15393
  latestDelta = delta;
15340
15394
  }
15341
- if (Delta.isInnerDifferent(latestDelta.deleted, latestDelta.inserted)) {
15395
+ const strippedDeleted = _ElementsDelta.stripVersionProps(
15396
+ latestDelta.deleted
15397
+ );
15398
+ const strippedInserted = _ElementsDelta.stripVersionProps(
15399
+ latestDelta.inserted
15400
+ );
15401
+ if (Delta.isInnerDifferent(strippedDeleted, strippedInserted)) {
15342
15402
  modifiedDeltas[id] = latestDelta;
15343
15403
  }
15344
15404
  }
@@ -15352,9 +15412,7 @@ var ElementsDelta = class _ElementsDelta {
15352
15412
  // redistribute the deltas as `isDeleted` could have been updated
15353
15413
  });
15354
15414
  }
15355
- applyTo(elements, snapshot = StoreSnapshot.empty().elements, options = {
15356
- excludedProperties: /* @__PURE__ */ new Set()
15357
- }) {
15415
+ applyTo(elements, snapshot = StoreSnapshot.empty().elements, options) {
15358
15416
  let nextElements = new Map(elements);
15359
15417
  let changedElements;
15360
15418
  const flags = {
@@ -15365,8 +15423,8 @@ var ElementsDelta = class _ElementsDelta {
15365
15423
  const applyDeltas = _ElementsDelta.createApplier(
15366
15424
  nextElements,
15367
15425
  snapshot,
15368
- options,
15369
- flags
15426
+ flags,
15427
+ options
15370
15428
  );
15371
15429
  const addedElements = applyDeltas(this.added);
15372
15430
  const removedElements = applyDeltas(this.removed);
@@ -15391,9 +15449,9 @@ var ElementsDelta = class _ElementsDelta {
15391
15449
  changedElements,
15392
15450
  flags
15393
15451
  );
15394
- const tempScene = new Scene(nextElements);
15395
- _ElementsDelta.redrawTextBoundingBoxes(tempScene, changedElements);
15396
- _ElementsDelta.redrawBoundArrows(tempScene, changedElements);
15452
+ if (!options?.skipRedraw) {
15453
+ _ElementsDelta.redrawElements(nextElements, changedElements);
15454
+ }
15397
15455
  } catch (e) {
15398
15456
  console.error(
15399
15457
  `Couldn't mutate elements after applying elements change`,
@@ -15406,7 +15464,35 @@ var ElementsDelta = class _ElementsDelta {
15406
15464
  return [nextElements, flags.containsVisibleDifference];
15407
15465
  }
15408
15466
  }
15409
- static createApplier = (nextElements, snapshot, options, flags) => (deltas) => {
15467
+ squash(delta) {
15468
+ const { added, removed, updated } = delta;
15469
+ for (const [id, nextDelta] of Object.entries(added)) {
15470
+ const prevDelta = this.added[id];
15471
+ if (!prevDelta) {
15472
+ this.added[id] = nextDelta;
15473
+ } else {
15474
+ this.added[id] = Delta.merge(prevDelta, nextDelta);
15475
+ }
15476
+ }
15477
+ for (const [id, nextDelta] of Object.entries(removed)) {
15478
+ const prevDelta = this.removed[id];
15479
+ if (!prevDelta) {
15480
+ this.removed[id] = nextDelta;
15481
+ } else {
15482
+ this.removed[id] = Delta.merge(prevDelta, nextDelta);
15483
+ }
15484
+ }
15485
+ for (const [id, nextDelta] of Object.entries(updated)) {
15486
+ const prevDelta = this.updated[id];
15487
+ if (!prevDelta) {
15488
+ this.updated[id] = nextDelta;
15489
+ } else {
15490
+ this.updated[id] = Delta.merge(prevDelta, nextDelta);
15491
+ }
15492
+ }
15493
+ return this;
15494
+ }
15495
+ static createApplier = (nextElements, snapshot, flags, options) => (deltas) => {
15410
15496
  const getElement = _ElementsDelta.createGetter(
15411
15497
  nextElements,
15412
15498
  snapshot,
@@ -15418,8 +15504,8 @@ var ElementsDelta = class _ElementsDelta {
15418
15504
  const newElement2 = _ElementsDelta.applyDelta(
15419
15505
  element,
15420
15506
  delta,
15421
- options,
15422
- flags
15507
+ flags,
15508
+ options
15423
15509
  );
15424
15510
  nextElements.set(newElement2.id, newElement2);
15425
15511
  acc.set(newElement2.id, newElement2);
@@ -15447,13 +15533,13 @@ var ElementsDelta = class _ElementsDelta {
15447
15533
  }
15448
15534
  return element;
15449
15535
  };
15450
- static applyDelta(element, delta, options, flags) {
15536
+ static applyDelta(element, delta, flags, options) {
15451
15537
  const directlyApplicablePartial = {};
15452
15538
  for (const key of Object.keys(delta.inserted)) {
15453
15539
  if (key === "boundElements") {
15454
15540
  continue;
15455
15541
  }
15456
- if (options.excludedProperties.has(key)) {
15542
+ if (options?.excludedProperties?.has(key)) {
15457
15543
  continue;
15458
15544
  }
15459
15545
  const value = delta.inserted[key];
@@ -15513,8 +15599,9 @@ var ElementsDelta = class _ElementsDelta {
15513
15599
  if (!nextElement) {
15514
15600
  return;
15515
15601
  }
15602
+ const prevElement = prevElements.get(element.id);
15516
15603
  let affectedElement;
15517
- if (prevElements.get(element.id) === nextElement) {
15604
+ if (prevElement === nextElement) {
15518
15605
  affectedElement = newElementWith(
15519
15606
  nextElement,
15520
15607
  updates
@@ -15549,19 +15636,10 @@ var ElementsDelta = class _ElementsDelta {
15549
15636
  const prevAffectedElements = new Map(
15550
15637
  Array.from(prevElements).filter(([id]) => nextAffectedElements.has(id))
15551
15638
  );
15552
- const { added, removed, updated } = _ElementsDelta.calculate(
15553
- prevAffectedElements,
15554
- nextAffectedElements
15639
+ this.squash(
15640
+ // technically we could do better here if perf. would become an issue
15641
+ _ElementsDelta.calculate(prevAffectedElements, nextAffectedElements)
15555
15642
  );
15556
- for (const [id, delta] of Object.entries(added)) {
15557
- this.added[id] = delta;
15558
- }
15559
- for (const [id, delta] of Object.entries(removed)) {
15560
- this.removed[id] = delta;
15561
- }
15562
- for (const [id, delta] of Object.entries(updated)) {
15563
- this.updated[id] = delta;
15564
- }
15565
15643
  return nextAffectedElements;
15566
15644
  }
15567
15645
  /**
@@ -15596,6 +15674,20 @@ var ElementsDelta = class _ElementsDelta {
15596
15674
  );
15597
15675
  BindableElement.rebindAffected(nextElements, nextElement(), updater);
15598
15676
  }
15677
+ static redrawElements(nextElements, changedElements) {
15678
+ try {
15679
+ const tempScene = new Scene(nextElements, { skipValidation: true });
15680
+ _ElementsDelta.redrawTextBoundingBoxes(tempScene, changedElements);
15681
+ _ElementsDelta.redrawBoundArrows(tempScene, changedElements);
15682
+ } catch (e) {
15683
+ console.error(`Couldn't redraw elements`, e);
15684
+ if (isTestEnv8() || isDevEnv7()) {
15685
+ throw e;
15686
+ }
15687
+ } finally {
15688
+ return nextElements;
15689
+ }
15690
+ }
15599
15691
  static redrawTextBoundingBoxes(scene, changed) {
15600
15692
  const elements = scene.getNonDeletedElementsMap();
15601
15693
  const boxesToRedraw = /* @__PURE__ */ new Map();
@@ -15684,14 +15776,22 @@ var ElementsDelta = class _ElementsDelta {
15684
15776
  const { id, updated, ...strippedPartial } = partial;
15685
15777
  return strippedPartial;
15686
15778
  }
15779
+ static stripVersionProps(partial) {
15780
+ const { version, versionNonce, ...strippedPartial } = partial;
15781
+ return strippedPartial;
15782
+ }
15687
15783
  };
15688
15784
 
15689
15785
  // src/distribute.ts
15690
15786
  init_define_import_meta_env();
15691
- var distributeElements = (selectedElements, elementsMap, distribution) => {
15787
+ var distributeElements = (selectedElements, elementsMap, distribution, appState) => {
15692
15788
  const [start, mid, end, extent] = distribution.axis === "x" ? ["minX", "midX", "maxX", "width"] : ["minY", "midY", "maxY", "height"];
15693
15789
  const bounds = getCommonBoundingBox(selectedElements);
15694
- const groups = getMaximumGroups(selectedElements, elementsMap).map((group) => [group, getCommonBoundingBox(group)]).sort((a2, b2) => a2[1][mid] - b2[1][mid]);
15790
+ const groups = getSelectedElementsByGroup(
15791
+ selectedElements,
15792
+ elementsMap,
15793
+ appState
15794
+ ).map((group) => [group, getCommonBoundingBox(group)]).sort((a2, b2) => a2[1][mid] - b2[1][mid]);
15695
15795
  let span = 0;
15696
15796
  for (const group of groups) {
15697
15797
  span += group[1][extent];
@@ -18403,7 +18503,7 @@ var getTransformHandles = (element, zoom, elementsMap, pointerType = "mouse", om
18403
18503
  );
18404
18504
  };
18405
18505
  var shouldShowBoundingBox = (elements, appState) => {
18406
- if (appState.editingLinearElement) {
18506
+ if (appState.selectedLinearElement?.isEditing) {
18407
18507
  return false;
18408
18508
  }
18409
18509
  if (elements.length > 1) {
@@ -19151,6 +19251,7 @@ export {
19151
19251
  getRootElements,
19152
19252
  getSceneVersion,
19153
19253
  getSelectedElements,
19254
+ getSelectedElementsByGroup,
19154
19255
  getSelectedGroupForElement,
19155
19256
  getSelectedGroupIdForElement,
19156
19257
  getSelectedGroupIds,