import{jsx as p,jsxs as y}from"react/jsx-runtime";import{cn as w}from"../../lib/cn.js";import{createSlot as H,createHost as X}from"create-slots";import{createContext as E,Children as F,cloneElement as L,forwardRef as O,useContext as W,useRef as v,useEffect as h,useCallback as C,useState as k}from"react";import{useButton as B,useHover as D,useFocusRing as I,mergeProps as V}from"react-aria";const T=E({currentTab:void 0,setCurrentTab:()=>{},tabRefs:{current:{}},disabled:!1}),N=H(({children:i,...l})=>p("div",{className:"flex items-center justify-center",children:F.map(i,a=>L(a,l))})),j=i=>{const{children:l,onChange:a,selectedTab:n,size:b="md",disabled:m=!1}=i,[e,o]=k(n),s=v({}),t=v(),[f,c]=k({transform:"translateX(4px)",width:"",height:""});h(()=>{n!==void 0&&o(n)},[n]),h(()=>(t.current||(t.current=new ResizeObserver(()=>{const{offsetLeft:r,clientWidth:d,clientHeight:u}=s.current[e];c({transform:`translateX(${r}px)`,width:`${d}px`,height:`${u}px`})})),t.current.observe(s.current[e]),()=>{t.current&&s.current[e]&&t.current.unobserve(s.current[e])}),[]),h(()=>{if(e&&s.current[e]){const{offsetLeft:r,clientWidth:d,clientHeight:u}=s.current[e];c({transform:`translateX(${r}px)`,width:`${d}px`,height:`${u}px`})}},[e,b]);const x=C(r=>{o(r),a(r)},[o,a]);return y("div",{className:"flex w-full p-1 rounded-full bg-ink-10 dark:bg-slate-2 relative",role:"tablist","aria-label":"Segmented Control",children:[p("div",{className:"absolute bg-paper dark:bg-slate-4 shadow-[0px_4px_20px_0px_rgba(24,23,26,0.1)] transition-transform duration-200 ease-in-out rounded-[inherit] -ml-1",style:{...f}}),p(T.Provider,{value:{currentTab:e,setCurrentTab:x,size:b,tabRefs:s,disabled:m},children:l})]})},P=O((i,l)=>{const{label:a,id:n}=i,{currentTab:b,setCurrentTab:m,tabRefs:e,size:o,disabled:s}=W(T),t=b===n,f=o==="sm"?"h-8":o==="md"?"h-10":"h-[3.25rem]",c=o==="sm"?16:20,x=v(null),r=l||x;h(()=>{typeof r=="object"&&e.current&&(e.current[n]=r.current)},[n]);const d=C(()=>{m(n)},[m,n]),{buttonProps:u,isPressed:R}=B({onPress:d,isDisabled:s},r),{hoverProps:$}=D({}),{isFocusVisible:z,focusProps:S}=I();return X(i.children,_=>{const g=_.get(N);return p("button",{className:w("flex justify-center items-center w-full rounded-button z-0 cursor-pointer font-semibold whitespace-nowrap bg-transparent outline disabled:opacity-30 disabled:pointer-events-none",f,o==="sm"?"text-sm":o==="md"?"text-md":"text-lg",t?"text-text-primary":"text-text-secondary",z?"outline-brand-base outline-thick":"outline-transparent outline-thick",t?"transition-none":"transition-colors duration-200 ease-in-out",t?"hover:bg-transparent dark:hover:bg-transparent":"hover:bg-ink-20 dark:hover:bg-slate-1"),ref:r,...V(u,$,S),disabled:s,children:y("div",{className:"flex items-center justify-center",style:{opacity:R&&!t?.5:1},children:[g&&{...g,props:{...g.props,className:w("mr-1",t?"text-text-primary":"text-text-secondary"),width:c,height:c}},a]})})})}),q=Object.assign(P,{Icon:N});P.displayName="Tab",j.displayName="SegmentedControl";export{j as SegmentedControl,q as Tab};
//# sourceMappingURL=segmented-control.js.map
