seat-editor 3.2.5 → 3.2.7

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

@@ -1,6 +1,5 @@
 import { RefsType } from "../board-v3";
 import { PropertiesProps } from "@/dto/table";
-import { UploadFile } from "antd";
 export interface TableEditorProps {
     componentProps: PropertiesProps[];
     extraComponentProps: PropertiesProps[];
@@ -20,7 +19,7 @@ export interface TableEditorProps {
     ];
     statusKey: string;
     defaultBackground?: string;
-    action?: (file: UploadFile<File>, type: string, defaultValue: PropertiesProps) => Promise<string>;
+    action?: (file: File) => Promise<string>;
     responseMapping?: {
         status: string;
         message: string;

package/dist/features/package/index.jsx

@@ -7,6 +7,7 @@ import { useAppDispatch, useAppSelector } from "../../hooks/use-redux";
 import { isEqual } from "lodash";
 import LayerView from "../view-only";
 const TableEditor = (props) => {
+    var _a;
     const [initialValue, setInitialValue] = useState(null);
     const { componentProps, extraComponentProps, onCurrentStateChange, dragOnly, mappingKey, viewOnly, deleteAutorized, refs, } = props;
     const { components, extraComponents, backgroundColor } = useAppSelector((state) => state.board);
@@ -29,7 +30,7 @@ const TableEditor = (props) => {
         }
         dispatch({
             type: "tool/setActiveTool",
-            payload: ""
+            payload: "",
         });
         if (viewOnly) {
             dispatch({ type: "board/setFlagChange", payload: true });
@@ -128,7 +129,7 @@ const TableEditor = (props) => {
           </div>) : (<div key={`${viewOnly}`} className="w-full h-full flex relative">
             <SideTool dragOnly={dragOnly} deleteAutorized={deleteAutorized}/>
             <Board key={`${viewOnly}`} refs={refsBoard}/>
-            <ControlPanels action={props.action}/>
+            <ControlPanels action={props.action} transform={(_a = refsBoard === null || refsBoard === void 0 ? void 0 : refsBoard.current) === null || _a === void 0 ? void 0 : _a.transformRef}/>
           </div>)}
       </div>
     </>);

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

@@ -1,7 +1,6 @@
-import { UploadFile } from "antd";
-import { PropertiesProps } from "../../dto/table";
 interface ControlPanelsProps {
-    action?: (file: UploadFile<File>, type: string, defaultValue: PropertiesProps) => Promise<string>;
+    action?: (file: File) => Promise<string>;
+    transform?: any;
 }
 declare const ControlPanels: (props: ControlPanelsProps) => import("react").JSX.Element;
 export default ControlPanels;

package/dist/features/panel/index.jsx

@@ -25,7 +25,7 @@ import { SEAT_SHAPES } from "../../utils/constant";
 import { adjustHeightWidthForSeatShape, getSeatCount, getSeatPosition, isSeatShape, } from "./utils";
 import SeatSquare from "./table-seat-square";
 const ControlPanels = (props) => {
-    const { action } = props;
+    const { action, transform } = props;
     const dispatch = useAppDispatch();
     const theme = useAppSelector((state) => state.theme);
     const tool = useAppSelector((state) => state.tool);
@@ -216,7 +216,7 @@ const ControlPanels = (props) => {
     const renderFormPanel = () => {
         switch (tool.active) {
             case "select":
-                return (<SelectToolForm action={action}/>);
+                return (<SelectToolForm action={action} tranform={transform}/>);
             case "square":
             case "circle":
                 return <SquareToolForm />;
@@ -225,9 +225,9 @@ const ControlPanels = (props) => {
             case "table-seat-square":
                 return <SeatSquare />;
             case "image-table":
-                return (<UploadTool name={tool.active} type="component" action={action}/>);
+                return (<UploadTool name={tool.active} type="component" action={action} transform={transform}/>);
             case "background":
-                return (<UploadTool name={tool.active} type="background" action={action}/>);
+                return (<UploadTool name={tool.active} type="background" action={action} transform={transform}/>);
             default:
                 return null;
         }

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

@@ -1,5 +1,6 @@
-declare const SelectToolForm: ({ title, action }: {
+declare const SelectToolForm: ({ title, action, tranform }: {
     title?: string;
     action: any;
+    tranform: any;
 }) => import("react").JSX.Element;
 export default SelectToolForm;

package/dist/features/panel/select-tool.jsx

@@ -6,7 +6,7 @@ import SeatSquare from "./table-seat-square";
 import UploadTool from "./upload-tool";
 import TextTool from "./text-tool";
 import SelectedGroup from "./selected-group";
-const SelectToolForm = ({ title = "Title", action }) => {
+const SelectToolForm = ({ title = "Title", action, tranform }) => {
     const components = useAppSelector((state) => state.board.components);
     const selectedComponent = useAppSelector((state) => state.panel.selectedComponent);
     const extraComponents = useAppSelector((state) => state.board.extraComponents);
@@ -49,7 +49,7 @@ const SelectToolForm = ({ title = "Title", action }) => {
             case "background":
                 return (<UploadTool action={action} name={selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.shape} defaultValue={selectedComponent} type={(selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.shape) === "background"
                         ? "background"
-                        : "component"}/>);
+                        : "component"} transform={tranform}/>);
             case "text":
                 return <TextTool />;
             default:

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

@@ -1,10 +1,10 @@
-import { UploadFile } from "antd";
 import { PropertiesProps } from "@/dto/table";
 interface UploadToolProps {
     name: string;
     type?: "component" | "background" | "assets";
-    action?: (file: UploadFile<File>, type: string, defaultValue: PropertiesProps) => Promise<string>;
+    action?: (file: File) => Promise<string>;
     defaultValue?: PropertiesProps;
+    transform?: any;
 }
-declare const UploadTool: ({ name, type, action, defaultValue }: UploadToolProps) => import("react").JSX.Element;
+declare const UploadTool: ({ name, type, action, defaultValue, transform }: UploadToolProps) => import("react").JSX.Element;
 export default UploadTool;

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

@@ -15,8 +15,9 @@ import { useAppDispatch } from "../../hooks/use-redux";
 import SectionLabel from "../../components/form-tools/label";
 import SectionShape from "../../components/form-tools/shape";
 const { Dragger } = Upload;
-const UploadTool = ({ name, type, action, defaultValue }) => {
-    var _a, _b;
+const UploadTool = ({ name, type, action, defaultValue, transform }) => {
+    var _a, _b, _c;
+    const transformState = (_a = transform === null || transform === void 0 ? void 0 : transform.instance) === null || _a === void 0 ? void 0 : _a.transformState;
     const [defaultSrc, setDefaultSrc] = useState(null);
     const [isEdit, setIsEdit] = useState(false);
     const [loading, setLoading] = useState(false);
@@ -28,12 +29,12 @@ const UploadTool = ({ name, type, action, defaultValue }) => {
         }
     }, [defaultValue]);
     const dispatch = useAppDispatch();
-    const widthWorkspace = ((_a = document === null || document === void 0 ? void 0 : document.getElementById("workspace")) === null || _a === void 0 ? void 0 : _a.clientWidth) || 0;
-    const heightWorkspace = ((_b = document === null || document === void 0 ? void 0 : document.getElementById("workspace")) === null || _b === void 0 ? void 0 : _b.clientHeight) || 0;
+    const widthWorkspace = ((_b = document === null || document === void 0 ? void 0 : document.getElementById("workspace")) === null || _b === void 0 ? void 0 : _b.clientWidth) || 0;
+    const heightWorkspace = ((_c = document === null || document === void 0 ? void 0 : document.getElementById("workspace")) === null || _c === void 0 ? void 0 : _c.clientHeight) || 0;
     const defaultFormatValue = (width, height, src, id) => ({
         id: id || new Date().getTime(),
-        x: 0,
-        y: 0,
+        x: Math.abs(transformState === null || transformState === void 0 ? void 0 : transformState.positionX),
+        y: Math.abs(transformState === null || transformState === void 0 ? void 0 : transformState.positionY),
         width: width < 1 ? 100 : width,
         height: height < 1 ? 100 : height,
         rotation: 0,
@@ -54,7 +55,7 @@ const UploadTool = ({ name, type, action, defaultValue }) => {
                 try {
                     // ⬇️ IF ada custom action (upload ke server)
                     if (action) {
-                        const src = yield action(file, type, defaultValue);
+                        const src = yield action(file);
                         if (isEdit) {
                             dispatch({
                                 type: "board/updateComponent",
@@ -68,6 +69,16 @@ const UploadTool = ({ name, type, action, defaultValue }) => {
                             dispatch({ type: "board/setFlagChange", payload: true });
                             dispatch({ type: "board/setUpdateBy", payload: "global" });
                         }
+                        else {
+                            dispatch({
+                                type: "board/addComponent",
+                                payload: Object.assign({}, defaultFormatValue(widthWorkspace, heightWorkspace, src)),
+                            });
+                            dispatch({
+                                type: "panel/setSelectedComponent",
+                                payload: Object.assign({}, defaultFormatValue(widthWorkspace, heightWorkspace, src)),
+                            });
+                        }
                     }
                     // ⬇️ IF local upload
                     else {

package/package.json

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