seat-editor 3.6.18 → 3.6.20

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.
@@ -580,3 +580,13 @@ export declare const data: ({
580
580
  sections: any;
581
581
  })[];
582
582
  export declare const COLORS_SECTION: string[];
583
+ export declare const background: {
584
+ x: number;
585
+ y: number;
586
+ id: string;
587
+ src: string;
588
+ image: string;
589
+ shape: string;
590
+ width: number;
591
+ height: number;
592
+ }[];
@@ -6993,3 +6993,13 @@ export const COLORS_SECTION = [
6993
6993
  "#FBC6D3",
6994
6994
  "#D5C4F9",
6995
6995
  ];
6996
+ export const background = [{
6997
+ "x": 1108,
6998
+ "y": 78,
6999
+ "id": "1754137849705",
7000
+ "src": "https://cdn.table.link/prod/5bf923de-2366-4a11-9b8b-e92de0afbf05/3a65cb36-7d85-4c38-9403-a15f94641920/68d45207-d66b-4bb5-92a2-4e5a87715e98/rsvp/1754137849587013665_BOI Reg.png",
7001
+ "image": "/5bf923de-2366-4a11-9b8b-e92de0afbf05/3a65cb36-7d85-4c38-9403-a15f94641920/68d45207-d66b-4bb5-92a2-4e5a87715e98/rsvp/1754137849587013665_BOI Reg.png",
7002
+ "shape": "background",
7003
+ "width": 1561,
7004
+ "height": 1494
7005
+ }];
@@ -140,7 +140,9 @@ export default function GraphView() {
140
140
  };
141
141
  return (_jsx("div", { className: "w-full h-screen flex relative", children: _jsxs("div", { className: "flex", children: [_jsx("div", { className: "absolute top-0 left-0 z-10 flex gap-2", children: priviledged.map((item) => (_jsx(Button, { type: actionPrivileged[item.key] ? "primary" : "default", htmlType: "button", onClick: () => {
142
142
  setActionPrivileged((prev) => (Object.assign(Object.assign({}, prev), { [item.key]: !prev[item.key] })));
143
- }, children: item.name }, item.key))) }), _jsx(LayerView, { componentProps: componentSection, statusKey: "section", defaultBackground: "#1e2d4a", mappingKey: "properties", keyNode: "nodes", onEdgesChange: (table, edges) => console.log({ edges, table }), isConnectEdge: isConnecting, isSelectNode: isSelectNode, onSelectComponent: handleSelectItem,
143
+ }, children: item.name }, item.key))) }), _jsx(LayerView, { componentProps: componentSection, statusKey: "section", defaultBackground: "#1e2d4a", mappingKey: "properties", keyNode: "nodes", onEdgesChange: (table, edges) => console.log({ edges, table }), isConnectEdge: isConnecting, isSelectNode: isSelectNode,
144
+ // extraComponentProps={background}
145
+ onSelectComponent: handleSelectItem,
144
146
  // actionPrivileged={{
145
147
  // select: true,
146
148
  // }}
@@ -160,5 +162,5 @@ export default function GraphView() {
160
162
  colorGroupSelection: COLORS_SECTION,
161
163
  dataKey: "uuid_table",
162
164
  selection: selection
163
- } }), _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" }) }) })] }) }));
165
+ }, 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" }) }) })] }) }));
164
166
  }
@@ -146,7 +146,9 @@ export default function GraphView() {
146
146
  {item.name}
147
147
  </Button>))}
148
148
  </div>
149
- <LayerView componentProps={componentSection} statusKey="section" defaultBackground="#1e2d4a" mappingKey="properties" keyNode="nodes" onEdgesChange={(table, edges) => console.log({ edges, table })} isConnectEdge={isConnecting} isSelectNode={isSelectNode} onSelectComponent={handleSelectItem}
149
+ <LayerView componentProps={componentSection} statusKey="section" defaultBackground="#1e2d4a" mappingKey="properties" keyNode="nodes" onEdgesChange={(table, edges) => console.log({ edges, table })} isConnectEdge={isConnecting} isSelectNode={isSelectNode}
150
+ // extraComponentProps={background}
151
+ onSelectComponent={handleSelectItem}
150
152
  // actionPrivileged={{
151
153
  // select: true,
152
154
  // }}
@@ -166,7 +168,7 @@ export default function GraphView() {
166
168
  colorGroupSelection: COLORS_SECTION,
167
169
  dataKey: "uuid_table",
168
170
  selection: selection
169
- }}/>
171
+ }} allowTooltip={true}/>
170
172
  <div className="w-1/5 p-4" onMouseMove={handleMouseMove} onMouseLeave={handleMouseLeave}>
171
173
  <div id="table"/>
172
174
  <div className="rounded-lg bg-white p-4">
@@ -121,6 +121,7 @@ const LayerView = (props) => {
121
121
  const handleUnSelectComponent = () => {
122
122
  setSelectedLines(null);
123
123
  dataElementSelectionGroupRef.current = [];
124
+ onMakeSelection && onMakeSelection([]);
124
125
  };
125
126
  const handleDoubleClick = (items, e) => {
126
127
  const find = componentsEditor.find((item) => {
@@ -262,7 +263,6 @@ const LayerView = (props) => {
262
263
  }, [actionPrivileged]);
263
264
  const handlePointerDown = (e) => {
264
265
  var _a, _b, _c;
265
- console.log("handlePointerDown");
266
266
  const svg = svgRef.current;
267
267
  if (!e.isPrimary || !svg)
268
268
  return;
@@ -275,7 +275,7 @@ const LayerView = (props) => {
275
275
  const { clientX, clientY } = e;
276
276
  const hitPoint = document.elementFromPoint(clientX, clientY);
277
277
  const downOutTable = (hitPoint === null || hitPoint === void 0 ? void 0 : hitPoint.nodeName) === "svg";
278
- const makeSelection = (downOutTable || !(hitPoint === null || hitPoint === void 0 ? void 0 : hitPoint.closest("g[data-id]"))) && (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.selection);
278
+ const makeSelection = (downOutTable || !targetGroup) && (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.selection);
279
279
  const hadSelection = dataElementSelectionGroupRef.current.length > 0;
280
280
  const downInOutSelection = hadSelection && makeSelection;
281
281
  if (downOutTable) {
@@ -299,7 +299,7 @@ const LayerView = (props) => {
299
299
  handleUnSelectComponent();
300
300
  }
301
301
  setPanningGroup(true);
302
- if (!targetGroup && (props === null || props === void 0 ? void 0 : props.allowTooltip)) {
302
+ if (makeSelection && (props === null || props === void 0 ? void 0 : props.allowTooltip) && (tooltip === null || tooltip === void 0 ? void 0 : tooltip.visible)) {
303
303
  setTooltip((prev) => (Object.assign(Object.assign({}, prev), { visible: false })));
304
304
  return;
305
305
  }
@@ -407,7 +407,7 @@ const LayerView = (props) => {
407
407
  };
408
408
  pointerMoveGhost(e.nativeEvent);
409
409
  const pointerHandleUp = (e) => {
410
- var _a, _b, _c;
410
+ var _a, _b, _c, _d, _e;
411
411
  if (targetGroup) {
412
412
  const dataId = JSON.parse(targetGroup.getAttribute("data-id") || "{}");
413
413
  isDragging.current = false;
@@ -484,6 +484,9 @@ const LayerView = (props) => {
484
484
  }
485
485
  (_c = svg.querySelector("#selection-box-ghost")) === null || _c === void 0 ? void 0 : _c.remove();
486
486
  }
487
+ if (makeSelection && ((_d = dataElementSelectionGroupRef.current) === null || _d === void 0 ? void 0 : _d.length) === 0) {
488
+ (_e = svg.querySelector("#selection-box-ghost")) === null || _e === void 0 ? void 0 : _e.remove();
489
+ }
487
490
  setPanningGroup(false);
488
491
  tableGhost.current = null;
489
492
  isDragging.current = false;
@@ -120,6 +120,7 @@ const LayerView = (props) => {
120
120
  const handleUnSelectComponent = () => {
121
121
  setSelectedLines(null);
122
122
  dataElementSelectionGroupRef.current = [];
123
+ onMakeSelection && onMakeSelection([]);
123
124
  };
124
125
  const handleDoubleClick = (items, e) => {
125
126
  const find = componentsEditor.find((item) => {
@@ -261,7 +262,6 @@ const LayerView = (props) => {
261
262
  }, [actionPrivileged]);
262
263
  const handlePointerDown = (e) => {
263
264
  var _a, _b, _c;
264
- console.log("handlePointerDown");
265
265
  const svg = svgRef.current;
266
266
  if (!e.isPrimary || !svg)
267
267
  return;
@@ -274,7 +274,7 @@ const LayerView = (props) => {
274
274
  const { clientX, clientY } = e;
275
275
  const hitPoint = document.elementFromPoint(clientX, clientY);
276
276
  const downOutTable = (hitPoint === null || hitPoint === void 0 ? void 0 : hitPoint.nodeName) === "svg";
277
- const makeSelection = (downOutTable || !(hitPoint === null || hitPoint === void 0 ? void 0 : hitPoint.closest("g[data-id]"))) && (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.selection);
277
+ const makeSelection = (downOutTable || !targetGroup) && (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.selection);
278
278
  const hadSelection = dataElementSelectionGroupRef.current.length > 0;
279
279
  const downInOutSelection = hadSelection && makeSelection;
280
280
  if (downOutTable) {
@@ -298,7 +298,7 @@ const LayerView = (props) => {
298
298
  handleUnSelectComponent();
299
299
  }
300
300
  setPanningGroup(true);
301
- if (!targetGroup && (props === null || props === void 0 ? void 0 : props.allowTooltip)) {
301
+ if (makeSelection && (props === null || props === void 0 ? void 0 : props.allowTooltip) && (tooltip === null || tooltip === void 0 ? void 0 : tooltip.visible)) {
302
302
  setTooltip((prev) => (Object.assign(Object.assign({}, prev), { visible: false })));
303
303
  return;
304
304
  }
@@ -406,7 +406,7 @@ const LayerView = (props) => {
406
406
  };
407
407
  pointerMoveGhost(e.nativeEvent);
408
408
  const pointerHandleUp = (e) => {
409
- var _a, _b, _c;
409
+ var _a, _b, _c, _d, _e;
410
410
  if (targetGroup) {
411
411
  const dataId = JSON.parse(targetGroup.getAttribute("data-id") || "{}");
412
412
  isDragging.current = false;
@@ -483,6 +483,9 @@ const LayerView = (props) => {
483
483
  }
484
484
  (_c = svg.querySelector("#selection-box-ghost")) === null || _c === void 0 ? void 0 : _c.remove();
485
485
  }
486
+ if (makeSelection && ((_d = dataElementSelectionGroupRef.current) === null || _d === void 0 ? void 0 : _d.length) === 0) {
487
+ (_e = svg.querySelector("#selection-box-ghost")) === null || _e === void 0 ? void 0 : _e.remove();
488
+ }
486
489
  setPanningGroup(false);
487
490
  tableGhost.current = null;
488
491
  isDragging.current = false;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "seat-editor",
3
- "version": "3.6.18",
3
+ "version": "3.6.20",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",