seat-editor 1.6.21 → 1.6.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.
Files changed (79) hide show
  1. package/dist/app/constant.d.ts +43 -0
  2. package/dist/app/constant.js +2747 -0
  3. package/dist/app/layout.d.ts +1 -1
  4. package/dist/app/{layout.js → layout.jsx} +7 -2
  5. package/dist/app/new-board/page.d.ts +1 -1
  6. package/dist/app/new-board/page.jsx +2 -2
  7. package/dist/app/old-board/page.d.ts +2 -1
  8. package/dist/app/old-board/{page.js → page.jsx} +215 -82
  9. package/dist/app/only-view/page.d.ts +1 -1
  10. package/dist/app/only-view/{page.js → page.jsx} +1 -2
  11. package/dist/app/page.d.ts +1 -1
  12. package/dist/app/page.jsx +13 -0
  13. package/dist/app/test/page.d.ts +2 -1
  14. package/dist/app/test/{page.js → page.jsx} +5 -3
  15. package/dist/app/v2/page.d.ts +1 -1
  16. package/dist/app/v2/page.jsx +13 -0
  17. package/dist/components/button-tools/index.d.ts +1 -1
  18. package/dist/components/button-tools/index.jsx +17 -0
  19. package/dist/components/form-tools/label.d.ts +1 -1
  20. package/dist/components/form-tools/label.jsx +44 -0
  21. package/dist/components/form-tools/shape.d.ts +1 -1
  22. package/dist/components/form-tools/shape.jsx +66 -0
  23. package/dist/components/input/number-indicator.d.ts +1 -1
  24. package/dist/components/input/{number-indicator.js → number-indicator.jsx} +11 -2
  25. package/dist/components/joystick/index.d.ts +2 -1
  26. package/dist/components/joystick/{index.js → index.jsx} +14 -13
  27. package/dist/components/layer/index.d.ts +1 -1
  28. package/dist/components/layer/index.jsx +383 -0
  29. package/dist/components/layer-v2/index.d.ts +1 -1
  30. package/dist/components/layer-v2/index.jsx +370 -0
  31. package/dist/components/lib/index.d.ts +1 -1
  32. package/dist/components/lib/{index.js → index.jsx} +7 -2
  33. package/dist/components/modal-preview/index.d.ts +1 -1
  34. package/dist/components/modal-preview/index.jsx +11 -0
  35. package/dist/features/board/index.d.ts +1 -1
  36. package/dist/features/board/{index.js → index.jsx} +90 -31
  37. package/dist/features/board-v2/index.d.ts +2 -1
  38. package/dist/features/board-v2/{index.js → index.jsx} +98 -39
  39. package/dist/features/navbar/index.d.ts +1 -1
  40. package/dist/features/navbar/index.jsx +5 -0
  41. package/dist/features/package/index.d.ts +1 -1
  42. package/dist/features/package/{index.js → index.jsx} +16 -6
  43. package/dist/features/panel/index.d.ts +1 -1
  44. package/dist/features/panel/{index.js → index.jsx} +16 -8
  45. package/dist/features/panel/select-tool.d.ts +1 -1
  46. package/dist/features/panel/{select-tool.js → select-tool.jsx} +20 -8
  47. package/dist/features/panel/square-circle-tool.d.ts +1 -1
  48. package/dist/features/panel/{square-circle-tool.js → square-circle-tool.jsx} +4 -2
  49. package/dist/features/panel/table-seat-circle.d.ts +1 -1
  50. package/dist/features/panel/table-seat-circle.jsx +31 -0
  51. package/dist/features/panel/text-tool.d.ts +1 -1
  52. package/dist/features/panel/text-tool.jsx +26 -0
  53. package/dist/features/panel/upload-tool.d.ts +1 -1
  54. package/dist/features/panel/{upload-tool.js → upload-tool.jsx} +24 -2
  55. package/dist/features/side-tool/index.d.ts +1 -1
  56. package/dist/features/side-tool/{index.js → index.jsx} +90 -71
  57. package/dist/features/view/index.d.ts +1 -1
  58. package/dist/features/view-only/index.d.ts +1 -1
  59. package/dist/features/view-only/{index.js → index.jsx} +44 -35
  60. package/dist/provider/antd-provider.jsx +46 -0
  61. package/dist/provider/redux-provider.d.ts +1 -1
  62. package/dist/provider/{redux-provider.js → redux-provider.jsx} +1 -2
  63. package/dist/provider/store-provider.d.ts +1 -1
  64. package/dist/provider/{store-provider.js → store-provider.jsx} +3 -2
  65. package/package.json +1 -1
  66. package/dist/app/new-board/page.js +0 -34
  67. package/dist/app/page.js +0 -8
  68. package/dist/app/v2/page.js +0 -8
  69. package/dist/components/button-tools/index.js +0 -11
  70. package/dist/components/form-tools/label.js +0 -7
  71. package/dist/components/form-tools/shape.js +0 -25
  72. package/dist/components/layer/index.js +0 -295
  73. package/dist/components/layer-v2/index.js +0 -282
  74. package/dist/components/modal-preview/index.js +0 -10
  75. package/dist/features/navbar/index.js +0 -6
  76. package/dist/features/panel/table-seat-circle.js +0 -9
  77. package/dist/features/panel/text-tool.js +0 -7
  78. package/dist/features/view/index.js +0 -221
  79. package/dist/provider/antd-provider.js +0 -43
@@ -1,6 +0,0 @@
1
- "use client";
2
- import { jsx as _jsx } from "react/jsx-runtime";
3
- const Navbar = () => {
4
- return _jsx("div", { children: "Navbar" });
5
- };
6
- export default Navbar;
@@ -1,9 +0,0 @@
1
- "use client";
2
- import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
3
- import { ColorPicker, Flex, Form, InputNumber } from "antd";
4
- import SectionLabel from "../../components/form-tools/label";
5
- import SectionShape from "../../components/form-tools/shape";
6
- const SeatCircle = () => {
7
- return (_jsx(_Fragment, { children: _jsxs("div", { className: "py-2", children: [_jsx("h1", { className: "heading-s", children: " Round table" }), _jsxs(Flex, { children: [_jsx(Form.Item, { name: "seatCount", label: "Seat Count", className: "w-full", children: _jsx(InputNumber, {}) }), _jsx(Form.Item, { name: "openSpace", label: "Open Space", className: "w-full", children: _jsx(InputNumber, { max: 1, min: 0, step: 0.1 }) })] }), _jsxs(Flex, { gap: 2, children: [_jsx(Form.Item, { label: "Seat Fill", name: "seatFill", getValueFromEvent: (color) => color.toHexString(), className: "w-full ", children: _jsx(ColorPicker, { allowClear: true, format: "hex", defaultFormat: "hex" }) }), _jsx(Form.Item, { label: "Table Fill", name: "fill", getValueFromEvent: (color) => color.toHexString(), className: "w-full ", children: _jsx(ColorPicker, { allowClear: true, format: "hex", defaultFormat: "hex" }) })] }), _jsx(SectionShape, {}), _jsx(SectionLabel, {})] }) }));
8
- };
9
- export default SeatCircle;
@@ -1,7 +0,0 @@
1
- "use client";
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { ColorPicker, Form, Input, InputNumber } from "antd";
4
- const TextTool = () => {
5
- return (_jsxs("div", { className: "py-2", children: [_jsx(Form.Item, { label: "Name", name: "shape", className: "w-full hidden", children: _jsx(Input, { defaultValue: "text" }) }), _jsx(Form.Item, { name: "text", label: "Text", children: _jsx(Input, {}) }), _jsx(Form.Item, { name: "fontColor", label: "Color", getValueFromEvent: (color) => color.toHexString(), children: _jsx(ColorPicker, { allowClear: true, format: "hex", defaultFormat: "hex" }) }), _jsx(Form.Item, { name: "x", label: "X", children: _jsx(InputNumber, {}) }), _jsx(Form.Item, { name: "y", label: "Y", children: _jsx(InputNumber, {}) }), _jsx(Form.Item, { name: "fontSize", label: "Size", children: _jsx(InputNumber, { suffix: "px" }) })] }));
6
- };
7
- export default TextTool;
@@ -1,221 +0,0 @@
1
- "use client";
2
- "use client";
3
- import { jsx as _jsx } from "react/jsx-runtime";
4
- import { useEffect, useMemo, useRef, useState } from "react";
5
- import { TransformWrapper, TransformComponent, } from "react-zoom-pan-pinch";
6
- import { useAppDispatch, useAppSelector } from "../../hooks/use-redux";
7
- import Layers from "../../components/layer";
8
- import { isEqual } from "lodash";
9
- const LayerView = (props) => {
10
- const { componentProps, extraComponentProps, onSelectComponent, onCurrentStateChange, mappingKey, selectedTableColor, colorMatchKey, statusKey, defaultBackground, } = props;
11
- const transformRef = useRef(null);
12
- const containerRef = useRef(null);
13
- const svgRef = useRef(null);
14
- const [scale, setScale] = useState(1);
15
- const [selectedTable, setSelectedTable] = useState(null);
16
- const { components: componentsEditor, extraComponents: extraComponentsEditor, } = useAppSelector((state) => state.board);
17
- const backgroundColor = useAppSelector((state) => state.board.backgroundColor);
18
- const dispatch = useAppDispatch();
19
- const convertComponentProps = () => {
20
- let mappingData = componentProps === null || componentProps === void 0 ? void 0 : componentProps.map((item) => {
21
- if (mappingKey && (item === null || item === void 0 ? void 0 : item[mappingKey])) {
22
- return Object.assign({}, item === null || item === void 0 ? void 0 : item[mappingKey]);
23
- }
24
- return item;
25
- });
26
- return mappingData;
27
- };
28
- useEffect(() => {
29
- if (componentProps) {
30
- if (!isEqual(componentsEditor, convertComponentProps())) {
31
- let mappingData = componentProps === null || componentProps === void 0 ? void 0 : componentProps.map((item) => {
32
- if (mappingKey && (item === null || item === void 0 ? void 0 : item[props.mappingKey])) {
33
- return Object.assign({}, item[props.mappingKey]);
34
- }
35
- return item;
36
- });
37
- dispatch({
38
- type: "board/setNewComponents",
39
- payload: mappingData,
40
- });
41
- }
42
- }
43
- if (extraComponentsEditor) {
44
- if (!isEqual(extraComponentsEditor, extraComponentProps)) {
45
- dispatch({
46
- type: "board/setNewExtraComponents",
47
- payload: extraComponentProps,
48
- });
49
- }
50
- }
51
- if (defaultBackground) {
52
- dispatch({
53
- type: "board/setBackgroundColor",
54
- payload: defaultBackground,
55
- });
56
- }
57
- }, [componentProps, extraComponentProps, defaultBackground]);
58
- useEffect(() => {
59
- onCurrentStateChange &&
60
- onCurrentStateChange({
61
- components: componentsEditor,
62
- extraComponents: extraComponentsEditor,
63
- });
64
- }, [componentsEditor, extraComponentsEditor]);
65
- const handleSelectComponent = (items) => {
66
- const find = componentsEditor.find((item) => {
67
- if (mappingKey && (item === null || item === void 0 ? void 0 : item[mappingKey])) {
68
- return item[mappingKey].id === (items === null || items === void 0 ? void 0 : items.id);
69
- }
70
- return (item === null || item === void 0 ? void 0 : item.id) === (items === null || items === void 0 ? void 0 : items.id);
71
- });
72
- onSelectComponent && onSelectComponent(find);
73
- setSelectedTable(find);
74
- };
75
- const boundingBox = useMemo(() => {
76
- var _a, _b, _c, _d, _e, _f, _g;
77
- if (!componentsEditor && (componentsEditor === null || componentsEditor === void 0 ? void 0 : componentsEditor.length) === 0) {
78
- return { minX: 0, minY: 0, width: 500, height: 500 };
79
- }
80
- let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
81
- componentsEditor === null || componentsEditor === void 0 ? void 0 : componentsEditor.forEach((_) => {
82
- var _a, _b, _c, _d;
83
- const hasMappingKey = mappingKey && _[mappingKey];
84
- let values = hasMappingKey ? _[mappingKey] : _;
85
- if (!values)
86
- return;
87
- if ((_a = values === null || values === void 0 ? void 0 : values.shape) === null || _a === void 0 ? void 0 : _a.includes("square")) {
88
- minX = Math.min(minX, values.x);
89
- minY = Math.min(minY, values.y);
90
- maxX = Math.max(maxX, values.x + values.width);
91
- maxY = Math.max(maxY, values.y + values.height);
92
- }
93
- if ((_b = values === null || values === void 0 ? void 0 : values.shape) === null || _b === void 0 ? void 0 : _b.includes("circle")) {
94
- minX = Math.min(minX, values.x);
95
- minY = Math.min(minY, values.y);
96
- maxX = Math.max(maxX, values.x + values.width);
97
- maxY = Math.max(maxY, values.y + values.height);
98
- }
99
- if ((_c = values === null || values === void 0 ? void 0 : values.shape) === null || _c === void 0 ? void 0 : _c.includes("table-seat-circle")) {
100
- minX = Math.min(minX, values.x);
101
- minY = Math.min(minY, values.y);
102
- maxX = Math.max(maxX, values.x + values.width);
103
- maxY = Math.max(maxY, values.y + values.height);
104
- }
105
- if ((_d = values === null || values === void 0 ? void 0 : values.shape) === null || _d === void 0 ? void 0 : _d.includes("image-table")) {
106
- minX = Math.min(minX, values.x);
107
- minY = Math.min(minY, values.y);
108
- maxX = Math.max(maxX, values.x + values.width);
109
- maxY = Math.max(maxY, values.y + values.height);
110
- }
111
- });
112
- extraComponentsEditor === null || extraComponentsEditor === void 0 ? void 0 : extraComponentsEditor.forEach((values) => {
113
- var _a, _b;
114
- if ((_a = values === null || values === void 0 ? void 0 : values.shape) === null || _a === void 0 ? void 0 : _a.includes("background")) {
115
- minX = Math.min(minX, values.x);
116
- minY = Math.min(minY, values.y);
117
- maxX = Math.max(maxX, values.x + values.width);
118
- maxY = Math.max(maxY, values.y + values.height);
119
- }
120
- if ((_b = values === null || values === void 0 ? void 0 : values.shape) === null || _b === void 0 ? void 0 : _b.includes("text")) {
121
- minX = Math.min(minX, values.x);
122
- minY = Math.min(minY, values.y);
123
- maxX = Math.max(maxX, values.x + values.width);
124
- maxY = Math.max(maxY, values.y + values.height);
125
- }
126
- });
127
- let backgroundHasOne = false;
128
- if ((extraComponentsEditor === null || extraComponentsEditor === void 0 ? void 0 : extraComponentsEditor.length) === 1 &&
129
- ((_b = (_a = extraComponentsEditor === null || extraComponentsEditor === void 0 ? void 0 : extraComponentsEditor[0]) === null || _a === void 0 ? void 0 : _a.shape) === null || _b === void 0 ? void 0 : _b.includes("background"))) {
130
- backgroundHasOne = true;
131
- minX = (_c = extraComponentsEditor === null || extraComponentsEditor === void 0 ? void 0 : extraComponentsEditor[0]) === null || _c === void 0 ? void 0 : _c.x;
132
- minY = (_d = extraComponentsEditor === null || extraComponentsEditor === void 0 ? void 0 : extraComponentsEditor[0]) === null || _d === void 0 ? void 0 : _d.y;
133
- maxX = (_e = extraComponentsEditor === null || extraComponentsEditor === void 0 ? void 0 : extraComponentsEditor[0]) === null || _e === void 0 ? void 0 : _e.width;
134
- maxY = (_f = extraComponentsEditor === null || extraComponentsEditor === void 0 ? void 0 : extraComponentsEditor[0]) === null || _f === void 0 ? void 0 : _f.height;
135
- }
136
- if ((extraComponentsEditor === null || extraComponentsEditor === void 0 ? void 0 : extraComponentsEditor.length) < 1 && ["background", "text"].includes((_g = componentsEditor === null || componentsEditor === void 0 ? void 0 : componentsEditor[0]) === null || _g === void 0 ? void 0 : _g.shape)) {
137
- minX = minX - minX * 0.5;
138
- minY = minY - minY * 0.5;
139
- }
140
- return {
141
- minX: backgroundHasOne ? minX : minX - minX * 0.5,
142
- minY: backgroundHasOne ? minY : minY - minY * 0.5,
143
- width: maxX,
144
- height: maxY,
145
- };
146
- }, [componentsEditor, extraComponentsEditor]);
147
- const renderElements = (elementEditor, mappingKey, colorMatchKey) => {
148
- return elementEditor === null || elementEditor === void 0 ? void 0 : elementEditor.map((editorItem, i) => {
149
- var _a, _b, _c, _d;
150
- const isUsingMapping = mappingKey &&
151
- typeof editorItem[mappingKey] === "object" &&
152
- editorItem[mappingKey] !== null;
153
- const finalProps = isUsingMapping ? editorItem[mappingKey] : editorItem;
154
- if (colorMatchKey) {
155
- if (isUsingMapping) {
156
- return Object.assign(Object.assign({}, finalProps), { fill: (_b = (_a = colorMatchKey.find((item) => item.key == (editorItem === null || editorItem === void 0 ? void 0 : editorItem[statusKey]))) === null || _a === void 0 ? void 0 : _a.color) !== null && _b !== void 0 ? _b : finalProps.fill });
157
- }
158
- else {
159
- return Object.assign(Object.assign({}, finalProps), { fill: (_d = (_c = colorMatchKey.find((item) => item.key == (editorItem === null || editorItem === void 0 ? void 0 : editorItem[statusKey]))) === null || _c === void 0 ? void 0 : _c.color) !== null && _d !== void 0 ? _d : finalProps.fill });
160
- }
161
- }
162
- return finalProps;
163
- });
164
- };
165
- const [fingerCount, setFingerCount] = useState(0);
166
- useEffect(() => {
167
- const container = document.getElementById("workspace");
168
- const handleTouchStart = (e) => {
169
- const count = e.touches.length;
170
- setFingerCount(count);
171
- };
172
- const handleTouchEnd = () => {
173
- setFingerCount(0);
174
- };
175
- if (container) {
176
- container.addEventListener("touchstart", handleTouchStart);
177
- container.addEventListener("touchend", handleTouchEnd);
178
- }
179
- return () => {
180
- if (container) {
181
- container.removeEventListener("touchstart", handleTouchStart);
182
- container.removeEventListener("touchend", handleTouchEnd);
183
- }
184
- };
185
- }, []);
186
- return (_jsx("div", Object.assign({ className: "relative w-full h-full flex-1", ref: containerRef, style: {
187
- height: "100vh",
188
- overflow: "auto",
189
- WebkitOverflowScrolling: "touch",
190
- touchAction: "pan-y",
191
- } }, props.containerProps, { children: _jsx(TransformWrapper, Object.assign({ ref: transformRef }, props.transformProps, { disabled: fingerCount === 1 && scale === 1, disablePadding: true,
192
- // panning={{
193
- // disabled: false,
194
- // velocityDisabled: true,
195
- // }}
196
- // limitToBounds={false}
197
- // doubleClick={{ disabled: true }}
198
- // pinch={{ disabled: false }}
199
- // wheel={{ disabled: true }}
200
- // disabled={true}
201
- // disablePadding={true}
202
- centerZoomedOut: true, onTransformed: ({ state: { scale } }) => setScale(scale), minScale: 1, maxScale: 1000, initialScale: 1,
203
- // pinch={{ step: 1 }}
204
- smooth: true, children: _jsx(TransformComponent, { wrapperStyle: {
205
- width: "100%",
206
- height: "100%",
207
- overflow: "visible",
208
- }, contentStyle: {
209
- width: "100%",
210
- height: "100%",
211
- }, children: _jsx("svg", Object.assign({}, props.svgProps, { id: "workspace", ref: svgRef, width: "100%", height: "100%", viewBox: `${boundingBox.minX} ${boundingBox.minY} ${boundingBox.width} ${boundingBox.height}`, className: "h-full", xmlns: "http://www.w3.org/2000/svg", preserveAspectRatio: "xMidYMid meet", style: {
212
- background: backgroundColor !== null && backgroundColor !== void 0 ? backgroundColor : defaultBackground,
213
- display: "block",
214
- pointerEvents: "auto",
215
- // touchAction: "pan-y",
216
- }, children: _jsx(Layers, { mode: "view", components: [
217
- ...((extraComponentsEditor === null || extraComponentsEditor === void 0 ? void 0 : extraComponentsEditor.length) > 0 ? extraComponentsEditor : []),
218
- ...renderElements(componentsEditor, mappingKey, colorMatchKey),
219
- ], onClick: handleSelectComponent, selectedTable: selectedTable, selectedTableColor: selectedTableColor }) })) }) })) })));
220
- };
221
- export default LayerView;
@@ -1,43 +0,0 @@
1
- "use client";
2
- import { jsx as _jsx } from "react/jsx-runtime";
3
- import { useEffect } from "react";
4
- import { ConfigProvider } from "antd";
5
- import { AntdRegistry } from "@ant-design/nextjs-registry";
6
- import { useAppSelector, useAppDispatch } from "../hooks/use-redux";
7
- export const AntdProvider = ({ children, themeColor }) => {
8
- const dispatch = useAppDispatch();
9
- const theme = useAppSelector((state) => state.theme);
10
- useEffect(() => {
11
- if (themeColor !== theme.primaryColor) {
12
- dispatch({
13
- type: "theme/setPrimaryColor",
14
- payload: themeColor
15
- });
16
- }
17
- }, [themeColor]);
18
- return (_jsx(AntdRegistry, { children: _jsx(ConfigProvider, { theme: {
19
- token: {
20
- colorPrimary: themeColor,
21
- },
22
- // token: {
23
- // colorPrimary: theme.theme["--primary-color"],
24
- // colorPrimaryBorderHover: theme.theme["--primary-color"],
25
- // fontFamily: "var(--font-inter), sans-serif",
26
- // colorError: theme.theme["--danger"],
27
- // controlOutlineWidth: 4,
28
- // controlOutline: theme.theme["--surface-color"],
29
- // colorBgContainerDisabled: "var(--netral-03)",
30
- // colorTextPlaceholder: "var(--netral-06)",
31
- // },
32
- components: {
33
- Form: {
34
- labelFontSize: 14,
35
- fontWeightStrong: 500,
36
- itemMarginBottom: 12,
37
- },
38
- Button: {
39
- colorPrimary: themeColor
40
- }
41
- },
42
- }, children: children }) }));
43
- };