| 1 |
- import{_ as Y,R as ge,S as J,a as I,I as $e,aw as pe,ax as Ce,G as oe,i as ke,a8 as _e,aj as Se,s as Be,c as xe}from"./index-BNM7SxA1.js";import{d as K,l as te,c as M,o as j,a as ze,p as Te,m as se,k as re,b as A,y as Pe,B as u,E as we,A as Oe,i as ue,e as f,aa as Ie,n as Ke,q as W,f as C,u as ce,I as Q,ae as de,w as G,r as X,s as Re,g as He,v as je}from"./vue-vendor-DFp1TAzT.js";import{I as Ae}from"./index-B1R-cSoC.js";import{R as ae}from"./resize-observer-MNhnITvS.js";import{u as Ne}from"./index-2syoWuWi.js";const Le=({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",Oe({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:we(e.handleDelete,["stop"])},{default:Pe(()=>[u(i)]),_:1},8,["class","onClick"])):se("v-if",!0)],16)}var qe=Y(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=Y(Ue,[["render",Ve]]),Ge=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(),B=f(()=>e.editable&&["line","card","card-gutter"].includes(e.type)),$=C(!1),R=C(0),z=C(0),y=C(0),O=()=>{var r,v,x;return(x=i.value==="vertical"?(r=l.value)==null?void 0:r.offsetHeight:(v=l.value)==null?void 0:v.offsetWidth)!=null?x:0},N=()=>!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=O(),z.value=N(),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",x=r?"offsetWidth":"offsetHeight",m=p.value[v],P=p.value[x],w=l.value[x],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+w&&k(m+P-w+H):o.value==="center"?k(m+(P-w+H)/2):o.value==="start"?k(m-H):o.value==="end"?k(m+P-w+H):ke(o.value)&&k(m-o.value)},L=r=>{if(!$.value)return;r.preventDefault();const{deltaX:v,deltaY:x}=r;Math.abs(v)>Math.abs(x)?k(y.value+v):k(y.value+x)},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()};G(d,()=>{Q(()=>{T()})}),G([h,o],()=>{setTimeout(()=>{E()},0)}),ce(()=>{T()});const ee=()=>!B.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(()=>Le({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:L},[u(ae,{onResize:D},{default:()=>[u("div",{ref:g,class:fe.value,style:ye.value},[e.tabs.map((v,x)=>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,w;return[(w=(P=(m=v.slots).title)==null?void 0:P.call(m))!=null?w: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}=Ne("TabPane"),_=X(new Map),B=f(()=>{const n=[];return p.value.forEach(b=>{const D=_.get(b);D&&n.push(D)}),n}),$=f(()=>B.value.map(n=>n.key)),R=(n,b)=>{_.set(n,b)},z=n=>{_.delete(n)},y=C(e.defaultActiveKey),O=f(()=>{var n;const b=(n=e.activeKey)!=null?n:y.value;return oe(b)?$.value[0]:b}),N=f(()=>{const n=$.value.indexOf(O.value);return n===-1?0:n});Re(Z,X({lazyLoad:c,destroyOnHide:h,activeKey:O,addItem:R,removeItem:z,trigger:i}));const T=n=>{n!==O.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)},L=()=>u("div",{class:[`${o}-content`,{[`${o}-content-hide`]:e.hideContent}]},[u("div",{class:[`${o}-content-list`,{[`${o}-content-animation`]:e.animation}],style:{marginLeft:`-${N.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"&&L(),u(Ge,{tabs:B.value,activeKey:O.value,activeIndex:N.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"&&L()])}}}),Xe=Object.defineProperty,ne=Object.getOwnPropertySymbols,Ye=Object.prototype.hasOwnProperty,Je=Object.prototype.propertyIsEnumerable,ie=(e,a,t)=>a in e?Xe(e,a,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[a]=t,Qe=(e,a)=>{for(var t in a||(a={}))Ye.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),_=X({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 B;i!=null&&i.uid&&((B=s.removeItem)==null||B.call(s,i.uid))}),G(S,B=>{B?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=Y(Ze,[["render",et]]);const ot=Object.assign(V,{TabPane:F,install:(e,a)=>{Be(e,a);const t=xe(a);e.component(t+V.name,V),e.component(t+F.name,F)}});export{ot as T,F as a};
|
