You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

2 lines
9.0 KiB

import{m as ne,_ as oe,E as V,h as ge,j as Ne,d as Ce,p as Te,k as te}from"./base-79ac1cb4.js";import{a as le,b as Pe,c as we,E as D}from"./aria-e318c742.js";import{P as Ee,ab as Se,b as I,i as Y,d as F,j as G,u as U,m as T,Q as R,$ as J,o as re,v as ie,n as ce,e as k,f as $e,_ as K,c as M,s as ue,aa as xe,y as b,p as ke,r as de,H as Be,k as Oe,R as Re,ac as ae,q as ze,ad as Ae,E as Fe,a9 as Me,I as Le,h as Ve,ae as De}from"./normalize-8d58a40d.js";import{t as Z,c as Ie,U as be}from"./el-button-4de18cb6.js";import{c as O}from"./strings-cd9d99f9.js";import{f as Ue}from"./vnode-d7202dcd.js";const Ke=(e,n,v)=>Ue(e.subTree).filter(t=>{var o;return Se(t)&&((o=t.type)==null?void 0:o.name)===n&&!!t.component}).map(t=>t.component.uid).map(t=>v[t]).filter(t=>!!t),je=(e,n)=>{const v={},P=Ee([]);return{children:P,addChild:o=>{v[o.uid]=o,P.value=Ke(e,n,v)},removeChild:o=>{delete v[o],P.value=P.value.filter(S=>S.uid!==o)}}},j=Symbol("tabsRootContextKey"),qe=I({tabs:{type:Y(Array),default:()=>ne([])}}),ve="ElTabBar",He=F({name:ve}),We=F({...He,props:qe,setup(e,{expose:n}){const v=e,P=K(),i=G(j);i||Z(ve,"<el-tabs><el-tab-bar /></el-tabs>");const t=U("tabs"),o=T(),S=T(),u=()=>{let f=0,m=0;const d=["top","bottom"].includes(i.props.tabPosition)?"width":"height",l=d==="width"?"x":"y",B=l==="x"?"left":"top";return v.tabs.every($=>{var E,a;const h=(a=(E=P.parent)==null?void 0:E.refs)==null?void 0:a[`tab-${$.uid}`];if(!h)return!1;if(!$.active)return!0;f=h[`offset${O(B)}`],m=h[`client${O(d)}`];const g=window.getComputedStyle(h);return d==="width"&&(v.tabs.length>1&&(m-=Number.parseFloat(g.paddingLeft)+Number.parseFloat(g.paddingRight)),f+=Number.parseFloat(g.paddingLeft)),!1}),{[d]:`${m}px`,transform:`translate${O(l)}(${f}px)`}},y=()=>S.value=u();return R(()=>v.tabs,async()=>{await J(),y()},{immediate:!0}),le(o,()=>y()),n({ref:o,update:y}),(f,m)=>(re(),ie("div",{ref_key:"barRef",ref:o,class:ce([k(t).e("active-bar"),k(t).is(k(i).props.tabPosition)]),style:$e(S.value)},null,6))}});var Qe=oe(We,[["__file","/home/runner/work/element-plus/element-plus/packages/components/tabs/src/tab-bar.vue"]]);const Xe=I({panes:{type:Y(Array),default:()=>ne([])},currentName:{type:[String,Number],default:""},editable:Boolean,type:{type:String,values:["card","border-card",""],default:""},stretch:Boolean}),Ye={tabClick:(e,n,v)=>v instanceof Event,tabRemove:(e,n)=>n instanceof Event},se="ElTabNav",Ge=F({name:se,props:Xe,emits:Ye,setup(e,{expose:n,emit:v}){const P=K(),i=G(j);i||Z(se,"<el-tabs><tab-nav /></el-tabs>");const t=U("tabs"),o=Pe(),S=we(),u=T(),y=T(),f=T(),m=T(),d=T(!1),l=T(0),B=T(!1),$=T(!0),E=M(()=>["top","bottom"].includes(i.props.tabPosition)?"width":"height"),a=M(()=>({transform:`translate${E.value==="width"?"X":"Y"}(-${l.value}px)`})),h=()=>{if(!u.value)return;const r=u.value[`offset${O(E.value)}`],c=l.value;if(!c)return;const s=c>r?c-r:0;l.value=s},g=()=>{if(!u.value||!y.value)return;const r=y.value[`offset${O(E.value)}`],c=u.value[`offset${O(E.value)}`],s=l.value;if(r-s<=c)return;const N=r-s>c*2?s+c:r-c;l.value=N},z=async()=>{const r=y.value;if(!d.value||!f.value||!u.value||!r)return;await J();const c=f.value.querySelector(".is-active");if(!c)return;const s=u.value,N=["top","bottom"].includes(i.props.tabPosition),C=c.getBoundingClientRect(),_=s.getBoundingClientRect(),x=N?r.offsetWidth-_.width:r.offsetHeight-_.height,w=l.value;let p=w;N?(C.left<_.left&&(p=w-(_.left-C.left)),C.right>_.right&&(p=w+C.right-_.right)):(C.top<_.top&&(p=w-(_.top-C.top)),C.bottom>_.bottom&&(p=w+(C.bottom-_.bottom))),p=Math.max(p,0),l.value=Math.min(p,x)},L=()=>{var r;if(!y.value||!u.value)return;e.stretch&&((r=m.value)==null||r.update());const c=y.value[`offset${O(E.value)}`],s=u.value[`offset${O(E.value)}`],N=l.value;s<c?(d.value=d.value||{},d.value.prev=N,d.value.next=N+s<c,c-N<s&&(l.value=c-s)):(d.value=!1,N>0&&(l.value=0))},pe=r=>{const c=r.code,{up:s,down:N,left:C,right:_}=D;if(![s,N,C,_].includes(c))return;const x=Array.from(r.currentTarget.querySelectorAll("[role=tab]:not(.is-disabled)")),w=x.indexOf(r.target);let p;c===C||c===s?w===0?p=x.length-1:p=w-1:w<x.length-1?p=w+1:p=0,x[p].focus({preventScroll:!0}),x[p].click(),ee()},ee=()=>{$.value&&(B.value=!0)},q=()=>B.value=!1;return R(o,r=>{r==="hidden"?$.value=!1:r==="visible"&&setTimeout(()=>$.value=!0,50)}),R(S,r=>{r?setTimeout(()=>$.value=!0,50):$.value=!1}),le(f,L),ue(()=>setTimeout(()=>z(),0)),xe(()=>L()),n({scrollToActiveTab:z,removeFocus:q}),R(()=>e.panes,()=>P.update(),{flush:"post",deep:!0}),()=>{const r=d.value?[b("span",{class:[t.e("nav-prev"),t.is("disabled",!d.value.prev)],onClick:h},[b(V,null,{default:()=>[b(ge,null,null)]})]),b("span",{class:[t.e("nav-next"),t.is("disabled",!d.value.next)],onClick:g},[b(V,null,{default:()=>[b(Ne,null,null)]})])]:null,c=e.panes.map((s,N)=>{var C,_,x,w;const p=s.uid,H=s.props.disabled,W=(_=(C=s.props.name)!=null?C:s.index)!=null?_:`${N}`,Q=!H&&(s.isClosable||e.editable);s.index=`${N}`;const he=Q?b(V,{class:"is-icon-close",onClick:A=>v("tabRemove",s,A)},{default:()=>[b(Ce,null,null)]}):null,ye=((w=(x=s.slots).label)==null?void 0:w.call(x))||s.props.label,_e=!H&&s.active?0:-1;return b("div",{ref:`tab-${p}`,class:[t.e("item"),t.is(i.props.tabPosition),t.is("active",s.active),t.is("disabled",H),t.is("closable",Q),t.is("focus",B.value)],id:`tab-${W}`,key:`tab-${p}`,"aria-controls":`pane-${W}`,role:"tab","aria-selected":s.active,tabindex:_e,onFocus:()=>ee(),onBlur:()=>q(),onClick:A=>{q(),v("tabClick",s,W,A)},onKeydown:A=>{Q&&(A.code===D.delete||A.code===D.backspace)&&v("tabRemove",s,A)}},[ye,he])});return b("div",{ref:f,class:[t.e("nav-wrap"),t.is("scrollable",!!d.value),t.is(i.props.tabPosition)]},[r,b("div",{class:t.e("nav-scroll"),ref:u},[b("div",{class:[t.e("nav"),t.is(i.props.tabPosition),t.is("stretch",e.stretch&&["top","bottom"].includes(i.props.tabPosition))],ref:y,style:a.value,role:"tablist",onKeydown:pe},[e.type?null:b(Qe,{ref:m,tabs:[...e.panes]},null),c])])])}}}),Je=I({type:{type:String,values:["card","border-card",""],default:""},activeName:{type:[String,Number]},closable:Boolean,addable:Boolean,modelValue:{type:[String,Number]},editable:Boolean,tabPosition:{type:String,values:["top","right","bottom","left"],default:"top"},beforeLeave:{type:Y(Function),default:()=>!0},stretch:Boolean}),X=e=>Be(e)||Oe(e),Ze={[be]:e=>X(e),tabClick:(e,n)=>n instanceof Event,tabChange:e=>X(e),edit:(e,n)=>["remove","add"].includes(n),tabRemove:e=>X(e),tabAdd:()=>!0};var et=F({name:"ElTabs",props:Je,emits:Ze,setup(e,{emit:n,slots:v,expose:P}){var i,t;const o=U("tabs"),{children:S,addChild:u,removeChild:y}=je(K(),"ElTabPane"),f=T(),m=T((t=(i=e.modelValue)!=null?i:e.activeName)!=null?t:"0"),d=a=>{m.value=a,n(be,a),n("tabChange",a)},l=async a=>{var h,g,z;if(!(m.value===a||te(a)))try{await((h=e.beforeLeave)==null?void 0:h.call(e,a,m.value))!==!1&&(d(a),(z=(g=f.value)==null?void 0:g.removeFocus)==null||z.call(g))}catch{}},B=(a,h,g)=>{a.props.disabled||(l(h),n("tabClick",a,g))},$=(a,h)=>{a.props.disabled||te(a.props.name)||(h.stopPropagation(),n("edit",a.props.name,"remove"),n("tabRemove",a.props.name))},E=()=>{n("edit",void 0,"add"),n("tabAdd")};return Ie({from:'"activeName"',replacement:'"model-value" or "v-model"',scope:"ElTabs",version:"2.3.0",ref:"https://element-plus.org/en-US/component/tabs.html#attributes",type:"Attribute"},M(()=>!!e.activeName)),R(()=>e.activeName,a=>l(a)),R(()=>e.modelValue,a=>l(a)),R(m,async()=>{var a;await J(),(a=f.value)==null||a.scrollToActiveTab()}),ke(j,{props:e,currentName:m,registerPane:u,unregisterPane:y}),P({currentName:m}),()=>{const a=e.editable||e.addable?b("span",{class:o.e("new-tab"),tabindex:"0",onClick:E,onKeydown:z=>{z.code===D.enter&&E()}},[b(V,{class:o.is("icon-plus")},{default:()=>[b(Te,null,null)]})]):null,h=b("div",{class:[o.e("header"),o.is(e.tabPosition)]},[a,b(Ge,{ref:f,currentName:m.value,editable:e.editable,type:e.type,panes:S.value,stretch:e.stretch,onTabClick:B,onTabRemove:$},null)]),g=b("div",{class:o.e("content")},[de(v,"default")]);return b("div",{class:[o.b(),o.m(e.tabPosition),{[o.m("card")]:e.type==="card",[o.m("border-card")]:e.type==="border-card"}]},[...e.tabPosition!=="bottom"?[h,g]:[g,h]])}}});const tt=I({label:{type:String,default:""},name:{type:[String,Number]},closable:Boolean,disabled:Boolean,lazy:Boolean}),at=["id","aria-hidden","aria-labelledby"],fe="ElTabPane",st=F({name:fe}),nt=F({...st,props:tt,setup(e){const n=e,v=K(),P=Re(),i=G(j);i||Z(fe,"usage: <el-tabs><el-tab-pane /></el-tabs/>");const t=U("tab-pane"),o=T(),S=M(()=>n.closable||i.props.closable),u=ae(()=>{var l;return i.currentName.value===((l=n.name)!=null?l:o.value)}),y=T(u.value),f=M(()=>{var l;return(l=n.name)!=null?l:o.value}),m=ae(()=>!n.lazy||y.value||u.value);R(u,l=>{l&&(y.value=!0)});const d=ze({uid:v.uid,slots:P,props:n,paneName:f,active:u,index:o,isClosable:S});return ue(()=>{i.registerPane(d)}),Ae(()=>{i.unregisterPane(d.uid)}),(l,B)=>k(m)?Fe((re(),ie("div",{key:0,id:`pane-${k(f)}`,class:ce(k(t).b()),role:"tabpanel","aria-hidden":!k(u),"aria-labelledby":`tab-${k(f)}`},[de(l.$slots,"default")],10,at)),[[Me,k(u)]]):Le("v-if",!0)}});var me=oe(nt,[["__file","/home/runner/work/element-plus/element-plus/packages/components/tabs/src/tab-pane.vue"]]);const dt=Ve(et,{TabPane:me}),bt=De(me);export{bt as E,dt as a};