seat-editor 3.6.24 → 3.6.26

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.
@@ -18,6 +18,7 @@ export default function GraphView() {
18
18
  selection: false,
19
19
  selectNode: false,
20
20
  connectingNode: false,
21
+ dragTransferTable: false
21
22
  });
22
23
  const [isSelectNode, setIsSelectNode] = useState(false);
23
24
  const [sections, setSections] = useState([
@@ -105,6 +106,10 @@ export default function GraphView() {
105
106
  key: "connectingNode",
106
107
  name: "Connecting Node",
107
108
  },
109
+ {
110
+ key: "dragTransferTable",
111
+ name: "Drag Transfer Table",
112
+ }
108
113
  ];
109
114
  const [dataDrag, setDataDrag] = useState(null);
110
115
  console.log({ dataDrag });
@@ -164,5 +169,7 @@ export default function GraphView() {
164
169
  selection: selection
165
170
  }, onRightClick: (e, data) => {
166
171
  console.log({ e, data });
167
- }, allowTooltip: true }), _jsxs("div", { className: "w-1/5 p-4", onMouseMove: handleMouseMove, onMouseLeave: handleMouseLeave, children: [_jsx("div", { id: "table" }), _jsxs("div", { className: "rounded-lg bg-white p-4", children: [_jsx("h1", { className: "text-2xl font-bold", children: "Section" }), sections.map((section) => (_jsxs("div", { className: clsx("font-bold text-white rounded-md p-2 cursor-pointer", sectionActive === section.id && "!bg-blue-500"), style: { backgroundColor: section.color }, onClick: () => setSectionActive(section.id), children: [_jsx("h2", { className: "text-lg", children: section.name }), section.items.length > 0 && (_jsx("ul", { className: "list-disc pl-5 bg-opacity-50 bg-white p-2 rounded ", children: section.items.map((item) => (_jsx("li", { children: item.name }, item.id))) }))] }, section.id)))] })] }), _jsx("div", { className: "w-1/5 p-4", children: _jsx("div", { className: "rounded-lg bg-white p-4", children: _jsx("h1", { className: "text-2xl font-bold", children: "Nodes" }) }) })] }) }));
172
+ }, allowTooltip: true, onHoldTable: (e, data) => {
173
+ console.log({ e, data });
174
+ } }), _jsxs("div", { className: "w-1/5 p-4", onMouseMove: handleMouseMove, onMouseLeave: handleMouseLeave, children: [_jsx("div", { id: "table" }), _jsxs("div", { className: "rounded-lg bg-white p-4", children: [_jsx("h1", { className: "text-2xl font-bold", children: "Section" }), sections.map((section) => (_jsxs("div", { className: clsx("font-bold text-white rounded-md p-2 cursor-pointer", sectionActive === section.id && "!bg-blue-500"), style: { backgroundColor: section.color }, onClick: () => setSectionActive(section.id), children: [_jsx("h2", { className: "text-lg", children: section.name }), section.items.length > 0 && (_jsx("ul", { className: "list-disc pl-5 bg-opacity-50 bg-white p-2 rounded ", children: section.items.map((item) => (_jsx("li", { children: item.name }, item.id))) }))] }, section.id)))] })] }), _jsx("div", { className: "w-1/5 p-4", children: _jsx("div", { className: "rounded-lg bg-white p-4", children: _jsx("h1", { className: "text-2xl font-bold", children: "Nodes" }) }) })] }) }));
168
175
  }
@@ -17,6 +17,7 @@ export default function GraphView() {
17
17
  selection: false,
18
18
  selectNode: false,
19
19
  connectingNode: false,
20
+ dragTransferTable: false
20
21
  });
21
22
  const [isSelectNode, setIsSelectNode] = useState(false);
22
23
  const [sections, setSections] = useState([
@@ -104,6 +105,10 @@ export default function GraphView() {
104
105
  key: "connectingNode",
105
106
  name: "Connecting Node",
106
107
  },
108
+ {
109
+ key: "dragTransferTable",
110
+ name: "Drag Transfer Table",
111
+ }
107
112
  ];
108
113
  const [dataDrag, setDataDrag] = useState(null);
109
114
  console.log({ dataDrag });
@@ -170,7 +175,9 @@ export default function GraphView() {
170
175
  selection: selection
171
176
  }} onRightClick={(e, data) => {
172
177
  console.log({ e, data });
173
- }} allowTooltip={true}/>
178
+ }} allowTooltip={true} onHoldTable={(e, data) => {
179
+ console.log({ e, data });
180
+ }}/>
174
181
  <div className="w-1/5 p-4" onMouseMove={handleMouseMove} onMouseLeave={handleMouseLeave}>
175
182
  <div id="table"/>
176
183
  <div className="rounded-lg bg-white p-4">
@@ -100,6 +100,7 @@ export interface LayerViewProps<TMeta = undefined> {
100
100
  dragTable?: boolean;
101
101
  selectNode?: boolean;
102
102
  connectingNode?: boolean;
103
+ dragTransferTable?: boolean;
103
104
  };
104
105
  onEdgesChange?: (edges: EdgeType[], table: PropertiesProps[]) => void;
105
106
  keyNode?: string;
@@ -112,6 +113,7 @@ export interface LayerViewProps<TMeta = undefined> {
112
113
  dataKey: string;
113
114
  selection: Record<number, string[]>;
114
115
  };
116
+ onHoldTable?: (e: React.PointerEvent<SVGSVGElement>, component: ComponentProps<TMeta>[]) => void;
115
117
  }
116
118
  declare const LayerView: <TMeta>(props: LayerViewProps<TMeta>) => import("react/jsx-runtime").JSX.Element;
117
119
  export default LayerView;
@@ -27,8 +27,9 @@ const LayerView = (props) => {
27
27
  viewGraph: false,
28
28
  dragTable: false,
29
29
  selectNode: false,
30
- connectingNode: false
31
- }, onMakeSelection, groupSelection } = props;
30
+ connectingNode: false,
31
+ dragTransferTable: false,
32
+ }, onMakeSelection, groupSelection, onHoldTable } = props;
32
33
  const widthTooltip = (tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.minWidth) || 168;
33
34
  const tableGhost = useRef(null);
34
35
  const hoverUnderghostId = useRef(null);
@@ -62,7 +63,9 @@ const LayerView = (props) => {
62
63
  }));
63
64
  const dispatch = useAppDispatch();
64
65
  useEffect(() => {
65
- setTooltip(Object.assign(Object.assign({}, tooltip), { visible: tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.open }));
66
+ if (!(tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.open)) {
67
+ setTooltip(Object.assign(Object.assign({}, tooltip), { visible: false }));
68
+ }
66
69
  }, [tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.open]);
67
70
  useEffect(() => {
68
71
  if (!loading && (loadingRender === null || loadingRender === void 0 ? void 0 : loadingRender.state)) {
@@ -264,6 +267,7 @@ const LayerView = (props) => {
264
267
  setSelectedLines(null);
265
268
  }
266
269
  }, [actionPrivileged]);
270
+ const timerRef = useRef(null);
267
271
  const handlePointerDown = (e) => {
268
272
  var _a, _b, _c;
269
273
  const svg = svgRef.current;
@@ -309,10 +313,30 @@ const LayerView = (props) => {
309
313
  return;
310
314
  }
311
315
  setPanningGroup(true);
312
- if (makeSelection && (props === null || props === void 0 ? void 0 : props.allowTooltip) && (tooltip === null || tooltip === void 0 ? void 0 : tooltip.visible) && e.button !== 2) {
316
+ if (makeSelection &&
317
+ (props === null || props === void 0 ? void 0 : props.allowTooltip) &&
318
+ (tooltip === null || tooltip === void 0 ? void 0 : tooltip.visible) &&
319
+ e.button !== 2) {
313
320
  setTooltip((prev) => (Object.assign(Object.assign({}, prev), { visible: false })));
314
321
  return;
315
322
  }
323
+ if ((actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.dragTransferTable) && e.button === 0) {
324
+ const targetGroup = e.target.closest("g[data-id]");
325
+ const targetSelectionGroup = e.target.closest("g[data-selection]");
326
+ if (targetGroup) {
327
+ const dataId = JSON.parse(targetGroup.getAttribute("data-id") || "{}");
328
+ const findDayaById = originalData({ id: dataId, type: "find" });
329
+ timerRef.current = setTimeout(() => {
330
+ onHoldTable && onHoldTable(e, [findDayaById]);
331
+ }, 1000);
332
+ }
333
+ if (targetSelectionGroup) {
334
+ const tableData = dataElementSelectionGroupRef.current;
335
+ timerRef.current = setTimeout(() => {
336
+ onHoldTable && onHoldTable(e, tableData);
337
+ }, 1000);
338
+ }
339
+ }
316
340
  let ghost = targetGroup === null || targetGroup === void 0 ? void 0 : targetGroup.cloneNode(true);
317
341
  const ghostId = JSON.parse((targetGroup === null || targetGroup === void 0 ? void 0 : targetGroup.getAttribute("data-id")) || "{}");
318
342
  const allowedDrag = (!(props === null || props === void 0 ? void 0 : props.dragTableBlockKey)
@@ -320,15 +344,16 @@ const LayerView = (props) => {
320
344
  : !((_b = props === null || props === void 0 ? void 0 : props.dragTableBlockKey) === null || _b === void 0 ? void 0 : _b.some((_) => {
321
345
  const dataRaw = originalData({ id: ghostId, type: "find" });
322
346
  return _.value === (dataRaw === null || dataRaw === void 0 ? void 0 : dataRaw[_.key]);
323
- }))) &&
324
- (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.dragTable);
347
+ }))) && (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.dragTable);
325
348
  if (ghostAttributes) {
326
349
  Object.keys(ghostAttributes).forEach((key) => ghost.setAttribute(key, ghostAttributes[key]));
327
350
  }
328
351
  if (allowedDrag) {
329
352
  (_c = e.dataTransfer) === null || _c === void 0 ? void 0 : _c.setData("application/json", JSON.stringify(ghostId));
330
353
  const dataRaw = originalData({ id: ghostId, type: "find" });
331
- (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.dragTable) && (props === null || props === void 0 ? void 0 : props.onDragTable) && props.onDragTable(e, dataRaw);
354
+ (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.dragTable) &&
355
+ (props === null || props === void 0 ? void 0 : props.onDragTable) &&
356
+ props.onDragTable(e, dataRaw);
332
357
  }
333
358
  ghost === null || ghost === void 0 ? void 0 : ghost.setAttribute("opacity", "0.5");
334
359
  ghost === null || ghost === void 0 ? void 0 : ghost.setAttribute("pointer-events", "none");
@@ -464,7 +489,10 @@ const LayerView = (props) => {
464
489
  const rightClick = e.button === 2 && allowTooltip;
465
490
  setTooltip({ x: newX / scale, y: newY / scale, visible: rightClick });
466
491
  }
467
- if (makeSelection && ((_a = dataElementSelectionGroupRef.current) === null || _a === void 0 ? void 0 : _a.length) > 0 && e.button === 0 && !targetSelectionGroup) {
492
+ if (makeSelection &&
493
+ ((_a = dataElementSelectionGroupRef.current) === null || _a === void 0 ? void 0 : _a.length) > 0 &&
494
+ e.button === 0 &&
495
+ !targetSelectionGroup) {
468
496
  const allTableInSelection = (_b = dataElementSelectionGroupRef.current) === null || _b === void 0 ? void 0 : _b.map((d) => d.id);
469
497
  const filterTableInSelection = componentProps === null || componentProps === void 0 ? void 0 : componentProps.filter((item) => {
470
498
  var _a, _b;
@@ -505,7 +533,10 @@ const LayerView = (props) => {
505
533
  }
506
534
  (_c = svg.querySelector("#selection-box-ghost")) === null || _c === void 0 ? void 0 : _c.remove();
507
535
  }
508
- if (makeSelection && ((_d = dataElementSelectionGroupRef.current) === null || _d === void 0 ? void 0 : _d.length) === 0 && e.button === 0 && targetSelectionGroup) {
536
+ if (makeSelection &&
537
+ ((_d = dataElementSelectionGroupRef.current) === null || _d === void 0 ? void 0 : _d.length) === 0 &&
538
+ e.button === 0 &&
539
+ targetSelectionGroup) {
509
540
  (_e = svg.querySelector("#selection-box-ghost")) === null || _e === void 0 ? void 0 : _e.remove();
510
541
  setSelectedLines(null);
511
542
  }
@@ -630,7 +661,16 @@ const LayerView = (props) => {
630
661
  const viewBox = isValidBoundingBox
631
662
  ? `${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)}`
632
663
  : "0 0 1000 1000";
633
- const renderedElements = useMemo(() => renderElements(componentsEditor, mappingKey, tableMatchKey, graph.connecting, groupSelection), [componentsEditor, mappingKey, tableMatchKey, statusKey, graph.connecting, groupSelection === null || groupSelection === void 0 ? void 0 : groupSelection.selection, groupSelection === null || groupSelection === void 0 ? void 0 : groupSelection.dataKey, groupSelection === null || groupSelection === void 0 ? void 0 : groupSelection.colorGroupSelection]);
664
+ const renderedElements = useMemo(() => renderElements(componentsEditor, mappingKey, tableMatchKey, graph.connecting, groupSelection), [
665
+ componentsEditor,
666
+ mappingKey,
667
+ tableMatchKey,
668
+ statusKey,
669
+ graph.connecting,
670
+ groupSelection === null || groupSelection === void 0 ? void 0 : groupSelection.selection,
671
+ groupSelection === null || groupSelection === void 0 ? void 0 : groupSelection.dataKey,
672
+ groupSelection === null || groupSelection === void 0 ? void 0 : groupSelection.colorGroupSelection,
673
+ ]);
634
674
  return (_jsxs("div", Object.assign({ className: "relative w-full h-full flex-1", ref: containerRef, style: { overflow: "auto", WebkitOverflowScrolling: "touch" } }, props.containerProps, { children: [loading && (_jsx("div", { className: "absolute z-10 top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 bg-opacity-50 bg-white w-full h-full flex items-center justify-center", children: (loadingRender === null || loadingRender === void 0 ? void 0 : loadingRender.element) || _jsx(Spin, {}) })), _jsx(TransformWrapper, Object.assign({ ref: transformRef, disablePadding: true, centerZoomedOut: true, panning: { disabled: panningGroup, wheelPanning: true }, wheel: { disabled: false }, onTransformed: ({ state: { scale } }) => setScale(scale), minScale: 1, maxScale: 1000, initialScale: 1, smooth: true, centerOnInit: true }, props.transformProps, { children: _jsxs(TransformComponent, { wrapperStyle: { width: "100%", height: "100%" }, contentStyle: { width: "100%", height: "100%" }, children: [_jsxs("svg", Object.assign({ id: "workspace", ref: svgRef, width: "100%", height: "100%", overflow: "hidden", viewBox: viewBox, className: "h-full", xmlns: "http://www.w3.org/2000/svg", preserveAspectRatio: "xMidYMid meet", onContextMenu: (e) => e.preventDefault(),
635
675
  // onDrop={(e) => handleTableEvent(e, "drop")}
636
676
  onPointerDown: handlePointerDown, onPointerUp: handleMouseUp, onMouseMove: (e) => graph.onMouseMove(e), onMouseUp: () => graph.onMouseUp(), onClick: (e) => {
@@ -26,8 +26,9 @@ const LayerView = (props) => {
26
26
  viewGraph: false,
27
27
  dragTable: false,
28
28
  selectNode: false,
29
- connectingNode: false
30
- }, onMakeSelection, groupSelection } = props;
29
+ connectingNode: false,
30
+ dragTransferTable: false,
31
+ }, onMakeSelection, groupSelection, onHoldTable } = props;
31
32
  const widthTooltip = (tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.minWidth) || 168;
32
33
  const tableGhost = useRef(null);
33
34
  const hoverUnderghostId = useRef(null);
@@ -61,7 +62,9 @@ const LayerView = (props) => {
61
62
  }));
62
63
  const dispatch = useAppDispatch();
63
64
  useEffect(() => {
64
- setTooltip(Object.assign(Object.assign({}, tooltip), { visible: tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.open }));
65
+ if (!(tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.open)) {
66
+ setTooltip(Object.assign(Object.assign({}, tooltip), { visible: false }));
67
+ }
65
68
  }, [tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.open]);
66
69
  useEffect(() => {
67
70
  if (!loading && (loadingRender === null || loadingRender === void 0 ? void 0 : loadingRender.state)) {
@@ -263,6 +266,7 @@ const LayerView = (props) => {
263
266
  setSelectedLines(null);
264
267
  }
265
268
  }, [actionPrivileged]);
269
+ const timerRef = useRef(null);
266
270
  const handlePointerDown = (e) => {
267
271
  var _a, _b, _c;
268
272
  const svg = svgRef.current;
@@ -308,10 +312,30 @@ const LayerView = (props) => {
308
312
  return;
309
313
  }
310
314
  setPanningGroup(true);
311
- if (makeSelection && (props === null || props === void 0 ? void 0 : props.allowTooltip) && (tooltip === null || tooltip === void 0 ? void 0 : tooltip.visible) && e.button !== 2) {
315
+ if (makeSelection &&
316
+ (props === null || props === void 0 ? void 0 : props.allowTooltip) &&
317
+ (tooltip === null || tooltip === void 0 ? void 0 : tooltip.visible) &&
318
+ e.button !== 2) {
312
319
  setTooltip((prev) => (Object.assign(Object.assign({}, prev), { visible: false })));
313
320
  return;
314
321
  }
322
+ if ((actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.dragTransferTable) && e.button === 0) {
323
+ const targetGroup = e.target.closest("g[data-id]");
324
+ const targetSelectionGroup = e.target.closest("g[data-selection]");
325
+ if (targetGroup) {
326
+ const dataId = JSON.parse(targetGroup.getAttribute("data-id") || "{}");
327
+ const findDayaById = originalData({ id: dataId, type: "find" });
328
+ timerRef.current = setTimeout(() => {
329
+ onHoldTable && onHoldTable(e, [findDayaById]);
330
+ }, 1000);
331
+ }
332
+ if (targetSelectionGroup) {
333
+ const tableData = dataElementSelectionGroupRef.current;
334
+ timerRef.current = setTimeout(() => {
335
+ onHoldTable && onHoldTable(e, tableData);
336
+ }, 1000);
337
+ }
338
+ }
315
339
  let ghost = targetGroup === null || targetGroup === void 0 ? void 0 : targetGroup.cloneNode(true);
316
340
  const ghostId = JSON.parse((targetGroup === null || targetGroup === void 0 ? void 0 : targetGroup.getAttribute("data-id")) || "{}");
317
341
  const allowedDrag = (!(props === null || props === void 0 ? void 0 : props.dragTableBlockKey)
@@ -319,15 +343,16 @@ const LayerView = (props) => {
319
343
  : !((_b = props === null || props === void 0 ? void 0 : props.dragTableBlockKey) === null || _b === void 0 ? void 0 : _b.some((_) => {
320
344
  const dataRaw = originalData({ id: ghostId, type: "find" });
321
345
  return _.value === (dataRaw === null || dataRaw === void 0 ? void 0 : dataRaw[_.key]);
322
- }))) &&
323
- (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.dragTable);
346
+ }))) && (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.dragTable);
324
347
  if (ghostAttributes) {
325
348
  Object.keys(ghostAttributes).forEach((key) => ghost.setAttribute(key, ghostAttributes[key]));
326
349
  }
327
350
  if (allowedDrag) {
328
351
  (_c = e.dataTransfer) === null || _c === void 0 ? void 0 : _c.setData("application/json", JSON.stringify(ghostId));
329
352
  const dataRaw = originalData({ id: ghostId, type: "find" });
330
- (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.dragTable) && (props === null || props === void 0 ? void 0 : props.onDragTable) && props.onDragTable(e, dataRaw);
353
+ (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.dragTable) &&
354
+ (props === null || props === void 0 ? void 0 : props.onDragTable) &&
355
+ props.onDragTable(e, dataRaw);
331
356
  }
332
357
  ghost === null || ghost === void 0 ? void 0 : ghost.setAttribute("opacity", "0.5");
333
358
  ghost === null || ghost === void 0 ? void 0 : ghost.setAttribute("pointer-events", "none");
@@ -463,7 +488,10 @@ const LayerView = (props) => {
463
488
  const rightClick = e.button === 2 && allowTooltip;
464
489
  setTooltip({ x: newX / scale, y: newY / scale, visible: rightClick });
465
490
  }
466
- if (makeSelection && ((_a = dataElementSelectionGroupRef.current) === null || _a === void 0 ? void 0 : _a.length) > 0 && e.button === 0 && !targetSelectionGroup) {
491
+ if (makeSelection &&
492
+ ((_a = dataElementSelectionGroupRef.current) === null || _a === void 0 ? void 0 : _a.length) > 0 &&
493
+ e.button === 0 &&
494
+ !targetSelectionGroup) {
467
495
  const allTableInSelection = (_b = dataElementSelectionGroupRef.current) === null || _b === void 0 ? void 0 : _b.map((d) => d.id);
468
496
  const filterTableInSelection = componentProps === null || componentProps === void 0 ? void 0 : componentProps.filter((item) => {
469
497
  var _a, _b;
@@ -504,7 +532,10 @@ const LayerView = (props) => {
504
532
  }
505
533
  (_c = svg.querySelector("#selection-box-ghost")) === null || _c === void 0 ? void 0 : _c.remove();
506
534
  }
507
- if (makeSelection && ((_d = dataElementSelectionGroupRef.current) === null || _d === void 0 ? void 0 : _d.length) === 0 && e.button === 0 && targetSelectionGroup) {
535
+ if (makeSelection &&
536
+ ((_d = dataElementSelectionGroupRef.current) === null || _d === void 0 ? void 0 : _d.length) === 0 &&
537
+ e.button === 0 &&
538
+ targetSelectionGroup) {
508
539
  (_e = svg.querySelector("#selection-box-ghost")) === null || _e === void 0 ? void 0 : _e.remove();
509
540
  setSelectedLines(null);
510
541
  }
@@ -629,7 +660,16 @@ const LayerView = (props) => {
629
660
  const viewBox = isValidBoundingBox
630
661
  ? `${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)}`
631
662
  : "0 0 1000 1000";
632
- const renderedElements = useMemo(() => renderElements(componentsEditor, mappingKey, tableMatchKey, graph.connecting, groupSelection), [componentsEditor, mappingKey, tableMatchKey, statusKey, graph.connecting, groupSelection === null || groupSelection === void 0 ? void 0 : groupSelection.selection, groupSelection === null || groupSelection === void 0 ? void 0 : groupSelection.dataKey, groupSelection === null || groupSelection === void 0 ? void 0 : groupSelection.colorGroupSelection]);
663
+ const renderedElements = useMemo(() => renderElements(componentsEditor, mappingKey, tableMatchKey, graph.connecting, groupSelection), [
664
+ componentsEditor,
665
+ mappingKey,
666
+ tableMatchKey,
667
+ statusKey,
668
+ graph.connecting,
669
+ groupSelection === null || groupSelection === void 0 ? void 0 : groupSelection.selection,
670
+ groupSelection === null || groupSelection === void 0 ? void 0 : groupSelection.dataKey,
671
+ groupSelection === null || groupSelection === void 0 ? void 0 : groupSelection.colorGroupSelection,
672
+ ]);
633
673
  return (<div className="relative w-full h-full flex-1" ref={containerRef} style={{ overflow: "auto", WebkitOverflowScrolling: "touch" }} {...props.containerProps}>
634
674
  {loading && (<div className="absolute z-10 top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 bg-opacity-50 bg-white w-full h-full flex items-center justify-center">
635
675
  {(loadingRender === null || loadingRender === void 0 ? void 0 : loadingRender.element) || <Spin />}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "seat-editor",
3
- "version": "3.6.24",
3
+ "version": "3.6.26",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",