dev1/src/components/ui/infoTooltip.js

22 lines
607 B
JavaScript

import React from "react";
/**
* <InfoTooltip message="This is a helpful tooltip" />
*
* Re-usable tiny "i" badge that shows its `message` prop in a native
* browser tooltip (`title=`). Sized for use inline with headings or
* labels. Uses Tailwind classes only—no external libs required.
*/
export default function InfoTooltip({ message = "" }) {
if (!message) return null;
return (
<span
className="ml-1 inline-flex h-4 w-4 items-center justify-center rounded-full bg-blue-500 text-white text-[10px] font-semibold cursor-help"
title={message}
>
i
</span>
);
}