import { CheckCircleIcon } from "@heroicons/react/outline"; import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu"; import Link from "next/link"; import { ComponentProps, forwardRef } from "react"; import { classNames } from "@calcom/lib"; import { SVGComponent } from "@calcom/types/SVGComponent"; import { ButtonColor } from "../../button/Button"; export const Dropdown = DropdownMenuPrimitive.Root; type DropdownMenuTriggerProps = ComponentProps; export const DropdownMenuTrigger = forwardRef( ({ className = "", ...props }, forwardedRef) => ( ) ); DropdownMenuTrigger.displayName = "DropdownMenuTrigger"; export const DropdownMenuTriggerItem = DropdownMenuPrimitive.Trigger; export const DropdownMenuPortal = DropdownMenuPrimitive.Portal; type DropdownMenuContentProps = ComponentProps; export const DropdownMenuContent = forwardRef( ({ children, sideOffset = 2, align = "end", ...props }, forwardedRef) => { return ( *:first-child]:mt-1 [&>*:last-child]:mb-1" )} ref={forwardedRef}> {children} ); } ); DropdownMenuContent.displayName = "DropdownMenuContent"; type DropdownMenuLabelProps = ComponentProps; export const DropdownMenuLabel = (props: DropdownMenuLabelProps) => ( ); type DropdownMenuItemProps = ComponentProps; export const DropdownMenuItem = forwardRef( ({ className = "", ...props }, forwardedRef) => ( ) ); DropdownMenuItem.displayName = "DropdownMenuItem"; export const DropdownMenuGroup = DropdownMenuPrimitive.Group; type DropdownMenuCheckboxItemProps = ComponentProps; export const DropdownMenuCheckboxItem = forwardRef( ({ children, ...props }, forwardedRef) => { return ( {children} ); } ); DropdownMenuCheckboxItem.displayName = "DropdownMenuCheckboxItem"; export const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup; type DropdownMenuRadioItemProps = ComponentProps; export const DropdownMenuRadioItem = forwardRef( ({ children, ...props }, forwardedRef) => { return ( {children} ); } ); DropdownMenuRadioItem.displayName = "DropdownMenuRadioItem"; type DropdownItemProps = { children: React.ReactNode; color?: ButtonColor; StartIcon?: SVGComponent; EndIcon?: SVGComponent; href?: string; disabled?: boolean; } & ButtonOrLinkProps; type ButtonOrLinkProps = ComponentProps<"button"> & ComponentProps<"a">; export function ButtonOrLink({ href, ...props }: ButtonOrLinkProps) { const isLink = typeof href !== "undefined"; const ButtonOrLink = isLink ? "a" : "button"; const content = ; if (isLink) { return ( {content} ); } return content; } export const DropdownItem = (props: DropdownItemProps) => { const { StartIcon, EndIcon, children, color, ...rest } = props; return ( <> {StartIcon && }
{children}
{EndIcon && }
); }; type DropdownMenuSeparatorProps = ComponentProps; export const DropdownMenuSeparator = forwardRef( ({ className = "", ...props }, forwardedRef) => { return ( ); } ); DropdownMenuSeparator.displayName = "DropdownMenuSeparator"; export default Dropdown;