seat-editor 3.6.11 → 3.6.12

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.
@@ -579,3 +579,4 @@ export declare const data: ({
579
579
  areas: any;
580
580
  sections: any;
581
581
  })[];
582
+ export declare const COLORS_SECTION: string[];
@@ -6971,3 +6971,25 @@ export const data = [
6971
6971
  sections: null,
6972
6972
  },
6973
6973
  ];
6974
+ export const COLORS_SECTION = [
6975
+ "#FDD9D5",
6976
+ "#D0E0E3",
6977
+ "#E7BFB2",
6978
+ "#E9DAB3",
6979
+ "#DACDB2",
6980
+ "#B2E3E1",
6981
+ "#B2DAD3",
6982
+ "#55CBCD",
6983
+ "#DCEDC1",
6984
+ "#B6CFB6",
6985
+ "#E1C4F9",
6986
+ "#F6EAC2",
6987
+ "#C5EAFF",
6988
+ "#CBAACB",
6989
+ "#E5F9C4",
6990
+ "#C8C4F9",
6991
+ "#FF8B94",
6992
+ "#FEDBBD",
6993
+ "#FBC6D3",
6994
+ "#D5C4F9",
6995
+ ];
@@ -2,9 +2,10 @@
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import clsx from "clsx";
4
4
  import LayerView from "../../features/view-only-5";
5
- import { data } from "./constant";
5
+ import { COLORS_SECTION, data } from "./constant";
6
6
  import { Button } from "antd";
7
7
  import { useMemo, useState } from "react";
8
+ import { selection } from "./selection";
8
9
  export default function GraphView() {
9
10
  const [isConnecting, setIsConnecting] = useState(false);
10
11
  const [actionPrivileged, setActionPrivileged] = useState({
@@ -155,5 +156,9 @@ export default function GraphView() {
155
156
  // props: {},
156
157
  // },
157
158
  },
158
- ], onDragTable: (_, data) => setDataDrag(data), actionPrivileged: actionPrivileged }), _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" }) }) })] }) }));
159
+ ], onDragTable: (_, data) => setDataDrag(data), actionPrivileged: actionPrivileged, groupSelection: {
160
+ colorGroupSelection: COLORS_SECTION,
161
+ dataKey: "uuid_table",
162
+ 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" }) }) })] }) }));
159
164
  }
@@ -1,9 +1,10 @@
1
1
  "use client";
2
2
  import clsx from "clsx";
3
3
  import LayerView from "../../features/view-only-5";
4
- import { data } from "./constant";
4
+ import { COLORS_SECTION, data } from "./constant";
5
5
  import { Button } from "antd";
6
6
  import { useMemo, useState } from "react";
7
+ import { selection } from "./selection";
7
8
  export default function GraphView() {
8
9
  const [isConnecting, setIsConnecting] = useState(false);
9
10
  const [actionPrivileged, setActionPrivileged] = useState({
@@ -161,7 +162,11 @@ export default function GraphView() {
161
162
  // props: {},
162
163
  // },
163
164
  },
164
- ]} onDragTable={(_, data) => setDataDrag(data)} actionPrivileged={actionPrivileged}/>
165
+ ]} onDragTable={(_, data) => setDataDrag(data)} actionPrivileged={actionPrivileged} groupSelection={{
166
+ colorGroupSelection: COLORS_SECTION,
167
+ dataKey: "uuid_table",
168
+ selection: selection
169
+ }}/>
165
170
  <div className="w-1/5 p-4" onMouseMove={handleMouseMove} onMouseLeave={handleMouseLeave}>
166
171
  <div id="table"/>
167
172
  <div className="rounded-lg bg-white p-4">
@@ -0,0 +1 @@
1
+ export declare const selection: string[][];
@@ -0,0 +1,69 @@
1
+ export const selection = [
2
+ [
3
+ "76d17e71-2f5a-4cb6-b7d6-b058223653ae",
4
+ "a7bcbdd2-ace1-4f8a-8330-d0d64b7f5dfe",
5
+ "76d17e71-2f5a-4cb6-b7d6-b058223653ae",
6
+ "cfec9e72-a7cb-4f6e-8086-c164d1b71a82",
7
+ "378e62b2-1992-4343-933b-a315fdb371e1",
8
+ "b83b691c-ac2d-43be-9096-422c802ca57b",
9
+ "ebb38b39-d730-4a22-ac84-742c79ccfcd7",
10
+ "904b0bbb-eafa-4387-bc5e-90028c3b6f4c",
11
+ "1fecb075-1e0d-46ff-8c20-9c95a8cd22e4",
12
+ "2dab63d7-2413-4519-9351-3bbc4238656d",
13
+ "18c2d62a-f247-49eb-ba77-0ad148d67ad2",
14
+ "cc621ce3-80ea-4198-8cf4-fc9c0a5dc48b",
15
+ "08a71a62-6c85-4ed2-ad87-be7cc7d0ed54",
16
+ "3f0dcb23-2d5f-40a4-a542-5149020cc0a0",
17
+ "6d6a8cf5-a378-43d4-9caf-ce31a36288cf",
18
+ "ab52ff2a-f958-4375-b3bb-d68b7c297e43",
19
+ "d088bba0-e990-410e-aea9-08548175a0b9",
20
+ "52755e15-422f-403c-a827-a321765f6517",
21
+ ],
22
+ [
23
+ "3f10d179-a745-4c75-adab-af27de757523",
24
+ "0255e226-25d2-4296-b517-980fe5cecfc3",
25
+ "22a3931a-753b-41ed-ae5f-0074e59fc7b6",
26
+ "32eff5c1-837f-4c36-912b-c6ae8678c1ec",
27
+ "74221ccf-cb48-42bd-810f-bb5c62be6750",
28
+ "39db8421-a7a3-442c-bd79-43172b256b42",
29
+ "e61d0aaf-9804-4b9d-93bc-f6a578e4a024",
30
+ "13842e19-ff7c-43b5-ba57-443a7fe0c1e5",
31
+ "443e4d6e-1090-4302-9f22-7e254b3e941b",
32
+ "f2b15b68-0cff-4f74-bd4e-51611abb8374",
33
+ "1e11184c-d9e0-41a4-88fc-9acfee4b4e00",
34
+ "77bc3f68-dc1c-41a0-86f5-ef8c2c2d1cdd",
35
+ "49c3804a-eb1f-4b18-b2a9-4341f24a272d",
36
+ "9ec0b960-629b-4560-8967-711eb8f313e0",
37
+ "a349cd07-c3ee-43cd-a7e5-87c250bd5119",
38
+ "f914d713-28d6-4240-b441-1b1becc4c6df",
39
+ "ec0b93c8-82a7-4e59-a7a7-9f506906d156",
40
+ "8a70f7e7-1681-4a9e-82c7-9a211cebe8f8",
41
+ "03d9a051-707e-4cb7-a3c5-6f0c6e65cf85",
42
+ "4aee0b66-6007-4c22-bd4d-efb795c4a983",
43
+ "73ef9906-5776-471a-98d6-86190bf32a72",
44
+ ],
45
+ [
46
+ "24ce73a0-d244-4169-818b-c448041d333f",
47
+ "85cc5379-4caf-4b69-9243-c30c6f90161d",
48
+ "5ed2db73-3667-4c11-b9a7-e201abcbc32a",
49
+ "ca13f369-1727-4ac3-82b5-560d25f1a755",
50
+ "6dc2aa25-7191-40dc-858e-e1ed9cfd6654",
51
+ "bd3a2cb0-a6a8-47a2-b2ae-72bab6e1ea0e",
52
+ "a9990f05-b372-4b10-b739-5490b48dc37c",
53
+ "2fadf186-1cd8-49df-a1fe-9f44f84787ab",
54
+ "e50aafeb-a3d3-42e1-8cb2-557170fcff23",
55
+ "638ddfb9-9791-4bff-91a2-b590f9c60032",
56
+ "01ed0282-01a2-48dd-963c-4146ffb21c11",
57
+ "c5aab141-cb77-46cc-bed1-a2222eac9ed9",
58
+ "3401107c-792e-4912-8bcf-e1a0804925e5",
59
+ "6da49554-e25e-43c5-8873-b8df3d8ce389",
60
+ "01bbb9f3-cdec-4e8a-8515-fce4b603a10a",
61
+ "9a6c720f-1909-4755-894d-60e888b4138c",
62
+ "72477b41-bb67-4969-b622-f2ff5e3d5328",
63
+ "4c17dc2b-4603-4ea8-af96-a8aa18773936",
64
+ "4ee66e65-bd92-41ee-99da-4bc6b71a67ec",
65
+ "1105ac2a-9c0e-4937-a097-9b18c8c6527c",
66
+ "55dbff36-0acb-497a-b0c4-2e75d97f37f2",
67
+ "caa643a7-c517-4c48-975d-23db3b1c21cc",
68
+ ],
69
+ ];
@@ -28,7 +28,7 @@ const LayerView = (props) => {
28
28
  dragTable: false,
29
29
  selectNode: false,
30
30
  connectingNode: false
31
- }, onMakeSelection } = props;
31
+ }, onMakeSelection, groupSelection } = props;
32
32
  const widthTooltip = (tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.minWidth) || 168;
33
33
  const tableGhost = useRef(null);
34
34
  const hoverUnderghostId = useRef(null);
@@ -602,7 +602,7 @@ const LayerView = (props) => {
602
602
  const viewBox = isValidBoundingBox
603
603
  ? `${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)}`
604
604
  : "0 0 1000 1000";
605
- const renderedElements = useMemo(() => renderElements(componentsEditor, mappingKey, tableMatchKey, graph.connecting), [componentsEditor, mappingKey, tableMatchKey, statusKey, graph.connecting]);
605
+ const renderedElements = useMemo(() => renderElements(componentsEditor, mappingKey, tableMatchKey, graph.connecting, groupSelection), [componentsEditor, mappingKey, tableMatchKey, statusKey, graph.connecting]);
606
606
  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(),
607
607
  // onDrop={(e) => handleTableEvent(e, "drop")}
608
608
  onPointerDown: handlePointerDown, onPointerUp: handleMouseUp, onMouseMove: (e) => graph.onMouseMove(e), onMouseUp: () => graph.onMouseUp(), onClick: (e) => {
@@ -27,7 +27,7 @@ const LayerView = (props) => {
27
27
  dragTable: false,
28
28
  selectNode: false,
29
29
  connectingNode: false
30
- }, onMakeSelection } = props;
30
+ }, onMakeSelection, groupSelection } = props;
31
31
  const widthTooltip = (tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.minWidth) || 168;
32
32
  const tableGhost = useRef(null);
33
33
  const hoverUnderghostId = useRef(null);
@@ -601,7 +601,7 @@ const LayerView = (props) => {
601
601
  const viewBox = isValidBoundingBox
602
602
  ? `${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)}`
603
603
  : "0 0 1000 1000";
604
- const renderedElements = useMemo(() => renderElements(componentsEditor, mappingKey, tableMatchKey, graph.connecting), [componentsEditor, mappingKey, tableMatchKey, statusKey, graph.connecting]);
604
+ const renderedElements = useMemo(() => renderElements(componentsEditor, mappingKey, tableMatchKey, graph.connecting, groupSelection), [componentsEditor, mappingKey, tableMatchKey, statusKey, graph.connecting]);
605
605
  return (<div className="relative w-full h-full flex-1" ref={containerRef} style={{ overflow: "auto", WebkitOverflowScrolling: "touch" }} {...props.containerProps}>
606
606
  {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">
607
607
  {(loadingRender === null || loadingRender === void 0 ? void 0 : loadingRender.element) || <Spin />}
@@ -66,7 +66,7 @@ export const buildPath = (points) => {
66
66
  };
67
67
  // ─── renderElements ──────────────────────────────────────────────────────────
68
68
  const findIndexByValue = (obj, targetValue) => {
69
- if (!obj || targetValue)
69
+ if (!obj || !targetValue)
70
70
  return undefined;
71
71
  const foundEntry = Object.entries(obj).find(([_, values]) => values.includes(targetValue));
72
72
  return foundEntry ? Number(foundEntry[0]) : undefined;
@@ -87,6 +87,7 @@ export const renderElements = (elementEditor, mappingKey, tableMatchKey, connect
87
87
  // console.log({ finalProps })
88
88
  const findIndexSelection = findIndexByValue(groupSelection === null || groupSelection === void 0 ? void 0 : groupSelection.selection, finalProps === null || finalProps === void 0 ? void 0 : finalProps[groupSelection === null || groupSelection === void 0 ? void 0 : groupSelection.dataKey]);
89
89
  let fill = finalProps === null || finalProps === void 0 ? void 0 : finalProps.fill;
90
+ // console.log({groupSelection },finalProps?.[groupSelection?.dataKey])
90
91
  if (findIndexSelection) {
91
92
  fill = groupSelection === null || groupSelection === void 0 ? void 0 : groupSelection.colorGroupSelection[findIndexSelection];
92
93
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "seat-editor",
3
- "version": "3.6.11",
3
+ "version": "3.6.12",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",