import { jsx } from "react/jsx-runtime";
import { useContext } from "react";
import { CSS } from "@dnd-kit/utilities";
import { cx } from "antd-style";
import { useDesignable } from "../../hooks/index.mjs";
import { useStyles } from "./DragHandlePageTab.style.mjs";
import { SortableContext } from "./SortableItem.mjs";
const DragHandlePageTab = (props)=>{
    const { isSubMenu, children, className: overStyle, isAdminMenu } = props;
    const { draggable } = useContext(SortableContext);
    const { designable } = useDesignable();
    const { attributes, listeners, setNodeRef, isDragging, transform, transition } = draggable;
    const { styles } = useStyles();
    if (!designable) return children;
    ({
        ...props.style,
        transform: CSS.Translate.toString(transform),
        transition,
        cursor: 'move',
        zIndex: isDragging ? 999 : 'auto'
    });
    return /*#__PURE__*/ jsx("div", {
        ref: setNodeRef,
        className: cx(styles.dragHandleMenu, {
            draggable: isDragging,
            leftBorder: isSubMenu && isDragging,
            adminMenu: isAdminMenu && isDragging
        }, overStyle),
        ...listeners,
        ...attributes,
        role: "none",
        children: children
    });
};
export { DragHandlePageTab };
