Tooltip

pnpm add @tessinaui/ui

import { Tooltip } from "@tessinaui/ui";

{/* Minimal */}
<Tooltip title="Feature name" description="A brief explanation." onClose={() => {}} />

{/* Full product tour step */}
<Tooltip
  intent="warning"
  arrowSide="bottom"
  arrowAlign="center"
  title="Title Placeholder Text"
  titleIcon={<CircleAlert className="w-5 h-5" />}
  image={<img src="..." className="w-full aspect-video object-cover" />}
  subtitle="Step title"
  subtitleIcon={<CircleAlert className="w-5 h-5" />}
  step={{ current: 2, total: 8 }}
  shortcuts={["⌘", "U"]}
  description="Learn how to use this feature."
  paginationText="1 of 4"
  onClose={() => {}}
  primaryAction={{ label: "Back",  leadingIcon: <ChevronLeft />, onClick: handleBack }}
  secondaryAction={{ label: "Skip", onClick: handleSkip }}
  ctaAction={{ label: "Next",       trailingIcon: <ChevronRight />, onClick: handleNext }}
/>

interface TooltipAction {
  label: string;
  leadingIcon?: React.ReactNode;
  trailingIcon?: React.ReactNode;
  onClick?: () => void;
  /** Override button style. Defaults: primary=outline, secondary=ghost, cta=primary. */
  variant?:  "primary" | "secondary" | "ghost" | "outline";
  /** Override button intent color. */
  intent?:   "none" | "error" | "warning" | "success" | "info";
  /** Override border radius. Defaults to "full". */
  rounded?:  "none" | "sm" | "md" | "lg" | "full";
  disabled?: boolean;
  loading?:  boolean;
}