Files
trustlab/src/components/ui/dropdown/DropdownItem.tsx
2025-12-30 12:14:45 +07:00

47 lines
1.0 KiB
TypeScript

import type React from "react";
import Link from "next/link";
interface DropdownItemProps {
tag?: "a" | "button";
href?: string;
onClick?: () => void;
onItemClick?: () => void;
baseClassName?: string;
className?: string;
children: React.ReactNode;
}
export const DropdownItem: React.FC<DropdownItemProps> = ({
tag = "button",
href,
onClick,
onItemClick,
baseClassName = "block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900",
className = "",
children,
}) => {
const combinedClasses = `${baseClassName} ${className}`.trim();
const handleClick = (event: React.MouseEvent) => {
if (tag === "button") {
event.preventDefault();
}
if (onClick) onClick();
if (onItemClick) onItemClick();
};
if (tag === "a" && href) {
return (
<Link href={href} className={combinedClasses} onClick={handleClick}>
{children}
</Link>
);
}
return (
<button onClick={handleClick} className={combinedClasses}>
{children}
</button>
);
};