import { jsx } from "react/jsx-runtime";
import { Tooltip } from "@mui/material";
import apollo_core from "@uipath/apollo-core";
import react from "react";
import { useChatScroll } from "../../providers/chat-scroll-provider.js";
import { useChatState } from "../../providers/chat-state-provider.js";
const AutopilotChatTooltip = /*#__PURE__*/ react.memo(({ title, disableInteractive = false, placement = 'bottom', children, open: controlledOpen, onOpen: controlledOnOpen, onClose: controlledOnClose, slotProps: customSlotProps, enterDelay, enterNextDelay })=>{
    const [internalOpen, setInternalOpen] = react.useState(false);
    const { overflowContainer } = useChatScroll();
    const { portalContainer } = useChatState();
    const tooltipRef = react.useRef(null);
    const isControlled = void 0 !== controlledOpen;
    const open = isControlled ? controlledOpen : internalOpen;
    react.useEffect(()=>{
        if (!overflowContainer || !open) return;
        const handleScroll = ()=>{
            if (isControlled) controlledOnClose?.();
            else setInternalOpen(false);
        };
        overflowContainer.addEventListener('scroll', handleScroll, {
            passive: true,
            capture: true
        });
        return ()=>{
            overflowContainer.removeEventListener('scroll', handleScroll, {
                capture: true
            });
        };
    }, [
        overflowContainer,
        open,
        isControlled,
        controlledOnClose
    ]);
    const handleTooltipClose = react.useCallback(()=>{
        if (isControlled) controlledOnClose?.();
        else setInternalOpen(false);
    }, [
        isControlled,
        controlledOnClose
    ]);
    const handleTooltipOpen = react.useCallback(()=>{
        if (isControlled) controlledOnOpen?.();
        else setInternalOpen(true);
    }, [
        isControlled,
        controlledOnOpen
    ]);
    const defaultSlotProps = react.useMemo(()=>({
            popper: {
                container: portalContainer
            },
            tooltip: {
                sx: {
                    maxWidth: '300px',
                    backgroundColor: 'var(--color-foreground)',
                    color: 'var(--color-background)',
                    padding: `${apollo_core.Spacing.SpacingXs} ${apollo_core.Spacing.SpacingS}`,
                    borderRadius: apollo_core.Border.BorderRadiusM,
                    fontSize: apollo_core.FontFamily.FontSSize,
                    lineHeight: apollo_core.FontFamily.FontSLineHeight,
                    '& > *': {
                        display: 'block',
                        marginBottom: apollo_core.Spacing.SpacingMicro,
                        '&:last-child': {
                            marginBottom: 0
                        }
                    }
                }
            }
        }), [
        portalContainer
    ]);
    const mergedSlotProps = react.useMemo(()=>customSlotProps ? {
            popper: {
                ...defaultSlotProps?.popper,
                ...customSlotProps.popper
            },
            tooltip: {
                ...defaultSlotProps?.tooltip,
                ...customSlotProps.tooltip
            }
        } : defaultSlotProps, [
        defaultSlotProps,
        customSlotProps
    ]);
    return /*#__PURE__*/ jsx(Tooltip, {
        ref: tooltipRef,
        title: title,
        open: open,
        onClose: handleTooltipClose,
        onOpen: handleTooltipOpen,
        disableInteractive: disableInteractive,
        placement: placement,
        enterDelay: enterDelay,
        enterNextDelay: enterNextDelay,
        TransitionProps: {
            timeout: 0
        },
        slotProps: mergedSlotProps,
        children: children
    });
});
export { AutopilotChatTooltip };
