import type { ReactNode } from "react";
import { createPortal } from "react-dom";
import { GlassSurface } from "./Glass";

export function PortalDropdown({
  open,
  children,
  style,
}: {
  open: boolean;
  children: ReactNode;
  style?: React.CSSProperties;
}) {
  if (!open || typeof document === "undefined") return null;

  return createPortal(
    <GlassSurface className="portal-dropdown" style={style}>
      {children}
    </GlassSurface>,
    document.body
  );
}
