22 lines
654 B
TypeScript
22 lines
654 B
TypeScript
import React from 'react';
|
|
import { LucideIcon } from 'lucide-react';
|
|
|
|
interface SidebarItemProps {
|
|
icon: LucideIcon;
|
|
text: string;
|
|
active: boolean;
|
|
onClick: () => void;
|
|
}
|
|
|
|
export const SidebarItem: React.FC<SidebarItemProps> = ({ icon: Icon, text, active, onClick }) => (
|
|
<div
|
|
onClick={onClick}
|
|
className={`flex items-center space-x-3 px-6 py-4 cursor-pointer transition-colors duration-200 ${
|
|
active ? 'bg-slate-800 border-l-4 border-blue-500 text-white' : 'text-slate-400 hover:bg-slate-800 hover:text-white'
|
|
}`}
|
|
>
|
|
<Icon size={20} />
|
|
<span className="font-medium text-sm tracking-wide">{text}</span>
|
|
</div>
|
|
);
|