vft 0.0.507 → 0.0.511

package/es/components/message-box/types.d.ts

@@ -0,0 +1,202 @@
+import type { AppContext, VNode } from 'vue';
+import type { CSSProperties } from 'vue';
+export type Action = 'confirm' | 'close' | 'cancel';
+export type MessageBoxType = '' | 'prompt' | 'alert' | 'confirm';
+export type MessageBoxMessageType = '' | 'primary' | 'success' | 'warning' | 'info' | 'error';
+export type MessageBoxButtonType = 'default' | 'primary' | 'success' | 'warning' | 'info' | 'danger' | 'text';
+export type CloseFn = () => void;
+export interface MessageBoxInputData {
+    /** 输入框内的值 */
+    value: string;
+    /** 触发的动作类型 */
+    action: Action;
+}
+export type MessageBoxData = MessageBoxInputData & Action;
+export interface MessageBoxActionHandlers {
+    confirm: CloseFn;
+    cancel: CloseFn;
+    close: CloseFn;
+}
+export type MessageBoxInputValidator = ((value: string) => boolean | string) | undefined;
+export type Callback = ((value: string, action: Action) => any) | ((action: Action) => any);
+export interface MessageBoxState {
+    /** 自动聚焦 */
+    autofocus: boolean;
+    /** 标题 */
+    title: string | undefined;
+    /** 消息内容 */
+    message: string | VNode;
+    /** 消息类型，控制图标 */
+    type: MessageBoxMessageType;
+    /** 自定义图标 */
+    icon: string;
+    /** 自定义关闭图标 */
+    closeIcon: string;
+    /** 自定义类名 */
+    customClass: string;
+    /** 自定义内联样式 */
+    customStyle: Record<string, string | number>;
+    /** 是否显示输入框，prompt 模式下默认 true */
+    showInput: boolean;
+    /** 输入框默认值 */
+    inputValue: string;
+    /** 输入框占位符 */
+    inputPlaceholder: string;
+    /** 输入框类型 */
+    inputType: string;
+    /** 输入框校验正则 */
+    inputPattern: RegExp | null;
+    /** 输入框自定义校验函数 */
+    inputValidator: MessageBoxInputValidator;
+    /** 输入框校验失败提示 */
+    inputErrorMessage: string;
+    /** 是否显示确认按钮 */
+    showConfirmButton: boolean;
+    /** 是否显示取消按钮 */
+    showCancelButton: boolean;
+    /** 当前触发的动作 */
+    action: Action;
+    /** 是否将 message 作为 HTML 字符串渲染 */
+    dangerouslyUseHTMLString: boolean;
+    /** 确认按钮文案 */
+    confirmButtonText: string;
+    /** 取消按钮文案 */
+    cancelButtonText: string;
+    /** 确认按钮类型 */
+    confirmButtonType: MessageBoxButtonType;
+    /** 取消按钮类型 */
+    cancelButtonType: MessageBoxButtonType;
+    /** 确认按钮加载中 */
+    confirmButtonLoading: boolean;
+    /** 取消按钮加载中 */
+    cancelButtonLoading: boolean;
+    /** 确认按钮加载图标 */
+    confirmButtonLoadingIcon: string;
+    /** 取消按钮加载图标 */
+    cancelButtonLoadingIcon: string;
+    /** 确认按钮自定义类名 */
+    confirmButtonClass: string;
+    /** 确认按钮是否禁用 */
+    confirmButtonDisabled: boolean;
+    /** 取消按钮自定义类名 */
+    cancelButtonClass: string;
+    /** 输入框校验失败信息 */
+    editorErrorMessage: string;
+    /** 关闭前回调 */
+    beforeClose: null | ((action: Action, instance: MessageBoxState, done: () => void) => void);
+    /** 关闭后回调（不使用 Promise 时） */
+    callback: null | Callback;
+    /** 是否区分取消和关闭 */
+    distinguishCancelAndClose: boolean;
+    /** 遮罩淡入淡出 */
+    modalFade: boolean;
+    /** 自定义遮罩类名 */
+    modalClass: string;
+    /** 校验是否失败 */
+    validateError: boolean;
+    /** 弹窗层级 */
+    zIndex: number;
+}
+/** MessageBox 选项 */
+export interface MessageBoxOptions {
+    /** 打开时是否自动聚焦 */
+    autofocus?: boolean;
+    /** 关闭前回调，会阻止默认关闭 */
+    beforeClose?: (action: Action, instance: MessageBoxState, done: () => void) => void;
+    /** 自定义类名 */
+    customClass?: string;
+    /** 自定义内联样式 */
+    customStyle?: CSSProperties;
+    /** 是否显示遮罩 */
+    modal?: boolean;
+    /** 遮罩自定义类名 */
+    modalClass?: string;
+    /** 关闭回调 */
+    callback?: Callback;
+    /** 取消按钮文案 */
+    cancelButtonText?: string;
+    /** 确认按钮文案 */
+    confirmButtonText?: string;
+    /** 取消按钮类型 */
+    cancelButtonType?: MessageBoxButtonType;
+    /** 确认按钮类型 */
+    confirmButtonType?: MessageBoxButtonType;
+    /** 取消按钮加载图标 */
+    cancelButtonLoadingIcon?: string;
+    /** 确认按钮加载图标 */
+    confirmButtonLoadingIcon?: string;
+    /** 取消按钮自定义类名 */
+    cancelButtonClass?: string;
+    /** 确认按钮自定义类名 */
+    confirmButtonClass?: string;
+    /** 内容是否居中 */
+    center?: boolean;
+    /** 是否可拖拽 */
+    draggable?: boolean;
+    /** 拖拽时是否允许溢出视口 */
+    overflow?: boolean;
+    /** 消息内容，可为字符串、VNode 或返回 VNode 的函数 */
+    message?: string | VNode | ((params: MessageBoxActionHandlers) => VNode);
+    /** 标题 */
+    title?: string | MessageBoxOptions;
+    /** 消息类型，决定图标 */
+    type?: MessageBoxMessageType;
+    /** boxType，由 alert / confirm / prompt 内部传入 */
+    boxType?: MessageBoxType;
+    /** 自定义图标 */
+    icon?: string;
+    /** 自定义关闭图标 */
+    closeIcon?: string;
+    /** 是否将 message 作为 HTML 字符串处理 */
+    dangerouslyUseHTMLString?: boolean;
+    /** 是否区分取消和关闭 */
+    distinguishCancelAndClose?: boolean;
+    /** 是否锁定 body 滚动 */
+    lockScroll?: boolean;
+    /** 是否显示取消按钮 */
+    showCancelButton?: boolean;
+    /** 是否显示确认按钮 */
+    showConfirmButton?: boolean;
+    /** 是否显示关闭按钮 */
+    showClose?: boolean;
+    /** 按钮是否使用圆角 */
+    roundButton?: boolean;
+    /** 点击遮罩是否关闭 */
+    closeOnClickModal?: boolean;
+    /** 按 ESC 是否关闭 */
+    closeOnPressEscape?: boolean;
+    /** hash 改变时是否关闭 */
+    closeOnHashChange?: boolean;
+    /** prompt 时是否显示输入框 */
+    showInput?: boolean;
+    /** 输入框占位符 */
+    inputPlaceholder?: string;
+    /** 输入框默认值 */
+    inputValue?: string;
+    /** 输入框校验正则 */
+    inputPattern?: RegExp;
+    /** 输入框类型 */
+    inputType?: string;
+    /** 输入框自定义校验函数 */
+    inputValidator?: MessageBoxInputValidator;
+    /** 校验失败时提示文案 */
+    inputErrorMessage?: string;
+    /** 按钮尺寸 */
+    buttonSize?: 'large' | 'default' | 'small';
+    /** 自定义挂载节点 */
+    appendTo?: HTMLElement | string;
+}
+export type MessageBoxShortcutMethod = ((message: MessageBoxOptions['message'], options?: MessageBoxOptions, appContext?: AppContext | null) => Promise<MessageBoxData>) & ((message: MessageBoxOptions['message'], title: MessageBoxOptions['title'], options?: MessageBoxOptions, appContext?: AppContext | null) => Promise<MessageBoxData>);
+export interface IMessageBox {
+    _context: AppContext | null;
+    /** 显示一个消息提示框 */
+    (options: MessageBoxOptions, appContext?: AppContext | null): Promise<MessageBoxData>;
+    /** 显示警告对话框 */
+    alert: MessageBoxShortcutMethod;
+    /** 显示确认对话框 */
+    confirm: MessageBoxShortcutMethod;
+    /** 显示提示输入框 */
+    prompt: MessageBoxShortcutMethod;
+    /** 关闭当前所有 message-box */
+    close: CloseFn;
+}

package/es/components/message-box/types.js

@@ -0,0 +1 @@
+

package/es/components/modal/index.d.ts

@@ -566,6 +566,7 @@ export declare const VftModal: import("vft/es/utils").SFCWithInstall<{
 }, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
     $slots: {
         default?(_: {}): any;
+        footer?(_: {}): any;
     };
 })> & Record<string, any>;
 export * from './types';

package/es/components/modal/modal-footer-action.vue2.js

@@ -1,6 +1,6 @@
-import { defineComponent as O, computed as e, createBlock as n, openBlock as s, unref as o, normalizeProps as w, guardReactiveProps as y, withCtx as i, createCommentVNode as c, renderSlot as l, mergeProps as p, createTextVNode as f, toDisplayString as B } from "vue";
+import { defineComponent as w, computed as e, openBlock as n, createBlock as s, unref as o, normalizeProps as v, guardReactiveProps as y, withCtx as a, mergeProps as l, createTextVNode as p, toDisplayString as f, createCommentVNode as B, renderSlot as b } from "vue";
 import { VftRow as g } from "../row/index.js";
-import { VftButton as b } from "../button/index.js";
+import { VftButton as d } from "../button/index.js";
 import "@vueuse/core";
 import "@vft/utils";
 import "../config-provider/hooks/use-global-config.js";
@@ -10,7 +10,8 @@ import { useNamespace as h } from "../../hooks/use-namespace/index.js";
 import "../../hooks/use-model-toggle/index.js";
 import "@popperjs/core";
 import "../../hooks/use-z-index/index.js";
-const A = /* @__PURE__ */ O({
+import x from "../../locale/use-locale.js";
+const q = /* @__PURE__ */ w({
   __name: "modal-footer-action",
   props: {
     showSubmitButton: { type: Boolean },
@@ -20,41 +21,41 @@ const A = /* @__PURE__ */ O({
     actionRowOptions: {}
   },
   setup(t) {
-    const a = h("form-action"), d = e(() => ({
+    const i = h("form-action"), { t: r } = x(), O = e(() => ({
       justify: "end",
       ...t.actionRowOptions
-    })), r = e(
-      () => Object.assign({ btnText: "确认" }, t.submitButtonOptions)
-    ), u = e(
-      () => Object.assign({ btnText: "取消" }, t.cancelButtonOptions)
+    })), m = e(
+      () => Object.assign({ btnText: r("vft.modal.confirm") }, t.submitButtonOptions)
+    ), c = e(
+      () => Object.assign({ btnText: r("vft.modal.cancel") }, t.cancelButtonOptions)
     );
-    return (m, v) => (s(), n(o(g), w(y(d.value)), {
-      default: i(() => [
-        t.showCancelButton ? (s(), n(o(b), p({ key: 0 }, u.value, {
-          class: o(a).e("cancel")
+    return (u, C) => (n(), s(o(g), v(y(O.value)), {
+      default: a(() => [
+        t.showCancelButton ? (n(), s(o(d), l({ key: 0 }, c.value, {
+          class: o(i).e("cancel")
         }), {
-          default: i(() => [
-            f(B(u.value.btnText), 1)
+          default: a(() => [
+            p(f(c.value.btnText), 1)
           ]),
           _: 1
-        }, 16, ["class"])) : c("", !0),
-        l(m.$slots, "submitBefore"),
-        t.showSubmitButton ? (s(), n(o(b), p({
+        }, 16, ["class"])) : B("", !0),
+        b(u.$slots, "submitBefore"),
+        t.showSubmitButton ? (n(), s(o(d), l({
           key: 1,
           type: "primary",
-          class: o(a).e("submit")
-        }, r.value), {
-          default: i(() => [
-            f(B(r.value.btnText), 1)
+          class: o(i).e("submit")
+        }, m.value), {
+          default: a(() => [
+            p(f(m.value.btnText), 1)
           ]),
           _: 1
-        }, 16, ["class"])) : c("", !0),
-        l(m.$slots, "submitAfter")
+        }, 16, ["class"])) : B("", !0),
+        b(u.$slots, "submitAfter")
       ]),
       _: 3
     }, 16));
   }
 });
 export {
-  A as default
+  q as default
 };

package/es/components/modal/modal.vue.d.ts

@@ -1,6 +1,7 @@
 import type { ModalActionProps, ModalMethods, ModalProps } from './types';
 declare function __VLS_template(): {
     default?(_: {}): any;
+    footer?(_: {}): any;
 };
 declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ModalProps & ModalActionProps>, {
     center: boolean;

package/es/components/modal/modal.vue2.js

@@ -1,8 +1,8 @@
-import { defineComponent as k, useAttrs as A, ref as m, getCurrentInstance as $, computed as c, unref as l, watchEffect as M, watch as P, nextTick as B, createBlock as y, openBlock as C, mergeProps as T, createSlots as R, withCtx as g, renderSlot as S, createCommentVNode as x } from "vue";
-import { VftDialog as D } from "../dialog/index.js";
-import { deepMerge as G, isFunction as I } from "@vft/utils";
+import { defineComponent as A, useAttrs as $, ref as m, getCurrentInstance as M, computed as d, unref as l, watchEffect as P, watch as T, nextTick as B, openBlock as y, createBlock as C, mergeProps as R, createSlots as S, withCtx as g, renderSlot as w, createCommentVNode as D } from "vue";
+import { VftDialog as G } from "../dialog/index.js";
+import { deepMerge as I, isFunction as x } from "@vft/utils";
 import E from "./modal-footer-action.vue2.js";
-const W = /* @__PURE__ */ k({
+const W = /* @__PURE__ */ A({
   __name: "modal",
   props: {
     closeFunc: {},
@@ -47,8 +47,8 @@ const W = /* @__PURE__ */ k({
     actionRowOptions: {}
   },
   emits: ["visible-change", "close", "ok", "register", "update:modelValue", "submit", "open", "opened", "closed", "openAutoFocus", "closeAutoFocus"],
-  setup(s, { emit: w }) {
-    const n = s, t = w, h = A(), d = m(null), a = m(!1), u = m(null), f = {
+  setup(s, { emit: h }) {
+    const n = s, t = h, V = $(), c = m(null), a = m(!1), u = m(null), f = {
       setModalProps: p,
       emitVisible: void 0,
       redoModalHeight: () => {
@@ -56,19 +56,19 @@ const W = /* @__PURE__ */ k({
           l(u) && l(u).setModalHeight();
         });
       }
-    }, i = $();
+    }, i = M();
     i && t("register", f, i.uid);
-    const V = c(() => ({
+    const v = d(() => ({
       ...n,
-      ...l(d)
-    })), v = c(() => ({
-      ...h,
-      ...l(V),
+      ...l(c)
+    })), O = d(() => ({
+      ...V,
+      ...l(v),
       modelValue: l(a)
     }));
-    M(() => {
+    P(() => {
       a.value = !!n.modelValue;
-    }), P(
+    }), T(
       () => l(a),
       (e) => {
         t("visible-change", e), t("update:modelValue", e), i && f.emitVisible && B(() => {
@@ -82,45 +82,47 @@ const W = /* @__PURE__ */ k({
       }
     );
     async function b(e) {
-      if (e?.stopPropagation(), n.closeFunc && I(n.closeFunc)) {
+      if (e?.stopPropagation(), n.closeFunc && x(n.closeFunc)) {
         await n.closeFunc() || p({ modelValue: !1 });
         return;
       }
       p({ modelValue: !1 }), t("close", e);
     }
     function p(e) {
-      d.value = G(l(d) || {}, e), Reflect.has(e, "modelValue") && (a.value = !!e.modelValue);
+      c.value = I(l(c) || {}, e), Reflect.has(e, "modelValue") && (a.value = !!e.modelValue);
     }
-    const O = c(() => ({
+    const F = d(() => ({
       onClick: (e) => b(e),
       ...n.cancelButtonOptions
-    })), F = c(() => ({
+    })), k = d(() => ({
       onClick: () => t("submit"),
       ...n.submitButtonOptions
     }));
-    return (e, o) => (C(), y(l(D), T(v.value, {
+    return (e, o) => (y(), C(l(G), R(O.value, {
       onClose: b,
       onOpen: o[0] || (o[0] = (r) => t("open")),
       onOpened: o[1] || (o[1] = (r) => t("opened")),
       onClosed: o[2] || (o[2] = (r) => t("closed")),
       onOpenAutoFocus: o[3] || (o[3] = (r) => t("openAutoFocus")),
       onCloseAutoFocus: o[4] || (o[4] = (r) => t("closeAutoFocus"))
-    }), R({
+    }), S({
       default: g(() => [
-        S(e.$slots, "default")
+        w(e.$slots, "default")
       ]),
       _: 2
     }, [
       e.$slots.footer || s.showActionButtonGroup ? {
         name: "footer",
         fn: g(() => [
-          s.showActionButtonGroup ? (C(), y(E, {
-            key: 0,
-            "show-cancel-button": s.showCancelButton,
-            "show-submit-button": s.showSubmitButton,
-            "cancel-button-options": O.value,
-            "submit-button-options": F.value
-          }, null, 8, ["show-cancel-button", "show-submit-button", "cancel-button-options", "submit-button-options"])) : x("", !0)
+          w(e.$slots, "footer", {}, () => [
+            s.showActionButtonGroup ? (y(), C(E, {
+              key: 0,
+              "show-cancel-button": s.showCancelButton,
+              "show-submit-button": s.showSubmitButton,
+              "cancel-button-options": F.value,
+              "submit-button-options": k.value
+            }, null, 8, ["show-cancel-button", "show-submit-button", "cancel-button-options", "submit-button-options"])) : D("", !0)
+          ])
         ]),
         key: "0"
       } : void 0

package/es/components/multiple-tabs/multiple-tabs.vue2.js

@@ -1,4 +1,4 @@
-import { defineComponent as B, getCurrentInstance as q, computed as d, ref as v, watchEffect as G, unref as t, onMounted as J, createElementBlock as P, openBlock as g, normalizeStyle as O, normalizeClass as V, createVNode as h, createSlots as Q, withCtx as T, Fragment as X, renderList as Y, createBlock as Z, renderSlot as ee, createElementVNode as te } from "vue";
+import { defineComponent as B, getCurrentInstance as q, computed as d, ref as v, watchEffect as G, unref as t, onMounted as J, openBlock as g, createElementBlock as P, normalizeStyle as O, normalizeClass as V, createVNode as h, createSlots as Q, withCtx as T, Fragment as X, renderList as Y, createBlock as Z, renderSlot as ee, createElementVNode as te } from "vue";
 import { VftTabs as ae, VftTabPane as ne } from "../tabs/index.js";
 import { VftIcon as w } from "../icon/index.js";
 import { isClient as oe } from "@vueuse/core";
@@ -7,11 +7,11 @@ import { addUnit as o } from "../../utils/helper.js";
 import { generateCssVars as M } from "../../utils/ns-cover.js";
 import "lodash-es";
 import "../form/index.js";
-import { useNamespace as le } from "../../hooks/use-namespace/index.js";
+import { useNamespace as ie } from "../../hooks/use-namespace/index.js";
 import "../../hooks/use-model-toggle/index.js";
 import "@popperjs/core";
 import "../../hooks/use-z-index/index.js";
-import { useRouterHelper as ie, getRouterKeyPath as b, listenerRouteChange as re } from "@vft/router";
+import { useRouterHelper as le, getRouterKeyPath as b, listenerRouteChange as re } from "@vft/router";
 import { useMultipleTabStore as se, isTabPinned as $, useTabs as ue } from "@vft/store";
 import { useRefs as ce } from "@vft/use";
 import fe from "hotkeys-js";
@@ -19,9 +19,10 @@ import { onBeforeRouteLeave as me } from "vue-router";
 import de from "./tab-content.vue2.js";
 import { initAffixTabs as ve, useTabsDrag as he } from "./use/use-multiple-tabs.js";
 import "../context-menu/context-menu.vue2.js";
+import "../../locale/use-locale.js";
 const be = B({
   name: "vft-multiple-tabs"
-}), ze = /* @__PURE__ */ B({
+}), De = /* @__PURE__ */ B({
   ...be,
   props: {
     tabsStyle: {},
@@ -32,15 +33,15 @@ const be = B({
     fixExtraScrollWidth: {}
   },
   setup(u) {
-    const R = le("multiple-tabs"), s = q().appContext.config.globalProperties.$router, I = ve(s), l = se(), f = d(
-      () => l.getTabList.filter((e) => !e.meta?.hideTab && $(e)).length
+    const R = ie("multiple-tabs"), s = q().appContext.config.globalProperties.$router, I = ve(s), i = se(), f = d(
+      () => i.getTabList.filter((e) => !e.meta?.hideTab && $(e)).length
     ), L = d(
       () => Math.max(u.fixTabCount, f.value)
-    ), r = v(""), i = v(0), p = v(), { go: C } = ie(s), m = d(() => l.getTabList.filter((e) => !e.meta?.hideTab));
+    ), r = v(""), l = v(0), p = v(), { go: C } = le(s), m = d(() => i.getTabList.filter((e) => !e.meta?.hideTab));
     G(() => {
       if (r.value) {
         const e = m.value.findIndex((n) => b(n) === r.value);
-        e === -1 ? i.value = m.value?.length - 1 : i.value = e, i.value = i.value < f.value ? f.value - 1 : i.value;
+        e === -1 ? l.value = m.value?.length - 1 : l.value = e, l.value = l.value < f.value ? f.value - 1 : l.value;
       }
     }), oe && me(() => {
       p.value = t(s.currentRoute);
@@ -50,13 +51,13 @@ const be = B({
       const { meta: n = {} } = e, { currentActivePath: a, hideTab: c } = n, W = c ? a : null, S = b(e);
       if (r.value !== S && (r.value = S), W) {
         const k = s.getRoutes().find((j) => j.path === a);
-        k && l.addTab(
+        k && i.addTab(
           k,
           t(p),
-          i.value,
+          l.value,
           e
         );
-      } else c || l.addTab(t(e), t(p), i.value);
+      } else c || i.addTab(t(e), t(p), l.value);
     });
     function N(e) {
       if (r.value === e.paneName)
@@ -67,7 +68,7 @@ const be = B({
       C(a || n.fullPath || n.path);
     }
     function _(e) {
-      l.closeTabByKey(e, s);
+      i.closeTabByKey(e, s);
     }
     const { refs: E, setRefs: F } = ce();
     function A(e) {
@@ -100,11 +101,11 @@ const be = B({
       ),
       ...u.contextMenuStyle
     }, K = () => {
-      l.toggleFullScreen(l.getTabList[i.value], s);
+      i.toggleFullScreen(i.getTabList[l.value], s);
     }, x = v(!1);
     let y;
     const U = () => {
-      clearInterval(y), x.value = !0, l.refreshPage(0, s, l.getTabList[i.value]), y = setTimeout(() => {
+      clearInterval(y), x.value = !0, i.refreshPage(0, s, i.getTabList[l.value]), y = setTimeout(() => {
         x.value = !1;
       }, 500);
     };
@@ -161,7 +162,7 @@ const be = B({
                 }, null, 8, ["rotate"]),
                 h(t(w), {
                   onClick: K,
-                  icon: t(l).isFullScreen ? "icon-collapse" : "icon-expand",
+                  icon: t(i).isFullScreen ? "icon-collapse" : "icon-expand",
                   pointer: ""
                 }, null, 8, ["icon"])
               ], 2)
@@ -174,5 +175,5 @@ const be = B({
   }
 });
 export {
-  ze as default
+  De as default
 };

package/es/components/multiple-tabs/tab-content.vue2.js

@@ -1,4 +1,4 @@
-import { defineComponent as r, computed as i, createBlock as f, openBlock as s, unref as x, withModifiers as b } from "vue";
+import { defineComponent as r, computed as i, openBlock as f, createBlock as s, unref as x, withModifiers as b } from "vue";
 import { singleAttrToObj as p } from "@vft/utils";
 import "../context-menu/context-menu.vue2.js";
 import "../icon/index.js";
@@ -29,7 +29,7 @@ const N = /* @__PURE__ */ r({
     }
     return m({
       handleContext: o
-    }), (e, M) => (s(), f(x(d), {
+    }), (e, M) => (f(), s(x(d), {
       class: "vft-multiple-tabs__title",
       title: n.value,
       icon: u.value,