1
0
Code Issues Pull Requests Packages Projects Releases Wiki Activity GitHub Gitee
inke/apps/web/ui/primitives/popover.tsx

31 lines
998 B
TypeScript
Raw Normal View History

2023-10-23 09:02:56 +08:00
"use client";
import * as React from "react";
import * as PopoverPrimitive from "@radix-ui/react-popover";
import { cn } from "@/lib/utils";
const Popover = PopoverPrimitive.Root;
const PopoverTrigger = PopoverPrimitive.Trigger;
const PopoverContent = React.forwardRef<
React.ElementRef<typeof PopoverPrimitive.Content>,
React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>
>(({ className, align = "center", sideOffset = 4, ...props }, ref) => (
<PopoverPrimitive.Portal>
<PopoverPrimitive.Content
ref={ref}
align={align}
sideOffset={sideOffset}
className={cn(
"z-50 items-center rounded-md border border-stone-200 bg-white shadow-md animate-in fade-in-20 data-[side=bottom]:slide-in-from-bottom-1 data-[side=top]:slide-in-from-top-1",
className,
)}
{...props}
/>
</PopoverPrimitive.Portal>
));
PopoverContent.displayName = PopoverPrimitive.Content.displayName;
export { Popover, PopoverTrigger, PopoverContent };