2025-12-24 14:23:22 +00:00

31 lines
788 B
TypeScript

import React from 'react'
import { MenuAsideItem } from '../interfaces'
import AsideMenuLayer from './AsideMenuLayer'
import OverlayLayer from './OverlayLayer'
type Props = {
menu: MenuAsideItem[]
isAsideMobileExpanded: boolean
isAsideLgActive: boolean
onAsideLgClose: () => void
}
export default function AsideMenu({
isAsideMobileExpanded = false,
isAsideLgActive = false,
...props
}: Props) {
return (
<>
<AsideMenuLayer
menu={props.menu}
className={`${isAsideMobileExpanded ? 'left-0' : '-left-60 lg:left-0'} ${
!isAsideLgActive ? 'lg:hidden xl:flex' : ''
}`}
onAsideLgCloseClick={props.onAsideLgClose}
/>
{isAsideLgActive && <OverlayLayer zIndex="z-30" onClick={props.onAsideLgClose} />}
</>
)
}