seat-editor 1.5.5 → 1.5.7
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.
- package/dist/app/new-board/page.js +11 -2
- package/dist/app/new-board/page.jsx +11 -2
- package/dist/features/board/index.js +1 -1
- package/dist/features/board/index.jsx +0 -2
- package/dist/features/panel/upload-tool.js +41 -50
- package/dist/features/panel/upload-tool.jsx +41 -50
- package/package.json +1 -1
|
@@ -23,9 +23,18 @@ export default function NewBoard() {
|
|
|
23
23
|
var _a;
|
|
24
24
|
console.log("setState", setState);
|
|
25
25
|
setInitialValue((_a = setState === null || setState === void 0 ? void 0 : setState.components) !== null && _a !== void 0 ? _a : []);
|
|
26
|
-
}, extraComponentProps: [
|
|
26
|
+
}, extraComponentProps: [{
|
|
27
|
+
src: "https://d3l3j4e3k9p181.cloudfront.net/dev/5bf923de-2366-4a11-9b8b-e92de0afbf05/3a65cb36-7d85-4c38-9403-a15f94641920/68d45207-d66b-4bb5-92a2-4e5a87715e98/rsvp/1751350513582817819_download (10).jpg",
|
|
28
|
+
id: 1747388267450,
|
|
29
|
+
x: 0,
|
|
30
|
+
y: 0,
|
|
31
|
+
shape: "background",
|
|
32
|
+
width: 100,
|
|
33
|
+
height: 100,
|
|
34
|
+
}], defaultBackground: "#ffffff",
|
|
27
35
|
// dragOnly={true}
|
|
28
36
|
statusKey: "status", action: (action) => __awaiter(this, void 0, void 0, function* () {
|
|
29
|
-
console.log(
|
|
37
|
+
console.log({ action });
|
|
38
|
+
return null;
|
|
30
39
|
}) }) })] }) }));
|
|
31
40
|
}
|
|
@@ -39,10 +39,19 @@ export default function NewBoard() {
|
|
|
39
39
|
var _a;
|
|
40
40
|
console.log("setState", setState);
|
|
41
41
|
setInitialValue((_a = setState === null || setState === void 0 ? void 0 : setState.components) !== null && _a !== void 0 ? _a : []);
|
|
42
|
-
}} extraComponentProps={[
|
|
42
|
+
}} extraComponentProps={[{
|
|
43
|
+
src: "https://d3l3j4e3k9p181.cloudfront.net/dev/5bf923de-2366-4a11-9b8b-e92de0afbf05/3a65cb36-7d85-4c38-9403-a15f94641920/68d45207-d66b-4bb5-92a2-4e5a87715e98/rsvp/1751350513582817819_download (10).jpg",
|
|
44
|
+
id: 1747388267450,
|
|
45
|
+
x: 0,
|
|
46
|
+
y: 0,
|
|
47
|
+
shape: "background",
|
|
48
|
+
width: 100,
|
|
49
|
+
height: 100,
|
|
50
|
+
}]} defaultBackground="#ffffff"
|
|
43
51
|
// dragOnly={true}
|
|
44
52
|
statusKey="status" action={(action) => __awaiter(this, void 0, void 0, function* () {
|
|
45
|
-
console.log(
|
|
53
|
+
console.log({ action });
|
|
54
|
+
return null;
|
|
46
55
|
})}/>
|
|
47
56
|
</div>
|
|
48
57
|
|
|
@@ -626,7 +626,7 @@ const BoardTemplate = ({ onSelectComponent }) => {
|
|
|
626
626
|
// moveComponent &&
|
|
627
627
|
// isTouching.current &&
|
|
628
628
|
// !resizeDirection
|
|
629
|
-
return (_jsxs(_Fragment, { children: [_jsx(ModalPreview, { children: _jsx(LayerView, { statusKey: "status" }) }), _jsxs("div", { className: "relative w-full h-screen flex-1 overflow-hidden", ref: containerRef, children: [_jsx("div", { className: "absolute bottom-5 left-1/2 transform -translate-x-1/2 z-10", children: _jsxs("div", { className: "flex gap-2", children: [_jsx(Button, { icon: _jsx(ZoomIn, {}), onClick: handelZoomIn }), _jsx(Button, { icon: _jsx(ZoomOut, {}), onClick: handleZoomOut })] }) }),
|
|
629
|
+
return (_jsxs(_Fragment, { children: [_jsx(ModalPreview, { children: _jsx(LayerView, { statusKey: "status" }) }), _jsxs("div", { className: "relative w-full h-screen flex-1 overflow-hidden", ref: containerRef, children: [_jsx("div", { className: "absolute bottom-5 left-1/2 transform -translate-x-1/2 z-10", children: _jsxs("div", { className: "flex gap-2", children: [_jsx(Button, { icon: _jsx(ZoomIn, {}), onClick: handelZoomIn }), _jsx(Button, { icon: _jsx(ZoomOut, {}), onClick: handleZoomOut })] }) }), _jsxs(TransformWrapper, { ref: transformRef, panning: { disabled: activeTool === "select" }, centerZoomedOut: true, onTransformed: ({ state: { scale } }) => setScale(scale), minScale: 1, maxScale: 1000, initialScale: 1, pinch: { step: 1 }, smooth: true, doubleClick: { step: 1, disabled: activeTool === "select" }, disablePadding: true, children: [scale > 1 && (_jsx("div", { className: "absolute bottom-[60px] left-1/2 transform -translate-x-1/2 z-10", children: renderMiniMap() })), _jsx(TransformComponent, { wrapperStyle: {
|
|
630
630
|
width: "100%",
|
|
631
631
|
height: "100%",
|
|
632
632
|
overflow: "hidden",
|
|
@@ -642,8 +642,6 @@ const BoardTemplate = ({ onSelectComponent }) => {
|
|
|
642
642
|
<Button icon={<ZoomOut />} onClick={handleZoomOut}/>
|
|
643
643
|
</div>
|
|
644
644
|
</div>
|
|
645
|
-
{moveComponent.current && (<h1>Move Component</h1>)}
|
|
646
|
-
|
|
647
645
|
<TransformWrapper ref={transformRef} panning={{ disabled: activeTool === "select" }} centerZoomedOut={true} onTransformed={({ state: { scale } }) => setScale(scale)} minScale={1} // sangat kecil = bisa zoom out jauh
|
|
648
646
|
maxScale={1000} initialScale={1} pinch={{ step: 1 }} smooth={true} doubleClick={{ step: 1, disabled: activeTool === "select" }} disablePadding>
|
|
649
647
|
{scale > 1 && (<div className="absolute bottom-[60px] left-1/2 transform -translate-x-1/2 z-10">
|
|
@@ -10,7 +10,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
10
10
|
};
|
|
11
11
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
12
12
|
import { useState, useEffect } from "react";
|
|
13
|
-
import { Upload,
|
|
13
|
+
import { Upload, Image, Button } from "antd";
|
|
14
14
|
import { InboxOutlined } from "@ant-design/icons";
|
|
15
15
|
import { useAppDispatch } from "../../hooks/use-redux";
|
|
16
16
|
import SectionLabel from "../../components/form-tools/label";
|
|
@@ -41,19 +41,18 @@ const UploadTool = ({ name, type, action, responseMapping, defaultValue, }) => {
|
|
|
41
41
|
id: id || new Date().getTime(),
|
|
42
42
|
x: 0,
|
|
43
43
|
y: 0,
|
|
44
|
-
width,
|
|
45
|
-
height,
|
|
44
|
+
width: width < 1 ? 100 : width,
|
|
45
|
+
height: height < 1 ? 100 : height,
|
|
46
46
|
rotation: 0,
|
|
47
47
|
shape: name,
|
|
48
48
|
src,
|
|
49
49
|
});
|
|
50
|
-
const
|
|
50
|
+
const propsUpload = {
|
|
51
51
|
name: "file",
|
|
52
52
|
multiple: true,
|
|
53
53
|
maxCount: 1,
|
|
54
54
|
showUploadList: false,
|
|
55
55
|
onChange: (info) => __awaiter(void 0, void 0, void 0, function* () {
|
|
56
|
-
var _a;
|
|
57
56
|
const { status } = info.file;
|
|
58
57
|
if (status !== "uploading" && info.file.originFileObj) {
|
|
59
58
|
const file = info.file.originFileObj;
|
|
@@ -61,48 +60,41 @@ const UploadTool = ({ name, type, action, responseMapping, defaultValue, }) => {
|
|
|
61
60
|
let srcFromResponse = "";
|
|
62
61
|
try {
|
|
63
62
|
// ⬇️ IF ada custom action (upload ke server)
|
|
64
|
-
if (action
|
|
63
|
+
if (action) {
|
|
65
64
|
const res = yield action(file);
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
})
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
};
|
|
100
|
-
// Set img src AFTER onload
|
|
101
|
-
img.src = srcFromResponse;
|
|
102
|
-
}
|
|
103
|
-
else {
|
|
104
|
-
message.error((res === null || res === void 0 ? void 0 : res[responseMapping.message]) || "Upload failed");
|
|
105
|
-
}
|
|
65
|
+
srcFromResponse = URL.createObjectURL(file);
|
|
66
|
+
img.onload = () => {
|
|
67
|
+
const scaleX = widthWorkspace / img.width;
|
|
68
|
+
const scaleY = heightWorkspace / img.height;
|
|
69
|
+
const scale = Math.min(1, scaleX, scaleY);
|
|
70
|
+
const width = img.width * scale;
|
|
71
|
+
const height = img.height * scale;
|
|
72
|
+
if (isEdit) {
|
|
73
|
+
dispatch({
|
|
74
|
+
type: type === "component"
|
|
75
|
+
? "board/updateComponent"
|
|
76
|
+
: "board/updateExtraComponent",
|
|
77
|
+
payload: Object.assign({}, defaultFormatValue(width, height, srcFromResponse, defaultValue.id)),
|
|
78
|
+
});
|
|
79
|
+
dispatch({
|
|
80
|
+
type: "panel/setSelectedComponent",
|
|
81
|
+
payload: Object.assign({}, defaultFormatValue(width, height, srcFromResponse, defaultValue.id)),
|
|
82
|
+
});
|
|
83
|
+
setDefaultSrc(srcFromResponse);
|
|
84
|
+
}
|
|
85
|
+
else {
|
|
86
|
+
dispatch({
|
|
87
|
+
type: type === "component"
|
|
88
|
+
? "board/addComponent"
|
|
89
|
+
: "board/setExtraComponent",
|
|
90
|
+
payload: Object.assign({}, defaultFormatValue(width, height, srcFromResponse)),
|
|
91
|
+
});
|
|
92
|
+
}
|
|
93
|
+
dispatch({ type: "board/setFlagChange", payload: true });
|
|
94
|
+
// message.success(`${info.file.name} uploaded successfully.`);
|
|
95
|
+
};
|
|
96
|
+
// Set img src AFTER onload
|
|
97
|
+
img.src = URL.createObjectURL(file);
|
|
106
98
|
}
|
|
107
99
|
// ⬇️ IF local upload
|
|
108
100
|
else {
|
|
@@ -134,15 +126,14 @@ const UploadTool = ({ name, type, action, responseMapping, defaultValue, }) => {
|
|
|
134
126
|
});
|
|
135
127
|
}
|
|
136
128
|
dispatch({ type: "board/setFlagChange", payload: true });
|
|
137
|
-
message.success(`${info.file.name} uploaded successfully.`);
|
|
129
|
+
// message.success(`${info.file.name} uploaded successfully.`);
|
|
138
130
|
};
|
|
139
131
|
// Set img src AFTER onload
|
|
140
132
|
img.src = URL.createObjectURL(file);
|
|
141
133
|
}
|
|
142
134
|
}
|
|
143
135
|
catch (e) {
|
|
144
|
-
|
|
145
|
-
message.error("Upload failed, please try again.");
|
|
136
|
+
// message.error("Upload failed, please try again.");
|
|
146
137
|
}
|
|
147
138
|
}
|
|
148
139
|
}),
|
|
@@ -150,6 +141,6 @@ const UploadTool = ({ name, type, action, responseMapping, defaultValue, }) => {
|
|
|
150
141
|
const handleDelete = () => {
|
|
151
142
|
setDefaultSrc(null);
|
|
152
143
|
};
|
|
153
|
-
return (_jsxs(_Fragment, { children: [defaultSrc ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "w-full flex flex-col items-center gap-2 max-h-[200px] overflow-y-auto", children: _jsx(Image, { src: defaultSrc }) }), _jsx(Button, { type: "primary", onClick: handleDelete, children: "Edit" })] })) : (_jsxs(Dragger, Object.assign({},
|
|
144
|
+
return (_jsxs(_Fragment, { children: [defaultSrc ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "w-full flex flex-col items-center gap-2 max-h-[200px] overflow-y-auto", children: _jsx(Image, { src: defaultSrc }) }), _jsx(Button, { type: "primary", onClick: handleDelete, children: "Edit" })] })) : (_jsxs(Dragger, Object.assign({}, propsUpload, { action: "", children: [_jsx("p", { className: "ant-upload-drag-icon", children: _jsx(InboxOutlined, {}) }), _jsx("p", { className: "ant-upload-text", children: "Click or drag file to this area to upload" }), _jsx("p", { className: "ant-upload-hint", children: "Support for a single or bulk upload. Strictly prohibited from uploading company data or other banned files." })] }))), _jsx(SectionShape, {}), _jsx(SectionLabel, {})] }));
|
|
154
145
|
};
|
|
155
146
|
export default UploadTool;
|
|
@@ -9,7 +9,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
9
9
|
});
|
|
10
10
|
};
|
|
11
11
|
import { useState, useEffect } from "react";
|
|
12
|
-
import { Upload,
|
|
12
|
+
import { Upload, Image, Button } from "antd";
|
|
13
13
|
import { InboxOutlined } from "@ant-design/icons";
|
|
14
14
|
import { useAppDispatch } from "../../hooks/use-redux";
|
|
15
15
|
import SectionLabel from "../../components/form-tools/label";
|
|
@@ -40,19 +40,18 @@ const UploadTool = ({ name, type, action, responseMapping, defaultValue, }) => {
|
|
|
40
40
|
id: id || new Date().getTime(),
|
|
41
41
|
x: 0,
|
|
42
42
|
y: 0,
|
|
43
|
-
width,
|
|
44
|
-
height,
|
|
43
|
+
width: width < 1 ? 100 : width,
|
|
44
|
+
height: height < 1 ? 100 : height,
|
|
45
45
|
rotation: 0,
|
|
46
46
|
shape: name,
|
|
47
47
|
src,
|
|
48
48
|
});
|
|
49
|
-
const
|
|
49
|
+
const propsUpload = {
|
|
50
50
|
name: "file",
|
|
51
51
|
multiple: true,
|
|
52
52
|
maxCount: 1,
|
|
53
53
|
showUploadList: false,
|
|
54
54
|
onChange: (info) => __awaiter(void 0, void 0, void 0, function* () {
|
|
55
|
-
var _a;
|
|
56
55
|
const { status } = info.file;
|
|
57
56
|
if (status !== "uploading" && info.file.originFileObj) {
|
|
58
57
|
const file = info.file.originFileObj;
|
|
@@ -60,48 +59,41 @@ const UploadTool = ({ name, type, action, responseMapping, defaultValue, }) => {
|
|
|
60
59
|
let srcFromResponse = "";
|
|
61
60
|
try {
|
|
62
61
|
// ⬇️ IF ada custom action (upload ke server)
|
|
63
|
-
if (action
|
|
62
|
+
if (action) {
|
|
64
63
|
const res = yield action(file);
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
})
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
};
|
|
99
|
-
// Set img src AFTER onload
|
|
100
|
-
img.src = srcFromResponse;
|
|
101
|
-
}
|
|
102
|
-
else {
|
|
103
|
-
message.error((res === null || res === void 0 ? void 0 : res[responseMapping.message]) || "Upload failed");
|
|
104
|
-
}
|
|
64
|
+
srcFromResponse = URL.createObjectURL(file);
|
|
65
|
+
img.onload = () => {
|
|
66
|
+
const scaleX = widthWorkspace / img.width;
|
|
67
|
+
const scaleY = heightWorkspace / img.height;
|
|
68
|
+
const scale = Math.min(1, scaleX, scaleY);
|
|
69
|
+
const width = img.width * scale;
|
|
70
|
+
const height = img.height * scale;
|
|
71
|
+
if (isEdit) {
|
|
72
|
+
dispatch({
|
|
73
|
+
type: type === "component"
|
|
74
|
+
? "board/updateComponent"
|
|
75
|
+
: "board/updateExtraComponent",
|
|
76
|
+
payload: Object.assign({}, defaultFormatValue(width, height, srcFromResponse, defaultValue.id)),
|
|
77
|
+
});
|
|
78
|
+
dispatch({
|
|
79
|
+
type: "panel/setSelectedComponent",
|
|
80
|
+
payload: Object.assign({}, defaultFormatValue(width, height, srcFromResponse, defaultValue.id)),
|
|
81
|
+
});
|
|
82
|
+
setDefaultSrc(srcFromResponse);
|
|
83
|
+
}
|
|
84
|
+
else {
|
|
85
|
+
dispatch({
|
|
86
|
+
type: type === "component"
|
|
87
|
+
? "board/addComponent"
|
|
88
|
+
: "board/setExtraComponent",
|
|
89
|
+
payload: Object.assign({}, defaultFormatValue(width, height, srcFromResponse)),
|
|
90
|
+
});
|
|
91
|
+
}
|
|
92
|
+
dispatch({ type: "board/setFlagChange", payload: true });
|
|
93
|
+
// message.success(`${info.file.name} uploaded successfully.`);
|
|
94
|
+
};
|
|
95
|
+
// Set img src AFTER onload
|
|
96
|
+
img.src = URL.createObjectURL(file);
|
|
105
97
|
}
|
|
106
98
|
// ⬇️ IF local upload
|
|
107
99
|
else {
|
|
@@ -133,15 +125,14 @@ const UploadTool = ({ name, type, action, responseMapping, defaultValue, }) => {
|
|
|
133
125
|
});
|
|
134
126
|
}
|
|
135
127
|
dispatch({ type: "board/setFlagChange", payload: true });
|
|
136
|
-
message.success(`${info.file.name} uploaded successfully.`);
|
|
128
|
+
// message.success(`${info.file.name} uploaded successfully.`);
|
|
137
129
|
};
|
|
138
130
|
// Set img src AFTER onload
|
|
139
131
|
img.src = URL.createObjectURL(file);
|
|
140
132
|
}
|
|
141
133
|
}
|
|
142
134
|
catch (e) {
|
|
143
|
-
|
|
144
|
-
message.error("Upload failed, please try again.");
|
|
135
|
+
// message.error("Upload failed, please try again.");
|
|
145
136
|
}
|
|
146
137
|
}
|
|
147
138
|
}),
|
|
@@ -157,7 +148,7 @@ const UploadTool = ({ name, type, action, responseMapping, defaultValue, }) => {
|
|
|
157
148
|
<Button type="primary" onClick={handleDelete}>
|
|
158
149
|
Edit
|
|
159
150
|
</Button>
|
|
160
|
-
</>) : (<Dragger {...
|
|
151
|
+
</>) : (<Dragger {...propsUpload} action={""}>
|
|
161
152
|
<p className="ant-upload-drag-icon">
|
|
162
153
|
<InboxOutlined />
|
|
163
154
|
</p>
|