seat-editor 1.2.15 → 1.2.16

package/dist/app/layout.d.ts

@@ -3,4 +3,4 @@ import "./globals.css";
 export declare const metadata: Metadata;
 export default function RootLayout({ children, }: Readonly<{
     children: React.ReactNode;
-}>): import("react").JSX.Element;
+}>): import("react/jsx-runtime").JSX.Element;

package/dist/app/new-board/page.d.ts

@@ -1 +1 @@
-export default function NewBoard(): import("react").JSX.Element;
+export default function NewBoard(): import("react/jsx-runtime").JSX.Element;

package/dist/app/old-board/page.d.ts

@@ -1,3 +1,2 @@
-import React from "react";
-declare const SeatEditor: () => React.JSX.Element;
+declare const SeatEditor: () => import("react/jsx-runtime").JSX.Element;
 export default SeatEditor;

package/dist/app/old-board/page.js

@@ -15,6 +15,7 @@ const SeatEditor = () => {
     const [shadowRect, setShadowRect] = useState(null);
     const [showModal, setShowModal] = useState(false);
     const [dragOffset, setDragOffset] = useState(null);
+    console.log({ rectangles });
     const [zoom, setZoom] = useState(1);
     const [resizeDirection, setResizeDirection] = useState(null);
     const [images, setImages] = useState([]);
@@ -29,12 +30,15 @@ const SeatEditor = () => {
         const file = (_a = e.target.files) === null || _a === void 0 ? void 0 : _a[0];
         if (!file)
             return;
+        console.log({ file });
         const reader = new FileReader();
         reader.onload = () => {
             const img = document.createElement("img");
             img.src = reader.result;
+            console.log({ img });
             let width = img.width > widthWorkspace ? img.width / 2 : img.width;
             let height = img.height > heightWorkspace ? img.height / 2 : img.height;
+            console.log({ width, height }, img.width, img.height);
             img.onload = () => {
                 setRectangles((prev) => [
                     ...prev,
@@ -284,6 +288,7 @@ const SeatEditor = () => {
         }
     };
     const exportJSON = () => {
+        console.log({ rectangles, images });
         // const json = JSON.stringify(rectangles, null, 2);
         // const blob = new Blob([json], { type: "application/json" });
         // const link = document.createElement("a");

package/dist/app/only-view/page.d.ts

@@ -1,2 +1,2 @@
-declare const OnlyView: () => import("react").JSX.Element;
+declare const OnlyView: () => import("react/jsx-runtime").JSX.Element;
 export default OnlyView;

package/dist/app/page.d.ts

@@ -1,2 +1,2 @@
-declare const TableEditor: () => import("react").JSX.Element;
+declare const TableEditor: () => import("react/jsx-runtime").JSX.Element;
 export default TableEditor;

package/dist/components/button-tools/index.d.ts

@@ -7,5 +7,5 @@ interface ButtonToolsProps {
     }>;
     popoverProps?: PopoverProps;
 }
-declare const ButtonTools: (props: ButtonToolsProps) => import("react").JSX.Element;
+declare const ButtonTools: (props: ButtonToolsProps) => import("react/jsx-runtime").JSX.Element;
 export default ButtonTools;

package/dist/components/form-tools/label.d.ts

@@ -1,2 +1,2 @@
-declare const SectionLabel: () => import("react").JSX.Element;
+declare const SectionLabel: () => import("react/jsx-runtime").JSX.Element;
 export default SectionLabel;

package/dist/components/form-tools/shape.d.ts

@@ -1,2 +1,2 @@
-declare const SectionShape: () => import("react").JSX.Element;
+declare const SectionShape: () => import("react/jsx-runtime").JSX.Element;
 export default SectionShape;

package/dist/components/input/number-indicator.d.ts

@@ -3,5 +3,5 @@ interface NumberIndicatorProps {
     defaultValue?: number;
     onChange: (value: number) => void;
 }
-declare const NumberIndicator: ({ name, defaultValue, onChange }: NumberIndicatorProps) => import("react").JSX.Element;
+declare const NumberIndicator: ({ name, defaultValue, onChange }: NumberIndicatorProps) => import("react/jsx-runtime").JSX.Element;
 export default NumberIndicator;

package/dist/components/layer/index.d.ts

@@ -12,5 +12,5 @@ interface LayersProps {
     style?: any;
     mode?: "view" | "edit";
 }
-declare const Layers: ({ shadowShape, components, onClick, selectedComponent, selectedTable, activeTool, onMouseDown, onMouseUp, onBlur, selectedTableColor, mode, style }: LayersProps) => import("react").JSX.Element;
+declare const Layers: ({ shadowShape, components, onClick, selectedComponent, selectedTable, activeTool, onMouseDown, onMouseUp, onBlur, selectedTableColor, mode, style }: LayersProps) => import("react/jsx-runtime").JSX.Element;
 export default Layers;

package/dist/components/layer/index.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { omit } from "lodash";
-const Layers = ({ shadowShape, components, onClick, selectedComponent, selectedTable, activeTool, onMouseDown, onMouseUp, onBlur, selectedTableColor, }) => {
+const Layers = ({ shadowShape, components, onClick, selectedComponent, selectedTable, activeTool, onMouseDown, onMouseUp, onBlur, selectedTableColor, mode = "edit", style }) => {
     const renderShadowShape = (item) => {
         const { id, x, y, width, height, fill, opacity, rotation, shape, fontColor, text, seatFill, labels, } = item;
         const commonProps = { fill, opacity };
@@ -86,17 +86,23 @@ const Layers = ({ shadowShape, components, onClick, selectedComponent, selectedT
         };
         switch (shape) {
             case "square":
-                return (_jsxs(_Fragment, { children: [_jsx("rect", Object.assign({ x: x, y: y, width: width, height: height, fill: selectedTableColor !== null && selectedTableColor !== void 0 ? selectedTableColor : fill, opacity: id === (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.id) ? 0.5 : opacity }, omit(commonProps, "opacity"), { transform: `rotate(${rotation} ${x + width / 2} ${y + height / 2})` }), id), labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
+                return (_jsxs(_Fragment, { children: [_jsx("rect", Object.assign({ x: x, y: y, width: width, height: height, fill: selectedTableColor !== null && selectedTableColor !== void 0 ? selectedTableColor : fill, style: Object.assign({ cursor: mode === "view" ? "pointer" : "default" }, style), opacity: id === (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.id) ? 0.5 : opacity }, omit(commonProps, "opacity"), { transform: `rotate(${rotation} ${x + width / 2} ${y + height / 2})` }), id), labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
                             var _a, _b, _c, _d;
-                            return (_jsx("text", { x: x + width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0), y: y + height / 2 + ((_b = _ === null || _ === void 0 ? void 0 : _.y) !== null && _b !== void 0 ? _b : 0), fill: (_c = _ === null || _ === void 0 ? void 0 : _.fontColor) !== null && _c !== void 0 ? _c : "black", fontSize: `${(_d = _ === null || _ === void 0 ? void 0 : _.fontSize) !== null && _d !== void 0 ? _d : 10}px`, fontWeight: "bold", textAnchor: "middle", dominantBaseline: "middle", transform: `rotate(${rotation} ${x + width / 2} ${y + height / 2})`, children: _ === null || _ === void 0 ? void 0 : _.label }, `${id}-label-${index}`));
+                            return (_jsx("text", { x: x + width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0), y: y + height / 2 + ((_b = _ === null || _ === void 0 ? void 0 : _.y) !== null && _b !== void 0 ? _b : 0), fill: (_c = _ === null || _ === void 0 ? void 0 : _.fontColor) !== null && _c !== void 0 ? _c : "black", fontSize: `${(_d = _ === null || _ === void 0 ? void 0 : _.fontSize) !== null && _d !== void 0 ? _d : 10}px`, fontWeight: "bold", textAnchor: "middle", dominantBaseline: "middle", transform: `rotate(${rotation} ${x + width / 2} ${y + height / 2})`, onClick: (e) => {
+                                    e.stopPropagation();
+                                    onClick(item);
+                                }, children: _ === null || _ === void 0 ? void 0 : _.label }, `${id}-label-${index}`));
                         })] }));
             case "circle":
-                return (_jsxs(_Fragment, { children: [_jsx("circle", Object.assign({ cx: x + width / 2, cy: y + height / 2, r: width / 2, fill: selectedTableColor !== null && selectedTableColor !== void 0 ? selectedTableColor : fill, opacity: id === (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.id) ? 0.5 : opacity }, omit(commonProps, "opacity")), id), labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
+                return (_jsxs(_Fragment, { children: [_jsx("circle", Object.assign({ cx: x + width / 2, cy: y + height / 2, r: width / 2, style: Object.assign({ cursor: mode === "view" ? "pointer" : "default" }, style), fill: selectedTableColor !== null && selectedTableColor !== void 0 ? selectedTableColor : fill, opacity: id === (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.id) ? 0.5 : opacity }, omit(commonProps, "opacity")), id), labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
                             var _a, _b, _c, _d;
-                            return (_jsx("text", { x: x + width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0), y: y + height / 2 + ((_b = _ === null || _ === void 0 ? void 0 : _.y) !== null && _b !== void 0 ? _b : 0), fill: (_c = _ === null || _ === void 0 ? void 0 : _.fontColor) !== null && _c !== void 0 ? _c : "black", fontSize: `${(_d = _ === null || _ === void 0 ? void 0 : _.fontSize) !== null && _d !== void 0 ? _d : 10}px`, fontWeight: "bold", textAnchor: "middle", dominantBaseline: "middle", transform: `rotate(${rotation} ${x + width / 2} ${y + height / 2})`, children: _ === null || _ === void 0 ? void 0 : _.label }, `${id}-label-${index}`));
+                            return (_jsx("text", { x: x + width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0), y: y + height / 2 + ((_b = _ === null || _ === void 0 ? void 0 : _.y) !== null && _b !== void 0 ? _b : 0), fill: (_c = _ === null || _ === void 0 ? void 0 : _.fontColor) !== null && _c !== void 0 ? _c : "black", fontSize: `${(_d = _ === null || _ === void 0 ? void 0 : _.fontSize) !== null && _d !== void 0 ? _d : 10}px`, fontWeight: "bold", textAnchor: "middle", dominantBaseline: "middle", transform: `rotate(${rotation} ${x + width / 2} ${y + height / 2})`, onClick: (e) => {
+                                    e.stopPropagation();
+                                    onClick(item);
+                                }, children: _ === null || _ === void 0 ? void 0 : _.label }, `${id}-label-${index}`));
                         })] }));
             case "diamond":
-                return (_jsxs(_Fragment, { children: [_jsx("rect", Object.assign({ x: x, y: y, width: width, height: height, transform: `rotate(${rotation}, ${x}, ${y})` }, commonProps, { fill: selectedTableColor !== null && selectedTableColor !== void 0 ? selectedTableColor : fill }), id), _jsx("text", { x: x + width / 2, y: y + height / 2, fill: fontColor !== null && fontColor !== void 0 ? fontColor : "black", fontSize: `${fontSize !== null && fontSize !== void 0 ? fontSize : 10}px`, fontWeight: "bold", textAnchor: "middle", dominantBaseline: "middle", children: label })] }));
+                return (_jsxs(_Fragment, { children: [_jsx("rect", Object.assign({ x: x, y: y, width: width, height: height, style: Object.assign({ cursor: mode === "view" ? "pointer" : "default" }, style), transform: `rotate(${rotation}, ${x}, ${y})` }, commonProps, { fill: selectedTableColor !== null && selectedTableColor !== void 0 ? selectedTableColor : fill }), id), _jsx("text", { x: x + width / 2, y: y + height / 2, fill: fontColor !== null && fontColor !== void 0 ? fontColor : "black", fontSize: `${fontSize !== null && fontSize !== void 0 ? fontSize : 10}px`, fontWeight: "bold", textAnchor: "middle", dominantBaseline: "middle", children: label })] }));
             case "table-seat-circle": {
                 const seatCount = item.seatCount;
                 const openSpace = item.openSpace; // nilai antara 0 (tidak ada ruang) sampai maksimal ~0.9
@@ -114,9 +120,12 @@ const Layers = ({ shadowShape, components, onClick, selectedComponent, selectedT
                     const cy = centerY + radius * Math.sin(angle);
                     return { cx, cy };
                 });
-                return (_jsxs("g", { transform: `rotate(${rotation} ${x + width / 2} ${y + height / 2})`, children: [_jsx("circle", Object.assign({ cx: centerX, cy: centerY, r: width - 15, fill: selectedTableColor !== null && selectedTableColor !== void 0 ? selectedTableColor : fill }, commonProps, { opacity: id === (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.id) ? 0.5 : opacity })), labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
+                return (_jsxs("g", { transform: `rotate(${rotation} ${x + width / 2} ${y + height / 2})`, children: [_jsx("circle", Object.assign({ cx: centerX, style: Object.assign({ cursor: mode === "view" ? "pointer" : "default" }, style), cy: centerY, r: width - 15, fill: selectedTableColor !== null && selectedTableColor !== void 0 ? selectedTableColor : fill }, commonProps, { opacity: id === (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.id) ? 0.5 : opacity })), labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {
                             var _a, _b, _c, _d;
-                            return (_jsx("text", { x: x + width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0), y: y + height / 2 + ((_b = _ === null || _ === void 0 ? void 0 : _.y) !== null && _b !== void 0 ? _b : 0), fill: (_c = _ === null || _ === void 0 ? void 0 : _.fontColor) !== null && _c !== void 0 ? _c : "black", fontSize: `${(_d = _ === null || _ === void 0 ? void 0 : _.fontSize) !== null && _d !== void 0 ? _d : 10}px`, fontWeight: "bold", textAnchor: "middle", dominantBaseline: "middle", transform: `rotate(${rotation} ${x + width / 2} ${y + height / 2})`, children: _ === null || _ === void 0 ? void 0 : _.label }, `${id}-label-${index}`));
+                            return (_jsx("text", { x: x + width / 2 + ((_a = _ === null || _ === void 0 ? void 0 : _.x) !== null && _a !== void 0 ? _a : 0), y: y + height / 2 + ((_b = _ === null || _ === void 0 ? void 0 : _.y) !== null && _b !== void 0 ? _b : 0), fill: (_c = _ === null || _ === void 0 ? void 0 : _.fontColor) !== null && _c !== void 0 ? _c : "black", fontSize: `${(_d = _ === null || _ === void 0 ? void 0 : _.fontSize) !== null && _d !== void 0 ? _d : 10}px`, fontWeight: "bold", textAnchor: "middle", dominantBaseline: "middle", transform: `rotate(${rotation} ${x + width / 2} ${y + height / 2})`, onClick: (e) => {
+                                    e.stopPropagation();
+                                    onClick(item);
+                                }, children: _ === null || _ === void 0 ? void 0 : _.label }, `${id}-label-${index}`));
                         }), _jsx("g", { fill: "#e6b9c0", opacity: id === (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.id) ? 0.5 : opacity, stroke: "#c49ba3", strokeWidth: "1", children: seatCircles.map(({ cx, cy }, i) => (_jsx("circle", { cx: cx, cy: cy, r: seatRadius, fill: seatFill }, `${id}-seat-${i}`))) })] }, id));
             }
             case "table-seat-square": {
@@ -137,10 +146,13 @@ const Layers = ({ shadowShape, components, onClick, selectedComponent, selectedT
                     cx: startX + i * spacing,
                     cy: y + height + seatRadius * 1.5,
                 }));
-                return (_jsxs("g", { transform: `rotate(${rotation}, ${x}, ${y})`, children: [_jsx("rect", Object.assign({ x: x, y: y, width: width, height: height }, commonProps, { fill: selectedTableColor !== null && selectedTableColor !== void 0 ? selectedTableColor : fill })), _jsx("text", { x: x + width / 2, y: y + height / 2, fill: fontColor !== null && fontColor !== void 0 ? fontColor : "black", fontSize: `${fontSize !== null && fontSize !== void 0 ? fontSize : 10}px`, fontWeight: "bold", textAnchor: "middle", dominantBaseline: "middle", children: label }), _jsx("g", { fill: "#e6b9c0", fillOpacity: "0.5", stroke: "#c49ba3", strokeWidth: "1", children: [...topSeats, ...bottomSeats].map(({ cx, cy }, i) => (_jsx("circle", { cx: cx, cy: cy, r: seatRadius }, `${id}-seat-${i}`))) })] }, id));
+                return (_jsxs("g", { transform: `rotate(${rotation}, ${x}, ${y})`, children: [_jsx("rect", Object.assign({ x: x, y: y, style: Object.assign({ cursor: mode === "view" ? "pointer" : "default" }, style), width: width, height: height }, commonProps, { fill: selectedTableColor !== null && selectedTableColor !== void 0 ? selectedTableColor : fill })), _jsx("text", { x: x + width / 2, y: y + height / 2, fill: fontColor !== null && fontColor !== void 0 ? fontColor : "black", fontSize: `${fontSize !== null && fontSize !== void 0 ? fontSize : 10}px`, fontWeight: "bold", textAnchor: "middle", dominantBaseline: "middle", children: label }), _jsx("g", { fill: "#e6b9c0", fillOpacity: "0.5", stroke: "#c49ba3", strokeWidth: "1", children: [...topSeats, ...bottomSeats].map(({ cx, cy }, i) => (_jsx("circle", { cx: cx, cy: cy, r: seatRadius }, `${id}-seat-${i}`))) })] }, id));
             }
             case "text":
-                return (_jsxs("g", { children: [_jsx("rect", { x: x, y: y, width: width, height: height, fill: "transparent", opacity: opacity }), _jsx("text", Object.assign({ x: x + width / 2, y: y + height / 2, textAnchor: "middle", dominantBaseline: "middle", fill: fontColor, fontSize: fontSize !== null && fontSize !== void 0 ? fontSize : height * 0.6, opacity: opacity }, omit(commonProps, ["fill", "opacity"]), { children: text }))] }, id));
+                return (_jsxs("g", { children: [_jsx("rect", { x: x, y: y, width: width, height: height, fill: "transparent", opacity: opacity, onClick: (e) => {
+                                e.stopPropagation();
+                                onClick(item);
+                            } }), _jsx("text", Object.assign({ x: x + width / 2, y: y + height / 2, textAnchor: "middle", dominantBaseline: "middle", fill: fontColor, fontSize: fontSize !== null && fontSize !== void 0 ? fontSize : height * 0.6, opacity: opacity }, omit(commonProps, ["fill", "opacity"]), { children: text }))] }, id));
             case "image-table":
             case "background":
                 return (_jsxs("g", { onClick: () => onClick(item), children: [_jsx("image", Object.assign({ href: src, x: x, y: y, width: width, height: height, transform: `rotate(${rotation} ${x + width / 2} ${y + height / 2})` }, commonProps)), labels === null || labels === void 0 ? void 0 : labels.map((_, index) => {

package/dist/components/lib/index.d.ts

@@ -3,6 +3,6 @@ export interface LayerViewProps {
     componentProps: any[];
     extraComponentProps: any[];
 }
-declare const TableEditor: ({ componentProps, extraComponentProps, }: LayerViewProps) => import("react").JSX.Element;
+declare const TableEditor: ({ componentProps, extraComponentProps, }: LayerViewProps) => import("react/jsx-runtime").JSX.Element;
 export default TableEditor;
 export { LayerView };

package/dist/components/modal-preview/index.d.ts

@@ -1,4 +1,4 @@
 declare const ModalPreview: ({ children }: {
     children: React.ReactNode;
-}) => import("react").JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default ModalPreview;

package/dist/features/board/index.d.ts

@@ -1,5 +1,5 @@
 interface BoardTemplateProps {
     onSelectComponent?: (items: any) => void;
 }
-declare const BoardTemplate: ({ onSelectComponent }: BoardTemplateProps) => import("react").JSX.Element;
+declare const BoardTemplate: ({ onSelectComponent }: BoardTemplateProps) => import("react/jsx-runtime").JSX.Element;
 export default BoardTemplate;

package/dist/features/navbar/index.d.ts

@@ -1,2 +1,2 @@
-declare const Navbar: () => import("react").JSX.Element;
+declare const Navbar: () => import("react/jsx-runtime").JSX.Element;
 export default Navbar;

package/dist/features/package/index.d.ts

@@ -13,5 +13,5 @@ export interface TableEditorProps {
     ];
     statusKey: string;
 }
-declare const TableEditor: (props: TableEditorProps) => import("react").JSX.Element;
+declare const TableEditor: (props: TableEditorProps) => import("react/jsx-runtime").JSX.Element;
 export default TableEditor;

package/dist/features/panel/index.d.ts

@@ -1,2 +1,2 @@
-declare const ControlPanels: () => import("react").JSX.Element;
+declare const ControlPanels: () => import("react/jsx-runtime").JSX.Element;
 export default ControlPanels;

package/dist/features/panel/index.js

@@ -16,7 +16,6 @@ const ControlPanels = () => {
     const [form] = Form.useForm();
     let values = Form.useWatch([], form);
     useEffect(() => {
-        console.log("masuuuuk");
         if (selectedComponent) {
             const isDifferentId = (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.id) !== (values === null || values === void 0 ? void 0 : values.id) || !(values === null || values === void 0 ? void 0 : values.id);
             const isSameIdAndSameDimensions = (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.id) === (values === null || values === void 0 ? void 0 : values.id) &&
@@ -24,15 +23,12 @@ const ControlPanels = () => {
                 (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.width) === (values === null || values === void 0 ? void 0 : values.width) &&
                 (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.x) === (values === null || values === void 0 ? void 0 : values.x) &&
                 (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.y) === (values === null || values === void 0 ? void 0 : values.y);
-            console.log({ isDifferentId, isSameIdAndSameDimensions, show });
             if (show && (isDifferentId || isSameIdAndSameDimensions)) {
                 setOpen(true);
             }
-            console.log("turee");
             form.setFieldsValue(selectedComponent);
         }
         else {
-            console.log("false");
             setOpen(false);
         }
     }, [selectedComponent]);
@@ -77,7 +73,6 @@ const ControlPanels = () => {
     };
     // if(!show) return null
     return (_jsx(Drawer, { open: show, onClose: handleClose, title: "Panel", children: _jsx("div", { className: "bg-white h-full max-h-screen overflow-y-auto w-[300px]", children: _jsxs(Form, { layout: "vertical", form: form, name: "table", onFinish: (values) => {
-                    console.log(values);
                 }, onValuesChange: handleChangeComponent, initialValues: { labels: [{}] }, children: [_jsx(Form.Item, { name: "id", hidden: true, children: _jsx(Input, {}) }), renderFormPanel()] }) }) }));
 };
 export default ControlPanels;

package/dist/features/panel/select-tool.d.ts

@@ -1,4 +1,4 @@
 declare const SelectToolForm: ({ title }: {
     title?: string;
-}) => import("react").JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default SelectToolForm;

package/dist/features/panel/square-circle-tool.d.ts

@@ -1,2 +1,2 @@
-declare const SquareToolForm: () => import("react").JSX.Element;
+declare const SquareToolForm: () => import("react/jsx-runtime").JSX.Element;
 export default SquareToolForm;

package/dist/features/panel/table-seat-circle.d.ts

@@ -1,2 +1,2 @@
-declare const SeatCircle: () => import("react").JSX.Element;
+declare const SeatCircle: () => import("react/jsx-runtime").JSX.Element;
 export default SeatCircle;

package/dist/features/panel/text-tool.d.ts

@@ -1,2 +1,2 @@
-declare const TextTool: () => import("react").JSX.Element;
+declare const TextTool: () => import("react/jsx-runtime").JSX.Element;
 export default TextTool;

package/dist/features/panel/upload-tool.d.ts

@@ -2,5 +2,5 @@ interface UploadToolProps {
     name: string;
     type?: "component" | "background";
 }
-declare const UploadTool: ({ name, type }: UploadToolProps) => import("react").JSX.Element;
+declare const UploadTool: ({ name, type }: UploadToolProps) => import("react/jsx-runtime").JSX.Element;
 export default UploadTool;

package/dist/features/panel/upload-tool.js

@@ -57,9 +57,6 @@ const UploadTool = ({ name, type }) => {
                 message.error(`${info.file.name} file upload failed.`);
             }
         },
-        onDrop(e) {
-            console.log("Dropped files", e.dataTransfer.files);
-        },
     };
     return (_jsxs(_Fragment, { children: [_jsxs(Dragger, Object.assign({}, props, { 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, {})] }));
 };

package/dist/features/side-tool/index.d.ts

@@ -1,2 +1,2 @@
-declare const SideTool: () => import("react").JSX.Element;
+declare const SideTool: () => import("react/jsx-runtime").JSX.Element;
 export default SideTool;

package/dist/features/view/index.d.ts

@@ -12,5 +12,5 @@ export interface LayerViewProps {
     statusKey: string;
     transformProps?: any;
 }
-declare const LayerView: (props: LayerViewProps) => import("react").JSX.Element;
+declare const LayerView: (props: LayerViewProps) => import("react/jsx-runtime").JSX.Element;
 export default LayerView;

package/dist/features/view/index.js

@@ -52,28 +52,29 @@ const LayerView = (props) => {
         }
         let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
         componentsEditor === null || componentsEditor === void 0 ? void 0 : componentsEditor.forEach((_) => {
+            var _a, _b, _c, _d;
             let values = mappingKey ? _[mappingKey] : _.shape;
             if (!values)
                 return;
-            if (values.shape.includes("square")) {
+            if ((_a = values === null || values === void 0 ? void 0 : values.shape) === null || _a === void 0 ? void 0 : _a.includes("square")) {
                 minX = Math.min(minX, values.x);
                 minY = Math.min(minY, values.y);
                 maxX = Math.max(maxX, values.x + values.width);
                 maxY = Math.max(maxY, values.y + values.height);
             }
-            if (values.shape.includes("circle")) {
+            if ((_b = values === null || values === void 0 ? void 0 : values.shape) === null || _b === void 0 ? void 0 : _b.includes("circle")) {
                 minX = Math.min(minX, values.x);
                 minY = Math.min(minY, values.y);
                 maxX = Math.max(maxX, values.x + values.width);
                 maxY = Math.max(maxY, values.y + values.height);
             }
-            if (values.shape.includes("table-seat-circle")) {
+            if ((_c = values === null || values === void 0 ? void 0 : values.shape) === null || _c === void 0 ? void 0 : _c.includes("table-seat-circle")) {
                 minX = Math.min(minX, values.x);
                 minY = Math.min(minY, values.y);
                 maxX = Math.max(maxX, values.x + values.width);
                 maxY = Math.max(maxY, values.y + values.height);
             }
-            if (values.shape.includes("image-table")) {
+            if ((_d = values === null || values === void 0 ? void 0 : values.shape) === null || _d === void 0 ? void 0 : _d.includes("image-table")) {
                 minX = Math.min(minX, values.x);
                 minY = Math.min(minY, values.y);
                 maxX = Math.max(maxX, values.x + values.width);
@@ -101,7 +102,6 @@ const LayerView = (props) => {
         };
     }, [componentsEditor, extraComponentsEditor]);
     let elementEditor = [, ...componentsEditor];
-    console.log({ elementEditor });
     const renderElements = (elementEditor, mappingKey, colorMatchKey) => {
         return elementEditor.map((editorItem, i) => {
             var _a, _b, _c, _d;
@@ -120,7 +120,9 @@ const LayerView = (props) => {
             return finalProps;
         });
     };
-    return (_jsx("div", { className: "relative w-full h-full flex-1", ref: containerRef, children: _jsx(TransformWrapper, { ref: transformRef, panning: { disabled: false }, centerZoomedOut: true, onTransformed: ({ state: { scale } }) => setScale(scale), minScale: 1, maxScale: 1000, initialScale: 1, pinch: { step: 1 }, smooth: true, disablePadding: true, children: _jsx(TransformComponent, { wrapperStyle: {
+    return (_jsx("div", { className: "relative w-full h-full flex-1", ref: containerRef, children: _jsx(TransformWrapper, Object.assign({ ref: transformRef }, props.transformProps, { panning: {
+                disabled: false,
+            }, centerZoomedOut: true, onTransformed: ({ state: { scale } }) => setScale(scale), minScale: 1, maxScale: 1000, initialScale: 1, pinch: { step: 1 }, smooth: true, children: _jsx(TransformComponent, { wrapperStyle: {
                     width: "100%",
                     height: "100%",
                     overflow: "hidden",
@@ -130,9 +132,9 @@ const LayerView = (props) => {
                 }, children: _jsx("svg", { 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: {
                         background: backgroundColor,
                         display: "block",
-                    }, children: _jsx(Layers, { components: [
+                    }, children: _jsx(Layers, { mode: "view", components: [
                             ...extraComponentsEditor,
                             ...renderElements(componentsEditor, mappingKey, colorMatchKey),
-                        ], onClick: handleSelectComponent, selectedTable: selectedTable, selectedTableColor: selectedTableColor }) }) }) }) }));
+                        ], onClick: handleSelectComponent, selectedTable: selectedTable, selectedTableColor: selectedTableColor }) }) }) })) }));
 };
 export default LayerView;

package/dist/provider/redux-provider.d.ts

@@ -1,3 +1,3 @@
 export declare const ReduxProvider: ({ children }: {
     children: React.ReactNode;
-}) => import("react").JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/provider/store-provider.d.ts

@@ -1,3 +1,3 @@
 export declare const StoreProvider: ({ children }: {
     children: React.ReactNode;
-}) => import("react").JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "seat-editor",
-  "version": "1.2.15",
+  "version": "1.2.16",
   "private": false,
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/dist/app/layout.jsx

@@ -1,27 +0,0 @@
-import localFont from "next/font/local";
-import "./globals.css";
-import { Layout } from "antd";
-import { StoreProvider } from "../provider/store-provider";
-const geistSans = localFont({
-    src: "./fonts/GeistVF.woff",
-    variable: "--font-geist-sans",
-    weight: "100 900",
-});
-const geistMono = localFont({
-    src: "./fonts/GeistMonoVF.woff",
-    variable: "--font-geist-mono",
-    weight: "100 900",
-});
-export const metadata = {
-    title: "Create Next App",
-    description: "Generated by create next app",
-};
-export default function RootLayout({ children, }) {
-    return (<html lang="en">
-      <body className={`${geistSans.variable} ${geistMono.variable} antialiased`}>
-        <StoreProvider>
-          <Layout>{children}</Layout>
-        </StoreProvider>
-      </body>
-    </html>);
-}

package/dist/app/new-board/page.jsx

@@ -1,12 +0,0 @@
-import Board from "../../features/board";
-import SideTool from "../../features/side-tool";
-import ControlPanels from "../../features/panel";
-export default function NewBoard() {
-    return (<>
-      <div className="w-full h-screen flex relative">
-        <SideTool />
-        <Board />
-        <ControlPanels />
-      </div>
-    </>);
-}