import { FC, PropsWithChildren } from "react";
import { Poppable } from "@/lib/poppables/components/poppable";
import { QuestionMarkCircleIcon } from "@heroicons/react/24/solid";

export const HelpPopper: FC<PropsWithChildren> = ({ children }) => {
  return (
    <Poppable
      content={children}
      preferredAlign="centered"
      preferredEdge="bottom"
    >
      <QuestionMarkCircleIcon className="w-4 h-4 fill-white" />
    </Poppable>
  );
};