import cx from "classnames";
import React from "react";

const CLASS_ROOT = "hint";

export interface HintProps extends React.HTMLAttributes<HTMLParagraphElement> {
  className?: string;
  children?: React.ReactNode;
}

const Hint: React.FC<HintProps> = ({ className, children, ...other }) => {
  return children ? (
    <p className={cx(CLASS_ROOT, className)} {...other}>
      {children}
    </p>
  ) : null;
};

Hint.displayName = "Hint";

export { Hint };
