@legion-ui-kit/react-core
Version:
To install the package into your project:
4 lines (3 loc) • 1.52 kB
JavaScript
"use client";
import{jsxs as s,jsx as t}from"react/jsx-runtime";import{useRef as r,useState as e,useEffect as i,Children as a}from"react";import o from"classnames";import n from"./styles/styles.module.scss.js";import c from"./Tab.js";import{getTabsIndicator as m}from"./Tabs.helper.js";import{isFunction as l}from"../../helpers/typeChecker.js";import{checkComponent as p}from"../../helpers/internal.js";import{TAB_LIST_DEFAULT_PROPS as d,TAB_ACTIVE_STYLE_DEFAULT as u,UNKNOWN_TAB_ACTIVE as f,TABS_ANIMATION_DURATION as b,TAB_DISPLAY_NAME as h}from"./Tab.constant.js";const y=y=>{const{activeTab:j=d.activeTab,children:x,className:N,onChange:T,position:v=d.position,...C}=y,g=o(n.legion_tab_list,N,n[v]),k=r([]),[$,_]=e(u),[A,D]=e([]),E=s=>{s>=0&&s<k.current.length&&!A.includes(s)?_({index:s,...m(v,k.current[s])}):_({...$,...f,index:s}),l(T)&&T(s)};return i(()=>{const s=[];a.toArray(x).forEach((t,r)=>t?.props?.disabled&&s.push(r)),s.includes(j)?_({...$,...f,index:j}):_({...$,...m(v,k.current[$.index])}),D(s)},[]),i(()=>{E(j)},[j]),s("div",{className:g,...C,children:[a.toArray(x).filter(s=>p(s,h)).map((s,r)=>{const{className:e,onClick:i,...a}=s.props,m=`tab-${r}}`,p={...a,ref:s=>k.current[r]=s,className:o(e,n.tab),onClick:()=>{l(i)&&i(),E(r)},active:$.index===r,style:{transitionDuration:`${b}ms`,...a.style},position:v};return t(c,{...p},m)}),t("span",{className:n.tab_indicator,style:{transitionDuration:`${b}ms`,...$}})]})};y.displayName="TabList";export{y as default};
//# sourceMappingURL=TabList.js.map