seat-editor 3.6.48 → 3.6.50

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 (4) hide show
  1. package/dist/features/view-only-5/index.js +104 -11
  2. package/dist/features/view-only-5/index.jsx +104 -11
  3. package/dist/features/view-only-5/utils.js +2 -2
  4. package/package.json +1 -1
package/dist/features/view-only-5/index.js CHANGED
@@ -269,7 +269,8 @@ const LayerView = (props) => {
269
269
  }, [actionPrivileged]);
270
270
  const timerRef = useRef(null);
271
271
  const handlePointerDown = (e) => {
272
- var _a, _b, _c;
272
+ var _a, _b, _c, _d, _e, _f;
273
+ const shiftActive = e.shiftKey;
273
274
  const svg = svgRef.current;
274
275
  if (!e.isPrimary || !svg)
275
276
  return;
@@ -288,11 +289,31 @@ const LayerView = (props) => {
288
289
  const downInOutSelection = hadSelection && makeSelection && e.button !== 2;
289
290
  const unSelectAll = hadSelection && e.button === 2 && targetGroup && !targetSelectionGroup;
290
291
  const hasSelectionDownOutSelection = !targetSelectionGroup && targetGroup && hadSelection;
292
+ const targetSelection = e.target.closest("g[id='selection-lines']");
291
293
  if (downOutTable || (!targetGroup && !targetSelectionGroup)) {
292
294
  if (graph.connecting) {
293
295
  graph.cancelConnect();
294
296
  }
295
297
  }
298
+ let idTargetElement = JSON.parse((targetGroup === null || targetGroup === void 0 ? void 0 : targetGroup.getAttribute("data-id")) || "{}");
299
+ const selectionTarget = (_b = (_a = targetSelection === null || targetSelection === void 0 ? void 0 : targetSelection.dataset) === null || _a === void 0 ? void 0 : _a.selection) === null || _b === void 0 ? void 0 : _b.replace("selection-", "");
300
+ const activeId = selectionTarget !== null && selectionTarget !== void 0 ? selectionTarget : idTargetElement;
301
+ if (targetGroup && shiftActive) {
302
+ const findById = renderedElements === null || renderedElements === void 0 ? void 0 : renderedElements.find((comp) => comp.id == activeId);
303
+ const currentSelection = (_c = dataElementSelectionGroupRef.current) !== null && _c !== void 0 ? _c : [];
304
+ if (currentSelection.length == 0 && findById) {
305
+ currentSelection.push(findById);
306
+ }
307
+ const alreadySelected = currentSelection.some((comp) => comp.id == activeId);
308
+ let newSelection;
309
+ if (alreadySelected) {
310
+ newSelection = currentSelection.filter((comp) => comp.id != activeId);
311
+ }
312
+ else {
313
+ newSelection = [...currentSelection, findById];
314
+ }
315
+ dataElementSelectionGroupRef.current = newSelection;
316
+ }
296
317
  if (makeSelection) {
297
318
  const boxSelection = createTableGhost({
298
319
  x,
@@ -303,9 +324,9 @@ const LayerView = (props) => {
303
324
  shape: "selection-box",
304
325
  id: "selection-box-ghost",
305
326
  });
306
- (_a = svgRef.current) === null || _a === void 0 ? void 0 : _a.appendChild(boxSelection);
327
+ (_d = svgRef.current) === null || _d === void 0 ? void 0 : _d.appendChild(boxSelection);
307
328
  }
308
- if (downInOutSelection || hasSelectionDownOutSelection || unSelectAll) {
329
+ if ((downInOutSelection || hasSelectionDownOutSelection || unSelectAll) && !shiftActive) {
309
330
  handleUnSelectComponent();
310
331
  }
311
332
  if (unSelectAll) {
@@ -341,7 +362,7 @@ const LayerView = (props) => {
341
362
  const ghostId = JSON.parse((targetGroup === null || targetGroup === void 0 ? void 0 : targetGroup.getAttribute("data-id")) || "{}");
342
363
  const allowedDrag = (!(props === null || props === void 0 ? void 0 : props.dragTableBlockKey)
343
364
  ? true
344
- : !((_b = props === null || props === void 0 ? void 0 : props.dragTableBlockKey) === null || _b === void 0 ? void 0 : _b.some((_) => {
365
+ : !((_e = props === null || props === void 0 ? void 0 : props.dragTableBlockKey) === null || _e === void 0 ? void 0 : _e.some((_) => {
345
366
  const dataRaw = originalData({ id: ghostId, type: "find" });
346
367
  return _.value === (dataRaw === null || dataRaw === void 0 ? void 0 : dataRaw[_.key]);
347
368
  }))) && (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.dragTable);
@@ -349,7 +370,7 @@ const LayerView = (props) => {
349
370
  Object.keys(ghostAttributes).forEach((key) => ghost.setAttribute(key, ghostAttributes[key]));
350
371
  }
351
372
  if (allowedDrag) {
352
- (_c = e.dataTransfer) === null || _c === void 0 ? void 0 : _c.setData("application/json", JSON.stringify(ghostId));
373
+ (_f = e.dataTransfer) === null || _f === void 0 ? void 0 : _f.setData("application/json", JSON.stringify(ghostId));
353
374
  const dataRaw = originalData({ id: ghostId, type: "find" });
354
375
  (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.dragTable) &&
355
376
  (props === null || props === void 0 ? void 0 : props.onDragTable) &&
@@ -442,7 +463,43 @@ const LayerView = (props) => {
442
463
  };
443
464
  pointerMoveGhost(e.nativeEvent);
444
465
  const pointerHandleUp = (e) => {
445
- var _a, _b, _c, _d, _e;
466
+ var _a, _b, _c, _d, _e, _f;
467
+ if (shiftActive) {
468
+ const allElementSelectionGroup = dataElementSelectionGroupRef.current;
469
+ // HITUNG BOUNDING BOX
470
+ let xs = [];
471
+ let ys = [];
472
+ let x2 = [];
473
+ let y2 = [];
474
+ allElementSelectionGroup.forEach((element) => {
475
+ const activeId = element.id;
476
+ const { g } = getAttributeElement(svg, String(activeId));
477
+ const { x, y, width, height } = getGlobalBBox(svg, g);
478
+ xs.push(x);
479
+ ys.push(y);
480
+ x2.push(x + width);
481
+ y2.push(y + height);
482
+ });
483
+ const selectionBox = {
484
+ x: Math.min(...xs),
485
+ y: Math.min(...ys),
486
+ width: Math.max(...x2) - Math.min(...xs),
487
+ height: Math.max(...y2) - Math.min(...ys),
488
+ stroke: "red",
489
+ shape: "selection-box",
490
+ fill: "transparent",
491
+ id: `${Date.now()}`,
492
+ rotation: 0,
493
+ };
494
+ setSelectedLines(selectionBox);
495
+ const allTableInSelection = (_a = dataElementSelectionGroupRef.current) === null || _a === void 0 ? void 0 : _a.map((d) => d.id);
496
+ const filterTableInSelection = componentProps === null || componentProps === void 0 ? void 0 : componentProps.filter((item) => {
497
+ var _a, _b;
498
+ return ((_a = item === null || item === void 0 ? void 0 : item[mappingKey]) === null || _a === void 0 ? void 0 : _a.id) &&
499
+ (allTableInSelection === null || allTableInSelection === void 0 ? void 0 : allTableInSelection.includes((_b = item === null || item === void 0 ? void 0 : item[mappingKey]) === null || _b === void 0 ? void 0 : _b.id));
500
+ });
501
+ onMakeSelection && onMakeSelection(filterTableInSelection);
502
+ }
446
503
  if (targetGroup && !hadSelection) {
447
504
  const dataId = JSON.parse(targetGroup.getAttribute("data-id") || "{}");
448
505
  isDragging.current = false;
@@ -490,10 +547,10 @@ const LayerView = (props) => {
490
547
  setTooltip({ x: newX / scale, y: newY / scale, visible: rightClick });
491
548
  }
492
549
  if (makeSelection &&
493
- ((_a = dataElementSelectionGroupRef.current) === null || _a === void 0 ? void 0 : _a.length) > 0 &&
550
+ ((_b = dataElementSelectionGroupRef.current) === null || _b === void 0 ? void 0 : _b.length) > 0 &&
494
551
  e.button === 0 &&
495
552
  !targetSelectionGroup) {
496
- const allTableInSelection = (_b = dataElementSelectionGroupRef.current) === null || _b === void 0 ? void 0 : _b.map((d) => d.id);
553
+ const allTableInSelection = (_c = dataElementSelectionGroupRef.current) === null || _c === void 0 ? void 0 : _c.map((d) => d.id);
497
554
  const filterTableInSelection = componentProps === null || componentProps === void 0 ? void 0 : componentProps.filter((item) => {
498
555
  var _a, _b;
499
556
  return ((_a = item === null || item === void 0 ? void 0 : item[mappingKey]) === null || _a === void 0 ? void 0 : _a.id) &&
@@ -531,13 +588,13 @@ const LayerView = (props) => {
531
588
  if (!hasInvalidNumber(selectionBox)) {
532
589
  setSelectedLines(selectionBox);
533
590
  }
534
- (_c = svg.querySelector("#selection-box-ghost")) === null || _c === void 0 ? void 0 : _c.remove();
591
+ (_d = svg.querySelector("#selection-box-ghost")) === null || _d === void 0 ? void 0 : _d.remove();
535
592
  }
536
593
  if (makeSelection &&
537
- ((_d = dataElementSelectionGroupRef.current) === null || _d === void 0 ? void 0 : _d.length) === 0 &&
594
+ ((_e = dataElementSelectionGroupRef.current) === null || _e === void 0 ? void 0 : _e.length) === 0 &&
538
595
  e.button === 0 &&
539
596
  targetSelectionGroup) {
540
- (_e = svg.querySelector("#selection-box-ghost")) === null || _e === void 0 ? void 0 : _e.remove();
597
+ (_f = svg.querySelector("#selection-box-ghost")) === null || _f === void 0 ? void 0 : _f.remove();
541
598
  setSelectedLines(null);
542
599
  }
543
600
  setPanningGroup(false);
@@ -665,6 +722,42 @@ const LayerView = (props) => {
665
722
  const viewBox = isValidBoundingBox
666
723
  ? `${boundingBox.minX - (((_a = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _a === void 0 ? void 0 : _a.paddingLeft) || 0)} ${boundingBox.minY - (((_b = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _b === void 0 ? void 0 : _b.paddingTop) || 0)} ${boundingBox.width + (((_c = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _c === void 0 ? void 0 : _c.paddingRight) || 0)} ${boundingBox.height + (((_d = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _d === void 0 ? void 0 : _d.paddingBottom) || 0)}`
667
724
  : "0 0 1000 1000";
725
+ const stillHoldShift = useRef(false);
726
+ useEffect(() => {
727
+ var _a, _b;
728
+ if (stillHoldShift.current && dataElementSelectionGroupRef.current) {
729
+ const selectionLines = (_a = svgRef.current) === null || _a === void 0 ? void 0 : _a.querySelector("#selection-lines");
730
+ selectionLines === null || selectionLines === void 0 ? void 0 : selectionLines.setAttribute("pointer-events", "none");
731
+ }
732
+ if (!stillHoldShift.current && dataElementSelectionGroupRef.current) {
733
+ const selectionLines = (_b = svgRef.current) === null || _b === void 0 ? void 0 : _b.querySelector("#selection-lines");
734
+ selectionLines === null || selectionLines === void 0 ? void 0 : selectionLines.setAttribute("pointer-events", "all");
735
+ }
736
+ }, [stillHoldShift.current, dataElementSelectionGroupRef.current]);
737
+ useEffect(() => {
738
+ const handleKeyDown = (e) => {
739
+ var _a, _b;
740
+ // setPressedKey(e.key);
741
+ const selectionLines = (_a = svgRef.current) === null || _a === void 0 ? void 0 : _a.querySelector("#selection-lines");
742
+ (_b = svgRef.current) === null || _b === void 0 ? void 0 : _b.querySelector("#selection-lines");
743
+ if (e.key === "Shift") {
744
+ stillHoldShift.current = true;
745
+ selectionLines === null || selectionLines === void 0 ? void 0 : selectionLines.setAttribute("pointer-events", "none");
746
+ }
747
+ };
748
+ const handleKeyUp = () => {
749
+ var _a;
750
+ const selectionLines = (_a = svgRef.current) === null || _a === void 0 ? void 0 : _a.querySelector("#selection-lines");
751
+ stillHoldShift.current = false;
752
+ selectionLines === null || selectionLines === void 0 ? void 0 : selectionLines.setAttribute("pointer-events", "all");
753
+ };
754
+ window.addEventListener("keydown", handleKeyDown);
755
+ window.addEventListener("keyup", handleKeyUp);
756
+ return () => {
757
+ window.removeEventListener("keydown", handleKeyDown);
758
+ window.removeEventListener("keyup", handleKeyUp);
759
+ };
760
+ }, [dataElementSelectionGroupRef.current]);
668
761
  const renderedElements = useMemo(() => renderElements(componentsEditor, mappingKey, tableMatchKey, graph.connecting, groupSelection, graph.edges, connectionMatchKey, displaySettings === null || displaySettings === void 0 ? void 0 : displaySettings.selectionGroup), [
669
762
  componentsEditor,
670
763
  mappingKey,
package/dist/features/view-only-5/index.jsx CHANGED
@@ -268,7 +268,8 @@ const LayerView = (props) => {
268
268
  }, [actionPrivileged]);
269
269
  const timerRef = useRef(null);
270
270
  const handlePointerDown = (e) => {
271
- var _a, _b, _c;
271
+ var _a, _b, _c, _d, _e, _f;
272
+ const shiftActive = e.shiftKey;
272
273
  const svg = svgRef.current;
273
274
  if (!e.isPrimary || !svg)
274
275
  return;
@@ -287,11 +288,31 @@ const LayerView = (props) => {
287
288
  const downInOutSelection = hadSelection && makeSelection && e.button !== 2;
288
289
  const unSelectAll = hadSelection && e.button === 2 && targetGroup && !targetSelectionGroup;
289
290
  const hasSelectionDownOutSelection = !targetSelectionGroup && targetGroup && hadSelection;
291
+ const targetSelection = e.target.closest("g[id='selection-lines']");
290
292
  if (downOutTable || (!targetGroup && !targetSelectionGroup)) {
291
293
  if (graph.connecting) {
292
294
  graph.cancelConnect();
293
295
  }
294
296
  }
297
+ let idTargetElement = JSON.parse((targetGroup === null || targetGroup === void 0 ? void 0 : targetGroup.getAttribute("data-id")) || "{}");
298
+ const selectionTarget = (_b = (_a = targetSelection === null || targetSelection === void 0 ? void 0 : targetSelection.dataset) === null || _a === void 0 ? void 0 : _a.selection) === null || _b === void 0 ? void 0 : _b.replace("selection-", "");
299
+ const activeId = selectionTarget !== null && selectionTarget !== void 0 ? selectionTarget : idTargetElement;
300
+ if (targetGroup && shiftActive) {
301
+ const findById = renderedElements === null || renderedElements === void 0 ? void 0 : renderedElements.find((comp) => comp.id == activeId);
302
+ const currentSelection = (_c = dataElementSelectionGroupRef.current) !== null && _c !== void 0 ? _c : [];
303
+ if (currentSelection.length == 0 && findById) {
304
+ currentSelection.push(findById);
305
+ }
306
+ const alreadySelected = currentSelection.some((comp) => comp.id == activeId);
307
+ let newSelection;
308
+ if (alreadySelected) {
309
+ newSelection = currentSelection.filter((comp) => comp.id != activeId);
310
+ }
311
+ else {
312
+ newSelection = [...currentSelection, findById];
313
+ }
314
+ dataElementSelectionGroupRef.current = newSelection;
315
+ }
295
316
  if (makeSelection) {
296
317
  const boxSelection = createTableGhost({
297
318
  x,
@@ -302,9 +323,9 @@ const LayerView = (props) => {
302
323
  shape: "selection-box",
303
324
  id: "selection-box-ghost",
304
325
  });
305
- (_a = svgRef.current) === null || _a === void 0 ? void 0 : _a.appendChild(boxSelection);
326
+ (_d = svgRef.current) === null || _d === void 0 ? void 0 : _d.appendChild(boxSelection);
306
327
  }
307
- if (downInOutSelection || hasSelectionDownOutSelection || unSelectAll) {
328
+ if ((downInOutSelection || hasSelectionDownOutSelection || unSelectAll) && !shiftActive) {
308
329
  handleUnSelectComponent();
309
330
  }
310
331
  if (unSelectAll) {
@@ -340,7 +361,7 @@ const LayerView = (props) => {
340
361
  const ghostId = JSON.parse((targetGroup === null || targetGroup === void 0 ? void 0 : targetGroup.getAttribute("data-id")) || "{}");
341
362
  const allowedDrag = (!(props === null || props === void 0 ? void 0 : props.dragTableBlockKey)
342
363
  ? true
343
- : !((_b = props === null || props === void 0 ? void 0 : props.dragTableBlockKey) === null || _b === void 0 ? void 0 : _b.some((_) => {
364
+ : !((_e = props === null || props === void 0 ? void 0 : props.dragTableBlockKey) === null || _e === void 0 ? void 0 : _e.some((_) => {
344
365
  const dataRaw = originalData({ id: ghostId, type: "find" });
345
366
  return _.value === (dataRaw === null || dataRaw === void 0 ? void 0 : dataRaw[_.key]);
346
367
  }))) && (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.dragTable);
@@ -348,7 +369,7 @@ const LayerView = (props) => {
348
369
  Object.keys(ghostAttributes).forEach((key) => ghost.setAttribute(key, ghostAttributes[key]));
349
370
  }
350
371
  if (allowedDrag) {
351
- (_c = e.dataTransfer) === null || _c === void 0 ? void 0 : _c.setData("application/json", JSON.stringify(ghostId));
372
+ (_f = e.dataTransfer) === null || _f === void 0 ? void 0 : _f.setData("application/json", JSON.stringify(ghostId));
352
373
  const dataRaw = originalData({ id: ghostId, type: "find" });
353
374
  (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.dragTable) &&
354
375
  (props === null || props === void 0 ? void 0 : props.onDragTable) &&
@@ -441,7 +462,43 @@ const LayerView = (props) => {
441
462
  };
442
463
  pointerMoveGhost(e.nativeEvent);
443
464
  const pointerHandleUp = (e) => {
444
- var _a, _b, _c, _d, _e;
465
+ var _a, _b, _c, _d, _e, _f;
466
+ if (shiftActive) {
467
+ const allElementSelectionGroup = dataElementSelectionGroupRef.current;
468
+ // HITUNG BOUNDING BOX
469
+ let xs = [];
470
+ let ys = [];
471
+ let x2 = [];
472
+ let y2 = [];
473
+ allElementSelectionGroup.forEach((element) => {
474
+ const activeId = element.id;
475
+ const { g } = getAttributeElement(svg, String(activeId));
476
+ const { x, y, width, height } = getGlobalBBox(svg, g);
477
+ xs.push(x);
478
+ ys.push(y);
479
+ x2.push(x + width);
480
+ y2.push(y + height);
481
+ });
482
+ const selectionBox = {
483
+ x: Math.min(...xs),
484
+ y: Math.min(...ys),
485
+ width: Math.max(...x2) - Math.min(...xs),
486
+ height: Math.max(...y2) - Math.min(...ys),
487
+ stroke: "red",
488
+ shape: "selection-box",
489
+ fill: "transparent",
490
+ id: `${Date.now()}`,
491
+ rotation: 0,
492
+ };
493
+ setSelectedLines(selectionBox);
494
+ const allTableInSelection = (_a = dataElementSelectionGroupRef.current) === null || _a === void 0 ? void 0 : _a.map((d) => d.id);
495
+ const filterTableInSelection = componentProps === null || componentProps === void 0 ? void 0 : componentProps.filter((item) => {
496
+ var _a, _b;
497
+ return ((_a = item === null || item === void 0 ? void 0 : item[mappingKey]) === null || _a === void 0 ? void 0 : _a.id) &&
498
+ (allTableInSelection === null || allTableInSelection === void 0 ? void 0 : allTableInSelection.includes((_b = item === null || item === void 0 ? void 0 : item[mappingKey]) === null || _b === void 0 ? void 0 : _b.id));
499
+ });
500
+ onMakeSelection && onMakeSelection(filterTableInSelection);
501
+ }
445
502
  if (targetGroup && !hadSelection) {
446
503
  const dataId = JSON.parse(targetGroup.getAttribute("data-id") || "{}");
447
504
  isDragging.current = false;
@@ -489,10 +546,10 @@ const LayerView = (props) => {
489
546
  setTooltip({ x: newX / scale, y: newY / scale, visible: rightClick });
490
547
  }
491
548
  if (makeSelection &&
492
- ((_a = dataElementSelectionGroupRef.current) === null || _a === void 0 ? void 0 : _a.length) > 0 &&
549
+ ((_b = dataElementSelectionGroupRef.current) === null || _b === void 0 ? void 0 : _b.length) > 0 &&
493
550
  e.button === 0 &&
494
551
  !targetSelectionGroup) {
495
- const allTableInSelection = (_b = dataElementSelectionGroupRef.current) === null || _b === void 0 ? void 0 : _b.map((d) => d.id);
552
+ const allTableInSelection = (_c = dataElementSelectionGroupRef.current) === null || _c === void 0 ? void 0 : _c.map((d) => d.id);
496
553
  const filterTableInSelection = componentProps === null || componentProps === void 0 ? void 0 : componentProps.filter((item) => {
497
554
  var _a, _b;
498
555
  return ((_a = item === null || item === void 0 ? void 0 : item[mappingKey]) === null || _a === void 0 ? void 0 : _a.id) &&
@@ -530,13 +587,13 @@ const LayerView = (props) => {
530
587
  if (!hasInvalidNumber(selectionBox)) {
531
588
  setSelectedLines(selectionBox);
532
589
  }
533
- (_c = svg.querySelector("#selection-box-ghost")) === null || _c === void 0 ? void 0 : _c.remove();
590
+ (_d = svg.querySelector("#selection-box-ghost")) === null || _d === void 0 ? void 0 : _d.remove();
534
591
  }
535
592
  if (makeSelection &&
536
- ((_d = dataElementSelectionGroupRef.current) === null || _d === void 0 ? void 0 : _d.length) === 0 &&
593
+ ((_e = dataElementSelectionGroupRef.current) === null || _e === void 0 ? void 0 : _e.length) === 0 &&
537
594
  e.button === 0 &&
538
595
  targetSelectionGroup) {
539
- (_e = svg.querySelector("#selection-box-ghost")) === null || _e === void 0 ? void 0 : _e.remove();
596
+ (_f = svg.querySelector("#selection-box-ghost")) === null || _f === void 0 ? void 0 : _f.remove();
540
597
  setSelectedLines(null);
541
598
  }
542
599
  setPanningGroup(false);
@@ -664,6 +721,42 @@ const LayerView = (props) => {
664
721
  const viewBox = isValidBoundingBox
665
722
  ? `${boundingBox.minX - (((_a = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _a === void 0 ? void 0 : _a.paddingLeft) || 0)} ${boundingBox.minY - (((_b = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _b === void 0 ? void 0 : _b.paddingTop) || 0)} ${boundingBox.width + (((_c = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _c === void 0 ? void 0 : _c.paddingRight) || 0)} ${boundingBox.height + (((_d = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _d === void 0 ? void 0 : _d.paddingBottom) || 0)}`
666
723
  : "0 0 1000 1000";
724
+ const stillHoldShift = useRef(false);
725
+ useEffect(() => {
726
+ var _a, _b;
727
+ if (stillHoldShift.current && dataElementSelectionGroupRef.current) {
728
+ const selectionLines = (_a = svgRef.current) === null || _a === void 0 ? void 0 : _a.querySelector("#selection-lines");
729
+ selectionLines === null || selectionLines === void 0 ? void 0 : selectionLines.setAttribute("pointer-events", "none");
730
+ }
731
+ if (!stillHoldShift.current && dataElementSelectionGroupRef.current) {
732
+ const selectionLines = (_b = svgRef.current) === null || _b === void 0 ? void 0 : _b.querySelector("#selection-lines");
733
+ selectionLines === null || selectionLines === void 0 ? void 0 : selectionLines.setAttribute("pointer-events", "all");
734
+ }
735
+ }, [stillHoldShift.current, dataElementSelectionGroupRef.current]);
736
+ useEffect(() => {
737
+ const handleKeyDown = (e) => {
738
+ var _a, _b;
739
+ // setPressedKey(e.key);
740
+ const selectionLines = (_a = svgRef.current) === null || _a === void 0 ? void 0 : _a.querySelector("#selection-lines");
741
+ (_b = svgRef.current) === null || _b === void 0 ? void 0 : _b.querySelector("#selection-lines");
742
+ if (e.key === "Shift") {
743
+ stillHoldShift.current = true;
744
+ selectionLines === null || selectionLines === void 0 ? void 0 : selectionLines.setAttribute("pointer-events", "none");
745
+ }
746
+ };
747
+ const handleKeyUp = () => {
748
+ var _a;
749
+ const selectionLines = (_a = svgRef.current) === null || _a === void 0 ? void 0 : _a.querySelector("#selection-lines");
750
+ stillHoldShift.current = false;
751
+ selectionLines === null || selectionLines === void 0 ? void 0 : selectionLines.setAttribute("pointer-events", "all");
752
+ };
753
+ window.addEventListener("keydown", handleKeyDown);
754
+ window.addEventListener("keyup", handleKeyUp);
755
+ return () => {
756
+ window.removeEventListener("keydown", handleKeyDown);
757
+ window.removeEventListener("keyup", handleKeyUp);
758
+ };
759
+ }, [dataElementSelectionGroupRef.current]);
667
760
  const renderedElements = useMemo(() => renderElements(componentsEditor, mappingKey, tableMatchKey, graph.connecting, groupSelection, graph.edges, connectionMatchKey, displaySettings === null || displaySettings === void 0 ? void 0 : displaySettings.selectionGroup), [
668
761
  componentsEditor,
669
762
  mappingKey,
package/dist/features/view-only-5/utils.js CHANGED
@@ -99,8 +99,8 @@ export const renderElements = (elementEditor, mappingKey, tableMatchKey, connect
99
99
  }
100
100
  if ((_a = tableMatch === null || tableMatch === void 0 ? void 0 : tableMatch.properties) === null || _a === void 0 ? void 0 : _a.fill) {
101
101
  fill = (_b = tableMatch === null || tableMatch === void 0 ? void 0 : tableMatch.properties) === null || _b === void 0 ? void 0 : _b.fill;
102
- seatFill = (_c = tableMatch === null || tableMatch === void 0 ? void 0 : tableMatch.properties) === null || _c === void 0 ? void 0 : _c.fill;
103
- stroke = (_d = tableMatch === null || tableMatch === void 0 ? void 0 : tableMatch.properties) === null || _d === void 0 ? void 0 : _d.fill;
102
+ seatFill = (_c = tableMatch === null || tableMatch === void 0 ? void 0 : tableMatch.properties) === null || _c === void 0 ? void 0 : _c.seatFill;
103
+ stroke = (_d = tableMatch === null || tableMatch === void 0 ? void 0 : tableMatch.properties) === null || _d === void 0 ? void 0 : _d.stroke;
104
104
  }
105
105
  if ((connecting === null || connecting === void 0 ? void 0 : connecting.fromId) == (finalProps === null || finalProps === void 0 ? void 0 : finalProps.id)) {
106
106
  fill = "#F8F5FF";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "seat-editor",
3
- "version": "3.6.48",
3
+ "version": "3.6.50",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",