@inditextech/weave-sdk 3.1.0 → 3.2.0-SNAPSHOT.84.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/types.js CHANGED
@@ -4,6 +4,7 @@ import { WEAVE_ASYNC_STATUS, WEAVE_AWARENESS_LAYER_ID, WEAVE_EXPORT_BACKGROUND_C
4
4
  import { getYjsDoc, getYjsValue, observeDeep, syncedStore } from "@syncedstore/core";
5
5
  import * as Y$1 from "yjs";
6
6
  import * as Y from "yjs";
7
+ import "konva/lib/types";
7
8
 
8
9
  //#region rolldown:runtime
9
10
  var __create = Object.create;
@@ -18791,7 +18792,11 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
18791
18792
  } else nodeHovered?.handleMouseout?.();
18792
18793
  });
18793
18794
  tr.on("mouseover", () => {
18794
- stage.container().style.cursor = "grab";
18795
+ const nodesSelected = tr.nodes();
18796
+ if (nodesSelected.length === 1) {
18797
+ const node = nodesSelected[0];
18798
+ stage.container().style.cursor = node.defineMousePointer() ?? "grab";
18799
+ } else stage.container().style.cursor = "grab";
18795
18800
  });
18796
18801
  tr.on("mouseout", () => {
18797
18802
  this.instance.getStage().handleMouseover?.();
@@ -19514,7 +19519,7 @@ var WeaveNodesSelectionPlugin = class extends WeavePlugin {
19514
19519
  if (areNodesSelected) {
19515
19520
  stage.container().tabIndex = 1;
19516
19521
  stage.container().focus();
19517
- stage.container().style.cursor = "grab";
19522
+ stage.container().style.cursor = nodeTargeted.defineMousePointer() ?? "grab";
19518
19523
  }
19519
19524
  this.triggerSelectedNodesEvent();
19520
19525
  }
@@ -19788,32 +19793,25 @@ var WeaveCopyPasteNodesPlugin = class extends WeavePlugin {
19788
19793
  if (!this.enabled) return;
19789
19794
  }
19790
19795
  });
19791
- if (catcher) {
19792
- document.addEventListener("paste", async (e) => {
19793
- const dataList = e.clipboardData?.items;
19794
- if (!dataList) return;
19795
- if (dataList?.length > 0) this.sendExternalPasteEvent(dataList);
19796
- });
19797
- catcher.addEventListener("paste", async (e) => {
19798
- e.preventDefault();
19799
- let items = void 0;
19800
- let hasWeaveData = false;
19801
- if (!items) {
19802
- if (this.isClipboardAPIAvailable()) items = await navigator.clipboard.read();
19803
- }
19804
- if (!items || items.length === 0) return;
19805
- if (this.isClipboardAPIAvailable()) {
19806
- const readText = await navigator.clipboard.readText();
19807
- const continueToPaste = this.isWeaveData(readText);
19808
- if (continueToPaste) hasWeaveData = true;
19809
- }
19810
- if (hasWeaveData) {
19811
- this.handlePaste();
19812
- return;
19813
- }
19814
- this.sendExternalPasteEvent(void 0, items);
19815
- });
19816
- }
19796
+ if (catcher) catcher.addEventListener("paste", async (e) => {
19797
+ e.preventDefault();
19798
+ let items = void 0;
19799
+ let hasWeaveData = false;
19800
+ if (!items) {
19801
+ if (this.isClipboardAPIAvailable()) items = await navigator.clipboard.read();
19802
+ }
19803
+ if (!items || items.length === 0) return;
19804
+ if (this.isClipboardAPIAvailable()) {
19805
+ const readText = await navigator.clipboard.readText();
19806
+ const continueToPaste = this.isWeaveData(readText);
19807
+ if (continueToPaste) hasWeaveData = true;
19808
+ }
19809
+ if (hasWeaveData) {
19810
+ this.handlePaste();
19811
+ return;
19812
+ }
19813
+ this.sendExternalPasteEvent(void 0, items);
19814
+ });
19817
19815
  }
19818
19816
  sendExternalPasteEvent(dataList, items) {
19819
19817
  const stage = this.instance.getStage();
@@ -20198,6 +20196,11 @@ var WeaveNode = class {
20198
20196
  node.handleMouseout = function() {};
20199
20197
  node.handleSelectNode = function() {};
20200
20198
  node.handleDeselectNode = function() {};
20199
+ node.defineMousePointer = () => {
20200
+ const selectedNodes = this.getSelectionPlugin()?.getSelectedNodes() ?? [];
20201
+ if (this.isSelecting() && selectedNodes.includes(node)) return "grab";
20202
+ return "pointer";
20203
+ };
20201
20204
  node.canBeHovered = function() {
20202
20205
  return true;
20203
20206
  };
@@ -20684,12 +20687,12 @@ var WeaveNode = class {
20684
20687
  }
20685
20688
  if (isNodeSelectionEnabled && this.isSelecting() && !this.isNodeSelected(realNode) && !this.isPasting() && isTargetable && !(isLocked || isMutexLocked) && stage.mode() === WEAVE_STAGE_DEFAULT_MODE) {
20686
20689
  showHover = true;
20687
- stage.container().style.cursor = "pointer";
20690
+ stage.container().style.cursor = realNode?.defineMousePointer() ?? "pointer";
20688
20691
  cancelBubble = true;
20689
20692
  }
20690
20693
  if (isNodeSelectionEnabled && this.isSelecting() && this.isNodeSelected(realNode) && !this.isPasting() && isTargetable && !(isLocked || isMutexLocked) && stage.mode() === WEAVE_STAGE_DEFAULT_MODE) {
20691
20694
  showHover = true;
20692
- stage.container().style.cursor = "grab";
20695
+ stage.container().style.cursor = realNode?.defineMousePointer() ?? "grab";
20693
20696
  cancelBubble = true;
20694
20697
  }
20695
20698
  if (!isTargetable) cancelBubble = true;
@@ -20875,6 +20878,9 @@ var WeaveAction = class {
20875
20878
  hasAliases() {
20876
20879
  return false;
20877
20880
  }
20881
+ setForceExecution(forceExecution) {
20882
+ this.forceExecution = forceExecution;
20883
+ }
20878
20884
  getAliases() {
20879
20885
  return [];
20880
20886
  }
@@ -21363,8 +21369,10 @@ var WeaveTargetingManager = class {
21363
21369
  };
21364
21370
  let measureContainer = mainLayer;
21365
21371
  let container = mainLayer;
21372
+ const utilityLayer = this.instance.getUtilityLayer();
21373
+ if (utilityLayer) utilityLayer.visible(false);
21366
21374
  const nodesSelection = this.instance.getPlugin("nodesSelection");
21367
- if (nodesSelection) nodesSelection.disable();
21375
+ if (nodesSelection) nodesSelection.getTransformer().visible(false);
21368
21376
  const dummyRect = new Konva.Rect({
21369
21377
  width: 10,
21370
21378
  height: 10,
@@ -21385,7 +21393,8 @@ var WeaveTargetingManager = class {
21385
21393
  x: 0,
21386
21394
  y: 0
21387
21395
  };
21388
- if (nodesSelection) nodesSelection.enable();
21396
+ if (utilityLayer) utilityLayer.visible(true);
21397
+ if (nodesSelection) nodesSelection.getTransformer().visible(true);
21389
21398
  dummyRect.destroy();
21390
21399
  return {
21391
21400
  mousePoint: relativeMousePointer,
@@ -21789,13 +21798,13 @@ var WeaveStateManager = class {
21789
21798
  updateNodes(nodes) {
21790
21799
  for (const node of nodes) this.updateNode(node);
21791
21800
  }
21792
- stateTransactional(callback) {
21801
+ stateTransactional(callback, origin) {
21793
21802
  const state = this.instance.getStore().getState();
21794
21803
  const doc = getYjsDoc(state);
21795
- const userId = this.instance.getStore().getUser().id;
21804
+ const transactionOrigin = origin ?? this.instance.getStore().getUser().id;
21796
21805
  doc.transact(() => {
21797
21806
  callback();
21798
- }, userId);
21807
+ }, transactionOrigin);
21799
21808
  }
21800
21809
  removeNode(node) {
21801
21810
  const state = this.instance.getStore().getState();
@@ -21930,7 +21939,6 @@ var WeaveRegisterManager = class {
21930
21939
  registerActionsHandlers() {
21931
21940
  const config = this.instance.getConfiguration();
21932
21941
  if (config.actions) for (const action of config.actions) this.registerActionHandler(action);
21933
- this.logger.info(`Actions handlers registered`);
21934
21942
  }
21935
21943
  registerActionHandler(action) {
21936
21944
  const actionName = action.getName();
@@ -21957,7 +21965,7 @@ var WeaveRegisterManager = class {
21957
21965
 
21958
21966
  //#endregion
21959
21967
  //#region package.json
21960
- var version = "3.1.0";
21968
+ var version = "3.2.0-SNAPSHOT.84.1";
21961
21969
 
21962
21970
  //#endregion
21963
21971
  //#region src/managers/setup.ts
@@ -22097,14 +22105,15 @@ var WeaveActionsManager = class {
22097
22105
  getActiveAction() {
22098
22106
  return this.activeAction;
22099
22107
  }
22100
- triggerAction(actionName, params) {
22108
+ triggerAction(actionName, params, forceExecution = false) {
22101
22109
  const actionsHandlers = this.instance.getActionsHandlers();
22102
22110
  if (typeof actionName === "undefined") throw new Error("Action name is required");
22103
22111
  if (actionName && !actionsHandlers[actionName]) throw new Error(`Action handler with name [${actionName}] not registered`);
22104
- if (typeof this.activeAction !== "undefined") this.cancelAction(this.activeAction);
22105
- this.activeAction = actionName;
22112
+ if (this.activeAction !== void 0 && !forceExecution) this.cancelAction(this.activeAction);
22113
+ if (!forceExecution) this.activeAction = actionName;
22114
+ actionsHandlers[actionName].setForceExecution(forceExecution);
22106
22115
  const payload = actionsHandlers[actionName].trigger(this.cancelActionCallback(actionName), params);
22107
- this.instance.emitEvent("onActiveActionChange", this.activeAction);
22116
+ if (!forceExecution) this.instance.emitEvent("onActiveActionChange", this.activeAction);
22108
22117
  return payload;
22109
22118
  }
22110
22119
  updatePropsAction(actionName, props) {
@@ -23132,8 +23141,8 @@ var Weave = class {
23132
23141
  getActiveAction() {
23133
23142
  return this.actionsManager.getActiveAction();
23134
23143
  }
23135
- triggerAction(actionName, params) {
23136
- return this.actionsManager.triggerAction(actionName, params);
23144
+ triggerAction(actionName, params, forceExecution = false) {
23145
+ return this.actionsManager.triggerAction(actionName, params, forceExecution);
23137
23146
  }
23138
23147
  getPropsAction(actionName) {
23139
23148
  return this.actionsManager.getPropsAction(actionName);
@@ -23165,9 +23174,10 @@ var Weave = class {
23165
23174
  return this.stateManager.getNode(nodeKey);
23166
23175
  }
23167
23176
  addNode(node, parentId = "mainLayer", options = DEFAULT_ADD_NODE_OPTIONS) {
23177
+ const { origin,...restOptions } = options;
23168
23178
  this.stateTransactional(() => {
23169
- this.addNodeNT(node, parentId, options);
23170
- });
23179
+ this.addNodeNT(node, parentId, restOptions);
23180
+ }, origin);
23171
23181
  }
23172
23182
  addNodeNT(node, parentId = "mainLayer", options = DEFAULT_ADD_NODE_OPTIONS) {
23173
23183
  const { index, emitUserChangeEvent, overrideUserChangeType } = mergeExceptArrays(DEFAULT_ADD_NODE_OPTIONS, options);
@@ -23188,9 +23198,10 @@ var Weave = class {
23188
23198
  }
23189
23199
  }
23190
23200
  updateNode(node, options = DEFAULT_UPDATE_NODE_OPTIONS) {
23201
+ const { origin,...restOptions } = options;
23191
23202
  this.stateTransactional(() => {
23192
- this.updateNodeNT(node, options);
23193
- });
23203
+ this.updateNodeNT(node, restOptions);
23204
+ }, origin);
23194
23205
  }
23195
23206
  updateNodeNT(node, options = DEFAULT_UPDATE_NODE_OPTIONS) {
23196
23207
  const { emitUserChangeEvent } = mergeExceptArrays(DEFAULT_UPDATE_NODE_OPTIONS, options);
@@ -23208,9 +23219,10 @@ var Weave = class {
23208
23219
  }
23209
23220
  }
23210
23221
  updateNodes(nodes, options = DEFAULT_UPDATE_NODE_OPTIONS) {
23222
+ const { origin,...restOptions } = options;
23211
23223
  this.stateTransactional(() => {
23212
- this.updateNodesNT(nodes, options);
23213
- });
23224
+ this.updateNodesNT(nodes, restOptions);
23225
+ }, origin);
23214
23226
  }
23215
23227
  updateNodesNT(nodes, options = DEFAULT_UPDATE_NODE_OPTIONS) {
23216
23228
  const { emitUserChangeEvent } = mergeExceptArrays(DEFAULT_UPDATE_NODE_OPTIONS, options);
@@ -23234,9 +23246,10 @@ var Weave = class {
23234
23246
  }
23235
23247
  }
23236
23248
  removeNode(node, options = DEFAULT_REMOVE_NODE_OPTIONS) {
23249
+ const { origin,...restOptions } = options;
23237
23250
  this.stateTransactional(() => {
23238
- this.removeNodeNT(node, options);
23239
- });
23251
+ this.removeNodeNT(node, restOptions);
23252
+ }, origin);
23240
23253
  }
23241
23254
  removeNodeNT(node, options = DEFAULT_REMOVE_NODE_OPTIONS) {
23242
23255
  const { emitUserChangeEvent } = mergeExceptArrays(DEFAULT_REMOVE_NODE_OPTIONS, options);
@@ -23268,9 +23281,10 @@ var Weave = class {
23268
23281
  if (selectionPlugin) selectionPlugin.setSelectedNodes([]);
23269
23282
  }
23270
23283
  removeNodes(nodes, options = DEFAULT_REMOVE_NODE_OPTIONS) {
23284
+ const { origin,...restOptions } = options;
23271
23285
  this.stateTransactional(() => {
23272
- this.removeNodesNT(nodes, options);
23273
- });
23286
+ this.removeNodesNT(nodes, restOptions);
23287
+ }, origin);
23274
23288
  }
23275
23289
  removeNodesNT(nodes, options = DEFAULT_REMOVE_NODE_OPTIONS) {
23276
23290
  for (const node of nodes) this.removeNodeNT(node, options);
@@ -23278,9 +23292,10 @@ var Weave = class {
23278
23292
  if (selectionPlugin) selectionPlugin.setSelectedNodes([]);
23279
23293
  }
23280
23294
  zMoveNode(node, position, options = DEFAULT_MOVE_NODE_OPTIONS) {
23295
+ const { origin,...restOptions } = options;
23281
23296
  this.stateTransactional(() => {
23282
- this.zMoveNodeNT(node, position, options);
23283
- });
23297
+ this.zMoveNodeNT(node, position, restOptions);
23298
+ }, origin);
23284
23299
  }
23285
23300
  zMoveNodeNT(node, position, options = DEFAULT_MOVE_NODE_OPTIONS) {
23286
23301
  const { emitUserChangeEvent } = mergeExceptArrays(DEFAULT_MOVE_NODE_OPTIONS, options);
@@ -23334,8 +23349,8 @@ var Weave = class {
23334
23349
  getBoundingBox(nodes, config) {
23335
23350
  return getBoundingBox(nodes, config);
23336
23351
  }
23337
- stateTransactional(callback) {
23338
- this.stateManager.stateTransactional(callback);
23352
+ stateTransactional(callback, origin) {
23353
+ this.stateManager.stateTransactional(callback, origin);
23339
23354
  }
23340
23355
  moveUp(node) {
23341
23356
  this.zIndexManager.moveUp(node);
@@ -25020,7 +25035,12 @@ const WEAVE_IMAGE_CROP_ANCHOR_POSITION = {
25020
25035
  const WEAVE_IMAGE_DEFAULT_CONFIG = {
25021
25036
  performance: { cache: { enabled: false } },
25022
25037
  style: { placeholder: { fill: "#aaaaaa" } },
25038
+ imageLoading: {
25039
+ maxRetryAttempts: 15,
25040
+ retryDelayMs: 2e3
25041
+ },
25023
25042
  crossOrigin: "anonymous",
25043
+ useFallbackImage: true,
25024
25044
  cropMode: {
25025
25045
  gridLines: { enabled: true },
25026
25046
  overlay: { fill: "rgba(0,0,0,0.2)" },
@@ -25590,7 +25610,9 @@ var WeaveImageCrop = class WeaveImageCrop {
25590
25610
  var WeaveImageNode = class extends WeaveNode {
25591
25611
  imageBitmapCache = {};
25592
25612
  imageSource = {};
25613
+ imageFallback = {};
25593
25614
  imageState = {};
25615
+ imageTryoutAttempts = {};
25594
25616
  imageIconSource = null;
25595
25617
  nodeType = WEAVE_IMAGE_NODE_TYPE;
25596
25618
  constructor(params) {
@@ -25604,6 +25626,12 @@ var WeaveImageNode = class extends WeaveNode {
25604
25626
  this.lastTapTime = 0;
25605
25627
  this.config = mergeExceptArrays(WEAVE_IMAGE_DEFAULT_CONFIG, config);
25606
25628
  this.imageCrop = null;
25629
+ this.tryoutTimeoutId = null;
25630
+ this.imageBitmapCache = {};
25631
+ this.imageSource = {};
25632
+ this.imageState = {};
25633
+ this.imageTryoutAttempts = {};
25634
+ this.imageFallback = {};
25607
25635
  }
25608
25636
  getConfiguration() {
25609
25637
  return this.config;
@@ -25684,6 +25712,12 @@ var WeaveImageNode = class extends WeaveNode {
25684
25712
  cropping: false
25685
25713
  });
25686
25714
  this.setupDefaultNodeAugmentation(image);
25715
+ image.defineMousePointer = () => {
25716
+ if (this.imageState[id]?.status === "loading") return "wait";
25717
+ const selectedNodes = this.getSelectionPlugin()?.getSelectedNodes() ?? [];
25718
+ if (this.isSelecting() && selectedNodes.includes(image)) return "grab";
25719
+ return "pointer";
25720
+ };
25687
25721
  image.movedToContainer = () => {
25688
25722
  const stage = this.instance.getStage();
25689
25723
  const image$1 = stage.findOne(`#${id}`);
@@ -25762,8 +25796,8 @@ var WeaveImageNode = class extends WeaveNode {
25762
25796
  image.dblClick = () => {
25763
25797
  if (this.imageState[id]?.loaded && !this.imageState[id]?.error) this.config.onDblClick?.(this, image);
25764
25798
  };
25765
- if (this.imageSource[id]) {
25766
- imagePlaceholder.destroy();
25799
+ if (this.imageSource[id] && imageProps.imageURL) {
25800
+ imagePlaceholder?.destroy();
25767
25801
  const imageSource = this.imageSource[id];
25768
25802
  internalImage.setAttrs({
25769
25803
  image: imageSource,
@@ -25788,13 +25822,14 @@ var WeaveImageNode = class extends WeaveNode {
25788
25822
  height: sourceImageHeight
25789
25823
  });
25790
25824
  this.imageState[id] = {
25825
+ status: "loaded",
25791
25826
  loaded: true,
25792
25827
  error: false
25793
25828
  };
25794
25829
  this.updateImageCrop(image);
25795
25830
  } else {
25796
25831
  this.updatePlaceholderSize(image, imagePlaceholder);
25797
- this.loadImage(imageProps, image);
25832
+ this.loadImage(imageProps, image, true);
25798
25833
  }
25799
25834
  if (this.config.performance.cache.enabled) image.on("transformend", () => {
25800
25835
  this.cacheNode(image);
@@ -26025,7 +26060,7 @@ var WeaveImageNode = class extends WeaveNode {
26025
26060
  scaleY: 1,
26026
26061
  rotation: 0,
26027
26062
  visible: true,
26028
- fill: "#ccccccff",
26063
+ fill: this.config.style.placeholder.fill,
26029
26064
  strokeWidth: 0,
26030
26065
  draggable: false,
26031
26066
  zIndex: 0
@@ -26059,7 +26094,7 @@ var WeaveImageNode = class extends WeaveNode {
26059
26094
  scaleY: 1,
26060
26095
  rotation: 0,
26061
26096
  visible: true,
26062
- fill: "#ccccccff",
26097
+ fill: this.config.style.placeholder.fill,
26063
26098
  strokeWidth: 0,
26064
26099
  draggable: false,
26065
26100
  zIndex: 0
@@ -26101,59 +26136,111 @@ var WeaveImageNode = class extends WeaveNode {
26101
26136
  }
26102
26137
  this.cacheNode(nodeInstance);
26103
26138
  }
26104
- preloadImage(imageId, imageURL, { onLoad, onError }) {
26139
+ preloadFallbackImage(imageId, imageURL, { onLoad, onError }) {
26140
+ const imageURLToLoad = imageURL ?? "http://localhost/false-image";
26141
+ this.imageFallback[imageId] = Konva.Util.createImageElement();
26142
+ this.imageFallback[imageId].crossOrigin = this.config.crossOrigin;
26143
+ this.imageFallback[imageId].onerror = (error) => {
26144
+ this.imageState[imageId] = {
26145
+ status: "error-fallback",
26146
+ loaded: false,
26147
+ error: true
26148
+ };
26149
+ onError(error);
26150
+ };
26151
+ this.imageFallback[imageId].onload = async () => {
26152
+ this.imageState[imageId] = {
26153
+ status: "loading",
26154
+ loaded: true,
26155
+ error: false
26156
+ };
26157
+ onLoad();
26158
+ };
26159
+ this.imageState[imageId] = {
26160
+ status: "loading",
26161
+ loaded: false,
26162
+ error: false
26163
+ };
26164
+ try {
26165
+ this.imageFallback[imageId].src = imageURLToLoad;
26166
+ } catch (ex) {
26167
+ console.error(ex);
26168
+ }
26169
+ }
26170
+ preloadImage(imageId, imageURL, { onLoad, onError }, loadingTryout = false) {
26171
+ const imageURLToLoad = imageURL ?? "http://localhost/false-image";
26105
26172
  this.imageSource[imageId] = Konva.Util.createImageElement();
26106
26173
  this.imageSource[imageId].crossOrigin = this.config.crossOrigin;
26107
26174
  this.imageSource[imageId].onerror = (error) => {
26108
- this.imageState[imageId] = {
26175
+ if (!loadingTryout) this.imageState[imageId] = {
26176
+ status: "error",
26109
26177
  loaded: false,
26110
26178
  error: true
26111
26179
  };
26112
26180
  delete this.imageSource[imageId];
26113
- delete this.imageState[imageId];
26114
26181
  onError(error);
26115
26182
  };
26116
26183
  this.imageSource[imageId].onload = async () => {
26117
26184
  this.imageState[imageId] = {
26185
+ status: "loaded",
26118
26186
  loaded: true,
26119
26187
  error: false
26120
26188
  };
26121
26189
  onLoad();
26122
26190
  };
26123
- this.imageState[imageId] = {
26191
+ if (this.imageState[imageId]) this.imageState[imageId].status = "loading";
26192
+ else this.imageState[imageId] = {
26193
+ status: "loading",
26124
26194
  loaded: false,
26125
26195
  error: false
26126
26196
  };
26127
26197
  try {
26128
- if (imageURL) this.imageSource[imageId].src = imageURL;
26198
+ this.imageSource[imageId].src = imageURLToLoad;
26129
26199
  } catch (ex) {
26130
26200
  console.error(ex);
26131
26201
  }
26132
26202
  }
26133
- loadImage(params, image) {
26203
+ loadImage(params, image, useFallback = false, loadTryout = false) {
26134
26204
  const imageProps = params;
26135
26205
  const { id } = imageProps;
26136
26206
  const imagePlaceholder = image.findOne(`#${id}-placeholder`);
26137
26207
  const internalImage = image.findOne(`#${id}-image`);
26138
- const realImageURL = this.config.urlTransformer?.(imageProps.imageURL ?? "", image) ?? imageProps.imageURL;
26208
+ let realImageURL = this.config.urlTransformer?.(imageProps.imageURL ?? "", image) ?? imageProps.imageURL;
26209
+ let preloadFunction = this.preloadImage.bind(this);
26210
+ const loadFallback = useFallback && imageProps.imageFallback && this.config.useFallbackImage;
26211
+ if (loadFallback) {
26212
+ preloadFunction = this.preloadFallbackImage.bind(this);
26213
+ realImageURL = imageProps.imageFallback;
26214
+ }
26139
26215
  this.loadAsyncElement(id);
26140
- this.preloadImage(id, realImageURL ?? "", {
26216
+ preloadFunction(id, realImageURL ?? "", {
26141
26217
  onLoad: () => {
26142
- if (image && imagePlaceholder && internalImage) {
26218
+ if (useFallback) this.tryoutTimeoutId = setTimeout(() => {
26219
+ const node = this.instance.getStage().findOne(`#${id}`);
26220
+ if (node) {
26221
+ this.imageTryoutAttempts[id] = (this.imageTryoutAttempts[id] ?? 0) + 1;
26222
+ this.loadImage(node.getAttrs(), node, false, true);
26223
+ }
26224
+ }, this.config.imageLoading.retryDelayMs);
26225
+ if (loadTryout && this.tryoutTimeoutId) {
26226
+ clearTimeout(this.tryoutTimeoutId);
26227
+ this.tryoutTimeoutId = null;
26228
+ }
26229
+ if (image && internalImage) {
26143
26230
  image.setAttrs({
26144
26231
  width: imageProps.width ? imageProps.width : this.imageSource[id].width,
26145
26232
  height: imageProps.height ? imageProps.height : this.imageSource[id].height
26146
26233
  });
26147
- imagePlaceholder.destroy();
26148
- const imageSource = this.imageSource[id];
26234
+ imagePlaceholder?.destroy();
26235
+ const imageSource = loadFallback ? this.imageFallback[id] : this.imageSource[id];
26149
26236
  internalImage.setAttrs({
26150
26237
  width: imageProps.width ? imageProps.width : this.imageSource[id].width,
26151
26238
  height: imageProps.height ? imageProps.height : this.imageSource[id].height,
26152
26239
  image: imageSource,
26153
26240
  visible: true
26154
26241
  });
26155
- let sourceImageWidth = this.imageSource[id].width;
26156
- let sourceImageHeight = this.imageSource[id].height;
26242
+ let sourceImageWidth = imageProps.width ? imageProps.width : this.imageSource[id].width;
26243
+ let sourceImageHeight = imageProps.height ? imageProps.height : this.imageSource[id].height;
26157
26244
  if (image.getAttrs().imageInfo) {
26158
26245
  sourceImageWidth = image.getAttrs().imageInfo.width;
26159
26246
  sourceImageHeight = image.getAttrs().imageInfo.height;
@@ -26172,40 +26259,56 @@ var WeaveImageNode = class extends WeaveNode {
26172
26259
  width: imageRect.width,
26173
26260
  height: imageRect.height
26174
26261
  });
26175
- this.imageState[id] = {
26176
- loaded: true,
26177
- error: false
26178
- };
26262
+ const stage = this.instance.getStage();
26263
+ if (!loadFallback) {
26264
+ if (stage.container().style.cursor === "wait") stage.container().style.cursor = "pointer";
26265
+ this.imageState[id] = {
26266
+ status: "loaded",
26267
+ loaded: true,
26268
+ error: false
26269
+ };
26270
+ }
26179
26271
  this.updateImageCrop(image);
26180
26272
  this.resolveAsyncElement(id);
26181
26273
  this.cacheNode(image);
26182
26274
  }
26183
26275
  },
26184
26276
  onError: (error) => {
26277
+ if (!this.config.useFallbackImage) this.tryoutTimeoutId = setTimeout(() => {
26278
+ const node = this.instance.getStage().findOne(`#${id}`);
26279
+ if (node) {
26280
+ this.imageTryoutAttempts[id] = (this.imageTryoutAttempts[id] ?? 0) + 1;
26281
+ this.loadImage(node.getAttrs(), node, false, true);
26282
+ }
26283
+ }, this.config.imageLoading.retryDelayMs);
26284
+ if (loadTryout) {
26285
+ const tryoutAttempts = this.imageTryoutAttempts[id] ?? 0;
26286
+ if (tryoutAttempts < this.config.imageLoading.maxRetryAttempts) this.tryoutTimeoutId = setTimeout(() => {
26287
+ const node = this.instance.getStage().findOne(`#${id}`);
26288
+ if (node) {
26289
+ this.imageTryoutAttempts[id] = tryoutAttempts + 1;
26290
+ this.loadImage(node.getAttrs(), node, false, true);
26291
+ }
26292
+ }, this.config.imageLoading.retryDelayMs);
26293
+ return;
26294
+ }
26295
+ if (this.config.useFallbackImage && !useFallback && !loadTryout && imageProps.imageFallback) {
26296
+ this.loadImage({ ...params }, image, true);
26297
+ return;
26298
+ }
26185
26299
  this.imageState[id] = {
26300
+ status: "error",
26186
26301
  loaded: false,
26187
26302
  error: true
26188
26303
  };
26189
- image.setAttrs({
26190
- image: void 0,
26191
- width: 100,
26192
- height: 100,
26193
- imageInfo: {
26194
- width: 100,
26195
- height: 100
26196
- },
26197
- uncroppedImage: {
26198
- width: 100,
26199
- height: 100
26200
- }
26201
- });
26304
+ image.setAttrs({ image: void 0 });
26202
26305
  this.resolveAsyncElement(id);
26203
26306
  console.error("Error loading image", realImageURL, error);
26204
26307
  imagePlaceholder?.setAttrs({ visible: true });
26205
26308
  internalImage?.setAttrs({ visible: false });
26206
26309
  this.cacheNode(image);
26207
26310
  }
26208
- });
26311
+ }, loadTryout);
26209
26312
  }
26210
26313
  updatePlaceholderSize(image, imagePlaceholder) {
26211
26314
  const imageAttrs = image.getAttrs();
@@ -26226,8 +26329,16 @@ var WeaveImageNode = class extends WeaveNode {
26226
26329
  const internalImage = image?.findOne(`#${imageAttrs.id}-image`);
26227
26330
  if (!this.imageState[imageAttrs.id ?? ""]?.loaded) return;
26228
26331
  if (image && internalImage && !imageAttrs.adding && imageAttrs.cropInfo && imageAttrs.uncroppedImage) {
26332
+ const imageId = imageAttrs.id ?? "";
26229
26333
  const originalImageInfo = imageAttrs.imageInfo;
26230
- const actualImageInfo = this.imageSource[imageAttrs.id ?? ""];
26334
+ let actualImageInfo = {
26335
+ width: this.imageSource[imageId]?.width ?? 0,
26336
+ height: this.imageSource[imageId]?.height ?? 0
26337
+ };
26338
+ if (actualImageInfo.width === 0 && actualImageInfo.height === 0 && this.imageFallback[imageId]) actualImageInfo = {
26339
+ width: this.imageFallback[imageId].width,
26340
+ height: this.imageFallback[imageId].height
26341
+ };
26231
26342
  const originalActualDiffScale = originalImageInfo ? actualImageInfo.width / originalImageInfo.width : 1;
26232
26343
  const actualScale = imageAttrs.uncroppedImage.width / imageAttrs.imageInfo.width;
26233
26344
  const cropScale = imageAttrs.cropInfo ? imageAttrs.cropInfo.scaleX : actualScale;
@@ -26256,6 +26367,9 @@ var WeaveImageNode = class extends WeaveNode {
26256
26367
  internalImage.height(imageAttrs.uncroppedImage.height);
26257
26368
  }
26258
26369
  }
26370
+ getFallbackImageSource(imageId) {
26371
+ return this.imageFallback[imageId];
26372
+ }
26259
26373
  getImageSource(imageId) {
26260
26374
  return this.imageSource[imageId];
26261
26375
  }
@@ -26307,6 +26421,23 @@ var WeaveImageNode = class extends WeaveNode {
26307
26421
  getIsAsync() {
26308
26422
  return true;
26309
26423
  }
26424
+ forceLoadImage(nodeInstance) {
26425
+ const nodeId = nodeInstance.getAttrs().id ?? "";
26426
+ const node = this.instance.getStage().findOne(`#${nodeId}`);
26427
+ if (this.tryoutTimeoutId) {
26428
+ clearTimeout(this.tryoutTimeoutId);
26429
+ this.tryoutTimeoutId = null;
26430
+ }
26431
+ if (node) this.loadImage(node.getAttrs(), node, false, false);
26432
+ }
26433
+ onDestroy(nodeInstance) {
26434
+ const nodeId = nodeInstance.getAttrs().id ?? "";
26435
+ delete this.imageSource[nodeId];
26436
+ delete this.imageState[nodeId];
26437
+ delete this.imageTryoutAttempts[nodeId];
26438
+ delete this.imageFallback[nodeId];
26439
+ nodeInstance.destroy();
26440
+ }
26310
26441
  };
26311
26442
 
26312
26443
  //#endregion
@@ -33364,42 +33495,60 @@ var WeaveTextToolAction = class extends WeaveAction {
33364
33495
 
33365
33496
  //#endregion
33366
33497
  //#region src/actions/image-tool/constants.ts
33367
- const IMAGE_TOOL_ACTION_NAME = "imageTool";
33368
- const IMAGE_TOOL_STATE = {
33498
+ const WEAVE_IMAGE_TOOL_ACTION_NAME = "imageTool";
33499
+ const WEAVE_IMAGE_TOOL_UPLOAD_TYPE = {
33500
+ ["FILE"]: "file",
33501
+ ["IMAGE_URL"]: "imageURL"
33502
+ };
33503
+ const WEAVE_IMAGE_TOOL_STATE = {
33369
33504
  ["IDLE"]: "idle",
33370
33505
  ["DEFINING_POSITION"]: "definingPosition",
33371
33506
  ["SELECTED_POSITION"]: "selectedPosition",
33372
33507
  ["ADDING"]: "adding",
33373
33508
  ["FINISHED"]: "finished"
33374
33509
  };
33375
- const IMAGE_TOOL_LOAD_FROM = {
33376
- ["DATAURL"]: "dataURL",
33377
- ["URL"]: "url"
33378
- };
33510
+ const WEAVE_IMAGE_TOOL_CONFIG_DEFAULT = { style: { cursor: {
33511
+ padding: 5,
33512
+ imageThumbnail: {
33513
+ width: 250,
33514
+ height: 250,
33515
+ shadowColor: "#aaaaaa",
33516
+ shadowBlur: 10,
33517
+ shadowOffset: {
33518
+ x: 2,
33519
+ y: 2
33520
+ },
33521
+ shadowOpacity: .5
33522
+ }
33523
+ } } };
33379
33524
 
33380
33525
  //#endregion
33381
33526
  //#region src/actions/image-tool/image-tool.ts
33382
33527
  var WeaveImageToolAction = class extends WeaveAction {
33383
33528
  initialized = false;
33384
33529
  initialCursor = null;
33385
- cursorPadding = 5;
33386
33530
  forceMainContainer = false;
33531
+ ignoreKeyboardEvents = false;
33532
+ ignorePointerEvents = false;
33533
+ uploadType = null;
33387
33534
  onPropsChange = void 0;
33388
33535
  update = void 0;
33389
- constructor() {
33536
+ constructor(params) {
33390
33537
  super();
33538
+ this.config = mergeExceptArrays(WEAVE_IMAGE_TOOL_CONFIG_DEFAULT, params?.config ?? {});
33391
33539
  this.pointers = new Map();
33392
33540
  this.initialized = false;
33393
- this.state = IMAGE_TOOL_STATE.IDLE;
33541
+ this.state = WEAVE_IMAGE_TOOL_STATE.IDLE;
33394
33542
  this.imageId = null;
33395
33543
  this.tempImageId = null;
33396
33544
  this.tempImageNode = null;
33397
33545
  this.container = void 0;
33398
33546
  this.imageURL = null;
33547
+ this.uploadType = null;
33399
33548
  this.clickPoint = null;
33400
33549
  }
33401
33550
  getName() {
33402
- return IMAGE_TOOL_ACTION_NAME;
33551
+ return WEAVE_IMAGE_TOOL_ACTION_NAME;
33403
33552
  }
33404
33553
  initProps() {
33405
33554
  return {
@@ -33413,14 +33562,15 @@ var WeaveImageToolAction = class extends WeaveAction {
33413
33562
  this.instance.addEventListener("onStageDrop", (e) => {
33414
33563
  const dragId = this.instance.getDragStartedId();
33415
33564
  const dragProperties = this.instance.getDragProperties();
33416
- if (dragProperties && dragId === IMAGE_TOOL_ACTION_NAME) {
33565
+ if (dragProperties && dragId === WEAVE_IMAGE_TOOL_ACTION_NAME) {
33417
33566
  this.instance.getStage().setPointersPositions(e);
33418
33567
  const position = getPositionRelativeToContainerOnPosition(this.instance);
33419
- this.instance.triggerAction(IMAGE_TOOL_ACTION_NAME, {
33568
+ this.instance.triggerAction(WEAVE_IMAGE_TOOL_ACTION_NAME, {
33569
+ type: WEAVE_IMAGE_TOOL_UPLOAD_TYPE.IMAGE_URL,
33420
33570
  imageURL: dragProperties.imageURL,
33421
- ...dragProperties.imageId && { imageId: dragProperties.imageId },
33422
- ...dragProperties.imageWidth && { imageWidth: dragProperties.imageWidth },
33423
- ...dragProperties.imageHeight && { imageHeight: dragProperties.imageHeight },
33571
+ imageFallback: dragProperties.imageFallback,
33572
+ imageWidth: dragProperties.imageWidth,
33573
+ imageHeight: dragProperties.imageHeight,
33424
33574
  position
33425
33575
  });
33426
33576
  }
@@ -33429,86 +33579,100 @@ var WeaveImageToolAction = class extends WeaveAction {
33429
33579
  setupEvents() {
33430
33580
  const stage = this.instance.getStage();
33431
33581
  window.addEventListener("keydown", (e) => {
33432
- if (e.code === "Escape" && this.instance.getActiveAction() === IMAGE_TOOL_ACTION_NAME) {
33582
+ if (e.code === "Escape" && this.instance.getActiveAction() === WEAVE_IMAGE_TOOL_ACTION_NAME && !this.ignoreKeyboardEvents) {
33433
33583
  this.cancelAction();
33434
33584
  return;
33435
33585
  }
33436
33586
  });
33437
33587
  stage.on("pointerdown", (e) => {
33438
33588
  this.setTapStart(e);
33589
+ if (this.ignorePointerEvents) return;
33439
33590
  this.pointers.set(e.evt.pointerId, {
33440
33591
  x: e.evt.clientX,
33441
33592
  y: e.evt.clientY
33442
33593
  });
33443
- if (this.pointers.size === 2 && this.instance.getActiveAction() === IMAGE_TOOL_ACTION_NAME) {
33444
- this.state = IMAGE_TOOL_STATE.DEFINING_POSITION;
33594
+ if (this.pointers.size === 2 && this.instance.getActiveAction() === WEAVE_IMAGE_TOOL_ACTION_NAME) {
33595
+ this.state = WEAVE_IMAGE_TOOL_STATE.DEFINING_POSITION;
33445
33596
  return;
33446
33597
  }
33447
- if (this.state === IMAGE_TOOL_STATE.DEFINING_POSITION) this.state = IMAGE_TOOL_STATE.SELECTED_POSITION;
33598
+ if (this.state === WEAVE_IMAGE_TOOL_STATE.DEFINING_POSITION) this.state = WEAVE_IMAGE_TOOL_STATE.SELECTED_POSITION;
33448
33599
  });
33449
33600
  stage.on("pointermove", (e) => {
33450
- if (this.state === IMAGE_TOOL_STATE.IDLE) return;
33601
+ if (this.ignorePointerEvents) return;
33602
+ if (this.state === WEAVE_IMAGE_TOOL_STATE.IDLE) return;
33451
33603
  this.setCursor();
33452
- if (this.pointers.size === 2 && this.instance.getActiveAction() === IMAGE_TOOL_ACTION_NAME) {
33453
- this.state = IMAGE_TOOL_STATE.DEFINING_POSITION;
33604
+ if (this.pointers.size === 2 && this.instance.getActiveAction() === WEAVE_IMAGE_TOOL_ACTION_NAME) {
33605
+ this.state = WEAVE_IMAGE_TOOL_STATE.DEFINING_POSITION;
33454
33606
  return;
33455
33607
  }
33456
- if ([IMAGE_TOOL_STATE.DEFINING_POSITION, IMAGE_TOOL_STATE.SELECTED_POSITION].includes(this.state) && this.tempImageNode && this.instance.getActiveAction() === IMAGE_TOOL_ACTION_NAME && e.evt.pointerType === "mouse") {
33608
+ if ([WEAVE_IMAGE_TOOL_STATE.DEFINING_POSITION, WEAVE_IMAGE_TOOL_STATE.SELECTED_POSITION].includes(this.state) && this.tempImageNode && this.instance.getActiveAction() === WEAVE_IMAGE_TOOL_ACTION_NAME && e.evt.pointerType === "mouse") {
33457
33609
  const mousePos = stage.getRelativePointerPosition();
33610
+ const cursorPadding = this.config.style.cursor.padding;
33458
33611
  this.tempImageNode.setAttrs({
33459
- x: (mousePos?.x ?? 0) + this.cursorPadding,
33460
- y: (mousePos?.y ?? 0) + this.cursorPadding
33612
+ x: (mousePos?.x ?? 0) + cursorPadding / stage.scaleX(),
33613
+ y: (mousePos?.y ?? 0) + cursorPadding / stage.scaleX()
33461
33614
  });
33462
33615
  }
33463
33616
  });
33464
33617
  stage.on("pointerup", (e) => {
33618
+ if (this.ignorePointerEvents) return;
33465
33619
  this.pointers.delete(e.evt.pointerId);
33466
- if (this.state === IMAGE_TOOL_STATE.SELECTED_POSITION) this.handleAdding();
33620
+ if (this.state === WEAVE_IMAGE_TOOL_STATE.SELECTED_POSITION) this.handleAdding();
33467
33621
  });
33468
33622
  this.initialized = true;
33469
33623
  }
33470
33624
  setState(state) {
33471
33625
  this.state = state;
33472
33626
  }
33473
- loadImage(imageData, kind, position) {
33627
+ async loadImage(imageData, downscalingRatio, position) {
33474
33628
  this.setCursor();
33475
33629
  this.setFocusStage();
33476
33630
  if (!this.imageId) {
33477
33631
  this.cancelAction();
33478
33632
  return;
33479
33633
  }
33480
- this.imageURL = kind === IMAGE_TOOL_LOAD_FROM.DATAURL ? "not-defined" : imageData;
33481
33634
  const imageNodeHandler = this.getImageNodeHandler();
33482
- if (!imageNodeHandler) {
33483
- this.cancelAction();
33484
- return;
33485
- }
33486
- if (IMAGE_TOOL_LOAD_FROM.URL === kind) {
33487
- this.props = {
33488
- ...this.props,
33489
- imageURL: this.imageURL,
33490
- width: this.props.loadImageWidth,
33491
- height: this.props.loadImageHeight
33635
+ if (!imageNodeHandler) return;
33636
+ const actualImageId = this.imageId;
33637
+ if (imageData instanceof File && downscalingRatio) {
33638
+ const realImageSize = await this.getImageSizeFromFile(imageData);
33639
+ const downscaledImage = await this.downscaleImageFile(imageData, downscalingRatio);
33640
+ const reader = new FileReader();
33641
+ reader.onloadend = () => {
33642
+ imageNodeHandler.preloadFallbackImage(actualImageId, reader.result, {
33643
+ onLoad: () => {
33644
+ this.instance.emitEvent("onImageLoadEnd", void 0);
33645
+ this.props = {
33646
+ ...this.props,
33647
+ imageFallback: reader.result,
33648
+ imageURL: void 0,
33649
+ width: realImageSize.width,
33650
+ height: realImageSize.height
33651
+ };
33652
+ this.addImageNode(position);
33653
+ },
33654
+ onError: () => {
33655
+ this.instance.emitEvent("onImageLoadEnd", new Error("Error loading image"));
33656
+ this.cancelAction();
33657
+ }
33658
+ });
33492
33659
  };
33493
- this.addImageNode(position);
33494
- }
33495
- imageNodeHandler.preloadImage(this.imageId, imageData, {
33496
- onLoad: () => {
33497
- this.instance.emitEvent("onImageLoadEnd", void 0);
33498
- const imageSource = imageNodeHandler.getImageSource(this.imageId);
33499
- if (imageSource && this.imageId) this.props = {
33500
- ...this.props,
33501
- imageURL: this.imageURL,
33502
- width: imageSource.width,
33503
- height: imageSource.height
33504
- };
33505
- this.addImageNode(position);
33506
- },
33507
- onError: () => {
33508
- this.instance.emitEvent("onImageLoadEnd", new Error("Error loading image"));
33660
+ reader.onerror = () => {};
33661
+ reader.readAsDataURL(downscaledImage);
33662
+ } else {
33663
+ const actualImageData = imageData;
33664
+ this.imageURL = actualImageData;
33665
+ if (!imageNodeHandler) {
33509
33666
  this.cancelAction();
33667
+ return;
33510
33668
  }
33511
- });
33669
+ if (WEAVE_IMAGE_TOOL_UPLOAD_TYPE.IMAGE_URL === this.uploadType) {
33670
+ setTimeout(() => {
33671
+ this.saveImageUrl(actualImageId, actualImageData);
33672
+ }, 0);
33673
+ this.addImageNode(position);
33674
+ }
33675
+ }
33512
33676
  this.instance.emitEvent("onImageLoadStart");
33513
33677
  }
33514
33678
  isTouchDevice() {
@@ -33519,7 +33683,7 @@ var WeaveImageToolAction = class extends WeaveAction {
33519
33683
  this.setCursor();
33520
33684
  this.setFocusStage();
33521
33685
  if (position) {
33522
- this.setState(IMAGE_TOOL_STATE.SELECTED_POSITION);
33686
+ this.setState(WEAVE_IMAGE_TOOL_STATE.SELECTED_POSITION);
33523
33687
  this.handleAdding(position);
33524
33688
  return;
33525
33689
  }
@@ -33531,33 +33695,45 @@ var WeaveImageToolAction = class extends WeaveAction {
33531
33695
  this.cancelAction();
33532
33696
  return;
33533
33697
  }
33534
- const imageSource = imageNodeHandler.getImageSource(this.imageId);
33698
+ let imageSource = imageNodeHandler.getImageSource(this.imageId);
33699
+ if (this.uploadType === "file") imageSource = imageNodeHandler.getFallbackImageSource(this.imageId);
33535
33700
  if (!imageSource) {
33536
33701
  this.cancelAction();
33537
33702
  return;
33538
33703
  }
33539
33704
  const aspectRatio = imageSource.width / imageSource.height;
33540
33705
  if (!this.tempImageNode && this.tempImageId && !this.isTouchDevice()) {
33706
+ const cursorPadding = this.config.style.cursor.padding;
33707
+ const imageThumbnailWidth = this.config.style.cursor.imageThumbnail.width;
33708
+ const imageThumbnailHeight = this.config.style.cursor.imageThumbnail.height;
33709
+ const shadowColor = this.config.style.cursor.imageThumbnail.shadowColor;
33710
+ const shadowBlur = this.config.style.cursor.imageThumbnail.shadowBlur;
33711
+ const shadowOffset = this.config.style.cursor.imageThumbnail.shadowOffset;
33712
+ const shadowOpacity = this.config.style.cursor.imageThumbnail.shadowOpacity;
33541
33713
  this.tempImageNode = new Konva.Image({
33542
33714
  id: this.tempImageId,
33543
- x: (mousePos?.x ?? 0) + this.cursorPadding,
33544
- y: (mousePos?.y ?? 0) + this.cursorPadding,
33545
- width: 240 * aspectRatio * (1 / stage.scaleX()),
33546
- height: 240 * (1 / stage.scaleY()),
33715
+ x: (mousePos?.x ?? 0) + cursorPadding / stage.scaleX(),
33716
+ y: (mousePos?.y ?? 0) + cursorPadding / stage.scaleY(),
33717
+ width: imageThumbnailWidth * aspectRatio * (1 / stage.scaleX()),
33718
+ height: imageThumbnailHeight * (1 / stage.scaleY()),
33547
33719
  opacity: 1,
33548
33720
  adding: true,
33549
33721
  image: imageSource,
33550
33722
  stroke: "#000000ff",
33551
33723
  strokeWidth: 0,
33552
33724
  strokeScaleEnabled: true,
33553
- listening: false
33725
+ listening: false,
33726
+ shadowColor,
33727
+ shadowBlur,
33728
+ shadowOffset,
33729
+ shadowOpacity
33554
33730
  });
33555
33731
  this.instance.getMainLayer()?.add(this.tempImageNode);
33556
33732
  }
33557
33733
  this.instance.emitEvent("onAddingImage", { imageURL: this.props.imageURL });
33558
33734
  }
33559
33735
  this.clickPoint = null;
33560
- this.setState(IMAGE_TOOL_STATE.DEFINING_POSITION);
33736
+ this.setState(WEAVE_IMAGE_TOOL_STATE.DEFINING_POSITION);
33561
33737
  }
33562
33738
  handleAdding(position) {
33563
33739
  if (this.imageId) {
@@ -33566,7 +33742,8 @@ var WeaveImageToolAction = class extends WeaveAction {
33566
33742
  this.cancelAction();
33567
33743
  return;
33568
33744
  }
33569
- const imageSource = imageNodeHandler.getImageSource(this.imageId);
33745
+ let imageSource = imageNodeHandler.getImageSource(this.imageId);
33746
+ if (this.uploadType === "file") imageSource = imageNodeHandler.getFallbackImageSource(this.imageId);
33570
33747
  if (!imageSource && !position) {
33571
33748
  this.cancelAction();
33572
33749
  return;
@@ -33575,8 +33752,8 @@ var WeaveImageToolAction = class extends WeaveAction {
33575
33752
  this.clickPoint = mousePoint;
33576
33753
  this.container = container;
33577
33754
  const nodeHandler = this.instance.getNodeHandler("image");
33578
- const imageWidth = this.props.loadImageWidth ? this.props.loadImageWidth : imageSource?.width;
33579
- const imageHeight = this.props.loadImageHeight ? this.props.loadImageHeight : imageSource?.height;
33755
+ const imageWidth = this.props.width ? this.props.width : imageSource?.width;
33756
+ const imageHeight = this.props.height ? this.props.height : imageSource?.height;
33580
33757
  if (nodeHandler) {
33581
33758
  const node = nodeHandler.create(this.imageId, {
33582
33759
  ...this.props,
@@ -33584,7 +33761,7 @@ var WeaveImageToolAction = class extends WeaveAction {
33584
33761
  y: this.clickPoint?.y ?? 0,
33585
33762
  opacity: 1,
33586
33763
  adding: false,
33587
- imageURL: this.imageURL,
33764
+ imageURL: this.imageURL ?? void 0,
33588
33765
  stroke: "#000000ff",
33589
33766
  strokeWidth: 0,
33590
33767
  strokeScaleEnabled: true,
@@ -33593,6 +33770,10 @@ var WeaveImageToolAction = class extends WeaveAction {
33593
33770
  imageInfo: {
33594
33771
  width: imageWidth,
33595
33772
  height: imageHeight
33773
+ },
33774
+ uncroppedImage: {
33775
+ width: imageWidth,
33776
+ height: imageHeight
33596
33777
  }
33597
33778
  });
33598
33779
  this.instance.addNode(node, this.forceMainContainer ? this.instance.getMainLayer()?.getAttrs().id : this.container?.getAttrs().id);
@@ -33601,7 +33782,7 @@ var WeaveImageToolAction = class extends WeaveAction {
33601
33782
  nodeId: this.imageId
33602
33783
  });
33603
33784
  }
33604
- this.setState(IMAGE_TOOL_STATE.FINISHED);
33785
+ this.setState(WEAVE_IMAGE_TOOL_STATE.FINISHED);
33605
33786
  }
33606
33787
  this.cancelAction();
33607
33788
  }
@@ -33611,14 +33792,35 @@ var WeaveImageToolAction = class extends WeaveAction {
33611
33792
  this.cancelAction = cancelAction;
33612
33793
  const selectionPlugin = this.instance.getPlugin("nodesSelection");
33613
33794
  if (selectionPlugin) selectionPlugin.setSelectedNodes([]);
33795
+ this.ignorePointerEvents = false;
33796
+ this.ignoreKeyboardEvents = false;
33614
33797
  this.forceMainContainer = params?.forceMainContainer ?? false;
33798
+ this.imageURL = null;
33615
33799
  this.imageId = v4_default();
33616
33800
  this.props = this.initProps();
33617
33801
  if (params?.imageId) this.updateProps({ imageId: params.imageId });
33618
- if (params?.imageId) this.updateProps({ loadImageWidth: params.imageWidth });
33619
- if (params?.imageId) this.updateProps({ loadImageHeight: params.imageHeight });
33620
- if (params.imageData) this.loadImage(params.imageData, IMAGE_TOOL_LOAD_FROM.DATAURL, params?.position ?? void 0);
33621
- if (params.imageURL) this.loadImage(params.imageURL, IMAGE_TOOL_LOAD_FROM.URL, params?.position ?? void 0);
33802
+ if (this.forceExecution) {
33803
+ this.ignorePointerEvents = true;
33804
+ this.ignoreKeyboardEvents = true;
33805
+ }
33806
+ if (params?.position) this.setState(WEAVE_IMAGE_TOOL_STATE.SELECTED_POSITION);
33807
+ if (params.type === WEAVE_IMAGE_TOOL_UPLOAD_TYPE.FILE && params.imageFile && params.imageDownscaleRatio) {
33808
+ this.uploadType = WEAVE_IMAGE_TOOL_UPLOAD_TYPE.FILE;
33809
+ this.loadImage(params.imageFile, params.imageDownscaleRatio, params?.position ?? void 0);
33810
+ }
33811
+ if (params.type === WEAVE_IMAGE_TOOL_UPLOAD_TYPE.IMAGE_URL && params.imageURL && params.imageFallback && params.imageWidth && params.imageHeight) {
33812
+ this.uploadType = WEAVE_IMAGE_TOOL_UPLOAD_TYPE.IMAGE_URL;
33813
+ this.updateProps({
33814
+ imageFallback: params.imageFallback,
33815
+ width: params.imageWidth,
33816
+ height: params.imageHeight
33817
+ });
33818
+ this.loadImage(params.imageURL, void 0, params?.position ?? void 0);
33819
+ }
33820
+ if (![WEAVE_IMAGE_TOOL_UPLOAD_TYPE.FILE, WEAVE_IMAGE_TOOL_UPLOAD_TYPE.IMAGE_URL].includes(params.type)) {
33821
+ this.cancelAction();
33822
+ return;
33823
+ }
33622
33824
  return {
33623
33825
  nodeId: this.imageId,
33624
33826
  finishUploadCallback: (nodeId, imageURL) => {
@@ -33628,38 +33830,516 @@ var WeaveImageToolAction = class extends WeaveAction {
33628
33830
  }
33629
33831
  saveImageUrl(nodeId, imageURL) {
33630
33832
  this.imageURL = imageURL;
33631
- if (this.state !== IMAGE_TOOL_STATE.DEFINING_POSITION) {
33833
+ const stage = this.instance.getStage();
33834
+ const nodeHandler = this.instance.getNodeHandler("image");
33835
+ const node = stage.findOne(`#${nodeId}`);
33836
+ if (nodeHandler && node) {
33837
+ node.setAttr("imageURL", imageURL);
33838
+ nodeHandler.forceLoadImage(node);
33839
+ this.instance.updateNode(nodeHandler.serialize(node), { origin: "system" });
33840
+ }
33841
+ }
33842
+ cleanup() {
33843
+ const stage = this.instance.getStage();
33844
+ if (this.tempImageNode) this.tempImageNode.destroy();
33845
+ if (!this.forceExecution) {
33846
+ const selectionPlugin = this.instance.getPlugin("nodesSelection");
33847
+ if (selectionPlugin) {
33848
+ const node = stage.findOne(`#${this.imageId}`);
33849
+ if (node) selectionPlugin.setSelectedNodes([node]);
33850
+ this.instance.triggerAction(SELECTION_TOOL_ACTION_NAME);
33851
+ }
33852
+ stage.container().style.cursor = "default";
33853
+ this.instance.endDrag(WEAVE_IMAGE_TOOL_ACTION_NAME);
33854
+ }
33855
+ this.initialCursor = null;
33856
+ this.forceMainContainer = false;
33857
+ this.container = void 0;
33858
+ this.tempImageNode = null;
33859
+ this.imageURL = null;
33860
+ this.clickPoint = null;
33861
+ this.setState(WEAVE_IMAGE_TOOL_STATE.IDLE);
33862
+ }
33863
+ getImageNodeHandler() {
33864
+ return this.instance.getNodeHandler("image");
33865
+ }
33866
+ setCursor() {
33867
+ const stage = this.instance.getStage();
33868
+ stage.container().style.cursor = "crosshair";
33869
+ }
33870
+ setFocusStage() {
33871
+ const stage = this.instance.getStage();
33872
+ stage.container().tabIndex = 1;
33873
+ stage.container().blur();
33874
+ stage.container().focus();
33875
+ }
33876
+ getImageSizeFromFile(file) {
33877
+ return new Promise((resolve, reject) => {
33878
+ const img = new Image();
33879
+ const url = URL.createObjectURL(file);
33880
+ img.onload = () => {
33881
+ resolve({
33882
+ width: img.naturalWidth,
33883
+ height: img.naturalHeight
33884
+ });
33885
+ URL.revokeObjectURL(url);
33886
+ };
33887
+ img.onerror = reject;
33888
+ img.src = url;
33889
+ });
33890
+ }
33891
+ async downscaleImageFile(file, ratio) {
33892
+ const bitmap = await createImageBitmap(file);
33893
+ const width = Math.round(bitmap.width * ratio);
33894
+ const height = Math.round(bitmap.height * ratio);
33895
+ const canvas = document.createElement("canvas");
33896
+ canvas.width = width;
33897
+ canvas.height = height;
33898
+ const ctx = canvas.getContext("2d");
33899
+ ctx.drawImage(bitmap, 0, 0, width, height);
33900
+ return new Promise((resolve) => {
33901
+ canvas.toBlob((blob) => resolve(blob), file.type, .9);
33902
+ });
33903
+ }
33904
+ setDragAndDropProperties(properties) {
33905
+ this.instance.startDrag(WEAVE_IMAGE_TOOL_ACTION_NAME);
33906
+ this.instance.setDragProperties(properties);
33907
+ }
33908
+ getActualState() {
33909
+ return this.state;
33910
+ }
33911
+ };
33912
+
33913
+ //#endregion
33914
+ //#region src/actions/images-tool/constants.ts
33915
+ const WEAVE_IMAGES_TOOL_ACTION_NAME = "imagesTool";
33916
+ const WEAVE_IMAGES_TOOL_UPLOAD_TYPE = {
33917
+ ["FILE"]: "file",
33918
+ ["IMAGE_URL"]: "imageURL"
33919
+ };
33920
+ const WEAVE_IMAGES_TOOL_STATE = {
33921
+ ["IDLE"]: "idle",
33922
+ ["UPLOADING"]: "uploading",
33923
+ ["DEFINING_POSITION"]: "definingPosition",
33924
+ ["SELECTED_POSITION"]: "selectedPosition",
33925
+ ["ADDING"]: "adding",
33926
+ ["FINISHED"]: "finished"
33927
+ };
33928
+ const WEAVE_IMAGES_TOOL_DEFAULT_CONFIG = {
33929
+ style: {
33930
+ cursor: {
33931
+ padding: 5,
33932
+ imageThumbnails: {
33933
+ padding: 15,
33934
+ width: 250,
33935
+ height: 250,
33936
+ shadowColor: "#aaaaaa",
33937
+ shadowBlur: 10,
33938
+ shadowOffset: {
33939
+ x: 2,
33940
+ y: 2
33941
+ },
33942
+ shadowOpacity: .5
33943
+ }
33944
+ },
33945
+ moreImages: {
33946
+ paddingX: 12,
33947
+ paddingY: 8,
33948
+ fontSize: 16,
33949
+ fontFamily: "Arial",
33950
+ textColor: "#000000",
33951
+ backgroundColor: "#FFFFFF",
33952
+ backgroundOpacity: 1
33953
+ },
33954
+ images: { padding: 20 }
33955
+ },
33956
+ layout: { columns: 4 }
33957
+ };
33958
+
33959
+ //#endregion
33960
+ //#region src/utils/generic.ts
33961
+ function sleep(ms) {
33962
+ return new Promise((resolve) => setTimeout(resolve, ms));
33963
+ }
33964
+
33965
+ //#endregion
33966
+ //#region src/actions/images-tool/images-tool.ts
33967
+ var WeaveImagesToolAction = class extends WeaveAction {
33968
+ initialized = false;
33969
+ initialCursor = null;
33970
+ nodesIds = [];
33971
+ imagesIds = [];
33972
+ imagesSize = [];
33973
+ imagesDownscaleRatio = [];
33974
+ imagesFallback = [];
33975
+ images = null;
33976
+ imagesURLs = null;
33977
+ forceMainContainer = false;
33978
+ onStartUploading = () => {};
33979
+ onFinishedUploading = () => {};
33980
+ uploadType = null;
33981
+ onPropsChange = void 0;
33982
+ update = void 0;
33983
+ constructor(params) {
33984
+ super();
33985
+ this.config = mergeExceptArrays(WEAVE_IMAGES_TOOL_DEFAULT_CONFIG, params ?? {});
33986
+ this.pointers = new Map();
33987
+ this.initialized = false;
33988
+ this.tempPointerFeedbackNode = null;
33989
+ this.state = WEAVE_IMAGES_TOOL_STATE.IDLE;
33990
+ this.images = [];
33991
+ this.container = void 0;
33992
+ this.preloadImgs = {};
33993
+ this.uploadType = null;
33994
+ this.clickPoint = null;
33995
+ }
33996
+ getName() {
33997
+ return WEAVE_IMAGES_TOOL_ACTION_NAME;
33998
+ }
33999
+ getPreloadedImage(imageId) {
34000
+ return this.preloadImgs?.[imageId];
34001
+ }
34002
+ initProps() {
34003
+ return {
34004
+ width: 100,
34005
+ height: 100,
34006
+ scaleX: 1,
34007
+ scaleY: 1
34008
+ };
34009
+ }
34010
+ onInit() {
34011
+ this.instance.addEventListener("onStageDrop", (e) => {
34012
+ const dragId = this.instance.getDragStartedId();
34013
+ const dragProperties = this.instance.getDragProperties();
34014
+ if (dragProperties && dragId === WEAVE_IMAGES_TOOL_ACTION_NAME) {
34015
+ this.instance.getStage().setPointersPositions(e);
34016
+ const position = getPositionRelativeToContainerOnPosition(this.instance);
34017
+ this.instance.triggerAction(WEAVE_IMAGES_TOOL_ACTION_NAME, {
34018
+ type: WEAVE_IMAGES_TOOL_UPLOAD_TYPE.IMAGE_URL,
34019
+ imagesURLs: dragProperties.imagesURls,
34020
+ imagesSize: dragProperties.imagesSize,
34021
+ imagesFallback: dragProperties.imagesFallback,
34022
+ imagesIds: dragProperties.imagesIds,
34023
+ position
34024
+ });
34025
+ }
34026
+ });
34027
+ }
34028
+ setupEvents() {
34029
+ const stage = this.instance.getStage();
34030
+ stage.container().addEventListener("keydown", (e) => {
34031
+ if (e.key === "Escape" && this.instance.getActiveAction() === WEAVE_IMAGES_TOOL_ACTION_NAME) {
34032
+ this.cancelAction();
34033
+ return;
34034
+ }
34035
+ });
34036
+ stage.on("pointerdown", (e) => {
34037
+ this.setTapStart(e);
34038
+ this.pointers.set(e.evt.pointerId, {
34039
+ x: e.evt.clientX,
34040
+ y: e.evt.clientY
34041
+ });
34042
+ if (this.pointers.size === 2 && this.instance.getActiveAction() === WEAVE_IMAGES_TOOL_ACTION_NAME) {
34043
+ this.state = WEAVE_IMAGES_TOOL_STATE.DEFINING_POSITION;
34044
+ return;
34045
+ }
34046
+ if (this.state === WEAVE_IMAGES_TOOL_STATE.DEFINING_POSITION) this.state = WEAVE_IMAGES_TOOL_STATE.SELECTED_POSITION;
34047
+ });
34048
+ stage.on("pointermove", (e) => {
34049
+ if (this.state === WEAVE_IMAGES_TOOL_STATE.IDLE) return;
34050
+ this.setCursor();
34051
+ this.setFocusStage();
34052
+ if (this.pointers.size === 2 && this.instance.getActiveAction() === WEAVE_IMAGES_TOOL_ACTION_NAME) {
34053
+ this.state = WEAVE_IMAGES_TOOL_STATE.DEFINING_POSITION;
34054
+ return;
34055
+ }
34056
+ if ([WEAVE_IMAGES_TOOL_STATE.DEFINING_POSITION, WEAVE_IMAGES_TOOL_STATE.SELECTED_POSITION].includes(this.state) && this.tempPointerFeedbackNode && this.instance.getActiveAction() === WEAVE_IMAGES_TOOL_ACTION_NAME && e.evt.pointerType === "mouse") {
34057
+ const mousePos = stage.getRelativePointerPosition();
34058
+ const cursorPadding = this.config.style.cursor.padding;
34059
+ this.tempPointerFeedbackNode.setAttrs({
34060
+ x: (mousePos?.x ?? 0) + cursorPadding / stage.scaleX(),
34061
+ y: (mousePos?.y ?? 0) + cursorPadding / stage.scaleY()
34062
+ });
34063
+ }
34064
+ });
34065
+ stage.on("pointerup", (e) => {
34066
+ this.pointers.delete(e.evt.pointerId);
34067
+ if (this.state === WEAVE_IMAGES_TOOL_STATE.SELECTED_POSITION) this.handleAdding();
34068
+ });
34069
+ this.initialized = true;
34070
+ }
34071
+ setState(state) {
34072
+ this.state = state;
34073
+ }
34074
+ async addImages(position) {
34075
+ const stage = this.instance.getStage();
34076
+ this.setCursor();
34077
+ this.setFocusStage();
34078
+ if (position) {
34079
+ this.setState(WEAVE_IMAGES_TOOL_STATE.SELECTED_POSITION);
34080
+ this.handleAdding(position);
34081
+ return;
34082
+ }
34083
+ if (!this.tempPointerFeedbackNode && !this.isTouchDevice() && this.images && this.uploadType === WEAVE_IMAGES_TOOL_UPLOAD_TYPE.FILE) {
34084
+ const mousePos = stage.getRelativePointerPosition();
34085
+ const cursorPadding = this.config.style.cursor.padding;
34086
+ const imageThumbnailsPadding = this.config.style.cursor.imageThumbnails.padding;
34087
+ this.tempPointerFeedbackNode = new Konva.Group({
34088
+ x: (mousePos?.x ?? 0) + cursorPadding / stage.scaleX(),
34089
+ y: (mousePos?.y ?? 0) + cursorPadding / stage.scaleY(),
34090
+ listening: false
34091
+ });
34092
+ const imagesTop3 = this.images.slice(0, 3) ?? [];
34093
+ let maxWidth = 0;
34094
+ let maxHeight = 0;
34095
+ let position$1 = {
34096
+ x: 0,
34097
+ y: 0
34098
+ };
34099
+ for (const image of imagesTop3) {
34100
+ const imageSource = await this.loadImageSource(image);
34101
+ const maxImageWidth = this.config.style.cursor.imageThumbnails.width;
34102
+ const maxImageHeight = this.config.style.cursor.imageThumbnails.height;
34103
+ const shadowColor = this.config.style.cursor.imageThumbnails.shadowColor;
34104
+ const shadowBlur = this.config.style.cursor.imageThumbnails.shadowBlur;
34105
+ const shadowOffset = this.config.style.cursor.imageThumbnails.shadowOffset;
34106
+ const shadowOpacity = this.config.style.cursor.imageThumbnails.shadowOpacity;
34107
+ const aspectRatio = imageSource.width / imageSource.height || 1;
34108
+ const imageWidth = maxImageWidth * aspectRatio * (1 / stage.scaleX());
34109
+ const imageHeight = maxImageHeight * (1 / stage.scaleY());
34110
+ const imageNode = new Konva.Image({
34111
+ x: position$1.x,
34112
+ y: position$1.y,
34113
+ width: imageWidth,
34114
+ height: imageHeight,
34115
+ opacity: 1,
34116
+ adding: true,
34117
+ image: imageSource,
34118
+ stroke: "#000000ff",
34119
+ strokeWidth: 0,
34120
+ strokeScaleEnabled: true,
34121
+ listening: false,
34122
+ shadowColor,
34123
+ shadowBlur,
34124
+ shadowOffset,
34125
+ shadowOpacity
34126
+ });
34127
+ maxWidth = position$1.x + imageWidth;
34128
+ maxHeight = Math.max(maxHeight, position$1.y + imageHeight);
34129
+ position$1 = {
34130
+ x: position$1.x + imageThumbnailsPadding / stage.scaleX(),
34131
+ y: position$1.y + imageThumbnailsPadding / stage.scaleY()
34132
+ };
34133
+ this.tempPointerFeedbackNode.add(imageNode);
34134
+ imageNode.moveToBottom();
34135
+ }
34136
+ if (this.images.length > 3) {
34137
+ const paddingX = this.config.style.moreImages.paddingX;
34138
+ const paddingY = this.config.style.moreImages.paddingY;
34139
+ const fontSize = this.config.style.moreImages.fontSize;
34140
+ const fontFamily = this.config.style.moreImages.fontFamily;
34141
+ const textColor = this.config.style.moreImages.textColor;
34142
+ const backgroundColor = this.config.style.moreImages.backgroundColor;
34143
+ const backgroundOpacity = this.config.style.moreImages.backgroundOpacity;
34144
+ const text = `and ${this.images.length - 3} more image(s)`;
34145
+ const textNode = new Konva.Text({
34146
+ x: maxWidth + paddingX / stage.scaleX() + cursorPadding / stage.scaleX(),
34147
+ y: position$1.y,
34148
+ fontFamily,
34149
+ fontSize: fontSize / stage.scaleX(),
34150
+ text,
34151
+ fill: textColor,
34152
+ listening: false
34153
+ });
34154
+ const textSize = textNode.measureSize(text);
34155
+ textNode.y((maxHeight - textSize.height) / 2);
34156
+ this.tempPointerFeedbackNode.add(textNode);
34157
+ const textBg = new Konva.Rect({
34158
+ x: textNode.x() - paddingX / stage.scaleX(),
34159
+ y: textNode.y() - paddingY / stage.scaleY(),
34160
+ width: textNode.width() + 2 * paddingX / stage.scaleX(),
34161
+ height: textNode.height() + 2 * paddingY / stage.scaleY(),
34162
+ fill: backgroundColor,
34163
+ opacity: backgroundOpacity
34164
+ });
34165
+ this.tempPointerFeedbackNode.add(textBg);
34166
+ textBg.moveToBottom();
34167
+ textNode.moveToTop();
34168
+ }
34169
+ this.instance.getUtilityLayer()?.add(this.tempPointerFeedbackNode);
34170
+ }
34171
+ this.clickPoint = null;
34172
+ this.setState(WEAVE_IMAGES_TOOL_STATE.DEFINING_POSITION);
34173
+ }
34174
+ async handleAdding(position) {
34175
+ const stage = this.instance.getStage();
34176
+ this.tempPointerFeedbackNode?.destroy();
34177
+ this.tempPointerFeedbackNode = null;
34178
+ this.instance.getUtilityLayer()?.batchDraw();
34179
+ stage.container().style.cursor = "default";
34180
+ const { mousePoint, container } = this.instance.getMousePointer(position);
34181
+ this.clickPoint = mousePoint;
34182
+ this.container = container;
34183
+ const originPoint = {
34184
+ x: this.clickPoint?.x ?? 0,
34185
+ y: this.clickPoint?.y ?? 0
34186
+ };
34187
+ if (!this.images && !this.imagesURLs) return;
34188
+ const imageToolActionHandler = this.instance.getActionHandler(WEAVE_IMAGE_TOOL_ACTION_NAME);
34189
+ if (!imageToolActionHandler) return;
34190
+ const imagesPadding = this.config.style.images.padding;
34191
+ const layoutColumns = this.config.layout.columns;
34192
+ const uploadImagesPromises = [];
34193
+ let imagePositionX = originPoint.x;
34194
+ let imagePositionY = originPoint.y;
34195
+ let maxHeight = 0;
34196
+ if (this.uploadType === WEAVE_IMAGES_TOOL_UPLOAD_TYPE.FILE && this.images) {
34197
+ for (let i = 0; i < this.images.length; i++) {
34198
+ const file = this.images[i];
34199
+ const downscaleRatio = this.imagesDownscaleRatio[i];
34200
+ const resourceId = this.imagesIds[i];
34201
+ const { nodeId, finishUploadCallback } = this.instance.triggerAction(
34202
+ WEAVE_IMAGE_TOOL_ACTION_NAME,
34203
+ {
34204
+ type: "file",
34205
+ imageFile: file,
34206
+ imageDownscaleRatio: downscaleRatio,
34207
+ imageId: resourceId,
34208
+ position: {
34209
+ x: imagePositionX,
34210
+ y: imagePositionY
34211
+ },
34212
+ forceMainContainer: this.forceMainContainer
34213
+ },
34214
+ true
34215
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
34216
+ );
34217
+ this.nodesIds.push(nodeId);
34218
+ maxHeight = Math.max(maxHeight, this.imagesSize[i].height);
34219
+ imagePositionX += imagesPadding + this.imagesSize[i].width;
34220
+ if ((i + 1) % layoutColumns === 0) {
34221
+ imagePositionX = originPoint.x;
34222
+ imagePositionY = imagePositionY + maxHeight + imagesPadding;
34223
+ maxHeight = 0;
34224
+ }
34225
+ const uploadImageFunction = async () => {
34226
+ const data = await this.uploadImageFunction.mutateAsync(file);
34227
+ const room = data.image.roomId;
34228
+ const imageId = data.image.imageId;
34229
+ finishUploadCallback?.(nodeId, `${process.env.NEXT_PUBLIC_API_ENDPOINT}/weavejs/rooms/${room}/images/${imageId}`);
34230
+ };
34231
+ uploadImagesPromises.push(uploadImageFunction);
34232
+ while (imageToolActionHandler.getActualState() !== WEAVE_IMAGES_TOOL_STATE.IDLE) await sleep(10);
34233
+ }
34234
+ const uploadImages = async () => {
34235
+ this.onStartUploading();
34236
+ await Promise.allSettled(uploadImagesPromises.map((fn) => fn()));
34237
+ this.onFinishedUploading();
34238
+ };
34239
+ uploadImages();
34240
+ }
34241
+ if (this.uploadType === WEAVE_IMAGES_TOOL_UPLOAD_TYPE.IMAGE_URL && this.imagesURLs) for (let i = 0; i < this.imagesURLs.length; i++) {
34242
+ const imageURL = this.imagesURLs[i];
34243
+ const imageFallback = this.imagesFallback[i];
34244
+ const imageSize = this.imagesSize[i];
34245
+ const resourceId = this.imagesIds[i];
34246
+ const { nodeId } = this.instance.triggerAction(
34247
+ WEAVE_IMAGE_TOOL_ACTION_NAME,
34248
+ {
34249
+ type: "imageURL",
34250
+ imageURL,
34251
+ imageFallback,
34252
+ imageWidth: imageSize.width,
34253
+ imageHeight: imageSize.height,
34254
+ imageId: resourceId,
34255
+ position: {
34256
+ x: imagePositionX,
34257
+ y: imagePositionY
34258
+ },
34259
+ forceMainContainer: this.forceMainContainer
34260
+ },
34261
+ true
34262
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
34263
+ );
34264
+ this.nodesIds.push(nodeId);
34265
+ maxHeight = Math.max(maxHeight, this.imagesSize[i].height);
34266
+ imagePositionX += imagesPadding + this.imagesSize[i].width;
34267
+ if ((i + 1) % layoutColumns === 0) {
34268
+ imagePositionX = originPoint.x;
34269
+ imagePositionY = imagePositionY + maxHeight + imagesPadding;
34270
+ maxHeight = 0;
34271
+ }
34272
+ while (imageToolActionHandler.getActualState() !== WEAVE_IMAGES_TOOL_STATE.IDLE) await sleep(10);
34273
+ }
34274
+ this.setState(WEAVE_IMAGES_TOOL_STATE.FINISHED);
34275
+ this.cancelAction();
34276
+ }
34277
+ trigger(cancelAction, params) {
34278
+ if (!this.instance) throw new Error("Instance not defined");
34279
+ if (!this.initialized) this.setupEvents();
34280
+ this.cancelAction = cancelAction;
34281
+ const selectionPlugin = this.instance.getPlugin("nodesSelection");
34282
+ if (selectionPlugin) selectionPlugin.setSelectedNodes([]);
34283
+ if (params?.position) this.setState(WEAVE_IMAGES_TOOL_STATE.SELECTED_POSITION);
34284
+ this.forceMainContainer = params.forceMainContainer ?? false;
34285
+ if (params.type === WEAVE_IMAGES_TOOL_UPLOAD_TYPE.FILE) {
34286
+ this.uploadType = WEAVE_IMAGES_TOOL_UPLOAD_TYPE.FILE;
34287
+ this.onStartUploading = params.onStartUploading;
34288
+ this.onFinishedUploading = params.onFinishedUploading;
34289
+ this.uploadImageFunction = params.uploadImageFunction;
34290
+ this.nodesIds = [];
34291
+ this.images = params.images;
34292
+ this.imagesDownscaleRatio = params.imagesDownscaleRatio;
34293
+ }
34294
+ if (params.type === WEAVE_IMAGES_TOOL_UPLOAD_TYPE.IMAGE_URL) {
34295
+ this.uploadType = WEAVE_IMAGES_TOOL_UPLOAD_TYPE.IMAGE_URL;
34296
+ this.nodesIds = [];
34297
+ this.imagesURLs = params.imagesURLs;
34298
+ this.imagesFallback = params.imagesFallback;
34299
+ }
34300
+ if (![WEAVE_IMAGES_TOOL_UPLOAD_TYPE.FILE, WEAVE_IMAGES_TOOL_UPLOAD_TYPE.IMAGE_URL].includes(params.type)) {
34301
+ this.cancelAction();
34302
+ return;
34303
+ }
34304
+ this.imagesIds = params.imagesIds;
34305
+ this.imagesSize = params.imagesSize;
34306
+ this.addImages(params?.position);
34307
+ }
34308
+ saveImageUrl(nodeId, imageURL) {
34309
+ if (this.state !== WEAVE_IMAGES_TOOL_STATE.DEFINING_POSITION) {
33632
34310
  const stage = this.instance.getStage();
33633
34311
  const nodeHandler = this.instance.getNodeHandler("image");
33634
34312
  const node = stage.findOne(`#${nodeId}`);
33635
34313
  if (nodeHandler && node) {
33636
34314
  node.setAttr("imageURL", imageURL);
33637
- this.instance.updateNode(nodeHandler.serialize(node));
34315
+ nodeHandler.forceLoadImage(node);
34316
+ this.instance.updateNode(nodeHandler.serialize(node), { origin: "system" });
33638
34317
  }
33639
34318
  }
33640
34319
  }
33641
34320
  cleanup() {
33642
34321
  const stage = this.instance.getStage();
33643
- if (this.tempImageNode) this.tempImageNode.destroy();
34322
+ this.tempPointerFeedbackNode?.destroy();
34323
+ this.tempPointerFeedbackNode = null;
34324
+ this.instance.getUtilityLayer()?.batchDraw();
33644
34325
  const selectionPlugin = this.instance.getPlugin("nodesSelection");
33645
34326
  if (selectionPlugin) {
33646
- const node = stage.findOne(`#${this.imageId}`);
33647
- if (node) selectionPlugin.setSelectedNodes([node]);
34327
+ const addedNodes = [];
34328
+ for (const nodeId of this.nodesIds) {
34329
+ const node = stage.findOne(`#${nodeId}`);
34330
+ if (node) addedNodes.push(node);
34331
+ }
34332
+ selectionPlugin.setSelectedNodes(addedNodes);
33648
34333
  this.instance.triggerAction(SELECTION_TOOL_ACTION_NAME);
33649
34334
  }
34335
+ this.instance.endDrag(WEAVE_IMAGES_TOOL_ACTION_NAME);
33650
34336
  stage.container().style.cursor = "default";
33651
- this.instance.endDrag(IMAGE_TOOL_ACTION_NAME);
33652
- this.initialCursor = null;
33653
- this.imageId = null;
34337
+ this.uploadType = null;
33654
34338
  this.forceMainContainer = false;
34339
+ this.initialCursor = null;
33655
34340
  this.container = void 0;
33656
- this.tempImageNode = null;
33657
- this.imageURL = null;
33658
34341
  this.clickPoint = null;
33659
- this.setState(IMAGE_TOOL_STATE.IDLE);
33660
- }
33661
- getImageNodeHandler() {
33662
- return this.instance.getNodeHandler("image");
34342
+ this.setState(WEAVE_IMAGES_TOOL_STATE.IDLE);
33663
34343
  }
33664
34344
  setCursor() {
33665
34345
  const stage = this.instance.getStage();
@@ -33671,8 +34351,46 @@ var WeaveImageToolAction = class extends WeaveAction {
33671
34351
  stage.container().blur();
33672
34352
  stage.container().focus();
33673
34353
  }
34354
+ getImageSizeFromFile(file) {
34355
+ return new Promise((resolve, reject) => {
34356
+ const img = new Image();
34357
+ const url = URL.createObjectURL(file);
34358
+ img.onload = () => {
34359
+ resolve({
34360
+ width: img.naturalWidth,
34361
+ height: img.naturalHeight
34362
+ });
34363
+ URL.revokeObjectURL(url);
34364
+ };
34365
+ img.onerror = reject;
34366
+ img.src = url;
34367
+ });
34368
+ }
34369
+ loadImageSource(image) {
34370
+ return new Promise((resolve, reject) => {
34371
+ const reader = new FileReader();
34372
+ reader.onloadend = () => {
34373
+ const imageSource = Konva.Util.createImageElement();
34374
+ imageSource.crossOrigin = "anonymous";
34375
+ imageSource.onerror = (error) => {
34376
+ reject(error);
34377
+ };
34378
+ imageSource.onload = async () => {
34379
+ resolve(imageSource);
34380
+ };
34381
+ imageSource.src = reader.result;
34382
+ };
34383
+ reader.onerror = () => {
34384
+ reject(new Error("Failed to read image file"));
34385
+ };
34386
+ reader.readAsDataURL(image);
34387
+ });
34388
+ }
34389
+ isTouchDevice() {
34390
+ return window.matchMedia("(pointer: coarse)").matches;
34391
+ }
33674
34392
  setDragAndDropProperties(properties) {
33675
- this.instance.startDrag(IMAGE_TOOL_ACTION_NAME);
34393
+ this.instance.startDrag(WEAVE_IMAGES_TOOL_ACTION_NAME);
33676
34394
  this.instance.setDragProperties(properties);
33677
34395
  }
33678
34396
  };
@@ -38941,5 +39659,5 @@ var WeaveStageKeyboardMovePlugin = class extends WeavePlugin {
38941
39659
  };
38942
39660
 
38943
39661
  //#endregion
38944
- export { ALIGN_NODES_ALIGN_TO, ALIGN_NODES_TOOL_ACTION_NAME, ALIGN_NODES_TOOL_STATE, ARROW_TOOL_ACTION_NAME, ARROW_TOOL_STATE, BRUSH_TOOL_ACTION_NAME, BRUSH_TOOL_DEFAULT_CONFIG, BRUSH_TOOL_STATE, CONNECTOR_TOOL_ACTION_NAME, CONNECTOR_TOOL_DEFAULT_CONFIG, CONNECTOR_TOOL_STATE, COPY_PASTE_NODES_PLUGIN_STATE, ELLIPSE_TOOL_ACTION_NAME, ELLIPSE_TOOL_STATE, ERASER_TOOL_ACTION_NAME, ERASER_TOOL_STATE, FRAME_TOOL_ACTION_NAME, FRAME_TOOL_STATE, GUIDE_DISTANCE_LINE_DEFAULT_CONFIG, GUIDE_ENTER_SNAPPING_TOLERANCE, GUIDE_EXIT_SNAPPING_TOLERANCE, GUIDE_HORIZONTAL_LINE_NAME, GUIDE_LINE_DEFAULT_CONFIG, GUIDE_LINE_DRAG_SNAPPING_THRESHOLD, GUIDE_LINE_NAME, GUIDE_LINE_TRANSFORM_SNAPPING_THRESHOLD, GUIDE_ORIENTATION, GUIDE_VERTICAL_LINE_NAME, IMAGE_TOOL_ACTION_NAME, IMAGE_TOOL_LOAD_FROM, IMAGE_TOOL_STATE, LINE_TOOL_ACTION_NAME, LINE_TOOL_DEFAULT_CONFIG, LINE_TOOL_STATE, MEASURE_TOOL_ACTION_NAME, MEASURE_TOOL_STATE, MOVE_TOOL_ACTION_NAME, MOVE_TOOL_STATE, NODE_SNAP, NODE_SNAP_HORIZONTAL, NODE_SNAP_VERTICAL, PEN_TOOL_ACTION_NAME, PEN_TOOL_STATE, RECTANGLE_TOOL_ACTION_NAME, RECTANGLE_TOOL_STATE, REGULAR_POLYGON_TOOL_ACTION_NAME, REGULAR_POLYGON_TOOL_STATE, SELECTION_TOOL_ACTION_NAME, SELECTION_TOOL_STATE, STAGE_MINIMAP_DEFAULT_CONFIG, STAR_TOOL_ACTION_NAME, STAR_TOOL_STATE, TEXT_LAYOUT, TEXT_TOOL_ACTION_NAME, TEXT_TOOL_STATE, VIDEO_TOOL_ACTION_NAME, VIDEO_TOOL_STATE, WEAVE_ARROW_NODE_TYPE, WEAVE_COMMENTS_RENDERER_KEY, WEAVE_COMMENTS_TOOL_LAYER_ID, WEAVE_COMMENT_CREATE_ACTION, WEAVE_COMMENT_NODE_ACTION, WEAVE_COMMENT_NODE_DEFAULTS, WEAVE_COMMENT_NODE_TYPE, WEAVE_COMMENT_STATUS, WEAVE_COMMENT_TOOL_ACTION_NAME, WEAVE_COMMENT_TOOL_DEFAULT_CONFIG, WEAVE_COMMENT_TOOL_STATE, WEAVE_COMMENT_VIEW_ACTION, WEAVE_CONNECTOR_NODE_ANCHOR_ORIGIN, WEAVE_CONNECTOR_NODE_DECORATOR_TYPE, WEAVE_CONNECTOR_NODE_DEFAULT_CONFIG, WEAVE_CONNECTOR_NODE_LINE_ORIGIN, WEAVE_CONNECTOR_NODE_LINE_TYPE, WEAVE_CONNECTOR_NODE_TYPE, WEAVE_COPY_PASTE_CONFIG_DEFAULT, WEAVE_COPY_PASTE_NODES_KEY, WEAVE_COPY_PASTE_PASTE_CATCHER_ID, WEAVE_COPY_PASTE_PASTE_MODES, WEAVE_DEFAULT_USER_INFO_FUNCTION, WEAVE_ELLIPSE_NODE_TYPE, WEAVE_FRAME_DEFAULT_BACKGROUND_COLOR, WEAVE_FRAME_NODE_DEFAULT_CONFIG, WEAVE_FRAME_NODE_DEFAULT_PROPS, WEAVE_FRAME_NODE_TYPE, WEAVE_GRID_DEFAULT_COLOR, WEAVE_GRID_DEFAULT_DOT_MAX_DOTS_PER_AXIS, WEAVE_GRID_DEFAULT_MAJOR_DOT_RATIO, WEAVE_GRID_DEFAULT_MAJOR_EVERY, WEAVE_GRID_DEFAULT_MAJOR_LINE_RATIO, WEAVE_GRID_DEFAULT_ORIGIN_COLOR, WEAVE_GRID_DEFAULT_RADIUS, WEAVE_GRID_DEFAULT_SIZE, WEAVE_GRID_DEFAULT_STROKE, WEAVE_GRID_DEFAULT_TYPE, WEAVE_GRID_LAYER_ID, WEAVE_GRID_TYPES, WEAVE_GROUP_NODE_TYPE, WEAVE_IMAGE_CROP_ANCHOR_POSITION, WEAVE_IMAGE_CROP_END_TYPE, WEAVE_IMAGE_DEFAULT_CONFIG, WEAVE_IMAGE_NODE_TYPE, WEAVE_LAYER_NODE_TYPE, WEAVE_LINE_NODE_DEFAULT_CONFIG, WEAVE_LINE_NODE_TYPE, WEAVE_MEASURE_NODE_DEFAULT_CONFIG, WEAVE_MEASURE_NODE_TYPE, WEAVE_MEASURE_TOOL_DEFAULT_CONFIG, WEAVE_NODES_DISTANCE_SNAPPING_PLUGIN_KEY, WEAVE_NODES_EDGE_SNAPPING_PLUGIN_KEY, WEAVE_NODES_MULTI_SELECTION_FEEDBACK_PLUGIN_DEFAULT_CONFIG, WEAVE_NODES_MULTI_SELECTION_FEEDBACK_PLUGIN_KEY, WEAVE_NODES_MULTI_SELECTION_FEEDBACK_PLUGIN_LAYER_ID, WEAVE_NODES_SELECTION_DEFAULT_CONFIG, WEAVE_NODES_SELECTION_KEY, WEAVE_NODES_SELECTION_LAYER_ID, WEAVE_RECTANGLE_NODE_TYPE, WEAVE_REGULAR_POLYGON_NODE_TYPE, WEAVE_STAGE_DEFAULT_MODE, WEAVE_STAGE_GRID_PLUGIN_KEY, WEAVE_STAGE_IMAGE_CROPPING_MODE, WEAVE_STAGE_KEYBOARD_MOVE_DEFAULT_CONFIG, WEAVE_STAGE_KEYBOARD_MOVE_KEY, WEAVE_STAGE_MINIMAP_KEY, WEAVE_STAGE_NODE_TYPE, WEAVE_STAGE_PANNING_DEFAULT_CONFIG, WEAVE_STAGE_PANNING_KEY, WEAVE_STAGE_PANNING_THROTTLE_MS, WEAVE_STAGE_TEXT_EDITION_MODE, WEAVE_STAR_NODE_TYPE, WEAVE_STROKE_NODE_DEFAULT_CONFIG, WEAVE_STROKE_NODE_TYPE, WEAVE_STROKE_SINGLE_NODE_DEFAULT_CONFIG, WEAVE_STROKE_SINGLE_NODE_TIP_SIDE, WEAVE_STROKE_SINGLE_NODE_TIP_TYPE, WEAVE_STROKE_SINGLE_NODE_TYPE, WEAVE_STROKE_TOOL_ACTION_NAME, WEAVE_STROKE_TOOL_ACTION_NAME_ALIASES, WEAVE_STROKE_TOOL_DEFAULT_CONFIG, WEAVE_STROKE_TOOL_STATE, WEAVE_TEXT_NODE_DEFAULT_CONFIG, WEAVE_TEXT_NODE_TYPE, WEAVE_USERS_POINTERS_CONFIG_DEFAULT_PROPS, WEAVE_USERS_POINTERS_KEY, WEAVE_USERS_PRESENCE_CONFIG_DEFAULT_PROPS, WEAVE_USERS_PRESENCE_PLUGIN_KEY, WEAVE_USERS_SELECTION_KEY, WEAVE_USER_POINTER_KEY, WEAVE_USER_PRESENCE_KEY, WEAVE_USER_SELECTION_KEY, WEAVE_VIDEO_DEFAULT_CONFIG, WEAVE_VIDEO_NODE_TYPE, Weave, WeaveAction, WeaveAlignNodesToolAction, WeaveArrowNode, WeaveArrowToolAction, WeaveBrushToolAction, WeaveCommentNode, WeaveCommentToolAction, WeaveCommentsRendererPlugin, WeaveConnectedUsersPlugin, WeaveConnectorNode, WeaveConnectorToolAction, WeaveContextMenuPlugin, WeaveCopyPasteNodesPlugin, WeaveEllipseNode, WeaveEllipseToolAction, WeaveEraserToolAction, WeaveExportNodesToolAction, WeaveExportStageToolAction, WeaveFitToScreenToolAction, WeaveFitToSelectionToolAction, WeaveFrameNode, WeaveFrameToolAction, WeaveGroupNode, WeaveImageNode, WeaveImageToolAction, WeaveLayerNode, WeaveLineNode, WeaveLineToolAction, WeaveMeasureNode, WeaveMeasureToolAction, WeaveMoveToolAction, WeaveNode, WeaveNodesDistanceSnappingPlugin, WeaveNodesEdgeSnappingPlugin, WeaveNodesMultiSelectionFeedbackPlugin, WeaveNodesSelectionPlugin, WeavePenToolAction, WeavePlugin, WeaveRectangleNode, WeaveRectangleToolAction, WeaveRegularPolygonNode, WeaveRegularPolygonToolAction, WeaveRenderer, WeaveSelectionToolAction, WeaveStageDropAreaPlugin, WeaveStageGridPlugin, WeaveStageKeyboardMovePlugin, WeaveStageMinimapPlugin, WeaveStageNode, WeaveStagePanningPlugin, WeaveStageResizePlugin, WeaveStageZoomPlugin, WeaveStarNode, WeaveStarToolAction, WeaveStore, WeaveStrokeNode, WeaveStrokeSingleNode, WeaveStrokeToolAction, WeaveTextNode, WeaveTextToolAction, WeaveUsersPointersPlugin, WeaveUsersPresencePlugin, WeaveUsersSelectionPlugin, WeaveVideoNode, WeaveVideoToolAction, WeaveZoomInToolAction, WeaveZoomOutToolAction, canComposite, clearContainerTargets, containerOverCursor, containsNodeDeep, defaultInitialState, getBoundingBox, getExportBoundingBox, getJSONFromYjsBinary, getPositionRelativeToContainerOnPosition, getSelectedNodesMetadata, getStageClickPoint, getTargetAndSkipNodes, getTargetedNode, getTopmostShadowHost, getVisibleNodes, getVisibleNodesInViewport, hasFrames, hasImages, intersectArrays, isArray, isIOS, isInShadowDOM, isNodeInSelection, isObject, isServer, mapJsonToYjsArray, mapJsonToYjsElements, mapJsonToYjsMap, memoize, mergeExceptArrays, moveNodeToContainer, moveNodeToContainerNT, resetScale, setupCanvasBackend, setupSkiaBackend, weavejsToYjsBinary };
39662
+ export { ALIGN_NODES_ALIGN_TO, ALIGN_NODES_TOOL_ACTION_NAME, ALIGN_NODES_TOOL_STATE, ARROW_TOOL_ACTION_NAME, ARROW_TOOL_STATE, BRUSH_TOOL_ACTION_NAME, BRUSH_TOOL_DEFAULT_CONFIG, BRUSH_TOOL_STATE, CONNECTOR_TOOL_ACTION_NAME, CONNECTOR_TOOL_DEFAULT_CONFIG, CONNECTOR_TOOL_STATE, COPY_PASTE_NODES_PLUGIN_STATE, ELLIPSE_TOOL_ACTION_NAME, ELLIPSE_TOOL_STATE, ERASER_TOOL_ACTION_NAME, ERASER_TOOL_STATE, FRAME_TOOL_ACTION_NAME, FRAME_TOOL_STATE, GUIDE_DISTANCE_LINE_DEFAULT_CONFIG, GUIDE_ENTER_SNAPPING_TOLERANCE, GUIDE_EXIT_SNAPPING_TOLERANCE, GUIDE_HORIZONTAL_LINE_NAME, GUIDE_LINE_DEFAULT_CONFIG, GUIDE_LINE_DRAG_SNAPPING_THRESHOLD, GUIDE_LINE_NAME, GUIDE_LINE_TRANSFORM_SNAPPING_THRESHOLD, GUIDE_ORIENTATION, GUIDE_VERTICAL_LINE_NAME, LINE_TOOL_ACTION_NAME, LINE_TOOL_DEFAULT_CONFIG, LINE_TOOL_STATE, MEASURE_TOOL_ACTION_NAME, MEASURE_TOOL_STATE, MOVE_TOOL_ACTION_NAME, MOVE_TOOL_STATE, NODE_SNAP, NODE_SNAP_HORIZONTAL, NODE_SNAP_VERTICAL, PEN_TOOL_ACTION_NAME, PEN_TOOL_STATE, RECTANGLE_TOOL_ACTION_NAME, RECTANGLE_TOOL_STATE, REGULAR_POLYGON_TOOL_ACTION_NAME, REGULAR_POLYGON_TOOL_STATE, SELECTION_TOOL_ACTION_NAME, SELECTION_TOOL_STATE, STAGE_MINIMAP_DEFAULT_CONFIG, STAR_TOOL_ACTION_NAME, STAR_TOOL_STATE, TEXT_LAYOUT, TEXT_TOOL_ACTION_NAME, TEXT_TOOL_STATE, VIDEO_TOOL_ACTION_NAME, VIDEO_TOOL_STATE, WEAVE_ARROW_NODE_TYPE, WEAVE_COMMENTS_RENDERER_KEY, WEAVE_COMMENTS_TOOL_LAYER_ID, WEAVE_COMMENT_CREATE_ACTION, WEAVE_COMMENT_NODE_ACTION, WEAVE_COMMENT_NODE_DEFAULTS, WEAVE_COMMENT_NODE_TYPE, WEAVE_COMMENT_STATUS, WEAVE_COMMENT_TOOL_ACTION_NAME, WEAVE_COMMENT_TOOL_DEFAULT_CONFIG, WEAVE_COMMENT_TOOL_STATE, WEAVE_COMMENT_VIEW_ACTION, WEAVE_CONNECTOR_NODE_ANCHOR_ORIGIN, WEAVE_CONNECTOR_NODE_DECORATOR_TYPE, WEAVE_CONNECTOR_NODE_DEFAULT_CONFIG, WEAVE_CONNECTOR_NODE_LINE_ORIGIN, WEAVE_CONNECTOR_NODE_LINE_TYPE, WEAVE_CONNECTOR_NODE_TYPE, WEAVE_COPY_PASTE_CONFIG_DEFAULT, WEAVE_COPY_PASTE_NODES_KEY, WEAVE_COPY_PASTE_PASTE_CATCHER_ID, WEAVE_COPY_PASTE_PASTE_MODES, WEAVE_DEFAULT_USER_INFO_FUNCTION, WEAVE_ELLIPSE_NODE_TYPE, WEAVE_FRAME_DEFAULT_BACKGROUND_COLOR, WEAVE_FRAME_NODE_DEFAULT_CONFIG, WEAVE_FRAME_NODE_DEFAULT_PROPS, WEAVE_FRAME_NODE_TYPE, WEAVE_GRID_DEFAULT_COLOR, WEAVE_GRID_DEFAULT_DOT_MAX_DOTS_PER_AXIS, WEAVE_GRID_DEFAULT_MAJOR_DOT_RATIO, WEAVE_GRID_DEFAULT_MAJOR_EVERY, WEAVE_GRID_DEFAULT_MAJOR_LINE_RATIO, WEAVE_GRID_DEFAULT_ORIGIN_COLOR, WEAVE_GRID_DEFAULT_RADIUS, WEAVE_GRID_DEFAULT_SIZE, WEAVE_GRID_DEFAULT_STROKE, WEAVE_GRID_DEFAULT_TYPE, WEAVE_GRID_LAYER_ID, WEAVE_GRID_TYPES, WEAVE_GROUP_NODE_TYPE, WEAVE_IMAGES_TOOL_ACTION_NAME, WEAVE_IMAGES_TOOL_DEFAULT_CONFIG, WEAVE_IMAGES_TOOL_STATE, WEAVE_IMAGES_TOOL_UPLOAD_TYPE, WEAVE_IMAGE_CROP_ANCHOR_POSITION, WEAVE_IMAGE_CROP_END_TYPE, WEAVE_IMAGE_DEFAULT_CONFIG, WEAVE_IMAGE_NODE_TYPE, WEAVE_IMAGE_TOOL_ACTION_NAME, WEAVE_IMAGE_TOOL_CONFIG_DEFAULT, WEAVE_IMAGE_TOOL_STATE, WEAVE_IMAGE_TOOL_UPLOAD_TYPE, WEAVE_LAYER_NODE_TYPE, WEAVE_LINE_NODE_DEFAULT_CONFIG, WEAVE_LINE_NODE_TYPE, WEAVE_MEASURE_NODE_DEFAULT_CONFIG, WEAVE_MEASURE_NODE_TYPE, WEAVE_MEASURE_TOOL_DEFAULT_CONFIG, WEAVE_NODES_DISTANCE_SNAPPING_PLUGIN_KEY, WEAVE_NODES_EDGE_SNAPPING_PLUGIN_KEY, WEAVE_NODES_MULTI_SELECTION_FEEDBACK_PLUGIN_DEFAULT_CONFIG, WEAVE_NODES_MULTI_SELECTION_FEEDBACK_PLUGIN_KEY, WEAVE_NODES_MULTI_SELECTION_FEEDBACK_PLUGIN_LAYER_ID, WEAVE_NODES_SELECTION_DEFAULT_CONFIG, WEAVE_NODES_SELECTION_KEY, WEAVE_NODES_SELECTION_LAYER_ID, WEAVE_RECTANGLE_NODE_TYPE, WEAVE_REGULAR_POLYGON_NODE_TYPE, WEAVE_STAGE_DEFAULT_MODE, WEAVE_STAGE_DROP_AREA_KEY, WEAVE_STAGE_GRID_PLUGIN_KEY, WEAVE_STAGE_IMAGE_CROPPING_MODE, WEAVE_STAGE_KEYBOARD_MOVE_DEFAULT_CONFIG, WEAVE_STAGE_KEYBOARD_MOVE_KEY, WEAVE_STAGE_MINIMAP_KEY, WEAVE_STAGE_NODE_TYPE, WEAVE_STAGE_PANNING_DEFAULT_CONFIG, WEAVE_STAGE_PANNING_KEY, WEAVE_STAGE_PANNING_THROTTLE_MS, WEAVE_STAGE_TEXT_EDITION_MODE, WEAVE_STAR_NODE_TYPE, WEAVE_STROKE_NODE_DEFAULT_CONFIG, WEAVE_STROKE_NODE_TYPE, WEAVE_STROKE_SINGLE_NODE_DEFAULT_CONFIG, WEAVE_STROKE_SINGLE_NODE_TIP_SIDE, WEAVE_STROKE_SINGLE_NODE_TIP_TYPE, WEAVE_STROKE_SINGLE_NODE_TYPE, WEAVE_STROKE_TOOL_ACTION_NAME, WEAVE_STROKE_TOOL_ACTION_NAME_ALIASES, WEAVE_STROKE_TOOL_DEFAULT_CONFIG, WEAVE_STROKE_TOOL_STATE, WEAVE_TEXT_NODE_DEFAULT_CONFIG, WEAVE_TEXT_NODE_TYPE, WEAVE_USERS_POINTERS_CONFIG_DEFAULT_PROPS, WEAVE_USERS_POINTERS_KEY, WEAVE_USERS_PRESENCE_CONFIG_DEFAULT_PROPS, WEAVE_USERS_PRESENCE_PLUGIN_KEY, WEAVE_USERS_SELECTION_KEY, WEAVE_USER_POINTER_KEY, WEAVE_USER_PRESENCE_KEY, WEAVE_USER_SELECTION_KEY, WEAVE_VIDEO_DEFAULT_CONFIG, WEAVE_VIDEO_NODE_TYPE, Weave, WeaveAction, WeaveAlignNodesToolAction, WeaveArrowNode, WeaveArrowToolAction, WeaveBrushToolAction, WeaveCommentNode, WeaveCommentToolAction, WeaveCommentsRendererPlugin, WeaveConnectedUsersPlugin, WeaveConnectorNode, WeaveConnectorToolAction, WeaveContextMenuPlugin, WeaveCopyPasteNodesPlugin, WeaveEllipseNode, WeaveEllipseToolAction, WeaveEraserToolAction, WeaveExportNodesToolAction, WeaveExportStageToolAction, WeaveFitToScreenToolAction, WeaveFitToSelectionToolAction, WeaveFrameNode, WeaveFrameToolAction, WeaveGroupNode, WeaveImageNode, WeaveImageToolAction, WeaveImagesToolAction, WeaveLayerNode, WeaveLineNode, WeaveLineToolAction, WeaveMeasureNode, WeaveMeasureToolAction, WeaveMoveToolAction, WeaveNode, WeaveNodesDistanceSnappingPlugin, WeaveNodesEdgeSnappingPlugin, WeaveNodesMultiSelectionFeedbackPlugin, WeaveNodesSelectionPlugin, WeavePenToolAction, WeavePlugin, WeaveRectangleNode, WeaveRectangleToolAction, WeaveRegularPolygonNode, WeaveRegularPolygonToolAction, WeaveRenderer, WeaveSelectionToolAction, WeaveStageDropAreaPlugin, WeaveStageGridPlugin, WeaveStageKeyboardMovePlugin, WeaveStageMinimapPlugin, WeaveStageNode, WeaveStagePanningPlugin, WeaveStageResizePlugin, WeaveStageZoomPlugin, WeaveStarNode, WeaveStarToolAction, WeaveStore, WeaveStrokeNode, WeaveStrokeSingleNode, WeaveStrokeToolAction, WeaveTextNode, WeaveTextToolAction, WeaveUsersPointersPlugin, WeaveUsersPresencePlugin, WeaveUsersSelectionPlugin, WeaveVideoNode, WeaveVideoToolAction, WeaveZoomInToolAction, WeaveZoomOutToolAction, canComposite, clearContainerTargets, containerOverCursor, containsNodeDeep, defaultInitialState, getBoundingBox, getExportBoundingBox, getJSONFromYjsBinary, getPositionRelativeToContainerOnPosition, getSelectedNodesMetadata, getStageClickPoint, getTargetAndSkipNodes, getTargetedNode, getTopmostShadowHost, getVisibleNodes, getVisibleNodesInViewport, hasFrames, hasImages, intersectArrays, isArray, isIOS, isInShadowDOM, isNodeInSelection, isObject, isServer, mapJsonToYjsArray, mapJsonToYjsElements, mapJsonToYjsMap, memoize, mergeExceptArrays, moveNodeToContainer, moveNodeToContainerNT, resetScale, setupCanvasBackend, setupSkiaBackend, weavejsToYjsBinary };
38945
39663
  //# sourceMappingURL=types.js.map