2 lines
12 KiB
JavaScript
2 lines
12 KiB
JavaScript
import{bI as We,b as j,a5 as ne,R as K,d as G,B as re,C as ce,a as J,D as L,a7 as se,H as Ne,o as Se,c as _e,al as Xe,n as Ee,f as U,g as Re,y as N,j as R,U as X,P as H,bJ as pe,G as Ye,bK as Ue,bL as Ie,s as g,E as I,bG as Ke,T as He,b1 as je,V as le,W as $,aT as Ge,bM as Je,bN as qe,h as oe,bO as Qe,J as Ze,ak as et,N as xe,F as tt,bm as at,z as nt,bP as st,K as lt,L as ot,l as it,ab as rt}from"./index-_T_ZwAU8.js";import{c as ct,r as ie,U as Pe}from"./raf-BSHx3Xj9.js";import{u as ut}from"./index-D9Qe2eDp.js";import{i as ee}from"./index-CnFjh-NG.js";import{c as te}from"./index-uEvcRnhb.js";import{i as dt}from"./index-DrL-DdXi.js";import{c as we}from"./clamp-eKDmixUu.js";import{o as bt}from"./omit-BNuYgpQl.js";const vt=({atEndEdge:e,atStartEdge:l,layout:u},p)=>{let t,T=0;const S=i=>i<0&&l.value||i>0&&e.value;return{hasReachedEdge:S,onWheel:i=>{ct(t);let{deltaX:h,deltaY:r}=i;i.shiftKey&&r!==0&&(h=r,r=0);const f=u.value==="horizontal"?h:r;S(f)||(T+=f,!We()&&f!==0&&i.preventDefault(),t=ie(()=>{p(T),T=0}))}}};const ge=e=>{let l,u;return e.type==="touchend"?(u=e.changedTouches[0].clientY,l=e.changedTouches[0].clientX):e.type.startsWith("touch")?(u=e.touches[0].clientY,l=e.touches[0].clientX):(u=e.clientY,l=e.clientX),{clientX:l,clientY:u}},q=Symbol("tabsRootContextKey"),ft=j({tabs:{type:K(Array),default:()=>ne([])},tabRefs:{type:K(Object),default:()=>ne({})}}),ye="ElTabBar";var ht=G({name:ye,__name:"tab-bar",props:ft,setup(e,{expose:l}){const u=e,p=re(q);p||ce(ye,"<el-tabs><el-tab-bar /></el-tabs>");const t=J("tabs"),T=N(),S=N(),d=R(()=>{var n;return X(p.props.defaultValue)||!!((n=S.value)!=null&&n.transform)}),i=()=>{let n=0,_=0;const v=["top","bottom"].includes(p.props.tabPosition)?"width":"height",x=v==="width"?"x":"y",w=x==="x"?"left":"top";return u.tabs.every(a=>{if(X(a.paneName))return!1;const c=u.tabRefs[a.paneName];if(!c)return!1;if(!a.active)return!0;n=c[`offset${te(w)}`],_=c[`client${te(v)}`];const C=window.getComputedStyle(c);return v==="width"&&(_-=Number.parseFloat(C.paddingLeft)+Number.parseFloat(C.paddingRight),n+=Number.parseFloat(C.paddingLeft)),!1}),{[v]:`${_}px`,transform:`translate${te(x)}(${n}px)`}},h=()=>S.value=i(),r=[],f=()=>{r.forEach(n=>n.stop()),r.length=0,Object.values(u.tabRefs).forEach(n=>{r.push(se(n,h))})};L(()=>u.tabs,async()=>{await H(),h(),f()},{immediate:!0});const b=se(T,()=>h());return Ne(()=>{r.forEach(n=>n.stop()),r.length=0,b.stop()}),l({ref:T,update:h}),(n,_)=>d.value?(Se(),_e("div",{key:0,ref_key:"barRef",ref:T,class:Ee([U(t).e("active-bar"),U(t).is(U(p).props.tabPosition)]),style:Xe(S.value)},null,6)):Re("v-if",!0)}}),mt=ht;const pt=5,gt=({scrollable:e,navOffset:l,navSize:u,navContainerSize:p,isHorizontal:t})=>{const T=N(!1),S=R(()=>Math.max(u.value-p.value,0));let d,i;const h=b=>{if(!e.value||b.touches.length!==1)return;const{clientX:n,clientY:_}=ge(b);d={startX:n,startY:_,startOffset:l.value},i=void 0},r=b=>{if(!d||!e.value)return;if(b.touches.length!==1){f();return}const{clientX:n,clientY:_}=ge(b),v=d.startX-n,x=d.startY-_,w=t.value?v:x,a=t.value?x:v,c=Math.abs(w),C=Math.abs(a);if(dt(i)){if(Math.max(c,C)<=pt)return;i=c>C}if(!i)return;const P=we(d.startOffset+w,0,S.value);S.value<=0||P===l.value||!b.cancelable||(b.preventDefault(),T.value=!0,l.value=P)},f=()=>{d=void 0,i=void 0,T.value=!1};return{isTouchScrolling:T,handleTouchStart:h,handleTouchMove:r,handleTouchEnd:f}},yt=j({panes:{type:K(Array),default:()=>ne([])},currentName:{type:[String,Number],default:""},editable:Boolean,type:{type:String,values:["card","border-card",""],default:""},stretch:Boolean,tabindex:{type:[String,Number],default:void 0}}),Tt={tabClick:(e,l,u)=>u instanceof Event,tabRemove:(e,l)=>l instanceof Event},Te="ElTabNav",Ct=G({name:Te,props:yt,emits:Tt,setup(e,{expose:l,emit:u}){const p=re(q);p||ce(Te,"<el-tabs><tab-nav /></el-tabs>");const t=J("tabs"),T=Je(),S=qe(),d=N(),i=N(),h=N(),r=N({}),f=N(),b=N(!1),n=N(0),_=N(!1),v=N(!0),x=N(!1),w=Ge(),a=R(()=>["top","bottom"].includes(p.props.tabPosition)),c=R(()=>a.value?"width":"height"),C=R(()=>{const s=c.value==="width"?"X":"Y";return{transition:x.value||$e.value?"none":void 0,transform:`translate${s}(-${n.value}px)`}}),{width:P,height:M}=pe(d),{width:Y,height:D}=pe(i,{width:0,height:0},{box:"border-box"}),B=R(()=>a.value?P.value:M.value),W=R(()=>a.value?Y.value:D.value),{onWheel:Oe}=vt({atStartEdge:R(()=>n.value<=0),atEndEdge:R(()=>W.value-n.value<=B.value),layout:R(()=>a.value?"horizontal":"vertical")},s=>{n.value=we(n.value+s,0,W.value-B.value)}),ke=s=>{x.value=!0,Oe(s),ie(()=>{x.value=!1})},{isTouchScrolling:$e,handleTouchStart:Ae,handleTouchMove:ze,handleTouchEnd:ue}=gt({scrollable:b,navOffset:n,navSize:W,navContainerSize:B,isHorizontal:a}),Me=()=>{if(!d.value)return;const s=d.value.getBoundingClientRect()[c.value],m=n.value;m&&(n.value=m>s?m-s:0)},Fe=()=>{if(!d.value||!i.value)return;const s=i.value.getBoundingClientRect()[c.value],m=d.value.getBoundingClientRect()[c.value],o=n.value;ee(s-o,m)&&(n.value=s-o>m*2?o+m:s-m)},de=async()=>{const s=i.value;if(!b.value||!h.value||!d.value||!s)return;await H();const m=r.value[e.currentName];if(!m)return;const o=d.value,y=m.getBoundingClientRect(),E=o.getBoundingClientRect(),F=E.left+1,A=E.right-1,V=s.getBoundingClientRect(),Z=a.value?V.width-E.width:V.height-E.height,z=n.value;let O=z;a.value?(y.left<F&&(O=z-(F-y.left)),y.right>A&&(O=z+y.right-A)):(y.top<E.top&&(O=z-(E.top-y.top)),y.bottom>E.bottom&&(O=z+(y.bottom-E.bottom))),O=Math.max(O,0),n.value=Math.min(O,Z)},be=()=>{var y;if(!i.value||!d.value)return;e.stretch&&((y=f.value)==null||y.update());const s=i.value.getBoundingClientRect()[c.value],m=d.value.getBoundingClientRect()[c.value],o=n.value;m<s?(b.value=b.value||{},b.value.prev=o,b.value.next=ee(s,o+m),ee(m,s-o)&&(n.value=s-m)):(b.value=!1,o>0&&(n.value=0))},Ve=s=>{const m=le(s);let o=0;switch(m){case $.left:case $.up:o=-1;break;case $.right:case $.down:o=1;break;default:return}const y=Array.from(s.currentTarget.querySelectorAll("[role=tab]:not(.is-disabled)"));let E=y.indexOf(s.target)+o;E<0?E=y.length-1:E>=y.length&&(E=0),y[E].focus({preventScroll:!0}),y[E].click(),ve()},ve=()=>{v.value&&(_.value=!0)},Q=()=>_.value=!1,Le=(s,m)=>{r.value[m]=s},De=async()=>{var s;await H(),(s=r.value[e.currentName])==null||s.focus({preventScroll:!0})};return L(T,s=>{s==="hidden"?v.value=!1:s==="visible"&&setTimeout(()=>v.value=!0,50)}),L(S,s=>{s?setTimeout(()=>v.value=!0,50):v.value=!1}),se(h,()=>{ie(be)}),Ye(()=>setTimeout(()=>de(),0)),Ue(()=>be()),l({scrollToActiveTab:de,removeFocus:Q,focusActiveTab:De,tabListRef:i,tabBarRef:f,scheduleRender:()=>Ie(w)}),()=>{const s=b.value?[g("span",{class:[t.e("nav-prev"),t.is("disabled",!b.value.prev)],onClick:Me},[g(I,null,{default:()=>[g(Ke,null,null)]})]),g("span",{class:[t.e("nav-next"),t.is("disabled",!b.value.next)],onClick:Fe},[g(I,null,{default:()=>[g(He,null,null)]})])]:null,m=e.panes.map((o,y)=>{var fe,he;const E=o.uid,F=o.props.disabled,A=o.props.name??o.index??`${y}`,V=!F&&(o.isClosable||o.props.closable!==!1&&e.editable);o.index=`${y}`;const Z=V?g(I,{class:"is-icon-close",onClick:k=>u("tabRemove",o,k)},{default:()=>[g(je,null,null)]}):null,z=((he=(fe=o.slots).label)==null?void 0:he.call(fe))||o.props.label,O=!F&&o.active?e.tabindex??p.props.tabindex:-1;return g("div",{ref:k=>Le(k,A),class:[t.e("item"),t.is(p.props.tabPosition),t.is("active",o.active),t.is("disabled",F),t.is("closable",V),t.is("focus",_.value)],id:`tab-${A}`,key:`tab-${E}`,"aria-controls":`pane-${A}`,role:"tab","aria-selected":o.active,tabindex:O,onFocus:()=>ve(),onBlur:()=>Q(),onClick:k=>{Q(),u("tabClick",o,A,k)},onKeydown:k=>{const me=le(k);V&&(me===$.delete||me===$.backspace)&&u("tabRemove",o,k)}},[z,Z])});return w.value,g("div",{ref:h,class:[t.e("nav-wrap"),t.is("scrollable",!!b.value),t.is(p.props.tabPosition)]},[s,g("div",{class:t.e("nav-scroll"),ref:d},[e.panes.length>0?g("div",{class:[t.e("nav"),t.is(p.props.tabPosition),t.is("stretch",e.stretch&&["top","bottom"].includes(p.props.tabPosition))],ref:i,style:C.value,role:"tablist",onKeydown:Ve,onWheel:ke,onTouchstart:Ae,onTouchmove:ze,onTouchend:ue,onTouchcancel:ue},[e.type?null:g(mt,{ref:f,tabs:[...e.panes],tabRefs:r.value},null),m]):null])])}}}),Nt=j({type:{type:String,values:["card","border-card",""],default:""},closable:Boolean,addable:Boolean,modelValue:{type:[String,Number]},defaultValue:{type:[String,Number]},editable:Boolean,tabPosition:{type:String,values:["top","right","bottom","left"],default:"top"},beforeLeave:{type:K(Function),default:()=>!0},stretch:Boolean,tabindex:{type:[String,Number],default:0}}),ae=e=>Ze(e)||et(e),St={[Pe]:e=>ae(e),tabClick:(e,l)=>l instanceof Event,tabChange:e=>ae(e),edit:(e,l)=>["remove","add"].includes(l),tabRemove:e=>ae(e),tabAdd:()=>!0},_t=G({name:"ElTabs",props:Nt,emits:St,setup(e,{emit:l,slots:u,expose:p}){const t=J("tabs"),T=R(()=>["left","right"].includes(e.tabPosition)),{children:S,addChild:d,removeChild:i,ChildrenSorter:h}=ut(xe(),"ElTabPane"),r=N(),f=N((X(e.modelValue)?e.defaultValue:e.modelValue)??"0"),b=async(a,c=!1)=>{var C,P,M,Y;if(!(f.value===a||X(a)))try{let D;if(e.beforeLeave){const B=e.beforeLeave(a,f.value);D=B instanceof Promise?await B:B}else D=!0;if(D!==!1){const B=(C=S.value.find(W=>W.paneName===f.value))==null?void 0:C.isFocusInsidePane();f.value=a,c&&(l(Pe,a),l("tabChange",a)),(M=(P=r.value)==null?void 0:P.removeFocus)==null||M.call(P),B&&((Y=r.value)==null||Y.focusActiveTab())}}catch{}},n=(a,c,C)=>{a.props.disabled||(l("tabClick",a,C),b(c,!0))},_=(a,c)=>{a.props.disabled||X(a.props.name)||(c.stopPropagation(),l("edit",a.props.name,"remove"),l("tabRemove",a.props.name))},v=()=>{l("edit",void 0,"add"),l("tabAdd")},x=a=>{const c=le(a);[$.enter,$.numpadEnter].includes(c)&&v()},w=a=>{const c=a.el.firstChild,C=["bottom","right"].includes(e.tabPosition)?a.children[0].el:a.children[1].el;c!==C&&c.before(C)};return L(()=>e.modelValue,a=>b(a)),L(f,async()=>{var a;await H(),(a=r.value)==null||a.scrollToActiveTab()}),tt(q,{props:e,currentName:f,registerPane:d,unregisterPane:i,nav$:r}),p({currentName:f,get tabNavRef(){return bt(r.value,["scheduleRender"])}}),()=>{const a=u["add-icon"],c=e.editable||e.addable?g("div",{class:[t.e("new-tab"),T.value&&t.e("new-tab-vertical")],tabindex:e.tabindex,onClick:v,onKeydown:x},[a?oe(u,"add-icon"):g(I,{class:t.is("icon-plus")},{default:()=>[g(Qe,null,null)]})]):null,C=()=>g(Ct,{ref:r,currentName:f.value,editable:e.editable,type:e.type,panes:S.value,stretch:e.stretch,onTabClick:n,onTabRemove:_},null),P=g("div",{class:[t.e("header"),T.value&&t.e("header-vertical"),t.is(e.tabPosition)]},[g(h,null,{default:C,$stable:!0}),c]),M=g("div",{class:t.e("content")},[oe(u,"default")]);return g("div",{class:[t.b(),t.m(e.tabPosition),{[t.m("card")]:e.type==="card",[t.m("border-card")]:e.type==="border-card"}],onVnodeMounted:w,onVnodeUpdated:w},[M,P])}}}),Et=j({label:{type:String,default:""},name:{type:[String,Number]},closable:{type:Boolean,default:void 0},disabled:Boolean,lazy:Boolean}),Rt=["id","aria-hidden","aria-labelledby"],Ce="ElTabPane";var xt=G({name:Ce,__name:"tab-pane",props:Et,setup(e){const l=e,u=xe(),p=at(),t=re(q);t||ce(Ce,"usage: <el-tabs><el-tab-pane /></el-tabs/>");const T=J("tab-pane"),S=N(),d=N(),i=R(()=>l.closable??t.props.closable),h=R(()=>t.currentName.value===(l.name??d.value)),r=N(h.value),f=R(()=>l.name??d.value),b=R(()=>!l.lazy||r.value||h.value),n=()=>{var v;return(v=S.value)==null?void 0:v.contains(document.activeElement)};L(h,v=>{v&&(r.value=!0)});const _=nt({uid:u.uid,getVnode:()=>u.vnode,slots:p,props:l,paneName:f,active:h,index:d,isClosable:i,isFocusInsidePane:n});return t.registerPane(_),Ne(()=>{t.unregisterPane(_)}),st(()=>{var v;p.label&&((v=t.nav$.value)==null||v.scheduleRender())}),(v,x)=>b.value?lt((Se(),_e("div",{key:0,id:`pane-${f.value}`,ref_key:"paneRef",ref:S,class:Ee(U(T).b()),role:"tabpanel","aria-hidden":!h.value,"aria-labelledby":`tab-${f.value}`},[oe(v.$slots,"default")],10,Rt)),[[ot,h.value]]):Re("v-if",!0)}}),Be=xt;const Mt=it(_t,{TabPane:Be}),Ft=rt(Be);export{Ft as E,Mt as a};
|