"use client"

import * as React from "react"
import { ContextMenu as BaseContextMenu } from "@base-ui/react/context-menu"
import { cn } from "@/lib/utils"

export type ContextMenuCheckboxItemIndicatorProps = React.ComponentPropsWithoutRef<typeof BaseContextMenu.CheckboxItemIndicator> & {
  className?: string
}

const BaseContextMenuCheckboxItemIndicator = BaseContextMenu.CheckboxItemIndicator as React.ElementType

export const ContextMenuCheckboxItemIndicator = React.forwardRef<HTMLElement, ContextMenuCheckboxItemIndicatorProps>(
  ({ className, ...props }, ref) => (
    <BaseContextMenuCheckboxItemIndicator
      ref={ref}
      className={cn(
        "flex size-4 shrink-0 items-center justify-center text-current",
        className,
      )}
      {...props}
    />
  ),
)

ContextMenuCheckboxItemIndicator.displayName = "ContextMenuCheckboxItemIndicator"