1 line
6.7 KiB
JavaScript
1 line
6.7 KiB
JavaScript
import{C as e,D as t,E as n,G as r,H as i,I as a,Ot as o,R as s,S as c,St as l,Tt as u,b as d,f,gt as p,it as m,k as h,kt as g,p as _,yt as v,z as y}from"./iconify-DYZHDLa8.js";import{E as b,y as x}from"./vue-vendor-DjtlKxRy.js";import{J as S}from"./index-Uji7rFqr.js";import{O as C,_ as w,b as T,g as E,y as D}from"./Teleport-BIYegdAM.js";import{r as O}from"./button-BuRmTYve.js";import{u as k}from"./PopperContent-BqlvlxQe.js";import{t as A}from"./useForwardExpose-B0BXtanw.js";import{t as j}from"./RovingFocusGroup-DF8fLFe7.js";import{t as M}from"./RovingFocusItem-BIHcXQd-.js";var[N,P]=C(`TabsRoot`),F=t({__name:`TabsRoot`,props:{defaultValue:{type:null,required:!1},orientation:{type:String,required:!1,default:`horizontal`},dir:{type:String,required:!1},activationMode:{type:String,required:!1,default:`automatic`},modelValue:{type:null,required:!1},unmountOnHide:{type:Boolean,required:!1,default:!0},asChild:{type:Boolean,required:!1},as:{type:null,required:!1}},emits:[`update:modelValue`],setup(e,{emit:t}){let n=e,a=t,{orientation:o,unmountOnHide:s,dir:d}=l(n),f=k(d);A();let h=x(n,`modelValue`,a,{defaultValue:n.defaultValue,passive:n.modelValue===void 0}),g=p(),_=v(new Set);return P({modelValue:h,changeModelValue:e=>{h.value=e},orientation:o,dir:f,unmountOnHide:s,activationMode:n.activationMode,baseId:w(void 0,`reka-tabs`),tabsList:g,contentIds:_,registerContent:e=>{_.value=new Set([..._.value,e])},unregisterContent:e=>{let t=new Set(_.value);t.delete(e),_.value=t}}),(e,t)=>(i(),c(u(O),{dir:u(f),"data-orientation":u(o),"as-child":e.asChild,as:e.as},{default:m(()=>[r(e.$slots,`default`,{modelValue:u(h)})]),_:3},8,[`dir`,`data-orientation`,`as-child`,`as`]))}});function I(e,t){return`${e}-trigger-${t}`}function L(e,t){return`${e}-content-${t}`}var R=t({__name:`TabsContent`,props:{value:{type:[String,Number],required:!0},forceMount:{type:Boolean,required:!1},asChild:{type:Boolean,required:!1},as:{type:null,required:!1}},setup(t){let a=t,{forwardRef:o}=A(),l=N(),f=d(()=>I(l.baseId,a.value)),h=d(()=>L(l.baseId,a.value)),_=d(()=>a.value===l.modelValue.value),v=p(_.value);return y(()=>{l.registerContent(a.value),requestAnimationFrame(()=>{v.value=!1})}),s(()=>{l.unregisterContent(a.value)}),(t,a)=>(i(),c(u(E),{present:t.forceMount||_.value,"force-mount":``},{default:m(({present:i})=>[n(u(O),{id:h.value,ref:u(o),"as-child":t.asChild,as:t.as,role:`tabpanel`,"data-state":_.value?`active`:`inactive`,"data-orientation":u(l).orientation.value,"aria-labelledby":f.value,hidden:!i,tabindex:`0`,style:g({animationDuration:v.value?`0s`:void 0})},{default:m(()=>[!u(l).unmountOnHide.value||i?r(t.$slots,`default`,{key:0}):e(`v-if`,!0)]),_:2},1032,[`id`,`as-child`,`as`,`data-state`,`data-orientation`,`aria-labelledby`,`hidden`,`style`])]),_:3},8,[`present`]))}}),z=t({__name:`TabsList`,props:{loop:{type:Boolean,required:!1,default:!0},asChild:{type:Boolean,required:!1},as:{type:null,required:!1}},setup(e){let{loop:t}=l(e),{forwardRef:a,currentElement:o}=A(),s=N();return s.tabsList=o,(e,o)=>(i(),c(u(j),{"as-child":``,orientation:u(s).orientation.value,dir:u(s).dir.value,loop:u(t)},{default:m(()=>[n(u(O),{ref:u(a),role:`tablist`,"as-child":e.asChild,as:e.as,"aria-orientation":u(s).orientation.value},{default:m(()=>[r(e.$slots,`default`)]),_:3},8,[`as-child`,`as`,`aria-orientation`])]),_:3},8,[`orientation`,`dir`,`loop`]))}}),B=t({__name:`TabsTrigger`,props:{value:{type:[String,Number],required:!0},disabled:{type:Boolean,required:!1,default:!1},asChild:{type:Boolean,required:!1},as:{type:null,required:!1,default:`button`}},setup(e){let t=e,{forwardRef:a}=A(),o=N(),s=d(()=>I(o.baseId,t.value)),l=d(()=>o.contentIds.value.has(t.value)?L(o.baseId,t.value):void 0),p=d(()=>t.value===o.modelValue.value);return(e,t)=>(i(),c(u(M),{"as-child":``,focusable:!e.disabled,active:p.value},{default:m(()=>[n(u(O),{id:s.value,ref:u(a),role:`tab`,type:e.as===`button`?`button`:void 0,as:e.as,"as-child":e.asChild,"aria-selected":p.value?`true`:`false`,"aria-controls":l.value,"data-state":p.value?`active`:`inactive`,disabled:e.disabled,"data-disabled":e.disabled?``:void 0,"data-orientation":u(o).orientation.value,onMousedown:t[0]||=_(t=>{!e.disabled&&t.ctrlKey===!1?u(o).changeModelValue(e.value):t.preventDefault()},[`left`]),onKeydown:t[1]||=f(t=>u(o).changeModelValue(e.value),[`enter`,`space`]),onFocus:t[2]||=()=>{let t=u(o).activationMode!==`manual`;!p.value&&!e.disabled&&t&&u(o).changeModelValue(e.value)}},{default:m(()=>[r(e.$slots,`default`)]),_:3},8,[`id`,`type`,`as`,`as-child`,`aria-selected`,`aria-controls`,`data-state`,`disabled`,`data-disabled`,`data-orientation`])]),_:3},8,[`focusable`,`active`]))}}),V=t({__name:`Tabs`,props:{defaultValue:{},orientation:{},dir:{},activationMode:{},modelValue:{},unmountOnHide:{type:Boolean},asChild:{type:Boolean},as:{},class:{type:[Boolean,null,String,Object,Array]}},emits:[`update:modelValue`],setup(e,{emit:t}){let n=e,s=t,l=D(b(n,`class`),s);return(e,t)=>(i(),c(u(F),a({"data-slot":`tabs`},u(l),{class:u(S)(`flex flex-col gap-2`,n.class)}),{default:m(t=>[r(e.$slots,`default`,o(h(t)))]),_:3},16,[`class`]))}}),H=t({__name:`TabsContent`,props:{value:{},forceMount:{type:Boolean},asChild:{type:Boolean},as:{},class:{type:[Boolean,null,String,Object,Array]}},setup(e){let t=e,n=b(t,`class`);return(e,o)=>(i(),c(u(R),a({"data-slot":`tabs-content`,class:u(S)(`flex-1 outline-none`,t.class)},u(n)),{default:m(()=>[r(e.$slots,`default`)]),_:3},16,[`class`]))}}),U=t({__name:`TabsList`,props:{loop:{type:Boolean},asChild:{type:Boolean},as:{},class:{type:[Boolean,null,String,Object,Array]}},setup(e){let t=e,n=b(t,`class`);return(e,o)=>(i(),c(u(z),a({"data-slot":`tabs-list`},u(n),{class:u(S)(`bg-muted text-muted-foreground inline-flex h-9 w-fit items-center justify-center rounded-lg p-[3px]`,t.class)}),{default:m(()=>[r(e.$slots,`default`)]),_:3},16,[`class`]))}}),W=t({__name:`TabsTrigger`,props:{value:{},disabled:{type:Boolean},asChild:{type:Boolean},as:{},class:{type:[Boolean,null,String,Object,Array]}},setup(e){let t=e,n=T(b(t,`class`));return(e,o)=>(i(),c(u(B),a({"data-slot":`tabs-trigger`,class:u(S)(`data-[state=active]:bg-background dark:data-[state=active]:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 text-foreground dark:text-muted-foreground inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4`,t.class)},u(n)),{default:m(()=>[r(e.$slots,`default`)]),_:3},16,[`class`]))}});export{V as i,U as n,H as r,W as t}; |