| 1 |
- import{a as G,a0 as ge,a1 as J,c as I,n as $e,f as pe,aK as Ce,i as oe,d as ke,ai as _e,ax as Se,s as xe,j as Be}from"./index-Bwyyoo5R.js";import{d as K,p as te,c as M,o as j,a as ze,s as Te,q as se,m as re,b as A,A as Pe,D as u,H as Oe,C as we,i as ue,e as f,l as Ie,n as Ke,u as W,j as C,x as ce,L as Q,a4 as de,w as X,r as Y,v as Re,g as He,y as je}from"./vue-vendor-BdC0yijC.js";import{I as Ae}from"./index-D4sHUj-y.js";import{R as ae}from"./index.es-DQat3s1x.js";import{u as Le}from"./index-B9XZQkcG.js";const Ne=({direction:e,type:a,offset:t})=>e==="vertical"?{transform:`translateY(${-t}px)`}:{transform:`translateX(${-t}px)`},De=(e,a)=>{const{scrollTop:t,scrollLeft:d}=e;a==="horizontal"&&d&&e.scrollTo({left:-1*d}),a==="vertical"&&t&&e.scrollTo({top:-1*t})},Z=Symbol("ArcoTabs"),Me=K({name:"TabsTab",components:{IconHover:J,IconClose:ge},props:{tab:{type:Object,required:!0},active:Boolean,editable:Boolean},emits:["click","delete"],setup(e,{emit:a}){const t=I("tabs-tab"),d=ue(Z,{}),c=l=>{e.tab.disabled||a("click",e.tab.key,l)},h=l=>{l.key==="Enter"&&c(l)},i=f(()=>Object.assign(d.trigger==="click"?{onClick:c}:{onMouseover:c},{onKeydown:h})),o=l=>{e.tab.disabled||a("delete",e.tab.key,l)},s=f(()=>[t,{[`${t}-active`]:e.active,[`${t}-closable`]:e.editable&&e.tab.closable,[`${t}-disabled`]:e.tab.disabled}]);return{prefixCls:t,cls:s,eventHandlers:i,handleDelete:o}}});function We(e,a,t,d,c,h){const i=te("icon-close"),o=te("icon-hover");return j(),M("div",we({tabindex:"0",class:e.cls},e.eventHandlers),[ze("span",{class:A(`${e.prefixCls}-title`)},[re(e.$slots,"default")],2),e.editable&&e.tab.closable?(j(),Te(o,{key:0,class:A(`${e.prefixCls}-close-btn`),onClick:Oe(e.handleDelete,["stop"])},{default:Pe(()=>[u(i)]),_:1},8,["class","onClick"])):se("v-if",!0)],16)}var qe=G(Me,[["render",We]]);function Ee(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!Ie(e)}var le=K({name:"TabsButton",props:{type:{type:String,default:"next"},direction:{type:String,default:"horizontal"},disabled:{type:Boolean,default:!1},onClick:{type:Function}},emits:["click"],setup(e,{emit:a}){const t=I("tabs-nav-button"),d=i=>{e.disabled||a("click",e.type,i)},c=()=>e.direction==="horizontal"?e.type==="next"?u(Ae,null,null):u($e,null,null):e.type==="next"?u(pe,null,null):u(Ce,null,null),h=f(()=>[t,{[`${t}-disabled`]:e.disabled,[`${t}-left`]:e.direction==="horizontal"&&e.type==="previous",[`${t}-right`]:e.direction==="horizontal"&&e.type==="next",[`${t}-up`]:e.direction==="vertical"&&e.type==="previous",[`${t}-down`]:e.direction==="vertical"&&e.type==="next"}]);return()=>{let i;return u("div",{class:h.value,onClick:d},[u(J,{disabled:e.disabled},Ee(i=c())?i:{default:()=>[i]})])}}});const Ue=K({name:"TabsNavInk",props:{activeTabRef:{type:Object},direction:{type:String},disabled:Boolean,animation:Boolean},setup(e){const{activeTabRef:a}=W(e),t=I("tabs-nav-ink"),d=C(0),c=C(0),h=f(()=>e.direction==="vertical"?{top:`${d.value}px`,height:`${c.value}px`}:{left:`${d.value}px`,width:`${c.value}px`}),i=()=>{if(a.value){const s=e.direction==="vertical"?a.value.offsetTop:a.value.offsetLeft,l=e.direction==="vertical"?a.value.offsetHeight:a.value.offsetWidth;(s!==d.value||l!==c.value)&&(d.value=s,c.value=l)}};ce(()=>{Q(()=>i())}),de(()=>{i()});const o=f(()=>[t,{[`${t}-animation`]:e.animation,[`${t}-disabled`]:e.disabled}]);return{prefixCls:t,cls:o,style:h}}});function Ve(e,a,t,d,c,h){return j(),M("div",{class:A(e.cls),style:Ke(e.style)},null,6)}var Fe=G(Ue,[["render",Ve]]),Xe=K({name:"TabsNav",props:{tabs:{type:Array,required:!0},direction:{type:String,required:!0},type:{type:String,required:!0},activeKey:{type:[String,Number]},activeIndex:{type:Number,required:!0},position:{type:String,required:!0},size:{type:String,required:!0},showAddButton:{type:Boolean,default:!1},editable:{type:Boolean,default:!1},animation:{type:Boolean,required:!0},headerPadding:{type:Boolean,default:!0},scrollPosition:{type:String,default:"auto"}},emits:["click","add","delete"],setup(e,{emit:a,slots:t}){const{tabs:d,activeKey:c,activeIndex:h,direction:i,scrollPosition:o}=W(e),s=I("tabs-nav"),l=C(),g=C(),S=C({}),p=f(()=>{if(!oe(c.value))return S.value[c.value]}),_=C(),x=f(()=>e.editable&&["line","card","card-gutter"].includes(e.type)),$=C(!1),R=C(0),z=C(0),y=C(0),w=()=>{var r,v,B;return(B=i.value==="vertical"?(r=l.value)==null?void 0:r.offsetHeight:(v=l.value)==null?void 0:v.offsetWidth)!=null?B:0},L=()=>!g.value||!l.value?0:i.value==="vertical"?g.value.offsetHeight-l.value.offsetHeight:g.value.offsetWidth-l.value.offsetWidth,T=()=>{$.value=q(),$.value?(R.value=w(),z.value=L(),y.value>z.value&&(y.value=z.value)):y.value=0},q=()=>l.value&&g.value?e.direction==="vertical"?g.value.offsetHeight>l.value.offsetHeight:g.value.offsetWidth>l.value.offsetWidth:!1,k=r=>{(!l.value||!g.value||r<0)&&(r=0),y.value=Math.min(r,z.value)},E=()=>{if(!p.value||!l.value||!$.value)return;De(l.value,i.value);const r=i.value==="horizontal",v=r?"offsetLeft":"offsetTop",B=r?"offsetWidth":"offsetHeight",m=p.value[v],P=p.value[B],O=l.value[B],me=window.getComputedStyle(p.value),he=r?o.value==="end"?"marginRight":"marginLeft":o.value==="end"?"marginBottom":"marginTop",H=parseFloat(me[he])||0;o.value==="auto"?m<y.value?k(m-H):m+P>y.value+O&&k(m+P-O+H):o.value==="center"?k(m+(P-O+H)/2):o.value==="start"?k(m-H):o.value==="end"?k(m+P-O+H):ke(o.value)&&k(m-o.value)},N=r=>{if(!$.value)return;r.preventDefault();const{deltaX:v,deltaY:B}=r;Math.abs(v)>Math.abs(B)?k(y.value+v):k(y.value+B)},U=(r,v)=>{a("click",r,v)},n=(r,v)=>{a("delete",r,v)},b=r=>{const v=r==="previous"?y.value-R.value:y.value+R.value;k(v)},D=()=>{T(),_.value&&_.value.$forceUpdate()};X(d,()=>{Q(()=>{T()})}),X([h,o],()=>{setTimeout(()=>{E()},0)}),ce(()=>{T()});const ee=()=>!x.value||!e.showAddButton?null:u("div",{class:`${s}-add-btn`,onClick:r=>a("add",r)},[u(J,null,{default:()=>[u(_e,null,null)]})]),ve=f(()=>[s,`${s}-${e.direction}`,`${s}-${e.position}`,`${s}-size-${e.size}`,`${s}-type-${e.type}`]),fe=f(()=>[`${s}-tab-list`,{[`${s}-tab-list-no-padding`]:!e.headerPadding&&["line","text"].includes(e.type)&&e.direction==="horizontal"}]),ye=f(()=>Ne({direction:e.direction,type:e.type,offset:y.value})),be=f(()=>[`${s}-tab`,{[`${s}-tab-scroll`]:$.value}]);return()=>{var r;return u("div",{class:ve.value},[$.value&&u(le,{type:"previous",direction:e.direction,disabled:y.value<=0,onClick:b},null),u(ae,{onResize:()=>T()},{default:()=>[u("div",{class:be.value,ref:l,onWheel:N},[u(ae,{onResize:D},{default:()=>[u("div",{ref:g,class:fe.value,style:ye.value},[e.tabs.map((v,B)=>u(qe,{key:v.key,ref:m=>{m!=null&&m.$el&&(S.value[v.key]=m.$el)},active:v.key===c.value,tab:v,editable:e.editable,onClick:U,onDelete:n},{default:()=>{var m,P,O;return[(O=(P=(m=v.slots).title)==null?void 0:P.call(m))!=null?O:v.title]}})),e.type==="line"&&p.value&&u(Fe,{ref:_,activeTabRef:p.value,direction:e.direction,disabled:!1,animation:e.animation},null)])]}),!$.value&&ee()])]}),$.value&&u(le,{type:"next",direction:e.direction,disabled:y.value>=z.value,onClick:b},null),u("div",{class:`${s}-extra`},[$.value&&ee(),(r=t.extra)==null?void 0:r.call(t)])])}}}),V=K({name:"Tabs",props:{activeKey:{type:[String,Number],default:void 0},defaultActiveKey:{type:[String,Number],default:void 0},position:{type:String,default:"top"},size:{type:String},type:{type:String,default:"line"},direction:{type:String,default:"horizontal"},editable:{type:Boolean,default:!1},showAddButton:{type:Boolean,default:!1},destroyOnHide:{type:Boolean,default:!1},lazyLoad:{type:Boolean,default:!1},justify:{type:Boolean,default:!1},animation:{type:Boolean,default:!1},headerPadding:{type:Boolean,default:!0},autoSwitch:{type:Boolean,default:!1},hideContent:{type:Boolean,default:!1},trigger:{type:String,default:"click"},scrollPosition:{type:[String,Number],default:"auto"}},emits:{"update:activeKey":e=>!0,change:e=>!0,tabClick:(e,a)=>!0,add:e=>!0,delete:(e,a)=>!0},setup(e,{emit:a,slots:t}){const{size:d,lazyLoad:c,destroyOnHide:h,trigger:i}=W(e),o=I("tabs"),{mergedSize:s}=Se(d),l=f(()=>e.direction==="vertical"?"left":e.position),g=f(()=>["left","right"].includes(l.value)?"vertical":"horizontal"),{children:S,components:p}=Le("TabPane"),_=Y(new Map),x=f(()=>{const n=[];return p.value.forEach(b=>{const D=_.get(b);D&&n.push(D)}),n}),$=f(()=>x.value.map(n=>n.key)),R=(n,b)=>{_.set(n,b)},z=n=>{_.delete(n)},y=C(e.defaultActiveKey),w=f(()=>{var n;const b=(n=e.activeKey)!=null?n:y.value;return oe(b)?$.value[0]:b}),L=f(()=>{const n=$.value.indexOf(w.value);return n===-1?0:n});Re(Z,Y({lazyLoad:c,destroyOnHide:h,activeKey:w,addItem:R,removeItem:z,trigger:i}));const T=n=>{n!==w.value&&(y.value=n,a("update:activeKey",n),a("change",n))},q=(n,b)=>{T(n),a("tabClick",n,b)},k=n=>{a("add",n),e.autoSwitch&&Q(()=>{const b=$.value[$.value.length-1];T(b)})},E=(n,b)=>{a("delete",n,b)},N=()=>u("div",{class:[`${o}-content`,{[`${o}-content-hide`]:e.hideContent}]},[u("div",{class:[`${o}-content-list`,{[`${o}-content-animation`]:e.animation}],style:{marginLeft:`-${L.value*100}%`}},[S.value])]),U=f(()=>[o,`${o}-${g.value}`,`${o}-${l.value}`,`${o}-type-${e.type}`,`${o}-size-${s.value}`,{[`${o}-justify`]:e.justify}]);return()=>{var n;return S.value=(n=t.default)==null?void 0:n.call(t),u("div",{class:U.value},[l.value==="bottom"&&N(),u(Xe,{tabs:x.value,activeKey:w.value,activeIndex:L.value,direction:g.value,position:l.value,editable:e.editable,animation:e.animation,showAddButton:e.showAddButton,headerPadding:e.headerPadding,scrollPosition:e.scrollPosition,size:s.value,type:e.type,onClick:q,onAdd:k,onDelete:E},{extra:t.extra}),l.value!=="bottom"&&N()])}}}),Ye=Object.defineProperty,ne=Object.getOwnPropertySymbols,Ge=Object.prototype.hasOwnProperty,Je=Object.prototype.propertyIsEnumerable,ie=(e,a,t)=>a in e?Ye(e,a,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[a]=t,Qe=(e,a)=>{for(var t in a||(a={}))Ge.call(a,t)&&ie(e,t,a[t]);if(ne)for(var t of ne(a))Je.call(a,t)&&ie(e,t,a[t]);return e};const Ze=K({name:"TabPane",props:{title:String,disabled:{type:Boolean,default:!1},closable:{type:Boolean,default:!0},destroyOnHide:{type:Boolean,default:!1}},setup(e,{slots:a}){var t;const{title:d,disabled:c,closable:h}=W(e),i=He(),o=I("tabs"),s=ue(Z,{}),l=C(),g=f(()=>i==null?void 0:i.vnode.key),S=f(()=>g.value===s.activeKey),p=C(s.lazyLoad?S.value:!0),_=Y({key:g,title:d,disabled:c,closable:h,slots:a});return i!=null&&i.uid&&((t=s.addItem)==null||t.call(s,i.uid,_)),je(()=>{var x;i!=null&&i.uid&&((x=s.removeItem)==null||x.call(s,i.uid))}),X(S,x=>{x?p.value||(p.value=!0):(e.destroyOnHide||s.destroyOnHide)&&(p.value=!1)}),de(()=>{_.slots=Qe({},a)}),{prefixCls:o,active:S,itemRef:l,mounted:p}}});function et(e,a,t,d,c,h){return j(),M("div",{ref:"itemRef",class:A([`${e.prefixCls}-content-item`,{[`${e.prefixCls}-content-item-active`]:e.active}])},[e.mounted?(j(),M("div",{key:0,class:A(`${e.prefixCls}-pane`)},[re(e.$slots,"default")],2)):se("v-if",!0)],2)}var F=G(Ze,[["render",et]]);const ot=Object.assign(V,{TabPane:F,install:(e,a)=>{xe(e,a);const t=Be(a);e.component(t+V.name,V),e.component(t+F.name,F)}});export{ot as T,F as a};
|