import React, { forwardRef } from "react";
import { INavLinkProps } from "./nav-link";
import cn from "classnames";

export interface INavItemProps {
  as?: React.ElementType;
  className?: string;
}

const NavItem: React.FC<INavItemProps | INavLinkProps> = forwardRef(
  ({ className, children, as: Component = "div", ...props }, ref) => {
    return (
      <Component {...props} ref={ref} className={cn("nav-item", className)}>
        {children}
      </Component>
    );
  }
);

NavItem.displayName = "NavItem";

export default NavItem;