UNPKG

@bothub-chat/ui

Version:

Bothub UI Components

2 lines (1 loc) 3.04 kB
import{jsxs as e,jsx as t}from"react/jsx-runtime";import i,{useState as r,useRef as n}from"react";import{useTransition as o}from"@react-spring/web";import{MultiLevelMenuLi as l,MultiLevelMenuHeader as c,MultiLevelMenuTitle as d,MultiLevelMenuArrowDownIcon as a,MultiLevelMenuFirstLevelWrapper as s,MultiLevelMenuFirstLevelUl as m,MultiLevelMenuSecondLevelWrapper as h,MultiLevelMenuSecondLevelContentWrapper as p,MultiLevelMenuSecondLevelLi as u,MultiLevelMenuSecondLevelLiHover as f,MultiLevelMenuSecondLevelCardLink as y,MultiLevelMenuSecondLevelHeader as g,MultiLevelMenuSecondLevelHeaderWrapper as j,MultiLevelMenuSecondLevelHeaderContent as x,MultiLevelMenuSecondLevelSubTitle as v,MultiLevelMenuSecondLevelDescription as C}from"./styled.js";import{MultiLevelMenuFirstLevelItem as k}from"../../multi-level-menu-first-level/ui/index.js";import{MultiLevelMenuSecondLevelArrowRight45 as $}from"../../styled.js";import{MultiLevelMenuFirstLevelTitle as I}from"../../multi-level-menu-first-level/ui/styled.js";import"tslib";import{IconProvider as Y}from"../../../../icon/context.js";import"../../../../icon/styled.js";import"react-markdown";import"react-dom";import"../../../../portal/styled.js";import"../../../../tooltip/styled.js";import"../../../../tooltip/arrow/styled.js";import"../../../../../theme/index.js";import"../../../../tooltip/context.js";const b=({menuItem:b,accordionIndex:_,openAccordion:T,handleCloseAccordion:w,handleAccordionToggle:A})=>{const[z,E]=r(b.children&&b.children[0].children?b.children[0]:void 0),O=n(null),L=o(T,{from:{opacity:0,height:0,transform:"translateY(-30px)"},enter:{opacity:1,height:"auto",transform:"translateY(0)"},leave:{opacity:0,height:"auto",transform:"translateY(-10px)"},config:{duration:200}}),M=o(z,{from:{opacity:0,height:0,transform:"translateY(-10px)"},enter:{opacity:1,height:"auto",transform:"translateY(0)"},leave:{opacity:0,height:0,transform:"translateY(-10px)"},config:{duration:100}});return e(l,{"data-test":b.accordion_title,children:[e(c,{onClick:A,$active:T,children:[t(d,{$open:T,children:b.accordion_title}),t(a,{$open:T})]}),L((r,n)=>n&&e(s,{$open:T&&!!n,style:r,children:[t(m,{children:b.children&&b.children.map((e,i)=>t(k,{onMouseEnter:()=>((e,t)=>{E(void 0),O.current&&clearTimeout(O.current),O.current=setTimeout(()=>{E(Object.assign(Object.assign({},e),{index:t}))},200)})(e,i),firstLevelItem:e,selectedItemTitle:null==z?void 0:z.title,linkIcon_hidden:b.linkIcon_hidden},i))}),M((r,n)=>n&&t(h,{style:r,children:t(p,{$columnsCount:0===_&&z&&1===z.index?2:1,children:z&&z.children&&z.children.map((r,n)=>t(u,{$even:z&&z.children&&z.children.length%2==0,$nthChildCount:0===_&&z&&1===z.index?2:1,"data-test":r.title,children:e(f,{onClick:w,children:[t(y,{onClick:r.onClick,href:r.path}),e(g,{children:[e(j,{children:[e(x,{children:[t(Y,{size:18,children:r.icon?i.createElement(r.icon):""}),t(I,{children:r.title}),t(v,{children:r.sub_title})]}),t($,{size:30})]}),r.description&&t(C,{children:r.description})]})]})},n))})}))]}))]})};export{b as MultiLevelMenuAccordion};