BottomNavigationBarItem.tsx raw
1 import { Button } from '@/components/ui/button'
2 import { cn } from '@/lib/utils'
3 import { MouseEventHandler } from 'react'
4
5 export default function BottomNavigationBarItem({
6 children,
7 active = false,
8 onClick,
9 onPointerDown,
10 onPointerUp
11 }: {
12 children: React.ReactNode
13 active?: boolean
14 onClick?: MouseEventHandler
15 onPointerDown?: MouseEventHandler
16 onPointerUp?: MouseEventHandler
17 }) {
18 return (
19 <Button
20 className={cn(
21 'flex shadow-none items-center bg-transparent w-full h-12 p-3 m-0 rounded-lg [&_svg]:size-6',
22 active && 'text-primary hover:text-primary'
23 )}
24 variant="ghost"
25 onClick={onClick}
26 onPointerDown={onPointerDown}
27 onPointerUp={onPointerUp}
28 >
29 {children}
30 </Button>
31 )
32 }
33