@bothub-chat/ui/dist/components/menu-tabs/index.js

Bothub UI Components

import{jsx as e,jsxs as n}from"react/jsx-runtime";import{useState as r,useRef as t,useEffect as i}from"react";import{MenuTabsStyled as l,MenuTabsList as c,MenuTabsWrapper as o,MenuTabsContent as d,MenuTabsItem as u,MenuTabsText as s,MenuTabsLine as a}from"./styled.js";const f=({tabs:f,defaultTab:h,onChangeValue:m})=>{const[v,p]=r(h||f[0].value),w=t(null),g=t(null);return i(()=>{const e=()=>{if(w.current&&g.current){const e=w.current,n=g.current;if(e&&n){const r=f.findIndex(({value:e})=>e===v),t=n.children[r];if(t){const r=n.getBoundingClientRect(),i=t.getBoundingClientRect(),l=r.left,c=i.left-l;e.style.width=`${i.width}px`,e.style.left=`${c}px`}}}};return e(),window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}},[v,g.current,w.current]),e(l,{children:e(c,{children:e(o,{children:n(d,{ref:g,children:[f.map(({label:n,value:r})=>e(u,{$active:r===v,onClick:()=>{return p(e=r),void(null==m||m(e));var e},children:e(s,{children:n})},r)),e(a,{ref:w})]})})})})};export{f as MenuTabs};