UNPKG

retro-react

Version:

A React component library for building retro-style websites

2 lines (1 loc) 2.21 kB
import{__rest as a}from"../../_virtual/_tslib.js";import{jsxs as n,jsx as e}from"react/jsx-runtime";import{forwardRef as r,useState as i,Children as t,cloneElement as s}from"react";import{classNames as l}from"../../utils/classNames.js";import o from"../../constants/commonClassNames.js";import{NavbarContainer as c,HamburgerMenu as m,NavbarItemsContainer as d,NavbarItemWrapper as v,NavItem as N,NavbarLogoContainer as b,NavMenuContainer as u,NavMenuTrigger as p,NavMenuDropdown as h}from"./Navbar.styled.js";const f=r(((r,N)=>{var{variant:b="default",children:u,className:p,id:h}=r,f=a(r,["variant","children","className","id"]);const[j,O]=i(!1),$=()=>{O(!j)},_=t.toArray(u).find((a=>a.type===g)),y=t.toArray(u).filter((a=>a.type!==g));return n(c,Object.assign({$variant:b,ref:N,id:h,className:l("navbar-root",p,o)},f,{children:[_,y.length>0&&e(m,{onClick:$,className:"navbar-hamburger",$open:j,$variant:b,"aria-controls":"navbar-menu","aria-expanded":j},void 0),e(d,Object.assign({$variant:b,$open:j,className:"navbar-items",id:"navbar-menu",role:"menu"},{children:t.map(y,((a,n)=>e(v,{children:s(a,{_internalVariant:b,_internalOnClick:$})},`navbar-item-${n}`)))}),void 0)]}),void 0)}));f.displayName="Navbar";const j=n=>{var{children:r,className:i,_internalVariant:t="default",_internalOnClick:s,onClick:o,id:c}=n,m=a(n,["children","className","_internalVariant","_internalOnClick","onClick","id"]);return e(N,Object.assign({id:c,className:l("navbar-item",i),$variant:t,onClick:()=>{s&&s(),o&&o()},role:"menuitem"},m,{children:r}),void 0)};j.displayName="NavItem";const g=a=>{let{children:n}=a;return e(b,Object.assign({id:"retro-navbar-logo"},{children:n}),void 0)};g.displayName="NavLogo";const O=r=>{var{label:t,children:s,className:o,_internalVariant:c="default"}=r,m=a(r,["label","children","className","_internalVariant"]);const[d,v]=i(!1);return n(u,Object.assign({className:l("nav-menu",o),onMouseLeave:()=>{v(!1)}},m,{children:[e(p,Object.assign({$variant:c,$isOpen:d,onClick:()=>{v(!d)},onMouseEnter:()=>"menu-bar"===c&&v(!0)},{children:t}),void 0),d&&e(h,Object.assign({$variant:c},{children:s}),void 0)]}),void 0)};O.displayName="NavMenu";export{j as NavItem,g as NavLogo,O as NavMenu,f as Navbar};