You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
38 lines
1.3 KiB
38 lines
1.3 KiB
import { cn } from "@core/utils/cn.ts";
|
|
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
|
|
import * as React from "react";
|
|
|
|
const TooltipProvider = TooltipPrimitive.Provider;
|
|
|
|
const Tooltip = ({ ...props }) => <TooltipPrimitive.Root {...props} />;
|
|
Tooltip.displayName = TooltipPrimitive.Tooltip.displayName;
|
|
|
|
const TooltipTrigger = TooltipPrimitive.Trigger;
|
|
const TooltipArrow = TooltipPrimitive.Arrow;
|
|
|
|
const TooltipContent = React.forwardRef<
|
|
React.ElementRef<typeof TooltipPrimitive.Content>,
|
|
React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>
|
|
>(({ className, sideOffset = 4, ...props }, ref) => (
|
|
<TooltipPrimitive.Content
|
|
ref={ref}
|
|
sideOffset={sideOffset}
|
|
className={cn(
|
|
"z-50 overflow-hidden rounded-md border border-slate-100 bg-white px-3 py-1.5 text-sm text-slate-700 shadow-md animate-in fade-in-50 data-[side=bottom]:slide-in-from-top-1 data-[side=left]:slide-in-from-right-1 data-[side=right]:slide-in-from-left-1 data-[side=top]:slide-in-from-bottom-1 dark:border-slate-800 dark:bg-slate-800 dark:text-slate-200",
|
|
className,
|
|
)}
|
|
{...props}
|
|
/>
|
|
));
|
|
TooltipContent.displayName = TooltipPrimitive.Content.displayName;
|
|
|
|
const TooltipPortal = TooltipPrimitive.Portal;
|
|
|
|
export {
|
|
Tooltip,
|
|
TooltipArrow,
|
|
TooltipContent,
|
|
TooltipProvider,
|
|
TooltipTrigger,
|
|
TooltipPortal,
|
|
};
|
|
|