seat-editor 3.5.21 → 3.5.22
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.
|
@@ -7,6 +7,7 @@ import Layers from "../../components/layer-v4";
|
|
|
7
7
|
import { getTranslate } from "../board-v3/utils";
|
|
8
8
|
import { Spin } from "antd";
|
|
9
9
|
const LayerView = (props) => {
|
|
10
|
+
var _a, _b, _c, _d;
|
|
10
11
|
const { componentProps, extraComponentProps, onSelectComponent, onDoubleClick, onCurrentStateChange, mappingKey, statusKey, defaultBackground, defaultBoundingBox, iconTags, tooltipProps, onRightClick, allowTooltip = true, tableMatchKey, eventMatchTable, ghostAttributes, onDrop, onSwitch, refs, privilegedTags, loadingRender, actionPrivileged = {
|
|
11
12
|
select: true,
|
|
12
13
|
move: true,
|
|
@@ -165,7 +166,7 @@ const LayerView = (props) => {
|
|
|
165
166
|
setSelectedTable(seletedTable);
|
|
166
167
|
};
|
|
167
168
|
const boundingBox = useMemo(() => {
|
|
168
|
-
var _a, _b, _c, _d, _e, _f
|
|
169
|
+
var _a, _b, _c, _d, _e, _f;
|
|
169
170
|
if (!componentsEditor && (componentsEditor === null || componentsEditor === void 0 ? void 0 : componentsEditor.length) === 0) {
|
|
170
171
|
return { minX: 0, minY: 0, width: 500, height: 500 };
|
|
171
172
|
}
|
|
@@ -228,10 +229,10 @@ const LayerView = (props) => {
|
|
|
228
229
|
if (hasBoundingBox) {
|
|
229
230
|
hasBoundingBoxRef.current = true;
|
|
230
231
|
return {
|
|
231
|
-
minX: boundingBoxProps.x
|
|
232
|
-
minY: boundingBoxProps.y
|
|
233
|
-
width: boundingBoxProps.width
|
|
234
|
-
height: boundingBoxProps.height
|
|
232
|
+
minX: boundingBoxProps.x,
|
|
233
|
+
minY: boundingBoxProps.y,
|
|
234
|
+
width: boundingBoxProps.width,
|
|
235
|
+
height: boundingBoxProps.height,
|
|
235
236
|
};
|
|
236
237
|
}
|
|
237
238
|
// return {
|
|
@@ -242,10 +243,10 @@ const LayerView = (props) => {
|
|
|
242
243
|
// };
|
|
243
244
|
// console.log(minX, minY, maxX, maxY, props?.viewStyles, "bounding box");
|
|
244
245
|
return {
|
|
245
|
-
minX: minX
|
|
246
|
-
minY: minY
|
|
247
|
-
width: maxX
|
|
248
|
-
height: maxY
|
|
246
|
+
minX: minX,
|
|
247
|
+
minY: minY,
|
|
248
|
+
width: maxX,
|
|
249
|
+
height: maxY,
|
|
249
250
|
};
|
|
250
251
|
}, [componentsEditor, extraComponentsEditor, boundingBoxProps]);
|
|
251
252
|
const renderElements = (elementEditor, mappingKey, tableMatchKey) => {
|
|
@@ -605,7 +606,7 @@ const LayerView = (props) => {
|
|
|
605
606
|
boundingBox.width > 0 &&
|
|
606
607
|
boundingBox.height > 0;
|
|
607
608
|
const viewBox = isValidBoundingBox
|
|
608
|
-
? `${boundingBox.minX} ${boundingBox.minY} ${boundingBox.width} ${boundingBox.height}`
|
|
609
|
+
? `${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)}`
|
|
609
610
|
: "0 0 1000 1000";
|
|
610
611
|
return (_jsxs("div", Object.assign({ className: "relative w-full h-full flex-1", ref: containerRef, style: {
|
|
611
612
|
overflow: "auto",
|
|
@@ -6,6 +6,7 @@ import Layers from "../../components/layer-v4";
|
|
|
6
6
|
import { getTranslate } from "../board-v3/utils";
|
|
7
7
|
import { Spin } from "antd";
|
|
8
8
|
const LayerView = (props) => {
|
|
9
|
+
var _a, _b, _c, _d;
|
|
9
10
|
const { componentProps, extraComponentProps, onSelectComponent, onDoubleClick, onCurrentStateChange, mappingKey, statusKey, defaultBackground, defaultBoundingBox, iconTags, tooltipProps, onRightClick, allowTooltip = true, tableMatchKey, eventMatchTable, ghostAttributes, onDrop, onSwitch, refs, privilegedTags, loadingRender, actionPrivileged = {
|
|
10
11
|
select: true,
|
|
11
12
|
move: true,
|
|
@@ -164,7 +165,7 @@ const LayerView = (props) => {
|
|
|
164
165
|
setSelectedTable(seletedTable);
|
|
165
166
|
};
|
|
166
167
|
const boundingBox = useMemo(() => {
|
|
167
|
-
var _a, _b, _c, _d, _e, _f
|
|
168
|
+
var _a, _b, _c, _d, _e, _f;
|
|
168
169
|
if (!componentsEditor && (componentsEditor === null || componentsEditor === void 0 ? void 0 : componentsEditor.length) === 0) {
|
|
169
170
|
return { minX: 0, minY: 0, width: 500, height: 500 };
|
|
170
171
|
}
|
|
@@ -227,10 +228,10 @@ const LayerView = (props) => {
|
|
|
227
228
|
if (hasBoundingBox) {
|
|
228
229
|
hasBoundingBoxRef.current = true;
|
|
229
230
|
return {
|
|
230
|
-
minX: boundingBoxProps.x
|
|
231
|
-
minY: boundingBoxProps.y
|
|
232
|
-
width: boundingBoxProps.width
|
|
233
|
-
height: boundingBoxProps.height
|
|
231
|
+
minX: boundingBoxProps.x,
|
|
232
|
+
minY: boundingBoxProps.y,
|
|
233
|
+
width: boundingBoxProps.width,
|
|
234
|
+
height: boundingBoxProps.height,
|
|
234
235
|
};
|
|
235
236
|
}
|
|
236
237
|
// return {
|
|
@@ -241,10 +242,10 @@ const LayerView = (props) => {
|
|
|
241
242
|
// };
|
|
242
243
|
// console.log(minX, minY, maxX, maxY, props?.viewStyles, "bounding box");
|
|
243
244
|
return {
|
|
244
|
-
minX: minX
|
|
245
|
-
minY: minY
|
|
246
|
-
width: maxX
|
|
247
|
-
height: maxY
|
|
245
|
+
minX: minX,
|
|
246
|
+
minY: minY,
|
|
247
|
+
width: maxX,
|
|
248
|
+
height: maxY,
|
|
248
249
|
};
|
|
249
250
|
}, [componentsEditor, extraComponentsEditor, boundingBoxProps]);
|
|
250
251
|
const renderElements = (elementEditor, mappingKey, tableMatchKey) => {
|
|
@@ -604,7 +605,7 @@ const LayerView = (props) => {
|
|
|
604
605
|
boundingBox.width > 0 &&
|
|
605
606
|
boundingBox.height > 0;
|
|
606
607
|
const viewBox = isValidBoundingBox
|
|
607
|
-
? `${boundingBox.minX} ${boundingBox.minY} ${boundingBox.width} ${boundingBox.height}`
|
|
608
|
+
? `${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)}`
|
|
608
609
|
: "0 0 1000 1000";
|
|
609
610
|
return (<div className="relative w-full h-full flex-1" ref={containerRef} style={{
|
|
610
611
|
overflow: "auto",
|
|
@@ -12,6 +12,7 @@ import { ConnectionLayer } from "./connection-layer";
|
|
|
12
12
|
import { ConnectHandle } from "./connect-handle";
|
|
13
13
|
import { getAttributeElement } from "../board-v3/resize-element";
|
|
14
14
|
const LayerView = (props) => {
|
|
15
|
+
var _a, _b, _c, _d;
|
|
15
16
|
const { componentProps, extraComponentProps, onSelectComponent, onDoubleClick, mappingKey, statusKey, defaultBackground, defaultBoundingBox, iconTags, tooltipProps, onRightClick, allowTooltip = true, tableMatchKey, eventMatchTable, ghostAttributes, onDrop, onSwitch, refs, privilegedTags, loadingRender, actionPrivileged = {
|
|
16
17
|
select: true,
|
|
17
18
|
move: true,
|
|
@@ -137,7 +138,7 @@ const LayerView = (props) => {
|
|
|
137
138
|
setSelectedTable(mappingKey ? find[mappingKey] : find);
|
|
138
139
|
};
|
|
139
140
|
const boundingBox = useMemo(() => {
|
|
140
|
-
var _a, _b
|
|
141
|
+
var _a, _b;
|
|
141
142
|
if (!componentsEditor && (componentsEditor === null || componentsEditor === void 0 ? void 0 : componentsEditor.length) === 0) {
|
|
142
143
|
return { minX: 0, minY: 0, width: 500, height: 500 };
|
|
143
144
|
}
|
|
@@ -190,17 +191,17 @@ const LayerView = (props) => {
|
|
|
190
191
|
if (boundingBoxProps) {
|
|
191
192
|
hasBoundingBoxRef.current = true;
|
|
192
193
|
return {
|
|
193
|
-
minX: boundingBoxProps.x
|
|
194
|
-
minY: boundingBoxProps.y
|
|
195
|
-
width: boundingBoxProps.width
|
|
196
|
-
height: boundingBoxProps.height
|
|
194
|
+
minX: boundingBoxProps.x,
|
|
195
|
+
minY: boundingBoxProps.y,
|
|
196
|
+
width: boundingBoxProps.width,
|
|
197
|
+
height: boundingBoxProps.height,
|
|
197
198
|
};
|
|
198
199
|
}
|
|
199
200
|
return {
|
|
200
|
-
minX: minX
|
|
201
|
-
minY: minY
|
|
202
|
-
width: maxX
|
|
203
|
-
height: maxY
|
|
201
|
+
minX: minX,
|
|
202
|
+
minY: minY,
|
|
203
|
+
width: maxX,
|
|
204
|
+
height: maxY,
|
|
204
205
|
};
|
|
205
206
|
}, [componentsEditor, extraComponentsEditor, boundingBoxProps]);
|
|
206
207
|
const [fingerCount, setFingerCount] = useState(0);
|
|
@@ -560,7 +561,7 @@ const LayerView = (props) => {
|
|
|
560
561
|
boundingBox.width > 0 &&
|
|
561
562
|
boundingBox.height > 0;
|
|
562
563
|
const viewBox = isValidBoundingBox
|
|
563
|
-
? `${boundingBox.minX} ${boundingBox.minY} ${boundingBox.width} ${boundingBox.height}`
|
|
564
|
+
? `${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)}`
|
|
564
565
|
: "0 0 1000 1000";
|
|
565
566
|
const renderedElements = useMemo(() => renderElements(componentsEditor, mappingKey, tableMatchKey, statusKey), [componentsEditor, mappingKey, tableMatchKey, statusKey]);
|
|
566
567
|
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(), onDrop: (e) => handleTableEvent(e, "drop"), onPointerDown: handlePointerDown, onPointerUp: handleMouseUp, onMouseMove: (e) => graph.onMouseMove(e), onMouseUp: () => graph.onMouseUp(), onClick: (e) => {
|
|
@@ -11,6 +11,7 @@ import { ConnectionLayer } from "./connection-layer";
|
|
|
11
11
|
import { ConnectHandle } from "./connect-handle";
|
|
12
12
|
import { getAttributeElement } from "../board-v3/resize-element";
|
|
13
13
|
const LayerView = (props) => {
|
|
14
|
+
var _a, _b, _c, _d;
|
|
14
15
|
const { componentProps, extraComponentProps, onSelectComponent, onDoubleClick, mappingKey, statusKey, defaultBackground, defaultBoundingBox, iconTags, tooltipProps, onRightClick, allowTooltip = true, tableMatchKey, eventMatchTable, ghostAttributes, onDrop, onSwitch, refs, privilegedTags, loadingRender, actionPrivileged = {
|
|
15
16
|
select: true,
|
|
16
17
|
move: true,
|
|
@@ -136,7 +137,7 @@ const LayerView = (props) => {
|
|
|
136
137
|
setSelectedTable(mappingKey ? find[mappingKey] : find);
|
|
137
138
|
};
|
|
138
139
|
const boundingBox = useMemo(() => {
|
|
139
|
-
var _a, _b
|
|
140
|
+
var _a, _b;
|
|
140
141
|
if (!componentsEditor && (componentsEditor === null || componentsEditor === void 0 ? void 0 : componentsEditor.length) === 0) {
|
|
141
142
|
return { minX: 0, minY: 0, width: 500, height: 500 };
|
|
142
143
|
}
|
|
@@ -189,17 +190,17 @@ const LayerView = (props) => {
|
|
|
189
190
|
if (boundingBoxProps) {
|
|
190
191
|
hasBoundingBoxRef.current = true;
|
|
191
192
|
return {
|
|
192
|
-
minX: boundingBoxProps.x
|
|
193
|
-
minY: boundingBoxProps.y
|
|
194
|
-
width: boundingBoxProps.width
|
|
195
|
-
height: boundingBoxProps.height
|
|
193
|
+
minX: boundingBoxProps.x,
|
|
194
|
+
minY: boundingBoxProps.y,
|
|
195
|
+
width: boundingBoxProps.width,
|
|
196
|
+
height: boundingBoxProps.height,
|
|
196
197
|
};
|
|
197
198
|
}
|
|
198
199
|
return {
|
|
199
|
-
minX: minX
|
|
200
|
-
minY: minY
|
|
201
|
-
width: maxX
|
|
202
|
-
height: maxY
|
|
200
|
+
minX: minX,
|
|
201
|
+
minY: minY,
|
|
202
|
+
width: maxX,
|
|
203
|
+
height: maxY,
|
|
203
204
|
};
|
|
204
205
|
}, [componentsEditor, extraComponentsEditor, boundingBoxProps]);
|
|
205
206
|
const [fingerCount, setFingerCount] = useState(0);
|
|
@@ -559,7 +560,7 @@ const LayerView = (props) => {
|
|
|
559
560
|
boundingBox.width > 0 &&
|
|
560
561
|
boundingBox.height > 0;
|
|
561
562
|
const viewBox = isValidBoundingBox
|
|
562
|
-
? `${boundingBox.minX} ${boundingBox.minY} ${boundingBox.width} ${boundingBox.height}`
|
|
563
|
+
? `${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)}`
|
|
563
564
|
: "0 0 1000 1000";
|
|
564
565
|
const renderedElements = useMemo(() => renderElements(componentsEditor, mappingKey, tableMatchKey, statusKey), [componentsEditor, mappingKey, tableMatchKey, statusKey]);
|
|
565
566
|
return (<div className="relative w-full h-full flex-1" ref={containerRef} style={{ overflow: "auto", WebkitOverflowScrolling: "touch" }} {...props.containerProps}>
|