UNPKG

@bothub-chat/ui

Version:

Bothub UI Components

2 lines (1 loc) 1.5 kB
import{jsx as t,jsxs as e}from"react/jsx-runtime";import{useRef as r,useState as n,useCallback as o,useEffect as i}from"react";import{useTransition as s}from"@react-spring/web";import{HeaderNavDropdownStyled as c,HeaderNavDropdownHead as a,HeaderNavDropdownArrow as m,HeaderNavDropdownBody as l}from"./styled.js";export{HeaderNavDropdownList}from"./styled.js";import{HeaderNavDropdownProvider as d}from"./context.js";import{useHeaderMenu as p}from"../../menu/context.js";import{useHeader as f}from"../../context.js";import"tslib";import"./item/styled.js";const u=({label:u,children:v})=>{const{variant:y}=f(),{isInMenu:j}=p(),w=r(null),[x,$]=n(!1),b=o(()=>{$(!x)},[x]);i(()=>{const t=w.current;if(null!==t){const e=e=>{t.contains(e.target)||j||$(!1)},r=()=>{j||$(!1)};return document.addEventListener("click",e),window.addEventListener("blur",r),()=>{document.removeEventListener("click",e),window.removeEventListener("blur",r)}}},[]);const h=s(x,{from:{opacity:0,transform:"scale(0)"},enter:{opacity:x?1:.5,transform:`scale(${x?1:.999})`},leave:{opacity:0,transform:"scale(0.999)"},config:{duration:150}});return t(d,{setIsOpen:$,children:e(c,{$inMenu:j,ref:w,children:[e(a,{as:"span",$variant:y,$active:x,$inMenu:j,onClick:b,children:[u,t(m,{style:{transform:x?"rotateZ(-180deg)":"rotateZ(0)"}})]}),h((e,r)=>r&&t(l,{$inMenu:j,style:e,children:v}))]})})};export{u as HeaderNavDropdown,m as HeaderNavDropdownArrow,l as HeaderNavDropdownBody,a as HeaderNavDropdownHead,c as HeaderNavDropdownStyled};