UNPKG

vue3-tabor

Version:

Vue 3 routing tabs with keepAlive support, browser-like tab navigation for Vue applications

3 lines (2 loc) 21.6 kB
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).Vue3Tabor={},e.Vue)}(this,(function(e,t){"use strict";var o=document.createElement("style");o.textContent=':root{--primary-color: #5a67d8;--tab-label-min-width: 30px;--tab-label-max-width: 100px;--tab-min-width: 83px;--tab-height: 40px;--tab-padding: 0 12px;--tabs-gap: 6px;--page-padding: 10px;--font-size-base: 14px;--tab-background-color: rgba(248, 249, 250, .5);--tab-active-background-color: #fff;--tab-active-color: var(--primary-color);--tab-text-color: #64748b;--tab-border-color: #e2e8f0;--tab-border-radius: 4px;--tab-box-shadow: 0 1px 2px rgba(0, 0, 0, .03);--tab-active-box-shadow: 0 1px 3px rgba(0, 0, 0, .05)}.tabor-pages{padding:var(--page-padding)}.tabor-tabs{box-sizing:border-box;display:flex;align-items:center;height:var(--tab-height);border-bottom:1px solid var(--tab-border-color);font-size:var(--font-size-base);padding-left:4px;background:var(--tab-active-background-color);position:relative}.tabor-tabs--line{border-color:var(--tab-border-color);padding:0 12px;border-bottom:1px solid var(--tab-border-color)}.tabor-tabs--card{gap:var(--tabs-gap);padding-bottom:0}.tabor-tab{display:flex;align-items:center;justify-content:center;box-sizing:border-box;height:inherit;padding:var(--tab-padding);cursor:pointer;border-style:solid;border-color:var(--tab-border-color);border-width:0;margin-bottom:-1px;background:var(--tab-background-color);transition:all .25s ease;font-weight:400;position:relative;min-width:var(--tab-min-width)}.tabor-tab.tabor-tab-active{background:var(--tab-active-background-color);color:var(--primary-color);font-weight:500}.tabor-tab .remove-icon{opacity:0;transition:opacity .2s ease;margin-left:5px;font-size:12px}.tabor-tab:hover .remove-icon{opacity:.7}.tabor-tab.rt-tab-active .remove-icon{opacity:.9}.tabor-tab:hover .remove-icon:hover{opacity:1}.tabor-tab .tabor-tab--prefix{margin-right:6px;display:flex;align-items:center}.tabor-tab--line{border-width:0;border-radius:0;margin:0 16px 0 0;background:transparent;position:relative;padding-bottom:0}.tabor-tab--line:after{content:"";position:absolute;bottom:0;left:50%;right:50%;height:2px;background-color:var(--primary-color);transition:all .25s ease;opacity:0}.tabor-tab--line.tabor-tab-active{background:transparent;border-bottom:none}.tabor-tab--line.tabor-tab-active:after{left:0;right:0;opacity:1}.tabor-tab--line:hover:not(.rt-tab-active){color:var(--primary-color);background:transparent}.tabor-tab--line:hover:not(.rt-tab-active):after{left:0;right:0;opacity:.5}.tabor-tab--card{border-width:1px;border-bottom-width:0;border-radius:var(--tab-border-radius) var(--tab-border-radius) 0 0;box-shadow:var(--tab-box-shadow);overflow:hidden}.tabor-tab--card.tabor-tab-active{border-bottom-color:var(--tab-active-background-color);box-shadow:var(--tab-active-box-shadow)}.tabor-tab--card.tabor-tab-active:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background-color:var(--primary-color)}.tabor-tab--card:hover:not(.tabor-tab-active){background:#f0f2f5cc}.tabor-dropdown-menu[data-v-54f47c12]{position:fixed;background-color:var(--tab-active-background-color, white);border:1px solid var(--tab-border-color, #e2e8f0);border-radius:4px;box-shadow:0 2px 10px #0000001a;z-index:9999;min-width:100px;padding:4px 0;font-size:13px;overflow:visible;animation:fadeIn-54f47c12 .15s ease-out}.tabor-dropdown-menu ul[data-v-54f47c12]{list-style:none;margin:0;padding:0}.tabor-dropdown-menu li[data-v-54f47c12]{padding:6px 12px;cursor:pointer;display:flex;align-items:center;color:var(--tab-text-color, #64748b);transition:all .15s ease;min-height:20px;line-height:1.4;border-radius:3px;margin:0 3px}.tabor-dropdown-menu li.tabor-dropdown-item-disabled[data-v-54f47c12]{opacity:.5;cursor:not-allowed;pointer-events:none}.tabor-dropdown-menu li[data-v-54f47c12]:not(.tabor-dropdown-item-disabled):hover{background-color:#5a67d814;color:var(--primary-color)}.tabor-dropdown-icon[data-v-54f47c12]{margin-right:6px;font-size:12px;display:inline-flex;align-items:center;justify-content:center;width:12px}.tabor-dropdown-divider[data-v-54f47c12]{height:1px;margin:3px 6px;overflow:hidden;background-color:var(--tab-border-color, #e2e8f0);padding:0!important;pointer-events:none;min-height:auto!important}.tabor-dropdown-divider[data-v-54f47c12]:hover{background-color:var(--tab-border-color, #e2e8f0)!important}@keyframes fadeIn-54f47c12{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.tabor-remove-icon{display:flex;align-items:center;margin-left:.5em}.tabor-tab-label{display:flex;align-items:center;justify-content:center;min-width:var(--tab-label-min-width);max-width:var(--tab-label-max-width)}.tabor-tab-label span{align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n/*$vite$:1*/',document.head.appendChild(o);class a{constructor(e,t){this.vnode=e,this.lastAccessed=t}}const r=e=>{const{max:o=10}=e,r=t.reactive({keySet:new Set,keyToWrapper:new Map,componentMap:new WeakMap,refreshing:!1,activeKey:void 0}),n=t.computed((()=>Array.from(r.keySet))),i=e=>{r.keySet.add(e)},l=e=>{e&&(r.keySet.delete(e),r.keyToWrapper.delete(e))};return{state:r,keys:n,setActiveKey:e=>{if(r.activeKey=e,e){const t=r.keyToWrapper.get(e);t&&(t.lastAccessed=Date.now())}},add:i,has:e=>r.keySet.has(e),hasComponent:e=>{const t=r.keyToWrapper.get(e);return Boolean(t&&r.componentMap.has(t))},getComponent:e=>{const t=r.keyToWrapper.get(e);return t?r.componentMap.get(t):void 0},addComponent:(e,n)=>{i(e),r.keySet.size>o&&(()=>{if(0===r.keyToWrapper.size)return;const e=Array.from(r.keyToWrapper.entries());if(0===e.length)return;const t=e.reduce(((e,t)=>e[1].lastAccessed<t[1].lastAccessed?e:t),e[0]),o=null==t?void 0:t[0];o&&l(o)})();const s=new a(t.markRaw(n),Date.now());r.keyToWrapper.set(e,s),r.componentMap.set(s,n)},remove:l,reset:()=>{r.keySet.clear(),r.keyToWrapper.clear()},refresh:async e=>{if(!e)return;const o=r.keyToWrapper.get(e),n=o?r.componentMap.get(o):void 0;if(!o||!n)return;r.keyToWrapper.delete(e);const i=r.activeKey===e;i&&(r.refreshing=!0,r.keySet.delete(e)),await t.nextTick();const l=new a(t.markRaw(n),Date.now());r.keyToWrapper.set(e,l),r.componentMap.set(l,n),i&&(r.refreshing=!1,r.keySet.add(e))},cleanup:()=>{if(r.keySet.size<=o)return;const e=Array.from(r.keyToWrapper.entries()).sort((([,e],[,t])=>e.lastAccessed-t.lastAccessed)),t=e.slice(0,e.length-o);for(const[o]of t)l(o)}}},n=e=>t=>Object.prototype.toString.call(t)===`[object ${e}]`,i=e=>n("String")(e),l=e=>{console.error(`[vue3-tabor]: ${e}`)};const s={key:"fullPath",keepAlive:!0,hideClose:!1},d="line",c=(e,t)=>{const o=e??s.key,a=(r=o,n("Function")(r)?o(t):t[o]);var r;return(e=>i(e)&&""!==e)(a)?a:l("tabKey is not 'path','fullPath' or a function, or the return value of the function is not a non-empty string")},u=e=>{const{key:t=s.key,name:o,keepAlive:a=s.keepAlive,iframeAttributes:r,hideClose:n=s.hideClose}=e.meta.tabConfig??s;if(!t)return l("tabKey is required");const i=c(t,e);if(!i)return l(`TabId is not found, please check the tab key: ${t}`);const d={name:o??e.name??e.path,id:i,keepAlive:a??s.keepAlive,fullPath:e.fullPath,hideClose:n??!1};return r&&(d.iframeAttributes=r),e.meta.routeName&&(d.routeName=e.meta.routeName),d},p=Symbol("tabor-store"),b="tabor-iframe-route",v=(e,o={})=>{const{maxCache:a=10}=o,n=t.reactive({tabs:[],activeTab:void 0,shouldClose:!0}),d=t.computed((()=>n.activeTab)),p=t.computed((()=>{var e;return null==(e=n.activeTab)?void 0:e.id})),v=t.computed((()=>n.tabs.filter((e=>e.iframeAttributes)))),f=r({max:a}),h=e=>{const t=n.tabs.findIndex((({id:t})=>t===e));return t<0&&l(`Tab not found, please check the tab id: ${e}`),t},g=e=>n.tabs.some((({id:t})=>t===e)),y=e=>n.tabs.find((({id:t})=>t===e)),k=e=>n.tabs.find((t=>t.fullPath===e)),x=e=>(n.activeTab=e,e&&f.setActiveKey(e.id),e),C=(e,t)=>{const o=n.tabs.push(e);return f.add(e.id),(null==t?void 0:t.setActive)&&x(e),o},w=e=>e<0?l(`Index is less than 0, please check the index: ${e}`):n.tabs.splice(e,1)[0],T=t=>{const o=h(t);if(o<0)return;const a=w(o);return f.remove(t),(null==a?void 0:a.iframeAttributes)&&a.routeName&&e.removeRoute(a.routeName),a?{...a,index:o}:void 0},A=t=>e.push(t),S=t=>e.replace(t),P=e=>{if(!e)return;if(!y(e))return l(`Tab not found, please check the tab id: ${e}`);f.refresh(e)},N=t=>e.resolve(t).matched.length>0;let O=!1;e.beforeEach(((t,o,a)=>{if(!O){(()=>{try{const t=localStorage.getItem(b);if(!t)return;const o=JSON.parse(t);N({path:o.path})||e.addRoute({path:o.path,name:o.name,meta:o.meta,component:m})}catch(t){console.error("[vue3-tabor]: Failed to restore iframe route from localStorage:",t)}})(),O=!0;const o=localStorage.getItem(b);if(o)try{const e=JSON.parse(o);if(t.path===e.path)return void a({path:t.fullPath,replace:!0})}catch(r){console.error("[vue3-tabor]: Error parsing stored route:",r)}}a()}));const V=async(t,o={replace:!1,refresh:!1})=>{const{replace:a,tabConfig:r}=o;if(!N(t)&&(null==r?void 0:r.iframeAttributes)){const o="string"==typeof t?t:t.path;if(!o)return l(`Path not found, please check the path: ${t}`);const a=`rt-iframe-${o.replace(/\//g,"-")}`,n={path:o,name:a,meta:{tabConfig:r,routeName:a},component:m};e.addRoute(n),(e=>{try{localStorage.setItem(b,JSON.stringify(e))}catch(t){console.error("[vue3-tabor]: Failed to save iframe route to localStorage:",t)}})({path:o,name:a,meta:{tabConfig:r,routeName:a}})}if(a)return S(t);const n=await A(t);if(o.refresh&&n){const e=j(n.to);e&&P(e)}return n},B=async e=>{const{index:t}=e,o=n.tabs[t]??n.tabs[t-1]??void 0;o&&await V(o.fullPath)},j=e=>{var t,o;const a=(null==(o=null==(t=e.meta)?void 0:t.tabConfig)?void 0:o.key)??s.key;return c(a,e)},$=e=>{const t=(e=>{var t;let o;const a="string"==typeof e?{fullPath:e}:e;return"id"in a&&(o=a.id),"fullPath"in a&&(o=a.fullPath?null==(t=k(a.fullPath))?void 0:t.id:void 0),o||l(`Tab not found, please check the param: ${e}`)})(e);if(t)return 1===n.tabs.length&&n.tabs[0].id===t?l(`The last tab cannot be closed:${e}`):T(t)},z=(q=()=>{n.tabs=[]},I=()=>{f.reset()},function(...e){const t=q.apply(this,e);return I.apply(this,e),t});var q,I;const E=e=>{var t,o;if(!e&&!(null==(t=n.activeTab)?void 0:t.id))return;const a=i(e)?{fullPath:e}:e;return a||{id:null==(o=n.activeTab)?void 0:o.id}};return e.afterEach((e=>{const t=j(e);if(!t||!g(t)){const t=u(e);return void(t&&C(t,{setActive:!0}))}const o=y(t);if(!o)return l(`Tab not found, please check the tab id: ${t}`);const a=e.fullPath===o.fullPath,r=a?o:((e,t)=>{const o=h(e);return o<0?l(`Tab not found, please check the tab id: ${e}`):(n.tabs[o]=t,t)})(t,{...o,fullPath:e.fullPath})??o;x(r),a||P(t)})),{$router:e,state:n,createTab:u,indexOf:h,find:y,getTabByFullpath:k,getTabIdByRoute:j,setActive:x,addTab:C,removeTabByIndex:w,removeTabById:T,routerPush:A,routerReplace:S,openTabById:e=>{const t=y(e);return t?A(t.fullPath):l(`Tab not found, please check the tab id: ${e}`)},openNearTab:B,remove:$,refresh:P,clear:z,getRemoveItem:E,setShouldClose:e=>{n.shouldClose=e},currentTab:d,currentTabId:p,open:V,close:async(e,t)=>{var o,a,r;if(!n.shouldClose)return;const i=E(e);if(!i)return;const s=i.id?i.id===(null==(o=n.activeTab)?void 0:o.id):i.fullPath===(null==(a=n.activeTab)?void 0:a.fullPath);s&&x(void 0);const d=$(i);if(d&&s&&await B(d),t&&(t.id||t.fullPath)){const{id:o,fullPath:a}=t;if(o===e)return l("The id of the tab to be closed cannot be the same as the id of the tab to be opened,if you want to open the tab, please use the fullPath parameter.");const n=o?null==(r=y(o))?void 0:r.fullPath:a;return n?(await A(n),d):l(`The fullPath of the tab to be opened is not found, please check ${o||a}.`)}return d},closeOthers:e=>{var t,o;if(!e&&!(null==(t=n.activeTab)?void 0:t.id))return;const a=e??(null==(o=n.activeTab)?void 0:o.id);if(!g(a))return;for(const i of[...n.tabs])if(i.id!==a){const e=y(i.id);if(e){("function"==typeof e.hideClose?e.hideClose(e):e.hideClose)||T(i.id)}}if(!a)return;const r=y(a);r&&x(r)},has:g,retrieveOrCacheComponent:e=>{var t,o;const a=p.value;if(!e||!a)return e;if(f.hasComponent(a))return f.getComponent(a);if(!(null==(t=d.value)?void 0:t.iframeAttributes)){if(null==(o=d.value)?void 0:o.keepAlive){const t=(r=e,n=a,{...r,type:{...r.type,name:n}});return f.addComponent(a,t),f.add(a),f.getComponent(a)}var r,n;return e}},cache:f,iframeTabs:v}},f=t.defineComponent({name:"Iframe",setup(){const e=t.inject(p),o=t.computed((()=>null==e?void 0:e.iframeTabs.value));return()=>{var a;return t.createVNode("div",{class:"tabor-iframe-container"},[null==(a=o.value)?void 0:a.map((o=>{var a;const r=null==(a=null==e?void 0:e.state.activeTab)?void 0:a.id,n=o.id===r||o.keepAlive,i=o.id===r;return n?t.withDirectives(t.createVNode("iframe",t.mergeProps({key:o.id,width:"100%",height:"100%"},o.iframeAttributes),null),[[t.vShow,i]]):null}))])}}}),h=(e,t)=>{const o=e.__vccOpts||e;for(const[a,r]of t)o[a]=r;return o};const m=h(t.defineComponent({name:"RtPages",components:{Iframe:f},setup(){const e=t.inject(p),o=t.inject("pageClass");t.onMounted((()=>{e||console.error("[vue3-tabor]: taborStore not provided. Did you install the plugin correctly?")}));const a=t.computed((()=>null==e?void 0:e.state.activeTab)),r=t.computed((()=>{var e;return null==(e=a.value)?void 0:e.id})),n=t.computed((()=>null==e?void 0:e.cache.state.refreshing)),i=t.computed((()=>{var t;const o=null==e?void 0:e.cache.keys.value;return(null==(t=a.value)?void 0:t.keepAlive)?o:null==o?void 0:o.filter((e=>e!==r.value))}));return{activeTabKey:r,cachedKeys:i,refreshing:n,pageClass:o,retrieveOrCacheComponent:null==e?void 0:e.retrieveOrCacheComponent}}}),[["render",function(e,o,a,r,n,i){const l=t.resolveComponent("router-view"),s=t.resolveComponent("Iframe");return t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["tabor-pages",e.pageClass])},[t.createVNode(l,null,{default:t.withCtx((({Component:o})=>{var a;return[(t.openBlock(),t.createBlock(t.KeepAlive,{include:e.cachedKeys},[e.refreshing?t.createCommentVNode("",!0):(t.openBlock(),t.createBlock(t.resolveDynamicComponent(null==(a=e.retrieveOrCacheComponent)?void 0:a.call(e,o)),{key:e.activeTabKey}))],1032,["include"]))]})),_:1}),t.createVNode(s)],2)}]]),g={zh:{refresh:"刷新",close:"关闭",closeOthers:"关闭其他"},en:{refresh:"Refresh",close:"Close",closeOthers:"Close Others"}};let y="zh";function k(e){y=e}function x(e){return g[y][e]}const C=t.defineComponent({name:"DropdownMenu",props:{visible:{type:Boolean,required:!0},position:{type:Object,required:!0},disabledActions:{type:Array,default:()=>[]},hideActions:{type:Array,default:()=>[]},language:{type:String,default:"zh"}},emits:["action"],setup(e,{emit:t}){e.language&&e.language!==y&&k(e.language);return{translations:{refresh:x("refresh"),close:x("close"),closeOthers:x("closeOthers")},handleAction:o=>{e.disabledActions.includes(o)||t("action",o)},handleRightClick:e=>{e.preventDefault(),e.stopPropagation()},hideActions:e.hideActions}}}),w={key:1,class:"tabor-dropdown-divider"};const T=h(C,[["render",function(e,o,a,r,n,i){return e.visible?(t.openBlock(),t.createElementBlock("div",{key:0,class:"tabor-dropdown-menu",style:t.normalizeStyle({top:e.position.y+"px",left:e.position.x+"px"}),onContextmenu:o[3]||(o[3]=(...t)=>e.handleRightClick&&e.handleRightClick(...t))},[t.createElementVNode("ul",null,[t.createElementVNode("li",{onClick:o[0]||(o[0]=t=>e.handleAction("refresh"))},[t.createElementVNode("span",null,t.toDisplayString(e.translations.refresh),1)]),e.hideActions.includes("close")?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("li",{key:0,onClick:o[1]||(o[1]=t=>!e.disabledActions.includes("close")&&e.handleAction("close")),class:t.normalizeClass({"tabor-dropdown-item-disabled":e.disabledActions.includes("close")})},[t.createElementVNode("span",null,t.toDisplayString(e.translations.close),1)],2)),e.hideActions.includes("closeOthers")?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("li",w)),e.hideActions.includes("closeOthers")?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("li",{key:2,onClick:o[2]||(o[2]=t=>!e.disabledActions.includes("closeOthers")&&e.handleAction("closeOthers")),class:t.normalizeClass({"tabor-dropdown-item-disabled":e.disabledActions.includes("closeOthers")})},[t.createElementVNode("span",null,t.toDisplayString(e.translations.closeOthers),1)],2))])],36)):t.createCommentVNode("",!0)}],["__scopeId","data-v-54f47c12"]]),A=t.defineComponent({name:"ElementClose",props:{style:{type:Object,required:!1}},setup:e=>()=>t.createVNode("div",{style:{width:"1em",height:"1em",...e.style}},[t.createVNode("svg",{viewBox:"0 0 24 24"},[t.createVNode("path",{fill:"currentColor",d:"m12 13.4l-4.9 4.9q-.275.275-.7.275t-.7-.275q-.275-.275-.275-.7t.275-.7l4.9-4.9l-4.9-4.9q-.275-.275-.275-.7t.275-.7q.275-.275.7-.275t.7.275l4.9 4.9l4.9-4.9q.275-.275.7-.275t.7.275q.275.275.275.7t-.275.7L13.4 12l4.9 4.9q.275.275.275.7t-.275.7q-.275.275-.7.275t-.7-.275L12 13.4Z"},null)])])}),S=t.defineComponent({name:"TaborTabClose",props:{id:{type:String,required:!0}},setup(e){const o=t.inject(p),a=t=>{null==o||o.close({id:e.id}),t.stopPropagation()};return()=>t.createVNode("div",{class:"tabor-remove-icon",onClick:a},[t.createVNode(A,null,null)])}}),P=t.defineComponent({name:"TaborTabLabel",props:{name:{type:[String,Symbol],required:!1,default:void 0}},setup:e=>()=>t.createVNode("div",{class:"tabor-tab-label"},[t.createVNode("span",null,[e.name])])}),N={beforeMount(e,t){const o=o=>{const a=o.target;e===a||e.contains(a)||t.value(o)};e._clickOutsideHandler=o,document.addEventListener("click",o,!0)},unmounted(e){e._clickOutsideHandler&&document.removeEventListener("click",e._clickOutsideHandler,!0)}},O=t.ref(null),V=t.defineComponent({name:"TaborTab",directives:{clickOutside:N},props:{name:{type:[String,Symbol,Function],required:!0},id:{type:String,required:!0},hideClose:{type:Boolean,default:!1},fullPath:{type:String,required:!0},prefix:{type:[Object,Function]}},setup(e){const o=t.inject(p),a=t.inject("tabClass"),r=t.inject("tabType"),n=t.inject("language"),i=t.computed((()=>(null==o?void 0:o.state.tabs.length)??0)),l=t.computed((()=>{var t;return(null==(t=null==o?void 0:o.state.activeTab)?void 0:t.id)===e.id})),s=t.computed((()=>null==o?void 0:o.find(e.id))),d=t.computed((()=>{var t;return i.value>1&&!(null==(t=s.value)?void 0:t.hideClose)&&!e.hideClose})),c=t.computed((()=>{if("function"==typeof e.name){const t=null==o?void 0:o.$router.resolve(e.fullPath);return t?e.name(t):(console.warn(`Route not found for fullPath: ${e.fullPath}`),String(e.name))}return e.name})),u=t.ref(!1),b=t.ref({x:0,y:0});t.computed((()=>{O.value!==e.id&&(u.value=!1)}));const v=t.computed((()=>["tabor-tab",`tabor-tab--${r}`,l.value&&"tabor-tab-active"])),f=()=>{if(O.value=null,l.value)return;const t=null==o?void 0:o.find(e.id);t&&(null==o||o.open(t.fullPath))},h=()=>{u.value=!1,O.value=null},m=t=>{t.preventDefault(),t.stopPropagation();let o=t.clientX,a=t.clientY;o+120>window.innerWidth&&(o=window.innerWidth-120-5);a+110>window.innerHeight&&(a=window.innerHeight-110-5),b.value={x:o,y:a},u.value=!0,O.value=e.id},g=t=>{u.value=!1,O.value=null;if(null==o?void 0:o.find(e.id))switch(t){case"refresh":null==o||o.refresh(e.id);break;case"close":null==o||o.close(e.id);break;case"closeOthers":null==o||o.closeOthers(e.id)}},y=()=>{if(!e.prefix)return null;const a=null==o?void 0:o.find(e.id);return a?t.h(e.prefix,{tab:a}):null};return()=>{let o=null;if(u.value&&O.value===e.id){const a=[],r=[];i.value<=1&&a.push("close"),i.value<=1&&a.push("closeOthers"),e.hideClose&&(r.push("close"),r.push("closeOthers")),o=t.withDirectives(t.h(T,{visible:u.value,position:b.value,disabledActions:a,hideActions:r,language:n,onAction:g}),[[N,h]])}return t.createVNode("div",{class:[...v.value,a],onClick:f,onContextmenu:m},[e.prefix&&t.createVNode("div",{class:"tabor-tab--prefix"},[y()]),t.createVNode(P,{name:c.value},null),d.value&&t.createVNode(S,{id:e.id},null),o])}}}),B=t.defineComponent({name:"Tabs",props:{tabPrefix:{type:Object},hideClose:{type:Boolean,default:!1}},setup(e){const o=t.inject(p),a=t.inject("tabType"),r=t.computed((()=>(null==o?void 0:o.state.tabs)??[])),n=t.computed((()=>["tabor-tabs",`tabor-tabs--${a}`]));return()=>t.createVNode("div",{class:n.value},[r.value.map((o=>t.createVNode(V,t.mergeProps({prefix:e.tabPrefix},o,{key:o.id,hideClose:e.hideClose}),null)))])}}),j=t.defineComponent({name:"vue-tabor",components:{Tabs:B,Page:m},props:{maxAlive:{type:Number,required:!1,default:10},hideClose:{type:Boolean,required:!1,default:!1},tabClass:{type:String},pageClass:{type:String},dropdownClass:{type:String},tabType:{type:String,default:d},tabPrefix:{type:Object},language:{type:String,default:"zh"},showLanguageSwitch:{type:Boolean,default:!0}},setup:e=>(e.language&&k(e.language),t.provide("dropdownClass",e.dropdownClass),t.provide("tabClass",e.tabClass),t.provide("pageClass",e.pageClass),t.provide("tabType",e.tabType??d),t.provide("language",e.language??"zh"),()=>t.createVNode("div",{class:"rt-container"},[t.createVNode(B,{tabPrefix:e.tabPrefix,hideClose:e.hideClose},null),t.createVNode(m,null,null)]))}),$=(e,t)=>{const{router:o}=t,a=((e,t={})=>v(e,t))(o,t);e.provide(p,a),e.config.globalProperties.$taborStore=a},z={install(e,t){$(e,t),e.component("vue-tabor",j)}};e.Tabor=j,e.default=z,e.useTabor=()=>{const e=t.inject(p);return e||l("Tabor store not found"),e},Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})})); //# sourceMappingURL=index.umd.js.map