import React, { createContext, useContext, useState, useRef } from 'react';
import { Slot } from './Slot';

const TooltipContext = createContext<any>(null);

export const TooltipProvider = ({ children }: any) => <>{children}</>;

export const TooltipRoot = ({ children, delayDuration = 200 }: any) => {
  const [open, setOpen] = useState(false);
  const timeoutRef = useRef<any>(null);
  
  const handleMouseEnter = () => {
    timeoutRef.current = setTimeout(() => setOpen(true), delayDuration);
  };
  const handleMouseLeave = () => {
    clearTimeout(timeoutRef.current);
    setOpen(false);
  };
  
  return (
    <TooltipContext.Provider value={{ open }}>
      <div className="relative inline-block" onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave} onFocus={handleMouseEnter} onBlur={handleMouseLeave}>
        {children}
      </div>
    </TooltipContext.Provider>
  );
};
TooltipRoot.displayName = "Tooltip";

export const TooltipTrigger = React.forwardRef<any, any>(({ asChild, children, ...props }, ref) => {
  const Comp = asChild ? Slot : "button";
  return <Comp ref={ref} {...props}>{children}</Comp>;
});
TooltipTrigger.displayName = "TooltipTrigger";

export const TooltipContent = React.forwardRef<HTMLDivElement, any>(({ className = '', children, sideOffset = 4, side = "top", ...props }, ref) => {
  const { open } = useContext(TooltipContext);
  if (!open) return null;
  
  let posClass = "bottom-full mb-2 left-1/2 -translate-x-1/2"; // default top
  if (side === "bottom") posClass = "top-full mt-2 left-1/2 -translate-x-1/2";
  if (side === "left") posClass = "right-full mr-2 top-1/2 -translate-y-1/2";
  if (side === "right") posClass = "left-full ml-2 top-1/2 -translate-y-1/2";
  
  return (
    <div
      ref={ref}
      className={`absolute z-floatingPanel ${posClass} overflow-hidden rounded-md border border-border bg-surface px-3 py-1.5 text-sm text-text shadow-md animate-in fade-in-0 zoom-in-95 ${className}`}
      {...props}
    >
      {children}
    </div>
  );
});
TooltipContent.displayName = "TooltipContent";