import { jsxs, jsx } from 'react/jsx-runtime';
import React__default, { useRef, useCallback } from 'react';
import { ChevronRightIcon } from '@heroicons/react/24/outline';
import { cn } from '../../../utils/cn.js';
import { useContextMenuContext, useSubMenuContext } from './ContextMenuContext.js';

/**
 * ContextMenuSubTrigger - Trigger for nested submenu with chevron indicator
 */
const ContextMenuSubTrigger = React__default.forwardRef(({ children, className, disabled = false, ...props }, ref) => {
    const { theme } = useContextMenuContext();
    const { isOpen, onOpenChange, triggerRef } = useSubMenuContext();
    const hoverTimeoutRef = useRef(null);
    // Handle mouse enter - open submenu after short delay
    const handleMouseEnter = useCallback(() => {
        if (disabled)
            return;
        // Clear any existing timeout
        if (hoverTimeoutRef.current) {
            clearTimeout(hoverTimeoutRef.current);
        }
        // Open submenu after short delay
        hoverTimeoutRef.current = setTimeout(() => {
            onOpenChange(true);
        }, 150);
    }, [disabled, onOpenChange]);
    // Handle keyboard navigation
    const handleKeyDown = useCallback((e) => {
        if (disabled)
            return;
        switch (e.key) {
            case "ArrowRight":
                e.preventDefault();
                e.stopPropagation();
                onOpenChange(true);
                break;
            case "ArrowLeft":
                e.preventDefault();
                e.stopPropagation();
                onOpenChange(false);
                break;
        }
    }, [disabled, onOpenChange]);
    // Combine refs
    const handleRef = useCallback((el) => {
        if (triggerRef && typeof triggerRef === "object" && "current" in triggerRef) {
            triggerRef.current = el;
        }
        if (typeof ref === "function") {
            ref(el);
        }
        else if (ref && typeof ref === "object" && "current" in ref) {
            ref.current = el;
        }
    }, [ref, triggerRef]);
    return (jsxs("div", { ref: handleRef, role: "menuitem", "aria-haspopup": "true", "aria-expanded": isOpen, "aria-disabled": disabled, "data-state": isOpen ? "open" : "closed", "data-disabled": disabled, tabIndex: disabled ? undefined : -1, className: cn(theme.subTriggerStyle, theme.itemFocusStyle, className), onMouseEnter: handleMouseEnter, onKeyDown: handleKeyDown, ...props, children: [jsx("span", { className: "flex-1 truncate", children: children }), jsx(ChevronRightIcon, { className: "absolute right-2 top-1/2 -translate-y-1/2 w-4 h-4 text-[var(--color-text-muted)]", "aria-hidden": "true" })] }));
});
ContextMenuSubTrigger.displayName = "ContextMenuSubTrigger";

export { ContextMenuSubTrigger };
