seat-editor 3.0.2 → 3.0.3

package/dist/features/view-only/{index.jsx → index.js}

@@ -1,4 +1,5 @@
 "use client";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect, useMemo, useRef, useState } from "react";
 import { TransformWrapper, TransformComponent, } from "react-zoom-pan-pinch";
 import { useAppDispatch, useAppSelector } from "../../hooks/use-redux";
@@ -159,47 +160,39 @@ const LayerView = (props) => {
             }
         };
     }, []);
-    return (<div className="relative w-full h-full flex-1" ref={containerRef} style={{
+    return (_jsx("div", Object.assign({ className: "relative w-full h-full flex-1", ref: containerRef, style: {
             height: "100vh",
             overflow: "auto",
             WebkitOverflowScrolling: "touch",
             touchAction: "pan-y",
-        }} {...props.containerProps}>
-      <TransformWrapper ref={transformRef} {...props.transformProps} disabled={fingerCount === 1 && scale === 1} disablePadding={true} 
-    // panning={{
-    //   disabled: false,
-    //   velocityDisabled: true,
-    // }}
-    // limitToBounds={false}
-    // doubleClick={{ disabled: true }}
-    // pinch={{ disabled: false }}
-    // wheel={{ disabled: true }}
-    // disabled={true}
-    // disablePadding={true}
-    centerZoomedOut={true} onTransformed={({ state: { scale } }) => setScale(scale)} minScale={1} maxScale={1000} initialScale={1} 
-    // pinch={{ step: 1 }}
-    smooth={true}>
-        <TransformComponent wrapperStyle={{
-            width: "100%",
-            height: "100%",
-            overflow: "visible",
-        }} contentStyle={{
-            width: "100%",
-            height: "100%",
-        }}>
-          <svg {...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={{
-            background: backgroundColor !== null && backgroundColor !== void 0 ? backgroundColor : defaultBackground,
-            display: "block",
-            pointerEvents: "auto",
-            // touchAction: "pan-y",
-        }}>
-            <Layers mode="view" components={[
-            ...extraComponentsEditor,
-            ...renderElements(componentsEditor, mappingKey, colorMatchKey),
-        ]} onClick={handleSelectComponent} selectedTable={selectedTable} selectedTableColor={selectedTableColor}/>
-          </svg>
-        </TransformComponent>
-      </TransformWrapper>
-    </div>);
+        } }, props.containerProps, { children: _jsx(TransformWrapper, Object.assign({ ref: transformRef }, props.transformProps, { disabled: fingerCount === 1 && scale === 1, disablePadding: true, 
+            // panning={{
+            //   disabled: false,
+            //   velocityDisabled: true,
+            // }}
+            // limitToBounds={false}
+            // doubleClick={{ disabled: true }}
+            // pinch={{ disabled: false }}
+            // wheel={{ disabled: true }}
+            // disabled={true}
+            // disablePadding={true}
+            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: "visible",
+                }, contentStyle: {
+                    width: "100%",
+                    height: "100%",
+                }, 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: {
+                        background: backgroundColor !== null && backgroundColor !== void 0 ? backgroundColor : defaultBackground,
+                        display: "block",
+                        pointerEvents: "auto",
+                        // touchAction: "pan-y",
+                    }, children: _jsx(Layers, { mode: "view", components: [
+                            ...extraComponentsEditor,
+                            ...renderElements(componentsEditor, mappingKey, colorMatchKey),
+                        ], onClick: handleSelectComponent, selectedTable: selectedTable, selectedTableColor: selectedTableColor }) })) }) })) })));
 };
 export default LayerView;

package/dist/features/view-only-2/index.d.ts

@@ -15,5 +15,5 @@ export interface LayerViewProps {
     containerProps?: any;
     svgProps?: 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-only-2/{index.jsx → index.js}

@@ -1,4 +1,5 @@
 "use client";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect, useMemo, useRef, useState } from "react";
 import { useAppDispatch, useAppSelector } from "../../hooks/use-redux";
 import Layers from "../../components/layer";
@@ -160,21 +161,17 @@ const LayerView = (props) => {
             }
         };
     }, []);
-    return (<div className="relative w-full h-full flex-1" ref={containerRef} {...props.containerProps}>
-      <svg {...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={{
-            background: backgroundColor !== null && backgroundColor !== void 0 ? backgroundColor : defaultBackground,
-            display: "block",
-            pointerEvents: "auto",
-            touchAction: "auto",
-            // touchAction: "pan-y",
-        }}>
-        <Layers mode="view" components={[
-            ...extraComponentsEditor,
-            ...renderElements(componentsEditor, mappingKey, colorMatchKey),
-        ]} onClick={handleSelectComponent} selectedTable={selectedTable} selectedTableColor={selectedTableColor}/>
-      </svg>
-    </div>);
+    return (_jsx("div", Object.assign({ className: "relative w-full h-full flex-1", ref: containerRef }, props.containerProps, { 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: {
+                background: backgroundColor !== null && backgroundColor !== void 0 ? backgroundColor : defaultBackground,
+                display: "block",
+                pointerEvents: "auto",
+                touchAction: "auto",
+                // touchAction: "pan-y",
+            }, children: _jsx(Layers, { mode: "view", components: [
+                    ...extraComponentsEditor,
+                    ...renderElements(componentsEditor, mappingKey, colorMatchKey),
+                ], onClick: handleSelectComponent, selectedTable: selectedTable, selectedTableColor: selectedTableColor }) })) })));
 };
 export default LayerView;

package/dist/features/view-only-3/index.d.ts

@@ -1,7 +1,7 @@
 import React, { CSSProperties, SVGAttributes } from "react";
 import { ReactZoomPanPinchRef, ReactZoomPanPinchProps, ReactZoomPanPinchContentRef } from "react-zoom-pan-pinch";
-import { PropertiesProps } from "@/dto/table";
-import { EventHandleType } from "@/dto/event-handler";
+import { PropertiesProps } from "../../dto/table";
+import { EventHandleType } from "../../dto/event-handler";
 export type TableGhost = {
     table: PropertiesProps;
     event: EventHandleType;
@@ -64,5 +64,5 @@ export interface LayerViewProps {
     onSwitch?: (e: MouseEvent, component: ComponentProps) => void;
     refs?: React.ForwardedRef<RefLayerView>;
 }
-declare const LayerView: (props: LayerViewProps) => React.JSX.Element;
+declare const LayerView: (props: LayerViewProps) => import("react/jsx-runtime").JSX.Element;
 export default LayerView;

package/dist/features/view-only-3/{index.jsx → index.js}

@@ -1,5 +1,6 @@
 "use client";
-import React, { useEffect, useMemo, useRef, useState, useImperativeHandle, } from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef, useState, useImperativeHandle, } from "react";
 import { TransformWrapper, TransformComponent, } from "react-zoom-pan-pinch";
 import { useAppDispatch, useAppSelector } from "../../hooks/use-redux";
 import Layers from "../../components/layer-v4";
@@ -477,53 +478,33 @@ const LayerView = (props) => {
                 handlePan(0, -speedPanning);
         }
     };
-    return (<div className="relative w-full h-full flex-1" ref={containerRef} style={{
+    return (_jsx("div", Object.assign({ className: "relative w-full h-full flex-1", ref: containerRef, style: {
             height: "100vh",
             overflow: "auto",
             WebkitOverflowScrolling: "touch",
-        }} {...props.containerProps}>
-      {/* {isDragging?.current && (
-          <div className="absolute bottom-1/2 left-1  flex gap-4 z-[10]">
-            <button className="p-4 bg-gray-400">+</button>
-          </div>
-        )} */}
-
-      <TransformWrapper ref={transformRef} {...props.transformProps} 
-    // disabled={fingerCount === 1 && scale === 1}
-    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}>
-        <TransformComponent wrapperStyle={{
-            width: "100%",
-            height: "100%",
-            overflow: "visible",
-        }} contentStyle={{
-            width: "100%",
-            height: "100%",
-        }}>
-          <svg id="workspace" onContextMenu={(e) => e.preventDefault()} onDrop={(e) => handleTableEvent(e, "drop")} onPointerDown={handlePointerDown} onPointerUp={handleMouseUp} 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 !== null && backgroundColor !== void 0 ? backgroundColor : defaultBackground,
-            display: "block",
-            pointerEvents: "all",
-            touchAction: "none",
-            userSelect: "none",
-        }} {...props.svgProps}>
-            <g id="main-layer">
-              <Layers components={[
-            ...extraComponentsEditor,
-            ...renderElements(componentsEditor, mappingKey, tableMatchKey),
-        ]} selectedTable={selectedTable} iconTags={iconTags} eventMatchTable={eventMatchTable}/>
-            </g>
-            {/* 🧠 Ghost universal */}
-          </svg>
-          {tooltip.visible && (<div className={`seat-editor tooltip-container ${tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.className}`} style={Object.assign({ top: tooltip.y, left: tooltip.x, minWidth: widthTooltip + "px" }, tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.style)}>
-              hallo dunia
-            </div>)}
-        </TransformComponent>
-      </TransformWrapper>
-    </div>);
+        } }, props.containerProps, { children: _jsx(TransformWrapper, Object.assign({ ref: transformRef }, props.transformProps, { 
+            // disabled={fingerCount === 1 && scale === 1}
+            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, children: _jsxs(TransformComponent, { wrapperStyle: {
+                    width: "100%",
+                    height: "100%",
+                    overflow: "visible",
+                }, contentStyle: {
+                    width: "100%",
+                    height: "100%",
+                }, children: [_jsx("svg", Object.assign({ id: "workspace", onContextMenu: (e) => e.preventDefault(), onDrop: (e) => handleTableEvent(e, "drop"), onPointerDown: handlePointerDown, onPointerUp: handleMouseUp, 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 !== null && backgroundColor !== void 0 ? backgroundColor : defaultBackground,
+                            display: "block",
+                            pointerEvents: "all",
+                            touchAction: "none",
+                            userSelect: "none",
+                        } }, props.svgProps, { children: _jsx("g", { id: "main-layer", children: _jsx(Layers, { components: [
+                                    ...extraComponentsEditor,
+                                    ...renderElements(componentsEditor, mappingKey, tableMatchKey),
+                                ], selectedTable: selectedTable, iconTags: iconTags, eventMatchTable: eventMatchTable }) }) })), tooltip.visible && (_jsx("div", { className: `seat-editor tooltip-container ${tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.className}`, style: Object.assign({ top: tooltip.y, left: tooltip.x, minWidth: widthTooltip + "px" }, tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.style), children: "hallo dunia" }))] }) })) })));
 };
 export default LayerView;

package/dist/provider/antd-provider.js

@@ -0,0 +1,43 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect } from "react";
+import { ConfigProvider } from "antd";
+import { AntdRegistry } from "@ant-design/nextjs-registry";
+import { useAppSelector, useAppDispatch } from "../hooks/use-redux";
+export const AntdProvider = ({ children, themeColor }) => {
+    const dispatch = useAppDispatch();
+    const theme = useAppSelector((state) => state.theme);
+    useEffect(() => {
+        if (themeColor !== theme.primaryColor) {
+            dispatch({
+                type: "theme/setPrimaryColor",
+                payload: themeColor
+            });
+        }
+    }, [themeColor]);
+    return (_jsx(AntdRegistry, { children: _jsx(ConfigProvider, { theme: {
+                token: {
+                    colorPrimary: themeColor,
+                },
+                //   token: {
+                //     colorPrimary: theme.theme["--primary-color"],
+                //     colorPrimaryBorderHover: theme.theme["--primary-color"],
+                //     fontFamily: "var(--font-inter), sans-serif",
+                //     colorError: theme.theme["--danger"],
+                //     controlOutlineWidth: 4,
+                //     controlOutline: theme.theme["--surface-color"],
+                //     colorBgContainerDisabled: "var(--netral-03)",
+                //     colorTextPlaceholder: "var(--netral-06)",
+                //   },
+                components: {
+                    Form: {
+                        labelFontSize: 14,
+                        fontWeightStrong: 500,
+                        itemMarginBottom: 12,
+                    },
+                    Button: {
+                        colorPrimary: themeColor
+                    }
+                },
+            }, children: children }) }));
+};

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/{redux-provider.jsx → redux-provider.js}

@@ -1,6 +1,7 @@
 "use client";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { store } from "../libs/store";
 import { Provider } from "react-redux";
 export const ReduxProvider = ({ children }) => {
-    return <Provider store={store}>{children}</Provider>;
+    return _jsx(Provider, { store: store, children: children });
 };

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

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

package/dist/provider/{store-provider.jsx → store-provider.js}

@@ -1,10 +1,9 @@
 "use client";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { ReduxProvider } from "./redux-provider";
 import { AntdProvider } from "./antd-provider";
 import { injectSeatEditorCSS } from "../utils/injectCss";
 export const StoreProvider = ({ children, themeColor = "red", }) => {
     injectSeatEditorCSS();
-    return (<ReduxProvider>
-      <AntdProvider themeColor={themeColor}>{children}</AntdProvider>
-    </ReduxProvider>);
+    return (_jsx(ReduxProvider, { children: _jsx(AntdProvider, { themeColor: themeColor, children: children }) }));
 };

package/package.json

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

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

@@ -1,55 +0,0 @@
-"use client";
-import { useEffect, useState } from "react";
-import SeatEditor from "../../features/package";
-import { extraComponent } from "../constant";
-import { data4 } from "../constant";
-export default function NewBoard() {
-    const [initialValue, setInitialValue] = useState([]);
-    const [extraComponents, setExtraComponents] = useState([]);
-    const [backgroundColor, setBackgroundColor] = useState("#000000");
-    const [viewOnly, setViewOnly] = useState(true);
-    useEffect(() => {
-        setInitialValue(data4);
-        setExtraComponents(extraComponent);
-    }, []);
-    return (<>
-      <div className="w-full h-screen flex flex-col relative justify-center">
-        <div className="w-full h-[1000px] bg-white border-r border-gray-200">
-        {/* <LayerView
-          componentProps={initialValue}
-          mappingKey="properties"
-          extraComponentProps={[]}
-          defaultBackground="#ffffff"
-          // dragOnly={true}
-          statusKey="status"
-          
-        /> */}
-        </div>
-        {/* <button className="bg-blue-500 text-white px-4 py-2 rounded"
-          onClick={() => setViewOnly(!viewOnly)}
-        >
-          {viewOnly ? "Edit Mode" : "View Mode"}
-        </button> */}
-        <div className="flex-1 h-full">
-          <SeatEditor componentProps={initialValue} viewOnly={false} dragOnly={true} deleteAutorized={{
-            component: true,
-            extraComponent: true,
-        }} mappingKey="properties" onCurrentStateChange={(setState) => {
-            var _a, _b, _c, _d;
-            if (((_a = setState === null || setState === void 0 ? void 0 : setState.components) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-                setInitialValue((_b = setState === null || setState === void 0 ? void 0 : setState.components) !== null && _b !== void 0 ? _b : []);
-            }
-            if (setState === null || setState === void 0 ? void 0 : setState.backgroundColor) {
-                setBackgroundColor(setState === null || setState === void 0 ? void 0 : setState.backgroundColor);
-            }
-            if (((_c = setState === null || setState === void 0 ? void 0 : setState.extraComponents) === null || _c === void 0 ? void 0 : _c.length) > 0) {
-                setExtraComponents((_d = setState === null || setState === void 0 ? void 0 : setState.extraComponents) !== null && _d !== void 0 ? _d : []);
-            }
-        }} extraComponentProps={extraComponents} defaultBackground={backgroundColor} 
-    // dragOnly={true}
-    statusKey="status"/>
-          </div>
-
-      </div>
-    </>);
-}

package/dist/app/only-view/page.jsx

@@ -1,101 +0,0 @@
-"use client";
-import LayerView from "@/features/view-only-3";
-import { useState, useRef } from "react";
-import { data4 } from "../constant";
-import { ChairIcon } from "./chair";
-import { UserIcon } from "./user";
-import { Modal } from "antd";
-import JsonView from '@uiw/react-json-view';
-const Card = (item) => {
-    const handleDragStart = (e) => {
-        // Jangan preventDefault di drag start
-        e.dataTransfer.setData("application/json", JSON.stringify(item));
-        e.dataTransfer.effectAllowed = "move";
-    };
-    return (<div className="h-40 bg-gray-400 shadow-lg rounded-lg p-4 m-4" data-table={JSON.stringify(item)} draggable onContextMenu={(e) => e.preventDefault()} onDragStart={handleDragStart} // ✅ ini yang benar
-     onClick={(e) => e.stopPropagation()} onPointerDown={(e) => e.stopPropagation()}>
-      <h2 className="text-lg font-semibold mb-2">Card Title</h2>
-      <p className="text-gray-600">{item === null || item === void 0 ? void 0 : item.name}</p>
-    </div>);
-};
-const TouchScrollDetect = () => {
-    const refLayer = useRef(null);
-    const [open, setOpen] = useState(false);
-    const [table, setTable] = useState(null);
-    const handleZoomIn = () => {
-        var _a, _b;
-        (_b = (_a = refLayer === null || refLayer === void 0 ? void 0 : refLayer.current) === null || _a === void 0 ? void 0 : _a.transformRef) === null || _b === void 0 ? void 0 : _b.zoomIn(0.1);
-    };
-    const handleZoomOut = () => {
-        var _a, _b;
-        (_b = (_a = refLayer === null || refLayer === void 0 ? void 0 : refLayer.current) === null || _a === void 0 ? void 0 : _a.transformRef) === null || _b === void 0 ? void 0 : _b.zoomOut();
-    };
-    const handleSwitch = (e, data) => {
-        setOpen(!open);
-        setTable(data);
-    };
-    const handleDrop = (e, data) => {
-        e.preventDefault();
-        setOpen(!open);
-        setTable(data);
-    };
-    const handleSelectTable = (item) => {
-        setOpen(!open);
-        setTable(item);
-    };
-    const renderModal = () => {
-        return (<Modal open={open} onCancel={() => setOpen(false)} width={700} title="Preview Board" centered footer={null}>
-        <div className="flex flex-col p-4 h-[500px] overflow-auto">
-        <JsonView value={table}/>
-        </div>
-      </Modal>);
-    };
-    return (<div className="w-full h-screen border-2 border-black overflow-auto" id="scroll-container">
-      {renderModal()}
-      <div className="flex">
-        <div className="h-screen bg-gray-500 w-1/3">
-          <div className="p-4">
-            {data4.map((item, index) => (<Card key={index} {...item}/>))}
-          </div>
-        </div>
-        <div className="h-screen w-2/3 relative">
-        <div className="absolute top-1 right-1  flex gap-4 z-[10]">
-          <button className="p-4 bg-gray-400" onClick={() => handleZoomIn()}>+</button>
-          <button className="p-4 bg-gray-400" onClick={() => handleZoomOut()}>-</button>
-        </div>
-          <LayerView refs={refLayer} statusKey="status" defaultBackground="#000000" mappingKey="properties" componentProps={data4} onDrop={(e, data) => handleDrop(e, data)} onSwitch={(e, data) => handleSwitch(e, data)} extraComponentProps={[]} onSelectComponent={(component) => {
-            handleSelectTable(component);
-        }} dragTableBlockKey={[
-            {
-                key: "is_lock",
-                value: 1,
-            },
-        ]} tableMatchKey={[
-            {
-                key: 0,
-                properties: { fill: "white" },
-            },
-        ]} eventMatchTable={[
-            {
-                event: "mouseenter",
-                properties: { fill: "red" },
-            },
-            {
-                event: "selected",
-                properties: { fill: "white" },
-            },
-        ]} iconTags={[
-            {
-                icon: <ChairIcon />,
-                key: "chair",
-            },
-            {
-                icon: <UserIcon />,
-                key: "user",
-            },
-        ]}/>
-        </div>
-      </div>
-    </div>);
-};
-export default TouchScrollDetect;

package/dist/app/page.jsx

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

package/dist/app/v2/page.jsx

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

package/dist/components/button-tools/index.jsx

@@ -1,17 +0,0 @@
-"use client";
-import { Button, Popover } from "antd";
-const ButtonTools = (props) => {
-    const { buttonProps, items, popoverProps } = props;
-    if (items.length === 0) {
-        return (<Popover trigger="hover" {...popoverProps}>
-        <Button {...buttonProps}/>
-      </Popover>);
-    }
-    return (<Popover content={<div>
-          <Button>Button 1</Button>
-          <Button>Button 2</Button>
-        </div>} trigger="click">
-      <Button {...buttonProps}/>
-    </Popover>);
-};
-export default ButtonTools;

package/dist/components/form-tools/label.jsx

@@ -1,44 +0,0 @@
-"use client";
-import { Button, ColorPicker, Flex, Form, Input, InputNumber } from "antd";
-const SectionLabel = () => {
-    return (<div className="py-2">
-      <h1 className="heading-s">Section Labeling</h1>
-      <Form.Item label="Labels in square" name={"labels"}>
-        <Form.List name="labels">
-          {(fields, { add, remove }) => (<>
-              {fields.map((field) => (<div key={field.key}>
-                  <Flex gap={2}>
-                    <Form.Item name={[field.name, "label"]} label="Text">
-                      <Input />
-                    </Form.Item>
-                    <Form.Item name={[field.name, "fontColor"]} label="Color" getValueFromEvent={(color) => color.toHexString()}>
-                      <ColorPicker allowClear format="hex" defaultFormat="hex"/>
-                    </Form.Item>
-                  </Flex>
-                  <Flex gap={2}>
-                    <Form.Item name={[field.name, "x"]} label="X">
-                      <InputNumber />
-                    </Form.Item>
-                    <Form.Item name={[field.name, "y"]} label="Y">
-                      <InputNumber />
-                    </Form.Item>
-                    <Form.Item name={[field.name, "fontSize"]} label="Size">
-                      <InputNumber suffix="px"/>
-                    </Form.Item>
-                  </Flex>
-                </div>))}
-              <Flex gap={2}>
-                <Button type="primary" onClick={() => add()} className="btn btn-primary">
-                  Add
-                </Button>
-                <Button type="primary" onClick={() => remove(fields.length - 1)} className="btn btn-primary">
-                  Remove
-                </Button>
-              </Flex>
-            </>)}
-        </Form.List>
-      </Form.Item>
-      <div className="divider-dashed"/>
-    </div>);
-};
-export default SectionLabel;