seat-editor 3.3.43 → 3.3.44

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

@@ -2,5 +2,5 @@ interface BoardTemplateProps {
     onSelectComponent?: (items: any) => void;
     mappingKey?: string;
 }
-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/board-v2/index.d.ts

@@ -1,8 +1,7 @@
-import React from "react";
 interface BoardTemplateProps {
     onSelectComponent?: (items: any) => void;
     mappingKey?: string;
     viewOnly?: boolean;
 }
-declare const BoardTemplate: ({ onSelectComponent, viewOnly }: BoardTemplateProps) => React.JSX.Element;
+declare const BoardTemplate: ({ onSelectComponent, viewOnly }: BoardTemplateProps) => import("react/jsx-runtime").JSX.Element;
 export default BoardTemplate;

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

@@ -13,5 +13,5 @@ interface BoardTemplateProps {
     };
     disabled?: boolean;
 }
-declare const BoardTemplate: ({ refs, loadingRender, disabled }: BoardTemplateProps) => React.JSX.Element;
+declare const BoardTemplate: ({ refs, loadingRender, disabled, }: BoardTemplateProps) => import("react/jsx-runtime").JSX.Element;
 export default BoardTemplate;

package/dist/features/board-v3/index.js

@@ -15,7 +15,7 @@ import { applyResizeToSvgElement, arrayToSvgPointsAttr, createTableGhost, getGlo
 const toolElement = ["square", "circle", "table-seat-circle"];
 const idSelectionBoxGhost = "selection-box-ghost";
 const nameShapeSelectionBoxGhost = "selection-box";
-const BoardTemplate = ({ refs, loadingRender }) => {
+const BoardTemplate = ({ refs, loadingRender, disabled = false, }) => {
     const dispatch = useAppDispatch();
     const backgroundColor = useAppSelector((state) => state.board.backgroundColor);
     const selectedComponentProps = useAppSelector((state) => state.panel.selectedComponent);
@@ -1312,7 +1312,7 @@ const BoardTemplate = ({ refs, loadingRender }) => {
                 let y2 = [];
                 allElementSelectionGroup.forEach((element) => {
                     const activeId = element.id;
-                    const { g, inner, element: el } = getAttributeElement(svg, String(activeId));
+                    const { g, inner, element: el, } = getAttributeElement(svg, String(activeId));
                     const { x, y, width, height } = getGlobalBBox(svg, g);
                     xs.push(x);
                     ys.push(y);
@@ -1547,7 +1547,13 @@ const BoardTemplate = ({ refs, loadingRender }) => {
             });
         }
     };
-    return (_jsxs(_Fragment, { children: [_jsxs(ModalPreview, { children: [_jsx(LayerView, { statusKey: "status", loadingRender: loadingRender }), _jsx("div", { className: "flex gap-2 mt-2", children: _jsxs(Radio.Group, { value: isShowTagType, onChange: handleCheckPreview, children: [_jsx(Radio, { value: "default", children: "Default" }), _jsx(Radio, { value: "type-1", children: "Type 1" }), _jsx(Radio, { value: "type-2", children: "Type 2" })] }) })] }), _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 })] }) }), _jsx(TransformWrapper, { ref: transformRef, 
+    return (_jsxs(_Fragment, { children: [_jsxs(ModalPreview, { children: [_jsx(LayerView, { statusKey: "status", loadingRender: loadingRender, actionPrivileged: {
+                            select: false,
+                            move: false,
+                            switch: false,
+                            drop: false,
+                            rightClick: false,
+                        } }), _jsx("div", { className: "flex gap-2 mt-2", children: _jsxs(Radio.Group, { value: isShowTagType, onChange: handleCheckPreview, children: [_jsx(Radio, { value: "default", children: "Default" }), _jsx(Radio, { value: "type-1", children: "Type 1" }), _jsx(Radio, { value: "type-2", children: "Type 2" })] }) })] }), _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 })] }) }), _jsx(TransformWrapper, { ref: transformRef, 
                         // limitToBounds={true}
                         panning: {
                             disabled: [
@@ -1558,7 +1564,7 @@ const BoardTemplate = ({ refs, loadingRender }) => {
                                 "table-seat-circle",
                                 "table-seat-square",
                                 "bounding-box",
-                                ""
+                                "",
                             ].includes(activeTool),
                         }, 
                         // centerZoomedOut={true}

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

@@ -44,5 +44,5 @@ export interface TableEditorProps<TMeta = undefined> {
     };
     disabledView?: boolean;
 }
-declare const TableEditor: <TMeta>(props: TableEditorProps<TMeta>) => import("react").JSX.Element;
+declare const TableEditor: <TMeta>(props: TableEditorProps<TMeta>) => import("react/jsx-runtime").JSX.Element;
 export default TableEditor;

package/dist/features/package/index.js

@@ -161,6 +161,12 @@ const TableEditor = (props) => {
         props === null || props === void 0 ? void 0 : props.defaultBoundingBox,
         loadingRender === null || loadingRender === void 0 ? void 0 : loadingRender.state,
     ]);
-    return (_jsx(_Fragment, { children: _jsx("div", { className: "w-full h-screen flex relative", children: viewOnly ? (_jsx("div", { className: "w-full h-full flex relative", children: _jsx(LayerView, { statusKey: "status", loadingRender: props === null || props === void 0 ? void 0 : props.loadingRender }, `${viewOnly}`) })) : (_jsxs("div", { className: "w-full h-full flex relative", children: [(loading && !isPreview) && (_jsx("div", { className: "absolute z-10 top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 bg-opacity-50 bg-white w-full h-full flex items-center justify-center", children: (loadingRender === null || loadingRender === void 0 ? void 0 : loadingRender.element) || _jsx(Spin, {}) })), _jsx(SideTool, { dragOnly: dragOnly, deleteAutorized: deleteAutorized }), _jsx(Board, { refs: refsBoard, loadingRender: props === null || props === void 0 ? void 0 : props.loadingRender }, `${viewOnly}`), _jsx(ControlPanels, { action: props.action, transform: (_a = refsBoard === null || refsBoard === void 0 ? void 0 : refsBoard.current) === null || _a === void 0 ? void 0 : _a.transformRef })] }, `${viewOnly}`)) }) }));
+    return (_jsx(_Fragment, { children: _jsx("div", { className: "w-full h-screen flex relative", children: viewOnly ? (_jsx("div", { className: "w-full h-full flex relative", children: _jsx(LayerView, { statusKey: "status", loadingRender: props === null || props === void 0 ? void 0 : props.loadingRender, actionPrivileged: {
+                        select: false,
+                        move: false,
+                        switch: false,
+                        drop: false,
+                        rightClick: false,
+                    } }, `${viewOnly}`) })) : (_jsxs("div", { className: "w-full h-full flex relative", children: [loading && !isPreview && (_jsx("div", { className: "absolute z-10 top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 bg-opacity-50 bg-white w-full h-full flex items-center justify-center", children: (loadingRender === null || loadingRender === void 0 ? void 0 : loadingRender.element) || _jsx(Spin, {}) })), _jsx(SideTool, { dragOnly: dragOnly, deleteAutorized: deleteAutorized }), _jsx(Board, { refs: refsBoard, loadingRender: props === null || props === void 0 ? void 0 : props.loadingRender, disabled: props === null || props === void 0 ? void 0 : props.disabledView }, `${viewOnly}`), _jsx(ControlPanels, { action: props.action, transform: (_a = refsBoard === null || refsBoard === void 0 ? void 0 : refsBoard.current) === null || _a === void 0 ? void 0 : _a.transformRef })] }, `${viewOnly}`)) }) }));
 };
 export default TableEditor;

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

@@ -2,5 +2,5 @@ interface ControlPanelsProps {
     action?: (file: File) => Promise<string>;
     transform?: any;
 }
-declare const ControlPanels: (props: ControlPanelsProps) => import("react").JSX.Element;
+declare const ControlPanels: (props: ControlPanelsProps) => import("react/jsx-runtime").JSX.Element;
 export default ControlPanels;

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

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

package/dist/features/panel/selected-group.d.ts

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

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/table-seat-square.d.ts

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

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

@@ -6,5 +6,5 @@ interface UploadToolProps {
     defaultValue?: PropertiesProps;
     transform?: any;
 }
-declare const UploadTool: ({ name, type, action, defaultValue, transform }: UploadToolProps) => import("react").JSX.Element;
+declare const UploadTool: ({ name, type, action, defaultValue, transform, }: UploadToolProps) => import("react/jsx-runtime").JSX.Element;
 export default UploadTool;

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

@@ -16,7 +16,7 @@ import { useAppDispatch, useAppSelector } 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, transform }) => {
+const UploadTool = ({ name, type, action, defaultValue, transform, }) => {
     // const src = Form.useWatch("src");
     // const height = Form.useWatch("height");
     // const width = Form.useWatch("width");
@@ -47,7 +47,7 @@ const UploadTool = ({ name, type, action, defaultValue, transform }) => {
     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, x, y) => ({
-        id: String(id) || `${Date.now()}`,
+        id: id ? String(id) : `${Date.now()}`,
         x: x || Math.abs(transformState === null || transformState === void 0 ? void 0 : transformState.positionX),
         y: y || Math.abs(transformState === null || transformState === void 0 ? void 0 : transformState.positionY),
         width: width < 1 ? 200 : width,
@@ -145,6 +145,6 @@ const UploadTool = ({ name, type, action, defaultValue, transform }) => {
     const handleDelete = () => {
         setDefaultSrc(null);
     };
-    return (_jsxs(Form.Item, { label: "", name: "src", className: "w-full", 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" })] })) : (_jsx(Dragger, Object.assign({ beforeUpload: () => false }, propsUpload, { children: loading ? (_jsx("div", { className: "w-full flex flex-col items-center gap-2 max-h-[200px]", children: _jsx(LoadingOutlined, {}) })) : (_jsxs(_Fragment, { 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, { allowChangeShape: type === "component" }), _jsx(SectionLabel, {})] }));
+    return (_jsxs(Form.Item, { label: "", name: "src", className: "w-full", 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" })] })) : (_jsx(Dragger, Object.assign({ beforeUpload: () => false }, propsUpload, { children: loading ? (_jsx("div", { className: "w-full flex flex-col items-center gap-2 max-h-[200px]", children: _jsx(LoadingOutlined, {}) })) : (_jsxs(_Fragment, { 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." })] })) }))), defaultSrc && (_jsxs(_Fragment, { children: [_jsx(SectionShape, { allowChangeShape: type === "component" }), _jsx(SectionLabel, {})] }))] }));
 };
 export default UploadTool;

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

@@ -15,7 +15,7 @@ import { useAppDispatch, useAppSelector } 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, transform }) => {
+const UploadTool = ({ name, type, action, defaultValue, transform, }) => {
     // const src = Form.useWatch("src");
     // const height = Form.useWatch("height");
     // const width = Form.useWatch("width");
@@ -168,9 +168,10 @@ const UploadTool = ({ name, type, action, defaultValue, transform }) => {
               </p>
             </>)}
         </Dragger>)}
-
-      <SectionShape allowChangeShape={type === "component"}/>
-      <SectionLabel />
+      {defaultSrc && (<>
+          <SectionShape allowChangeShape={type === "component"}/>
+          <SectionLabel />
+        </>)}
     </Form.Item>);
 };
 export default UploadTool;

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

@@ -4,5 +4,5 @@ declare const SideTool: ({ dragOnly, deleteAutorized, }: {
         component: boolean;
         extraComponent: boolean;
     };
-}) => import("react").JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default SideTool;

package/dist/features/view-only/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.d.ts

@@ -77,13 +77,19 @@ export interface LayerViewProps<TMeta = undefined> {
         paddingRight?: number;
         paddingBottom?: number;
     };
-    disabled?: boolean;
     loadingRender?: {
         state: boolean;
         element: React.JSX.Element;
     };
     defaultBoundingBox?: PropertiesProps;
     viewOnly?: boolean;
+    actionPrivileged?: {
+        select: boolean;
+        move: boolean;
+        switch: boolean;
+        drop: boolean;
+        rightClick: boolean;
+    };
 }
-declare const LayerView: <TMeta>(props: LayerViewProps<TMeta>) => React.JSX.Element;
+declare const LayerView: <TMeta>(props: LayerViewProps<TMeta>) => import("react/jsx-runtime").JSX.Element;
 export default LayerView;

package/dist/features/view-only-2/index.js

@@ -6,7 +6,13 @@ import Layers from "../../components/layer-v4";
 import { getTranslate } from "../board-v3/utils";
 import { Spin } from "antd";
 const LayerView = (props) => {
-    const { componentProps, extraComponentProps, onSelectComponent, onCurrentStateChange, mappingKey, statusKey, defaultBackground, defaultBoundingBox, iconTags, tooltipProps, onRightClick, allowTooltip = true, tableMatchKey, eventMatchTable, ghostAttributes, onDrop, onSwitch, refs, privilegedTags, disabled, loadingRender, } = props;
+    const { componentProps, extraComponentProps, onSelectComponent, onCurrentStateChange, mappingKey, statusKey, defaultBackground, defaultBoundingBox, iconTags, tooltipProps, onRightClick, allowTooltip = true, tableMatchKey, eventMatchTable, ghostAttributes, onDrop, onSwitch, refs, privilegedTags, loadingRender, actionPrivileged = {
+        select: true,
+        move: true,
+        switch: true,
+        drop: true,
+        rightClick: true
+    } } = props;
     const widthTooltip = (tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.minWidth) || 168;
     const tableGhost = useRef(null);
     const hoverUnderghostId = useRef(null);
@@ -132,13 +138,13 @@ const LayerView = (props) => {
         });
         const rightClick = e.button === 2;
         const click = e.button === 0;
-        onRightClick && rightClick && onRightClick(e, find);
-        onSelectComponent && !rightClick && onSelectComponent(find);
+        (onRightClick && rightClick && (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.rightClick)) && onRightClick(e, find);
+        (onSelectComponent && !rightClick && (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.select)) && onSelectComponent(find);
         const seletedTable = mappingKey ? find[mappingKey] : find;
         setSelectedTable(seletedTable);
     };
     const boundingBox = useMemo(() => {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
         if (!componentsEditor && (componentsEditor === null || componentsEditor === void 0 ? void 0 : componentsEditor.length) === 0) {
             return { minX: 0, minY: 0, width: 500, height: 500 };
         }
@@ -196,10 +202,10 @@ const LayerView = (props) => {
         if (hasBoundingBox) {
             hasBoundingBoxRef.current = true;
             return {
-                minX: boundingBoxProps.x,
-                minY: boundingBoxProps.y,
-                width: boundingBoxProps.width,
-                height: boundingBoxProps.height,
+                minX: boundingBoxProps.x - (((_g = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _g === void 0 ? void 0 : _g.paddingLeft) || 0),
+                minY: boundingBoxProps.y - (((_h = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _h === void 0 ? void 0 : _h.paddingTop) || 0),
+                width: boundingBoxProps.width + (((_j = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _j === void 0 ? void 0 : _j.paddingRight) || 0),
+                height: boundingBoxProps.height + (((_k = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _k === void 0 ? void 0 : _k.paddingBottom) || 0),
             };
         }
         // return {
@@ -210,10 +216,10 @@ const LayerView = (props) => {
         // };
         // console.log(minX, minY, maxX, maxY,props?.viewStyles, "bounding box");
         return {
-            minX: minX - (((_g = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _g === void 0 ? void 0 : _g.paddingLeft) || 0),
-            minY: minY - (((_h = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _h === void 0 ? void 0 : _h.paddingTop) || 0),
-            width: maxX + (((_j = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _j === void 0 ? void 0 : _j.paddingRight) || 0),
-            height: maxY + (((_k = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _k === void 0 ? void 0 : _k.paddingBottom) || 0),
+            minX: minX - (((_l = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _l === void 0 ? void 0 : _l.paddingLeft) || 0),
+            minY: minY - (((_m = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _m === void 0 ? void 0 : _m.paddingTop) || 0),
+            width: maxX + (((_o = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _o === void 0 ? void 0 : _o.paddingRight) || 0),
+            height: maxY + (((_p = props === null || props === void 0 ? void 0 : props.viewStyles) === null || _p === void 0 ? void 0 : _p.paddingBottom) || 0),
         };
     }, [componentsEditor, extraComponentsEditor, boundingBoxProps]);
     const renderElements = (elementEditor, mappingKey, tableMatchKey) => {
@@ -271,7 +277,7 @@ const LayerView = (props) => {
             };
             // drop from out layout editor
             if (type === "drop") {
-                onDrop && onDrop(event, data);
+                (onDrop && (actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.drop)) && onDrop(event, data);
             }
             // cari elemen bentuk (rect / circle / path)
             const shape = group.querySelector("rect") ||
@@ -316,10 +322,10 @@ const LayerView = (props) => {
         const ghostId = JSON.parse(targetGroup.getAttribute("data-id") || "{}");
         const allowedDrag = (!(props === null || props === void 0 ? void 0 : props.dragTableBlockKey)
             ? true
-            : (_a = props === null || props === void 0 ? void 0 : props.dragTableBlockKey) === null || _a === void 0 ? void 0 : _a.some((_) => {
+            : !((_a = props === null || props === void 0 ? void 0 : props.dragTableBlockKey) === null || _a === void 0 ? void 0 : _a.some((_) => {
                 const dataRaw = originalData({ id: ghostId, type: "find" });
-                return _.value != (dataRaw === null || dataRaw === void 0 ? void 0 : dataRaw[_.key]);
-            })) && !disabled;
+                return _.value === (dataRaw === null || dataRaw === void 0 ? void 0 : dataRaw[_.key]);
+            }))) && !(actionPrivileged === null || actionPrivileged === void 0 ? void 0 : actionPrivileged.switch);
         if (ghostAttributes) {
             Object.keys(ghostAttributes).forEach((key) => {
                 ghost.setAttribute(key, ghostAttributes[key]);
@@ -539,15 +545,24 @@ const LayerView = (props) => {
         }
     };
     const hasBoundingBox = hasBoundingBoxRef.current;
+    const isValidBoundingBox = Number.isFinite(boundingBox.minX) &&
+        Number.isFinite(boundingBox.minY) &&
+        Number.isFinite(boundingBox.width) &&
+        Number.isFinite(boundingBox.height) &&
+        boundingBox.width > 0 &&
+        boundingBox.height > 0;
+    const viewBox = isValidBoundingBox
+        ? `${boundingBox.minX} ${boundingBox.minY} ${boundingBox.width} ${boundingBox.height}`
+        : "0 0 1000 1000";
     return (_jsxs("div", Object.assign({ className: "relative w-full h-full flex-1", ref: containerRef, style: {
             overflow: "auto",
             WebkitOverflowScrolling: "touch",
         } }, props.containerProps, { children: [loading && (_jsx("div", { className: "absolute z-10 top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 bg-opacity-50 bg-white w-full h-full flex items-center justify-center", children: (loadingRender === null || loadingRender === void 0 ? void 0 : loadingRender.element) || _jsx(Spin, {}) })), _jsxs("svg", Object.assign({ id: "workspace", onContextMenu: (e) => e.preventDefault(), onDrop: (e) => handleTableEvent(e, "drop"), onPointerDown: handlePointerDown, onPointerUp: handleMouseUp, ref: svgRef, width: "100%", height: "100%", 
                 // scale={5}
-                overflow: "hidden", viewBox: `${boundingBox.minX} ${boundingBox.minY} ${boundingBox.width} ${boundingBox.height}`, className: "h-full", xmlns: "http://www.w3.org/2000/svg", preserveAspectRatio: "xMidYMid meet", style: {
+                overflow: "hidden", viewBox: viewBox, 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: disabled ? "none" : "all",
+                    // pointerEvents: disabled ? "none" : "all",
                     touchAction: "none",
                     userSelect: "none",
                 } }, props.svgProps, { children: [hasBoundingBox && (_jsx("defs", { children: _jsx("clipPath", { id: "contentCrop", children: _jsx("rect", { x: boundingBox.minX, y: boundingBox.minY, width: boundingBox.width, height: boundingBox.height }) }) })), _jsx("g", { id: "main-layer", "clip-path": "url(#contentCrop)", children: _jsx(Layers, { components: [

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

@@ -77,13 +77,19 @@ export interface LayerViewProps<TMeta = undefined> {
         paddingRight?: number;
         paddingBottom?: number;
     };
-    disabled?: boolean;
     loadingRender?: {
         state: boolean;
         element: React.JSX.Element;
     };
     defaultBoundingBox?: PropertiesProps;
     viewOnly?: boolean;
+    actionPrivileged?: {
+        select: boolean;
+        move: boolean;
+        switch: boolean;
+        drop: boolean;
+        rightClick: boolean;
+    };
 }
-declare const LayerView: <TMeta>(props: LayerViewProps<TMeta>) => React.JSX.Element;
+declare const LayerView: <TMeta>(props: LayerViewProps<TMeta>) => import("react/jsx-runtime").JSX.Element;
 export default LayerView;