import type { ReactNode } from 'react';
import * as PopoverPrimitive from '@radix-ui/react-popover';

import { Icon } from '../iconography';

export type PopoverCloseProps = PopoverPrimitive.PopoverCloseProps & {
  children?: ReactNode;
};

export function PopoverClose(props: PopoverCloseProps) {
  const { asChild, children } = props;

  return (
    <PopoverPrimitive.Close asChild={asChild} className="c-popover-close">
      {children ?? <Icon.Cancel width={16} height={16} />}
    </PopoverPrimitive.Close>
  );
}
