Const Tooltip
Tooltip: ForwardRefExoticComponent<{ always?: boolean; bounce?: boolean; color?: "error" | "info" | "warning" | "success"; noAnimate?: boolean; position?: ("bottom-left" | "bottom-right" | "top-left" | "top-right") | "bottom" | "left" | "right" | "top"; rounded?: boolean; size?: "small" | "medium" | "large"; title: string } & Omit<HTMLAttributes<HTMLDivElement>, "title"> & RefAttributes<HTMLDivElement>> = forwardRef<HTMLDivElement,{title: string;position?: `${"bottom" | "top"}-${"left" | "right"}` | "bottom" | "left" | "right" | "top";color?: "error" | "info" | "warning" | "success";size?: "small" | "medium" | "large";always?: boolean;rounded?: boolean;noAnimate?: boolean;bounce?: boolean;} & Omit<HTMLAttributes<HTMLDivElement>, "title">>(({children,className,title,position = "top",color,size = "large",always,rounded,noAnimate,bounce,...rest},ref) => {usePlainCss(hintCss, "hint-css", true);return (<divstyle={{position: "relative",display: "inline"}}ref={ref}aria-label={title}className={`hint--${position} hint--${size} ${color ? `hint--${color}` : ""} ${always ? `hint--always` : ""} ${rounded ? `hint--rounded` : ""} ${noAnimate ? `hint--no-animate` : ""} ${bounce ? `hint--bounce` : ""} ${className || ""}`}{...rest}>{children}</div>);})
This is a very basic
hint.cssimplementation for a tooltip.https://kushagra.dev/lab/hint/