import React from 'react';

import type { SafePick } from '@shoptet/utils';
import { forwardRef, type SafeOmit } from '@shoptet/utils';

import type { IconButtonProps } from '../IconButton/IconButton';
import { IconButton } from '../IconButton/IconButton';

export interface ContextMenuIconButtonProps
  extends
    SafeOmit<IconButtonProps, 'children' | 'icon' | 'form' | 'type'>,
    Partial<SafePick<IconButtonProps, 'icon'>> {}

export const ContextMenuIconButton = forwardRef<HTMLButtonElement, ContextMenuIconButtonProps>(
  function ContextMenuIconButton(props, ref) {
    return (
      <IconButton
        {...props}
        ref={ref}
        ghost={props.ghost ?? true}
        variant={props.variant ?? 'secondary'}
        icon={props.icon ?? 'shp-more'}
      />
    );
  }
);