vue3-router-tab 1.1.0 → 1.1.1

package/dist/vue3-router-tab.js

@@ -1,115 +1,7 @@
 import './vue3-router-tab.css';
-import { defineComponent as te, inject as z, computed as P, unref as $e, provide as U, ref as B, watch as E, h as Ke, getCurrentInstance as ne, reactive as _e, shallowRef as Ie, nextTick as ae, onMounted as Q, onBeforeUnmount as Ve, resolveComponent as Oe, createElementBlock as A, openBlock as w, createElementVNode as $, createCommentVNode as K, renderSlot as ie, createVNode as D, TransitionGroup as Ne, mergeProps as q, withCtx as L, Fragment as se, renderList as le, withModifiers as j, normalizeClass as re, createTextVNode as De, toDisplayString as ce, Transition as ue, createBlock as W, KeepAlive as Le, resolveDynamicComponent as fe, normalizeStyle as je } from "vue";
-/*!
-  * vue-router v4.5.1
-  * (c) 2025 Eduardo San Martin Morote
-  * @license MIT
-  */
-const Me = typeof document < "u", Ue = Object.assign, ze = Array.isArray;
-function Be(e) {
-  const t = Array.from(arguments).slice(1);
-  console.warn.apply(console, ["[Vue Router warn]: " + e].concat(t));
-}
-function Ge(e, t) {
-  return (e.aliasOf || e) === (t.aliasOf || t);
-}
-var de;
-(function(e) {
-  e.pop = "pop", e.push = "push";
-})(de || (de = {}));
-var pe;
-(function(e) {
-  e.back = "back", e.forward = "forward", e.unknown = "";
-})(pe || (pe = {}));
-Symbol(process.env.NODE_ENV !== "production" ? "navigation failure" : "");
-var be;
-(function(e) {
-  e[e.aborted = 4] = "aborted", e[e.cancelled = 8] = "cancelled", e[e.duplicated = 16] = "duplicated";
-})(be || (be = {}));
-const Je = Symbol(process.env.NODE_ENV !== "production" ? "router view location matched" : ""), ve = Symbol(process.env.NODE_ENV !== "production" ? "router view depth" : "");
-Symbol(process.env.NODE_ENV !== "production" ? "router" : "");
-Symbol(process.env.NODE_ENV !== "production" ? "route location" : "");
-const me = Symbol(process.env.NODE_ENV !== "production" ? "router view location" : ""), He = /* @__PURE__ */ te({
-  name: "RouterView",
-  // #674 we manually inherit them
-  inheritAttrs: !1,
-  props: {
-    name: {
-      type: String,
-      default: "default"
-    },
-    route: Object
-  },
-  // Better compat for @vue/compat users
-  // https://github.com/vuejs/router/issues/1315
-  compatConfig: { MODE: 3 },
-  setup(e, { attrs: t, slots: o }) {
-    process.env.NODE_ENV !== "production" && qe();
-    const n = z(me), s = P(() => e.route || n.value), p = z(ve, 0), d = P(() => {
-      let b = $e(p);
-      const { matched: v } = s.value;
-      let m;
-      for (; (m = v[b]) && !m.components; )
-        b++;
-      return b;
-    }), l = P(() => s.value.matched[d.value]);
-    U(ve, P(() => d.value + 1)), U(Je, l), U(me, s);
-    const r = B();
-    return E(() => [r.value, l.value, e.name], ([b, v, m], [k, h, T]) => {
-      v && (v.instances[m] = b, h && h !== v && b && b === k && (v.leaveGuards.size || (v.leaveGuards = h.leaveGuards), v.updateGuards.size || (v.updateGuards = h.updateGuards))), b && v && // if there is no instance but to and from are the same this might be
-      // the first visit
-      (!h || !Ge(v, h) || !k) && (v.enterCallbacks[m] || []).forEach((_) => _(b));
-    }, { flush: "post" }), () => {
-      const b = s.value, v = e.name, m = l.value, k = m && m.components[v];
-      if (!k)
-        return he(o.default, { Component: k, route: b });
-      const h = m.props[v], T = h ? h === !0 ? b.params : typeof h == "function" ? h(b) : h : null, R = Ke(k, Ue({}, T, t, {
-        onVnodeUnmounted: (x) => {
-          x.component.isUnmounted && (m.instances[v] = null);
-        },
-        ref: r
-      }));
-      if (process.env.NODE_ENV !== "production" && Me && R.ref) {
-        const x = {
-          depth: d.value,
-          name: m.name,
-          path: m.path,
-          meta: m.meta
-        };
-        (ze(R.ref) ? R.ref.map((S) => S.i) : [R.ref.i]).forEach((S) => {
-          S.__vrv_devtools = x;
-        });
-      }
-      return (
-        // pass the vnode to the slot as a prop.
-        // h and <component :is="..."> both accept vnodes
-        he(o.default, { Component: R, route: b }) || R
-      );
-    };
-  }
-});
-function he(e, t) {
-  if (!e)
-    return null;
-  const o = e(t);
-  return o.length === 1 ? o[0] : o;
-}
-const Ye = He;
-function qe() {
-  const e = ne(), t = e.parent && e.parent.type.name, o = e.parent && e.parent.subTree && e.parent.subTree.type;
-  if (t && (t === "KeepAlive" || t.includes("Transition")) && typeof o == "object" && o.name === "RouterView") {
-    const n = t === "KeepAlive" ? "keep-alive" : "transition";
-    Be(`<router-view> can no longer be used directly inside <transition> or <keep-alive>.
-Use slot props instead:
-
-<router-view v-slot="{ Component }">
-  <${n}>
-    <component :is="Component" />
-  </${n}>
-</router-view>`);
-  }
-}
-function We(e = {}) {
+import { reactive as me, ref as Q, shallowRef as Ae, computed as K, watch as P, nextTick as ie, inject as oe, getCurrentInstance as ye, onMounted as Z, defineComponent as ge, provide as _e, onBeforeUnmount as Pe, resolveComponent as xe, createElementBlock as g, openBlock as m, createElementVNode as R, createCommentVNode as w, renderSlot as H, createVNode as E, TransitionGroup as $e, mergeProps as j, withCtx as z, Fragment as Y, renderList as ae, withModifiers as O, normalizeClass as le, createTextVNode as Ie, toDisplayString as se, normalizeProps as Ke, Transition as re, createBlock as q, KeepAlive as Se, resolveDynamicComponent as ce, normalizeStyle as Le } from "vue";
+import { RouterView as Me } from "vue-router";
+function Ee(e = {}) {
   return {
     initialTabs: e.initialTabs ?? [],
     keepAlive: e.keepAlive ?? !0,
@@ -119,79 +11,79 @@ function We(e = {}) {
     defaultRoute: e.defaultRoute ?? "/"
   };
 }
-function I(e, t) {
-  const o = e.resolve(t);
+function A(e, n) {
+  const o = e.resolve(n);
   if (!o || !o.matched.length)
-    throw new Error(`[RouterTabs] Unable to resolve route: ${String(t)}`);
+    throw new Error(`[RouterTabs] Unable to resolve route: ${String(n)}`);
   return o;
 }
-const Xe = {
+const je = {
   path: (e) => e.path,
   fullpath: (e) => e.fullPath,
   fullname: (e) => e.fullPath,
   full: (e) => e.fullPath,
   name: (e) => e.name ? String(e.name) : e.fullPath
 };
-function V(e) {
-  const t = e.meta?.key;
-  if (typeof t == "function") {
-    const o = t(e);
+function _(e) {
+  const n = e.meta?.key;
+  if (typeof n == "function") {
+    const o = n(e);
     if (typeof o == "string" && o.length) return o;
-  } else if (typeof t == "string" && t.length) {
-    const o = Xe[t.toLowerCase()];
-    return o ? o(e) : t;
+  } else if (typeof n == "string" && n.length) {
+    const o = je[n.toLowerCase()];
+    return o ? o(e) : n;
   }
   return e.fullPath;
 }
-function Z(e, t) {
+function ee(e, n) {
   const o = e.meta?.keepAlive;
-  return typeof o == "boolean" ? o : t;
+  return typeof o == "boolean" ? o : n;
 }
-function ee(e, t) {
+function te(e, n) {
   const o = e.meta?.reuse;
-  return typeof o == "boolean" ? o : t;
+  return typeof o == "boolean" ? o : n;
 }
-function Ae(e) {
-  const t = e.meta ?? {}, o = {};
-  return "title" in t && (o.title = t.title), "tips" in t && (o.tips = t.tips), "icon" in t && (o.icon = t.icon), "closable" in t && (o.closable = t.closable), "tabClass" in t && (o.tabClass = t.tabClass), "target" in t && (o.target = t.target), "href" in t && (o.href = t.href), o;
+function Te(e) {
+  const n = e.meta ?? {}, o = {};
+  return "title" in n && (o.title = n.title), "tips" in n && (o.tips = n.tips), "icon" in n && (o.icon = n.icon), "closable" in n && (o.closable = n.closable), "tabClass" in n && (o.tabClass = n.tabClass), "target" in n && (o.target = n.target), "href" in n && (o.href = n.href), o;
 }
-function M(e, t, o) {
-  const n = Ae(e);
+function V(e, n, o) {
+  const t = Te(e);
   return {
-    id: V(e),
+    id: _(e),
     to: e.fullPath,
     fullPath: e.fullPath,
     matched: e,
-    alive: Z(e, o),
-    reusable: ee(e, !1),
-    closable: n.closable ?? !0,
-    ...n,
-    ...t
+    alive: ee(e, o),
+    reusable: te(e, !1),
+    closable: t.closable ?? !0,
+    ...t,
+    ...n
   };
 }
-function X(e, t, o, n) {
-  if (!e.find((p) => p.id === t.id)) {
-    if (o === "next" && n) {
-      const p = e.findIndex((d) => d.id === n);
-      if (p > -1) {
-        e.splice(p + 1, 0, t);
+function W(e, n, o, t) {
+  if (!e.find((d) => d.id === n.id)) {
+    if (o === "next" && t) {
+      const d = e.findIndex((b) => b.id === t);
+      if (d > -1) {
+        e.splice(d + 1, 0, n);
         return;
       }
     }
-    e.push(t);
+    e.push(n);
   }
 }
-function ye(e, t, o) {
-  if (!t || t <= 0) return;
-  const n = e.filter((s) => s.alive);
-  for (; n.length > t; ) {
-    const s = n.shift();
-    if (!s || s.id === o) continue;
-    const p = e.findIndex((d) => d.id === s.id);
-    p > -1 && (e[p].alive = !1);
+function ue(e, n, o) {
+  if (!n || n <= 0) return;
+  const t = e.filter((r) => r.alive);
+  for (; t.length > n; ) {
+    const r = t.shift();
+    if (!r || r.id === o) continue;
+    const d = e.findIndex((b) => b.id === r.id);
+    d > -1 && (e[d].alive = !1);
   }
 }
-function Fe(e) {
+function ze(e) {
   return {
     to: e.to,
     title: e.title,
@@ -201,173 +93,173 @@ function Fe(e) {
     closable: e.closable
   };
 }
-function Qe(e) {
-  const t = {};
-  return "title" in e && (t.title = e.title), "tips" in e && (t.tips = e.tips), "icon" in e && (t.icon = e.icon), "tabClass" in e && (t.tabClass = e.tabClass), "closable" in e && (t.closable = e.closable), t;
+function Oe(e) {
+  const n = {};
+  return "title" in e && (n.title = e.title), "tips" in e && (n.tips = e.tips), "icon" in e && (n.icon = e.icon), "tabClass" in e && (n.tabClass = e.tabClass), "closable" in e && (n.closable = e.closable), n;
 }
-function Ze(e, t = {}) {
-  const o = We(t), n = _e([]), s = B(null), p = Ie(), d = B(null), l = P(() => n.filter((i) => i.alive).map((i) => i.id));
-  let r = !1;
-  function b(i) {
-    const c = typeof i.matched == "object" ? i : I(e, i);
+function Ve(e, n = {}) {
+  const o = Ee(n), t = me([]), r = Q(null), d = Ae(), b = Q(null), l = K(() => t.filter((a) => a.alive).map((a) => a.id));
+  let u = !1;
+  function T(a) {
+    const s = typeof a.matched == "object" ? a : A(e, a);
     return {
-      key: V(c),
-      fullPath: c.fullPath,
-      alive: Z(c, o.keepAlive),
-      reusable: ee(c, !1),
-      matched: c
+      key: _(s),
+      fullPath: s.fullPath,
+      alive: ee(s, o.keepAlive),
+      reusable: te(s, !1),
+      matched: s
     };
   }
-  function v(i) {
-    const c = V(i);
-    let u = n.find((y) => y.id === c);
-    return u ? (u.fullPath = i.fullPath, u.to = i.fullPath, u.matched = i, u.alive = Z(i, o.keepAlive), u.reusable = ee(i, u.reusable), Object.assign(u, Ae(i)), u) : (u = M(i, {}, o.keepAlive), X(n, u, o.appendPosition, s.value), ye(n, o.maxAlive, s.value), u);
+  function C(a) {
+    const s = _(a);
+    let c = t.find((p) => p.id === s);
+    return c ? (c.fullPath = a.fullPath, c.to = a.fullPath, c.matched = a, c.alive = ee(a, o.keepAlive), c.reusable = te(a, c.reusable), Object.assign(c, Te(a)), c) : (c = V(a, {}, o.keepAlive), W(t, c, o.appendPosition, r.value), ue(t, o.maxAlive, r.value), c);
   }
-  async function m(i, c = !1, u = !0) {
-    const y = I(e, i), a = V(y), f = s.value === a;
-    u === "sameTab" && (u = f), u && await _(a, !0), await e[c ? "replace" : "push"](y), f && await O();
+  async function S(a, s = !1, c = !0) {
+    const p = A(e, a), k = _(p), i = r.value === k;
+    c === "sameTab" && (c = i), c && await v(k, !0), await e[s ? "replace" : "push"](p), i && await $();
   }
-  function k(i) {
-    const c = n.findIndex((y) => y.id === i), u = n[c] || n[c - 1] || n[0];
-    return u ? u.to : o.defaultRoute;
+  function L(a) {
+    const s = t.findIndex((p) => p.id === a), c = t[s] || t[s - 1] || t[0];
+    return c ? c.to : o.defaultRoute;
   }
-  async function h(i = s.value, c = {}) {
-    if (i) {
-      if (!c.force && o.keepLastTab && n.length === 1)
+  async function x(a = r.value, s = {}) {
+    if (a) {
+      if (!s.force && o.keepLastTab && t.length === 1)
         throw new Error("[RouterTabs] Unable to close the final tab when keepLastTab is true.");
-      if (await T(i, { force: c.force }), c.redirect !== null)
-        if (s.value === i) {
-          const u = c.redirect ?? k(i);
-          u && await e.replace(u);
-        } else c.redirect && await e.replace(c.redirect);
+      if (await M(a, { force: s.force }), s.redirect !== null)
+        if (r.value === a) {
+          const c = s.redirect ?? L(a);
+          c && await e.replace(c);
+        } else s.redirect && await e.replace(s.redirect);
     }
   }
-  async function T(i, c = {}) {
-    const u = n.findIndex((y) => y.id === i);
-    u !== -1 && (n.splice(u, 1), d.value === i && (d.value = null), s.value === i && (s.value = null, p.value = void 0));
+  async function M(a, s = {}) {
+    const c = t.findIndex((p) => p.id === a);
+    c !== -1 && (t.splice(c, 1), b.value === a && (b.value = null), r.value === a && (r.value = null, d.value = void 0));
   }
-  async function _(i = s.value ?? void 0, c = !1) {
-    i && (d.value = i, await ae(), c || await ae(), d.value = null);
+  async function v(a = r.value ?? void 0, s = !1) {
+    a && (b.value = a, await ie(), s || await ie(), b.value = null);
   }
-  async function R(i = !1) {
-    for (const c of n)
-      await _(c.id, i);
+  async function N(a = !1) {
+    for (const s of t)
+      await v(s.id, a);
   }
-  async function x(i = o.defaultRoute) {
-    n.splice(0, n.length), s.value = null, p.value = void 0;
-    for (const c of o.initialTabs) {
-      const u = I(e, c.to), y = M(u, c, o.keepAlive);
-      n.push(y);
+  async function U(a = o.defaultRoute) {
+    t.splice(0, t.length), r.value = null, d.value = void 0;
+    for (const s of o.initialTabs) {
+      const c = A(e, s.to), p = V(c, s, o.keepAlive);
+      t.push(p);
     }
-    await e.replace(i);
+    await e.replace(a);
   }
-  async function O() {
-    const i = s.value;
-    i && await _(i, !0);
+  async function $() {
+    const a = r.value;
+    a && await v(a, !0);
   }
-  function S(i) {
-    return typeof i.matched == "object" ? V(i) : V(I(e, i));
+  function B(a) {
+    return typeof a.matched == "object" ? _(a) : _(A(e, a));
   }
-  function N() {
-    const i = n.find((c) => c.id === s.value);
+  function F() {
+    const a = t.find((s) => s.id === r.value);
     return {
-      tabs: n.map(Fe),
-      active: i ? i.to : null
+      tabs: t.map(ze),
+      active: a ? a.to : null
     };
   }
-  async function J(i) {
-    r = !0, n.splice(0, n.length), s.value = null, p.value = void 0;
-    const c = i?.tabs ?? [];
-    for (const y of c)
+  async function I(a) {
+    u = !0, t.splice(0, t.length), r.value = null, d.value = void 0;
+    const s = a?.tabs ?? [];
+    for (const p of s)
       try {
-        const a = I(e, y.to), f = Qe(y), g = M(a, f, o.keepAlive);
-        X(n, g, "last", null);
+        const k = A(e, p.to), i = Oe(p), f = V(k, i, o.keepAlive);
+        W(t, f, "last", null);
       } catch {
       }
-    r = !1;
-    const u = i?.active ?? c[c.length - 1]?.to ?? o.defaultRoute;
-    if (u)
+    u = !1;
+    const c = a?.active ?? s[s.length - 1]?.to ?? o.defaultRoute;
+    if (c)
       try {
-        await e.replace(u);
+        await e.replace(c);
       } catch {
       }
   }
-  return E(
+  return P(
     () => e.currentRoute.value,
-    (i) => {
-      if (r) return;
-      const c = v(i);
-      s.value = c.id, p.value = c, ye(n, o.maxAlive, s.value);
+    (a) => {
+      if (u) return;
+      const s = C(a);
+      r.value = s.id, d.value = s, ue(t, o.maxAlive, r.value);
     },
     { immediate: !0 }
-  ), o.initialTabs.length && o.initialTabs.forEach((i) => {
-    const c = I(e, i.to), u = M(c, i, o.keepAlive);
-    X(n, u, "last", null);
+  ), o.initialTabs.length && o.initialTabs.forEach((a) => {
+    const s = A(e, a.to), c = V(s, a, o.keepAlive);
+    W(t, c, "last", null);
   }), {
     options: o,
-    tabs: n,
-    activeId: s,
-    current: p,
+    tabs: t,
+    activeId: r,
+    current: d,
     includeKeys: l,
-    refreshingKey: d,
-    openTab: m,
-    closeTab: h,
-    removeTab: T,
-    refreshTab: _,
-    refreshAll: R,
-    reset: x,
-    reload: O,
-    getRouteKey: S,
-    matchRoute: b,
-    snapshot: N,
-    hydrate: J
+    refreshingKey: b,
+    openTab: S,
+    closeTab: x,
+    removeTab: M,
+    refreshTab: v,
+    refreshAll: N,
+    reset: U,
+    reload: $,
+    getRouteKey: B,
+    matchRoute: T,
+    snapshot: F,
+    hydrate: I
   };
 }
-function ge(e) {
+function fe(e) {
   return e ? typeof e == "string" ? { name: e } : e : {};
 }
-const G = Symbol("RouterTabsContext"), et = "router-tabs:snapshot";
-function Te(e = {}) {
-  const { optional: t = !1 } = e, o = z(G, null);
+const D = Symbol("RouterTabsContext"), De = "router-tabs:snapshot";
+function de(e = {}) {
+  const { optional: n = !1 } = e, o = oe(D, null);
   if (o) return o;
-  const n = z("$tabs", null);
-  if (n) return n;
-  const p = ne()?.appContext.config.globalProperties.$tabs;
-  if (p) return p;
-  if (!t)
+  const t = oe("$tabs", null);
+  if (t) return t;
+  const d = ye()?.appContext.config.globalProperties.$tabs;
+  if (d) return d;
+  if (!n)
     throw new Error("[RouterTabs] useRouterTabs must be used within <router-tab>.");
   return null;
 }
-const tt = 864e5;
-function nt(e) {
+const Ne = 864e5;
+function Ue(e) {
   if (typeof document > "u") return null;
-  const t = `${encodeURIComponent(e)}=`, o = document.cookie ? document.cookie.split("; ") : [];
-  for (const n of o)
-    if (n.startsWith(t))
-      return decodeURIComponent(n.slice(t.length));
+  const n = `${encodeURIComponent(e)}=`, o = document.cookie ? document.cookie.split("; ") : [];
+  for (const t of o)
+    if (t.startsWith(n))
+      return decodeURIComponent(t.slice(n.length));
   return null;
 }
-function ke(e, t, o) {
+function be(e, n, o) {
   if (typeof document > "u") return;
   const {
-    expiresInDays: n = 7,
-    path: s = "/",
-    domain: p,
-    secure: d,
+    expiresInDays: t = 7,
+    path: r = "/",
+    domain: d,
+    secure: b,
     sameSite: l = "lax"
-  } = o, r = [`${encodeURIComponent(e)}=${encodeURIComponent(t)}`];
-  if (n !== 1 / 0) {
-    const b = new Date(Date.now() + n * tt).toUTCString();
-    r.push(`Expires=${b}`);
+  } = o, u = [`${encodeURIComponent(e)}=${encodeURIComponent(n)}`];
+  if (t !== 1 / 0) {
+    const T = new Date(Date.now() + t * Ne).toUTCString();
+    u.push(`Expires=${T}`);
   }
-  s && r.push(`Path=${s}`), p && r.push(`Domain=${p}`), d && r.push("Secure"), l && r.push(`SameSite=${l.charAt(0).toUpperCase()}${l.slice(1)}`), document.cookie = r.join("; ");
+  r && u.push(`Path=${r}`), d && u.push(`Domain=${d}`), b && u.push("Secure"), l && u.push(`SameSite=${l.charAt(0).toUpperCase()}${l.slice(1)}`), document.cookie = u.join("; ");
 }
-function we(e, t) {
+function pe(e, n) {
   if (typeof document > "u") return;
-  const { path: o = "/", domain: n } = t, s = [`${encodeURIComponent(e)}=`];
-  s.push("Expires=Thu, 01 Jan 1970 00:00:01 GMT"), o && s.push(`Path=${o}`), n && s.push(`Domain=${n}`), document.cookie = s.join("; ");
+  const { path: o = "/", domain: t } = n, r = [`${encodeURIComponent(e)}=`];
+  r.push("Expires=Thu, 01 Jan 1970 00:00:01 GMT"), o && r.push(`Path=${o}`), t && r.push(`Domain=${t}`), document.cookie = r.join("; ");
 }
-const ot = (e) => JSON.stringify(e ?? null), at = (e) => {
+const Be = (e) => JSON.stringify(e ?? null), Fe = (e) => {
   if (!e) return null;
   try {
     return JSON.parse(e);
@@ -375,58 +267,58 @@ const ot = (e) => JSON.stringify(e ?? null), at = (e) => {
     return null;
   }
 };
-function xe(e = {}) {
+function ke(e = {}) {
   const {
-    cookieKey: t = et,
-    serialize: o = ot,
-    deserialize: n = at
-  } = e, s = Te({ optional: !0 }), p = B(!1), d = (l) => {
-    Q(async () => {
-      const r = n(nt(t));
-      if (r && r.tabs?.length)
+    cookieKey: n = De,
+    serialize: o = Be,
+    deserialize: t = Fe
+  } = e, r = de({ optional: !0 }), d = Q(!1), b = (l) => {
+    Z(async () => {
+      const u = t(Ue(n));
+      if (u && u.tabs?.length)
         try {
-          p.value = !0, await l.hydrate(r);
+          d.value = !0, await l.hydrate(u);
         } finally {
-          p.value = !1;
+          d.value = !1;
         }
       else
         try {
-          p.value = !0;
-          const v = e.fallbackRoute ?? l.options.defaultRoute;
-          await l.reset(v);
+          d.value = !0;
+          const C = e.fallbackRoute ?? l.options.defaultRoute;
+          await l.reset(C);
         } finally {
-          p.value = !1;
+          d.value = !1;
         }
-      const b = l.snapshot();
-      b.tabs.length ? ke(t, o(b), e) : we(t, e);
-    }), E(
+      const T = l.snapshot();
+      T.tabs.length ? be(n, o(T), e) : pe(n, e);
+    }), P(
       () => ({
-        tabs: l.tabs.map((r) => ({
-          to: r.to,
-          title: r.title,
-          tips: r.tips,
-          icon: r.icon,
-          tabClass: r.tabClass,
-          closable: r.closable
+        tabs: l.tabs.map((u) => ({
+          to: u.to,
+          title: u.title,
+          tips: u.tips,
+          icon: u.icon,
+          tabClass: u.tabClass,
+          closable: u.closable
         })),
         active: l.activeId.value
       }),
       () => {
-        if (p.value) return;
-        const r = l.snapshot();
-        r.tabs.length ? ke(t, o(r), e) : we(t, e);
+        if (d.value) return;
+        const u = l.snapshot();
+        u.tabs.length ? be(n, o(u), e) : pe(n, e);
       },
       { deep: !0 }
     );
   };
-  s ? d(s) : Q(() => {
-    const l = Te({ optional: !0 });
-    l && d(l);
+  r ? b(r) : Z(() => {
+    const l = de({ optional: !0 });
+    l && b(l);
   });
 }
-const it = te({
+const Ge = ge({
   name: "RouterTab",
-  components: { RouterView: Ye },
+  components: { RouterView: Me },
   props: {
     tabs: {
       type: Array,
@@ -474,13 +366,13 @@ const it = te({
     }
   },
   setup(e) {
-    const t = ne();
-    if (!t)
+    const n = ye();
+    if (!n)
       throw new Error("[RouterTab] component must be used within a Vue application context.");
-    const o = t.appContext.app.config.globalProperties.$router;
+    const o = n.appContext.app.config.globalProperties.$router;
     if (!o)
       throw new Error("[RouterTab] Vue Router is required. Make sure to call app.use(router) before RouterTab.");
-    const n = Ze(o, {
+    const t = Ve(o, {
       initialTabs: e.tabs,
       keepAlive: e.keepAlive,
       maxAlive: e.maxAlive,
@@ -488,17 +380,19 @@ const it = te({
       appendPosition: e.append,
       defaultRoute: e.defaultPage
     });
-    if (U(G, n), t.appContext.config.globalProperties.$tabs = n, e.cookieKey || e.persistence) {
-      const a = {
+    _e(D, t), n.appContext.config.globalProperties.$tabs = t;
+    const r = K(() => !!n?.slots?.default);
+    if (e.cookieKey || e.persistence) {
+      const i = {
         ...e.persistence ?? {}
       };
-      e.cookieKey && (a.cookieKey = e.cookieKey), xe(a);
+      e.cookieKey && (i.cookieKey = e.cookieKey), ke(i);
     }
-    const s = P(() => ge(e.tabTransition)), p = P(() => ge(e.pageTransition)), d = _e({
+    const d = K(() => fe(e.tabTransition)), b = K(() => fe(e.pageTransition)), l = me({
       visible: !1,
       target: null,
       position: { x: 0, y: 0 }
-    }), l = [
+    }), u = [
       "refresh",
       "refreshAll",
       "close",
@@ -506,267 +400,270 @@ const it = te({
       "closeRights",
       "closeOthers"
     ];
-    function r(a) {
-      return n.tabs.findIndex((f) => f.id === a);
+    function T(i) {
+      return t.tabs.findIndex((f) => f.id === i);
     }
-    function b(a) {
-      const f = r(a.id);
-      return f > 0 ? n.tabs.slice(0, f) : [];
+    function C(i) {
+      const f = T(i.id);
+      return f > 0 ? t.tabs.slice(0, f) : [];
     }
-    function v(a) {
-      const f = r(a.id);
-      return f > -1 ? n.tabs.slice(f + 1) : [];
+    function S(i) {
+      const f = T(i.id);
+      return f > -1 ? t.tabs.slice(f + 1) : [];
     }
-    function m(a) {
-      return n.tabs.filter((f) => f.id !== a.id);
+    function L(i) {
+      return t.tabs.filter((f) => f.id !== i.id);
     }
-    async function k(a, f) {
-      const g = a.filter((C) => C.closable !== !1);
-      if (g.length) {
-        for (const C of g)
-          n.activeId.value === C.id ? await n.closeTab(C.id, { redirect: f.to, force: !0 }) : await n.removeTab(C.id, { force: !0 });
-        n.activeId.value !== f.id && await n.openTab(f.to, !0, !1);
+    async function x(i, f) {
+      const h = i.filter((y) => y.closable !== !1);
+      if (h.length) {
+        for (const y of h)
+          t.activeId.value === y.id ? await t.closeTab(y.id, { redirect: f.to, force: !0 }) : await t.removeTab(y.id, { force: !0 });
+        t.activeId.value !== f.id && await t.openTab(f.to, !0, !1);
       }
     }
-    const h = {
+    const M = {
       refresh: {
         label: "Refresh",
-        handler: async ({ target: a }) => {
-          await n.refreshTab(a.id, !0);
+        handler: async ({ target: i }) => {
+          await t.refreshTab(i.id, !0);
         }
       },
       refreshAll: {
         label: "Refresh All",
         handler: async () => {
-          await n.refreshAll(!0);
+          await t.refreshAll(!0);
         }
       },
       close: {
         label: "Close",
-        handler: async ({ target: a }) => {
-          await n.closeTab(a.id);
+        handler: async ({ target: i }) => {
+          await t.closeTab(i.id);
         },
-        enable: ({ target: a }) => N(a)
+        enable: ({ target: i }) => I(i)
       },
       closeLefts: {
         label: "Close to the Left",
-        handler: async ({ target: a }) => {
-          await k(b(a), a);
+        handler: async ({ target: i }) => {
+          await x(C(i), i);
         },
-        enable: ({ target: a }) => b(a).some((f) => f.closable !== !1)
+        enable: ({ target: i }) => C(i).some((f) => f.closable !== !1)
       },
       closeRights: {
         label: "Close to the Right",
-        handler: async ({ target: a }) => {
-          await k(v(a), a);
+        handler: async ({ target: i }) => {
+          await x(S(i), i);
         },
-        enable: ({ target: a }) => v(a).some((f) => f.closable !== !1)
+        enable: ({ target: i }) => S(i).some((f) => f.closable !== !1)
       },
       closeOthers: {
         label: "Close Others",
-        handler: async ({ target: a }) => {
-          await k(m(a), a);
+        handler: async ({ target: i }) => {
+          await x(L(i), i);
         },
-        enable: ({ target: a }) => m(a).some((f) => f.closable !== !1)
+        enable: ({ target: i }) => L(i).some((f) => f.closable !== !1)
       }
     };
-    function T() {
-      d.visible = !1, d.target = null;
+    function v() {
+      l.visible = !1, l.target = null;
     }
-    function _(a, f) {
-      e.contextmenu && (d.visible = !0, d.target = a, d.position.x = f.clientX, d.position.y = f.clientY, document.addEventListener("click", T, { once: !0 }));
+    function N(i, f) {
+      e.contextmenu && (l.visible = !0, l.target = i, l.position.x = f.clientX, l.position.y = f.clientY, document.addEventListener("click", v, { once: !0 }));
     }
-    function R(a, f) {
-      const g = typeof a == "string" ? { id: a } : a, C = h[g.id], Pe = g.label ?? C?.label ?? String(g.id), H = g.visible ?? C?.visible ?? !0;
-      if (!(typeof H == "function" ? H(f) : H !== !1)) return null;
-      const Y = g.enable ?? C?.enable ?? !0, Se = typeof Y == "function" ? Y(f) : Y !== !1, oe = g.handler ?? C?.handler;
-      if (!oe) return null;
-      const Ee = async () => {
-        await Promise.resolve(oe(f));
+    function U(i, f) {
+      const h = typeof i == "string" ? { id: i } : i, y = M[h.id], Ce = h.label ?? y?.label ?? String(h.id), G = h.visible ?? y?.visible ?? !0;
+      if (!(typeof G == "function" ? G(f) : G !== !1)) return null;
+      const J = h.enable ?? y?.enable ?? !0, Re = typeof J == "function" ? J(f) : J !== !1, ne = h.handler ?? y?.handler;
+      if (!ne) return null;
+      const we = async () => {
+        await Promise.resolve(ne(f));
       };
       return {
-        id: String(g.id),
-        label: Pe,
-        disabled: !Se,
-        action: Ee
+        id: String(h.id),
+        label: Ce,
+        disabled: !Re,
+        action: we
       };
     }
-    const x = P(() => {
-      if (!d.visible || !d.target || e.contextmenu === !1) return [];
-      const a = Array.isArray(e.contextmenu) ? e.contextmenu : l, f = { target: d.target, controller: n };
-      return a.map((g) => R(g, f)).filter((g) => !!g);
+    const $ = K(() => {
+      if (!l.visible || !l.target || e.contextmenu === !1) return [];
+      const i = Array.isArray(e.contextmenu) ? e.contextmenu : u, f = { target: l.target, controller: t };
+      return i.map((h) => U(h, f)).filter((h) => !!h);
     });
-    async function O(a) {
-      a.disabled || (T(), await a.action());
+    async function B(i) {
+      i.disabled || (v(), await i.action());
     }
-    function S(a) {
-      return typeof a.title == "string" ? a.title : Array.isArray(a.title) && a.title.length ? String(a.title[0]) : a.fullPath;
+    function F(i) {
+      return typeof i.title == "string" ? i.title : Array.isArray(i.title) && i.title.length ? String(i.title[0]) : i.fullPath;
     }
-    function N(a) {
-      return !(a.closable === !1 || n.options.keepLastTab && n.tabs.length <= 1);
+    function I(i) {
+      return !(i.closable === !1 || t.options.keepLastTab && t.tabs.length <= 1);
     }
-    async function J(a) {
-      await n.closeTab(a.id);
+    async function a(i) {
+      await t.closeTab(i.id);
     }
-    function i(a) {
-      n.activeId.value !== a.id && n.openTab(a.to, !1);
+    function s(i) {
+      t.activeId.value !== i.id && t.openTab(i.to, !1);
     }
-    function c(a) {
+    function c(i) {
       return [
         "router-tab__item",
         {
-          "is-active": n.activeId.value === a.id,
-          "is-closable": N(a)
+          "is-active": t.activeId.value === i.id,
+          "is-closable": I(i)
         },
-        a.tabClass
+        i.tabClass
       ];
     }
-    function u(a) {
-      return n.refreshingKey.value === n.getRouteKey(a);
+    function p(i) {
+      return t.refreshingKey.value === t.getRouteKey(i);
     }
-    Q(() => {
-      document.addEventListener("keydown", T);
-    }), Ve(() => {
-      document.removeEventListener("keydown", T), t.appContext.config.globalProperties.$tabs = null;
-    }), E(
+    Z(() => {
+      document.addEventListener("keydown", v);
+    }), Pe(() => {
+      document.removeEventListener("keydown", v), n.appContext.config.globalProperties.$tabs = null;
+    }), P(
       () => e.keepAlive,
-      (a) => {
-        n.options.keepAlive = a;
+      (i) => {
+        t.options.keepAlive = i;
       }
-    ), E(
-      () => n.activeId.value,
-      () => T()
-    ), E(
+    ), P(
+      () => t.activeId.value,
+      () => v()
+    ), P(
       () => e.contextmenu,
-      (a) => {
-        a || T();
+      (i) => {
+        i || v();
       }
-    ), E(
-      () => x.value.length,
-      (a) => {
-        d.visible && a === 0 && T();
+    ), P(
+      () => $.value.length,
+      (i) => {
+        l.visible && i === 0 && v();
       }
     );
-    const y = n.includeKeys;
+    const k = t.includeKeys;
     return {
-      controller: n,
-      tabs: n.tabs,
-      includeKeys: y,
-      tabTransitionProps: s,
-      pageTransitionProps: p,
+      controller: t,
+      tabs: t.tabs,
+      includeKeys: k,
+      tabTransitionProps: d,
+      pageTransitionProps: b,
       buildTabClass: c,
-      activate: i,
-      close: J,
-      context: d,
-      menuItems: x,
-      handleMenuAction: O,
-      showContextMenu: _,
-      hideContextMenu: T,
-      tabTitle: S,
-      isClosable: N,
-      isRefreshing: u
+      activate: s,
+      close: a,
+      context: l,
+      menuItems: $,
+      handleMenuAction: B,
+      showContextMenu: N,
+      hideContextMenu: v,
+      tabTitle: F,
+      isClosable: I,
+      isRefreshing: p,
+      hasCustomSlot: r
     };
   }
-}), st = (e, t) => {
+}), Je = (e, n) => {
   const o = e.__vccOpts || e;
-  for (const [n, s] of t)
-    o[n] = s;
+  for (const [t, r] of n)
+    o[t] = r;
   return o;
-}, lt = { class: "router-tab" }, rt = { class: "router-tab__header" }, ct = { class: "router-tab__slot-start" }, ut = { class: "router-tab__scroll" }, ft = ["onClick", "onAuxclick", "onContextmenu"], dt = ["title"], pt = ["onClick"], bt = { class: "router-tab__slot-end" }, vt = { class: "router-tab__container" }, mt = ["aria-disabled", "onClick"];
-function ht(e, t, o, n, s, p) {
-  const d = Oe("RouterView");
-  return w(), A("div", lt, [
-    $("header", rt, [
-      $("div", ct, [
-        ie(e.$slots, "start")
+}, He = { class: "router-tab" }, Ye = { class: "router-tab__header" }, qe = { class: "router-tab__slot-start" }, We = { class: "router-tab__scroll" }, Xe = ["onClick", "onAuxclick", "onContextmenu"], Qe = ["title"], Ze = ["onClick"], et = { class: "router-tab__slot-end" }, tt = { class: "router-tab__container" }, nt = ["aria-disabled", "onClick"];
+function it(e, n, o, t, r, d) {
+  const b = xe("RouterView");
+  return m(), g("div", He, [
+    R("header", Ye, [
+      R("div", qe, [
+        H(e.$slots, "start")
       ]),
-      $("div", ut, [
-        D(Ne, q({
+      R("div", We, [
+        E($e, j({
           tag: "ul",
           class: "router-tab__nav"
         }, e.tabTransitionProps), {
-          default: L(() => [
-            (w(!0), A(se, null, le(e.tabs, (l) => (w(), A("li", {
+          default: z(() => [
+            (m(!0), g(Y, null, ae(e.tabs, (l) => (m(), g("li", {
               key: l.id,
-              class: re(e.buildTabClass(l)),
-              onClick: (r) => e.activate(l),
-              onAuxclick: j((r) => e.close(l), ["middle", "prevent"]),
-              onContextmenu: j((r) => e.showContextMenu(l, r), ["prevent"])
+              class: le(e.buildTabClass(l)),
+              onClick: (u) => e.activate(l),
+              onAuxclick: O((u) => e.close(l), ["middle", "prevent"]),
+              onContextmenu: O((u) => e.showContextMenu(l, u), ["prevent"])
             }, [
-              $("span", {
+              R("span", {
                 class: "router-tab__item-title",
                 title: e.tabTitle(l)
               }, [
-                l.icon ? (w(), A("i", {
+                l.icon ? (m(), g("i", {
                   key: 0,
-                  class: re(["router-tab__item-icon", l.icon])
-                }, null, 2)) : K("", !0),
-                De(" " + ce(e.tabTitle(l)), 1)
-              ], 8, dt),
-              e.isClosable(l) ? (w(), A("a", {
+                  class: le(["router-tab__item-icon", l.icon])
+                }, null, 2)) : w("", !0),
+                Ie(" " + se(e.tabTitle(l)), 1)
+              ], 8, Qe),
+              e.isClosable(l) ? (m(), g("a", {
                 key: 0,
                 class: "router-tab__item-close",
                 type: "button",
-                onClick: j((r) => e.close(l), ["stop"])
-              }, null, 8, pt)) : K("", !0)
-            ], 42, ft))), 128))
+                onClick: O((u) => e.close(l), ["stop"])
+              }, null, 8, Ze)) : w("", !0)
+            ], 42, Xe))), 128))
           ]),
           _: 1
         }, 16)
       ]),
-      $("div", bt, [
-        ie(e.$slots, "end")
+      R("div", et, [
+        H(e.$slots, "end")
       ])
     ]),
-    $("div", vt, [
-      D(d, null, {
-        default: L(({ Component: l, route: r }) => [
-          D(ue, q(e.pageTransitionProps, { appear: "" }), {
-            default: L(() => [
-              e.controller.options.keepAlive ? (w(), W(Le, {
-                key: 0,
-                include: e.includeKeys,
-                max: e.controller.options.maxAlive || void 0
-              }, [
-                e.isRefreshing(r) ? K("", !0) : (w(), W(fe(l), {
-                  key: e.controller.getRouteKey(r),
+    R("div", tt, [
+      E(b, null, {
+        default: z((l) => [
+          e.hasCustomSlot ? H(e.$slots, "default", Ke(j({ key: 0 }, { ...l, controller: e.controller }))) : (m(), g(Y, { key: 1 }, [
+            E(re, j(e.pageTransitionProps, { appear: "" }), {
+              default: z(() => [
+                e.controller.options.keepAlive ? (m(), q(Se, {
+                  key: 0,
+                  include: e.includeKeys,
+                  max: e.controller.options.maxAlive || void 0
+                }, [
+                  e.isRefreshing(l.route) ? w("", !0) : (m(), q(ce(l.Component), {
+                    key: e.controller.getRouteKey(l.route),
+                    class: "router-tab-page"
+                  }))
+                ], 1032, ["include", "max"])) : w("", !0)
+              ]),
+              _: 2
+            }, 1040),
+            E(re, j(e.pageTransitionProps, { appear: "" }), {
+              default: z(() => [
+                !e.controller.options.keepAlive || e.isRefreshing(l.route) ? (m(), q(ce(l.Component), {
+                  key: e.controller.getRouteKey(l.route) + (e.isRefreshing(l.route) ? "-refresh" : ""),
                   class: "router-tab-page"
-                }))
-              ], 1032, ["include", "max"])) : K("", !0)
-            ]),
-            _: 2
-          }, 1040),
-          D(ue, q(e.pageTransitionProps, { appear: "" }), {
-            default: L(() => [
-              !e.controller.options.keepAlive || e.isRefreshing(r) ? (w(), W(fe(l), {
-                key: e.controller.getRouteKey(r) + (e.isRefreshing(r) ? "-refresh" : ""),
-                class: "router-tab-page"
-              })) : K("", !0)
-            ]),
-            _: 2
-          }, 1040)
+                })) : w("", !0)
+              ]),
+              _: 2
+            }, 1040)
+          ], 64))
         ]),
-        _: 1
+        _: 3
       })
     ]),
-    e.context.visible && e.context.target ? (w(), A("div", {
+    e.context.visible && e.context.target ? (m(), g("div", {
       key: 0,
       class: "router-tab__contextmenu",
-      style: je({ left: e.context.position.x + "px", top: e.context.position.y + "px" })
+      style: Le({ left: e.context.position.x + "px", top: e.context.position.y + "px" })
     }, [
-      (w(!0), A(se, null, le(e.menuItems, (l) => (w(), A("a", {
+      (m(!0), g(Y, null, ae(e.menuItems, (l) => (m(), g("a", {
         key: l.id,
         class: "router-tab__contextmenu-item",
         "aria-disabled": l.disabled,
-        onClick: j((r) => e.handleMenuAction(l), ["prevent"])
-      }, ce(l.label), 9, mt))), 128))
-    ], 4)) : K("", !0)
+        onClick: O((u) => e.handleMenuAction(l), ["prevent"])
+      }, se(l.label), 9, nt))), 128))
+    ], 4)) : w("", !0)
   ]);
 }
-const Re = /* @__PURE__ */ st(it, [["render", ht]]), yt = {
+const he = /* @__PURE__ */ Je(Ge, [["render", it]]), ot = {
   class: "router-tabs",
   "aria-hidden": "true"
-}, F = /* @__PURE__ */ te({
+}, X = /* @__PURE__ */ ge({
   name: "RouterTabs",
   __name: "RouterTabs",
   props: {
@@ -781,30 +678,30 @@ const Re = /* @__PURE__ */ st(it, [["render", ht]]), yt = {
     fallbackRoute: {}
   },
   setup(e) {
-    return xe(e), (o, n) => (w(), A("span", yt));
+    return ke(e), (o, t) => (m(), g("span", ot));
   }
-}), Ce = {
+}), ve = {
   install(e) {
-    if (Ce._installed) return;
-    Ce._installed = !0;
-    const t = Re.name || "RouterTab", o = F.name || "RouterTabs";
-    e.component(t, Re), e.component(o, F), o !== "router-tabs" && e.component("router-tabs", F), Object.defineProperty(e.config.globalProperties, "$tabs", {
+    if (ve._installed) return;
+    ve._installed = !0;
+    const n = he.name || "RouterTab", o = X.name || "RouterTabs";
+    e.component(n, he), e.component(o, X), o !== "router-tabs" && e.component("router-tabs", X), Object.defineProperty(e.config.globalProperties, "$tabs", {
       configurable: !0,
       enumerable: !1,
       get() {
-        return e._context.provides[G];
+        return e._context.provides[D];
       },
-      set(n) {
-        n && e.provide(G, n);
+      set(t) {
+        t && e.provide(D, t);
       }
     });
   }
 };
 export {
-  Re as RouterTab,
-  F as RouterTabs,
-  Ce as default,
-  G as routerTabsKey,
-  Te as useRouterTabs,
-  xe as useRouterTabsPersistence
+  he as RouterTab,
+  X as RouterTabs,
+  ve as default,
+  D as routerTabsKey,
+  de as useRouterTabs,
+  ke as useRouterTabsPersistence
 };