vft 0.0.13 → 0.0.15

package/es/component.mjs

@@ -8,14 +8,16 @@ import { VftTooltip as i } from "./components/tooltip/index.mjs";
 import { VftPopover as e } from "./components/popover/index.mjs";
 import { VftPopper as V } from "./components/popper/index.mjs";
 import { VftTabs as n, VftTabPane as a } from "./components/tabs/index.mjs";
-import { VftCollapseTransition as u } from "./components/collapse-transition/index.mjs";
-import { VftMenu as s, VftMenuItem as l, VftMenuItemGroup as M, VftSubMenu as T } from "./components/menu/index.mjs";
-const G = [
-  s,
+import { VftMultipleTabs as u } from "./components/multiple-tabs/index.mjs";
+import { VftCollapseTransition as s } from "./components/collapse-transition/index.mjs";
+import { VftMenu as l, VftMenuItem as M, VftMenuItemGroup as T, VftSubMenu as b } from "./components/menu/index.mjs";
+const S = [
+  u,
   l,
   M,
   T,
-  u,
+  b,
+  s,
   t,
   o,
   r,
@@ -29,6 +31,6 @@ const G = [
   V
 ];
 export {
-  G as default
+  S as default
 };
 //# sourceMappingURL=component.mjs.map

package/es/component.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"component.mjs","sources":["../../../packages/vft/component.ts"],"sourcesContent":["import { VftDivider } from '@vft-ui/components/divider';\nimport { VftIcon } from '@vft-ui/components/icon';\nimport { VftAvatar } from '@vft-ui/components/avatar';\nimport { VftEmpty } from '@vft-ui/components/empty';\nimport { VftResult } from '@vft-ui/components/result';\nimport { VftException } from '@vft-ui/components/exception';\nimport { VftTooltip } from '@vft-ui/components/tooltip';\nimport { VftPopover } from '@vft-ui/components/popover';\nimport { VftPopper } from '@vft-ui/components/popper';\nimport { VftTabs, VftTabPane } from '@vft-ui/components/tabs';\nimport { VftCollapseTransition } from '@vft-ui/components/collapse-transition';\nimport {\n\tVftMenu,\n\tVftMenuItem,\n\tVftMenuItemGroup,\n\tVftSubMenu,\n} from '@vft-ui/components/menu';\n\nimport type { Plugin } from 'vue';\n\nexport default [\n\tVftMenu,\n\tVftMenuItem,\n\tVftMenuItemGroup,\n\tVftSubMenu,\n\tVftCollapseTransition,\n\tVftDivider,\n\tVftIcon,\n\tVftAvatar,\n\tVftEmpty,\n\tVftResult,\n\tVftException,\n\tVftTabs,\n\tVftTabPane,\n\tVftTooltip,\n\tVftPopover,\n\tVftPopper\n] as Plugin[];\n"],"names":["Components","VftMenu","VftMenuItem","VftMenuItemGroup","VftSubMenu","VftCollapseTransition","VftDivider","VftIcon","VftAvatar","VftEmpty","VftResult","VftException","VftTabs","VftTabPane","VftTooltip","VftPopover","VftPopper"],"mappings":";;;;;;;;;;;;AAoBA,MAAeA,IAAA;AAAA,EACdC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AACD;"}
+{"version":3,"file":"component.mjs","sources":["../../../packages/vft/component.ts"],"sourcesContent":["import { VftDivider } from '@vft-ui/components/divider';\nimport { VftIcon } from '@vft-ui/components/icon';\nimport { VftAvatar } from '@vft-ui/components/avatar';\nimport { VftEmpty } from '@vft-ui/components/empty';\nimport { VftResult } from '@vft-ui/components/result';\nimport { VftException } from '@vft-ui/components/exception';\nimport { VftTooltip } from '@vft-ui/components/tooltip';\nimport { VftPopover } from '@vft-ui/components/popover';\nimport { VftPopper } from '@vft-ui/components/popper';\nimport { VftTabs, VftTabPane } from '@vft-ui/components/tabs';\nimport { VftMultipleTabs } from '@vft-ui/components/multiple-tabs';\nimport { VftCollapseTransition } from '@vft-ui/components/collapse-transition';\nimport {\n\tVftMenu,\n\tVftMenuItem,\n\tVftMenuItemGroup,\n\tVftSubMenu,\n} from '@vft-ui/components/menu';\n\nimport type { Plugin } from 'vue';\n\nexport default [\n\tVftMultipleTabs,\n\tVftMenu,\n\tVftMenuItem,\n\tVftMenuItemGroup,\n\tVftSubMenu,\n\tVftCollapseTransition,\n\tVftDivider,\n\tVftIcon,\n\tVftAvatar,\n\tVftEmpty,\n\tVftResult,\n\tVftException,\n\tVftTabs,\n\tVftTabPane,\n\tVftTooltip,\n\tVftPopover,\n\tVftPopper\n] as Plugin[];\n"],"names":["Components","VftMultipleTabs","VftMenu","VftMenuItem","VftMenuItemGroup","VftSubMenu","VftCollapseTransition","VftDivider","VftIcon","VftAvatar","VftEmpty","VftResult","VftException","VftTabs","VftTabPane","VftTooltip","VftPopover","VftPopper"],"mappings":";;;;;;;;;;;;;AAqBA,MAAeA,IAAA;AAAA,EACdC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AACD;"}

package/es/components/back-top/back-top.vue2.mjs

@@ -12,6 +12,8 @@ import "../collapse-transition/index.mjs";
 import "../tooltip/index.mjs";
 import "../popover/index.mjs";
 import "../menu/index.mjs";
+import "@vft/use";
+import "../multiple-tabs/index.mjs";
 import { useBackTop as w } from "./use-back-top.mjs";
 import { useNamespace as I } from "../../hooks/use-namespace/index.mjs";
 import "@popperjs/core";
@@ -24,7 +26,7 @@ const e = (
   I("back-top")
 ), N = s({
   name: e.b()
-}), Z = /* @__PURE__ */ s({
+}), ot = /* @__PURE__ */ s({
   ...N,
   props: {
     visibilityHeight: { default: 200 },
@@ -35,10 +37,10 @@ const e = (
   },
   emits: ["click"],
   setup(r, { emit: u }) {
-    const f = g(), { handleClick: n, visible: d } = w(f.props, u, e.b()), b = a(() => ({
+    const f = g(), { handleClick: m, visible: d } = w(f.props, u, e.b()), b = a(() => ({
       right: `${r.right}px`,
       bottom: `${r.bottom}px`
-    })), m = a(() => S(r.icon, "icon", {
+    })), n = a(() => S(r.icon, "icon", {
       color: "black"
     }));
     return (k, p) => (i(), l(C, {
@@ -51,14 +53,14 @@ const e = (
           class: x(t(e).b()),
           onClick: p[0] || (p[0] = B(
             //@ts-ignore
-            (...o) => t(n) && t(n)(...o),
+            (...o) => t(m) && t(m)(...o),
             ["stop"]
           ))
         }, [
           T(k.$slots, "default", {}, () => {
             var o;
             return [
-              (o = t(m)) != null && o.icon ? (i(), l(t(_), $(z({ key: 0 }, t(m))), null, 16)) : c("", !0)
+              (o = t(n)) != null && o.icon ? (i(), l(t(_), $(z({ key: 0 }, t(n))), null, 16)) : c("", !0)
             ];
           })
         ], 6)) : c("", !0)
@@ -68,6 +70,6 @@ const e = (
   }
 });
 export {
-  Z as default
+  ot as default
 };
 //# sourceMappingURL=back-top.vue2.mjs.map

package/es/components/back-top/back-top.vue2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"back-top.vue2.mjs","sources":["../../../../../packages/components/back-top/back-top.vue"],"sourcesContent":["<script lang=\"ts\">\nconst ns = /* hoist-static*/ useNamespace('back-top')\n\nimport { defineComponent as DO_defineComponent } from 'vue';\nexport default /*#__PURE__*/ DO_defineComponent({\n\tname: ns.b()\n});</script>\n<script lang=\"ts\" setup>\nimport { singleAttrToObj } from '@vft/utils';\nimport { type IconProps, VftIcon } from '@vft-ui/components';\nimport { useBackTop } from './use-back-top';\nimport { useNamespace } from '@vft-ui/hooks';\nimport { computed, getCurrentInstance } from 'vue';\n\ninterface BackTopProps {\n  /** 滚动高度达到此参数值才出现 */\n  visibilityHeight?: number\n  /** 触发滚动的对象 */\n  target?: string\n  /** 控制其显示位置，距离页面右边距 */\n  right?: number\n  /** 控制其显示位置，距离页面底部距离 */\n  bottom?: number\n  /** 滚动 icon dom  */\n  icon?: IconProps\n}\n\ndefineProps({\n  \"visibilityHeight\": { default: 200 },\n  \"target\": null,\n  \"right\": { default: 40 },\n  \"bottom\": { default: 40 },\n  \"icon\": { default: 'vi-back-top' }\n})\n\nconst emit = defineEmits(['click']);\n\n\n\n;\n\nconst instance = getCurrentInstance()!;\n\nconst { handleClick, visible } = useBackTop(instance.props, emit, ns.b());\n\nconst backTopStyle = computed(() => ({\n  right: `${__props.right}px`,\n  bottom: `${__props.bottom}px`\n}));\n\nconst _icon = computed(() => {\n  return singleAttrToObj(__props.icon, 'icon', {\n    color: 'black'\n  }) as IconProps;\n});\n</script>\n\n<template>\n  <transition :name=\"`${ns.namespace}-fade-in`\">\n    <div\n      v-if=\"visible\"\n      :style=\"backTopStyle\"\n      :class=\"ns.b()\"\n      @click.stop=\"handleClick\"\n    >\n      <slot>\n        <vft-icon v-if=\"_icon?.icon\" v-bind=\"_icon\" />\n      </slot>\n    </div>\n  </transition>\n</template>\n"],"names":["ns","useNamespace","__default__","DO_defineComponent","instance","getCurrentInstance","handleClick","visible","useBackTop","emit","backTopStyle","computed","__props","_icon","singleAttrToObj"],"mappings":";;;;;;;;;;;;;;;;;;;;;AACA,MAAMA;AAAA;AAAA,EAAuBC,EAAa,UAAU;AAAA,GAGpDC,IAA6BC,EAAmB;AAAA,EAC/C,MAAMH,EAAG,EAAE;AACZ,CAAC;;;;;;;;;;;AAmCD,UAAMI,IAAWC,KAEX,EAAE,aAAAC,GAAa,SAAAC,EAAY,IAAAC,EAAWJ,EAAS,OAAOK,GAAMT,EAAG,EAAA,CAAG,GAElEU,IAAeC,EAAS,OAAO;AAAA,MACnC,OAAO,GAAGC,EAAQ;AAAA,MAClB,QAAQ,GAAGA,EAAQ;AAAA,IACnB,EAAA,GAEIC,IAAQF,EAAS,MACdG,EAAgBF,EAAQ,MAAM,QAAQ;AAAA,MAC3C,OAAO;AAAA,IAAA,CACR,CACF;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"back-top.vue2.mjs","sources":["../../../../../packages/components/back-top/back-top.vue"],"sourcesContent":["<script lang=\"ts\">\nconst ns = /* hoist-static*/ useNamespace('back-top')\n\nimport { defineComponent as DO_defineComponent } from 'vue';\nexport default /*#__PURE__*/ DO_defineComponent({\n\tname: ns.b()\n});</script>\n<script lang=\"ts\" setup>\nimport { singleAttrToObj } from '@vft/utils';\nimport { type IconProps, VftIcon } from '@vft-ui/components';\nimport { useBackTop } from './use-back-top';\nimport { useNamespace } from '@vft-ui/hooks';\nimport { computed, getCurrentInstance } from 'vue';\n\ninterface BackTopProps {\n  /** 滚动高度达到此参数值才出现 */\n  visibilityHeight?: number\n  /** 触发滚动的对象 */\n  target?: string\n  /** 控制其显示位置，距离页面右边距 */\n  right?: number\n  /** 控制其显示位置，距离页面底部距离 */\n  bottom?: number\n  /** 滚动 icon dom  */\n  icon?: IconProps\n}\n\ndefineProps({\n  \"visibilityHeight\": { default: 200 },\n  \"target\": null,\n  \"right\": { default: 40 },\n  \"bottom\": { default: 40 },\n  \"icon\": { default: 'vi-back-top' }\n})\n\nconst emit = defineEmits(['click']);\n\n\n\n;\n\nconst instance = getCurrentInstance()!;\n\nconst { handleClick, visible } = useBackTop(instance.props, emit, ns.b());\n\nconst backTopStyle = computed(() => ({\n  right: `${__props.right}px`,\n  bottom: `${__props.bottom}px`\n}));\n\nconst _icon = computed(() => {\n  return singleAttrToObj(__props.icon, 'icon', {\n    color: 'black'\n  }) as IconProps;\n});\n</script>\n\n<template>\n  <transition :name=\"`${ns.namespace}-fade-in`\">\n    <div\n      v-if=\"visible\"\n      :style=\"backTopStyle\"\n      :class=\"ns.b()\"\n      @click.stop=\"handleClick\"\n    >\n      <slot>\n        <vft-icon v-if=\"_icon?.icon\" v-bind=\"_icon\" />\n      </slot>\n    </div>\n  </transition>\n</template>\n"],"names":["ns","useNamespace","__default__","DO_defineComponent","instance","getCurrentInstance","handleClick","visible","useBackTop","emit","backTopStyle","computed","__props","_icon","singleAttrToObj"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AACA,MAAMA;AAAA;AAAA,EAAuBC,EAAa,UAAU;AAAA,GAGpDC,IAA6BC,EAAmB;AAAA,EAC/C,MAAMH,EAAG,EAAE;AACZ,CAAC;;;;;;;;;;;AAmCD,UAAMI,IAAWC,KAEX,EAAE,aAAAC,GAAa,SAAAC,EAAY,IAAAC,EAAWJ,EAAS,OAAOK,GAAMT,EAAG,EAAA,CAAG,GAElEU,IAAeC,EAAS,OAAO;AAAA,MACnC,OAAO,GAAGC,EAAQ;AAAA,MAClB,QAAQ,GAAGA,EAAQ;AAAA,IACnB,EAAA,GAEIC,IAAQF,EAAS,MACdG,EAAgBF,EAAQ,MAAM,QAAQ;AAAA,MAC3C,OAAO;AAAA,IAAA,CACR,CACF;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/components/context-menu/context-menu.vue.d.ts

@@ -0,0 +1,39 @@
+import type { PropType as __PropType } from 'vue';
+import { type CSSProperties } from 'vue';
+import type { Axis, ContextMenuItem } from './types';
+declare const _sfc_main: import("vue").DefineComponent<{
+    axis: {
+        type: __PropType<Axis | undefined>;
+        required: false;
+    };
+    styles: {
+        type: __PropType<CSSProperties | undefined>;
+        required: false;
+    };
+    width: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    items: {
+        type: __PropType<ContextMenuItem[] | undefined>;
+        required: false;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    axis: {
+        type: __PropType<Axis | undefined>;
+        required: false;
+    };
+    styles: {
+        type: __PropType<CSSProperties | undefined>;
+        required: false;
+    };
+    width: {
+        type: __PropType<number | undefined>;
+        required: false;
+    };
+    items: {
+        type: __PropType<ContextMenuItem[] | undefined>;
+        required: false;
+    };
+}>>, {}>;
+export default _sfc_main;

package/es/components/context-menu/context-menu.vue.mjs

@@ -0,0 +1,5 @@
+import f from "./context-menu.vue2.mjs";
+export {
+  f as default
+};
+//# sourceMappingURL=context-menu.vue.mjs.map

package/es/components/context-menu/context-menu.vue.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"context-menu.vue.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/es/components/context-menu/context-menu.vue2.mjs

@@ -0,0 +1,93 @@
+import { defineComponent as w, ref as c, computed as y, openBlock as s, createBlock as a, Transition as k, withCtx as C, withDirectives as b, createElementVNode as f, normalizeStyle as g, unref as u, withModifiers as M, createElementBlock as $, Fragment as z, renderList as B, vShow as E } from "vue";
+import { useTimeoutFn as S, useClickAway as A, useEventListener as m } from "@vft/use";
+import "../divider/index.mjs";
+import "../icon/index.mjs";
+import "../avatar/index.mjs";
+import "../empty/index.mjs";
+import "../result/index.mjs";
+import "../exception/index.mjs";
+import "../tabs/index.mjs";
+import "../popper/index.mjs";
+import "../collapse-transition/index.mjs";
+import "../tooltip/index.mjs";
+import "../popover/index.mjs";
+import { VftMenuItem as F } from "../menu/index.mjs";
+import "@vft/utils";
+import "../multiple-tabs/index.mjs";
+const H = { class: "vri-sub-menu" }, Q = /* @__PURE__ */ w({
+  __name: "context-menu",
+  props: {
+    axis: null,
+    styles: null,
+    width: null,
+    items: null
+  },
+  setup(i) {
+    let d = c();
+    const p = y(() => {
+      const { x: e, y: t } = i.axis || { x: 0, y: 0 }, n = (i.items || []).length * 40, l = i.width || 0, r = document.body, v = r.clientWidth < e + l ? e - l : e, h = r.clientHeight < t + n ? t - n : t;
+      return {
+        zIndex: 3e3,
+        ...i.styles,
+        position: "fixed",
+        width: `${i.width}px`,
+        left: `${v + 1}px`,
+        top: `${h + 1}px`
+      };
+    });
+    let o = c(!1);
+    S(() => {
+      o.value = !0;
+    }, 0), A(d, () => {
+      o.value = !1;
+    }, {
+      listenerOptions: {
+        capture: !0
+      }
+    }), m(window, "scroll", () => {
+      o.value = !1;
+    }, {
+      capture: !0
+    }), m(window, "drag", () => {
+      o.value = !1;
+    }, {
+      capture: !0
+    });
+    function x(e) {
+      var t;
+      e != null && e.disabled || ((t = e.handler) == null || t.call(e), o.value = !1);
+    }
+    return (e, t) => (s(), a(k, { name: "vri-zoom-in-top" }, {
+      default: C(() => [
+        b(f("div", {
+          ref_key: "contextMenuRef",
+          ref: d,
+          style: g(u(p)),
+          onClick: t[0] || (t[0] = M(() => {
+          }, ["stop"])),
+          class: "vft-menu"
+        }, [
+          f("div", H, [
+            (s(!0), $(z, null, B(i.items, (n, l) => (s(), a(u(F), {
+              onClick: (r) => x(n),
+              index: l + n.text,
+              title: n.text,
+              divider: n.divider,
+              disabled: n.disabled,
+              icon: n.iconCfg,
+              isAloneUse: "",
+              key: l
+            }, null, 8, ["onClick", "index", "title", "divider", "disabled", "icon"]))), 128))
+          ])
+        ], 4), [
+          [E, u(o)]
+        ])
+      ]),
+      _: 1
+    }));
+  }
+});
+export {
+  Q as default
+};
+//# sourceMappingURL=context-menu.vue2.mjs.map

package/es/components/context-menu/context-menu.vue2.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"context-menu.vue2.mjs","sources":["../../../../../packages/components/context-menu/context-menu.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useClickAway, useEventListener, useTimeoutFn } from '@vft/use';\nimport { computed, ref, type CSSProperties } from 'vue';\nimport type { Axis, ContextMenuItem } from './types';\nimport { VftMenuItem as MenuItem } from '@vft-ui/components';\n\ninterface Props {\n  axis?: Axis;\n  styles?: CSSProperties;\n  width?: number;\n  items?: ContextMenuItem[];\n}\n\ndefineProps({\n  \"axis\": null,\n  \"styles\": null,\n  \"width\": null,\n  \"items\": null\n})\n\nlet contextMenuRef = ref();\n\nconst getStyle = computed((): CSSProperties => {\n  const { x, y } = __props.axis || { x: 0, y: 0 };\n  const menuHeight = (__props.items || []).length * 40;\n  const menuWidth = __props.width || 0;\n  const body = document.body;\n\n  const left = body.clientWidth < x + menuWidth ? x - menuWidth : x;\n  const top = body.clientHeight < y + menuHeight ? y - menuHeight : y;\n  return {\n    zIndex: 3000,\n    ...__props.styles,\n    position: 'fixed',\n    width: `${__props.width}px`,\n    left: `${left + 1}px`,\n    top: `${top + 1}px`\n  };\n});\n\nlet show = ref(false);\n\nuseTimeoutFn(() => {\n  show.value = true;\n}, 0);\n\nuseClickAway(contextMenuRef, () => {\n  show.value = false;\n}, {\n  listenerOptions: {\n    capture: true\n  }\n});\n\nuseEventListener(window, 'scroll', () => {\n  show.value = false;\n}, {\n  capture: true\n});\n\nuseEventListener(window, 'drag', () => {\n  show.value = false;\n}, {\n  capture: true\n});\n\nfunction handleClick (item: ContextMenuItem) {\n  if (!item?.disabled) {\n    item.handler?.();\n    show.value = false;\n  }\n}\n</script>\n\n<template>\n  <transition name=\"vri-zoom-in-top\">\n    <div ref=\"contextMenuRef\" v-show=\"show\" :style=\"getStyle\" @click.stop class=\"vft-menu\">\n      <div class=\"vri-sub-menu\">\n        <menu-item v-for=\"(item, index) in items\"\n          @click=\"handleClick(item)\"\n          :index=\"index + item.text\"\n          :title=\"item.text\"\n          :divider=\"item.divider\"\n          :disabled=\"item.disabled\"\n          :icon=\"item.iconCfg\"\n          isAloneUse\n          :key=\"index\" />\n      </div>\n    </div>\n  </transition>\n</template>\n\n"],"names":["contextMenuRef","ref","getStyle","computed","x","y","__props","menuHeight","menuWidth","body","left","top","show","useTimeoutFn","useClickAway","useEventListener","handleClick","item","_a"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,QAAIA,IAAiBC;AAEf,UAAAC,IAAWC,EAAS,MAAqB;AACvC,YAAA,EAAE,GAAAC,GAAG,GAAAC,EAAM,IAAAC,EAAQ,QAAQ,EAAE,GAAG,GAAG,GAAG,KACtCC,KAAcD,EAAQ,SAAS,IAAI,SAAS,IAC5CE,IAAYF,EAAQ,SAAS,GAC7BG,IAAO,SAAS,MAEhBC,IAAOD,EAAK,cAAcL,IAAII,IAAYJ,IAAII,IAAYJ,GAC1DO,IAAMF,EAAK,eAAeJ,IAAIE,IAAaF,IAAIE,IAAaF;AAC3D,aAAA;AAAA,QACL,QAAQ;AAAA,QACR,GAAGC,EAAQ;AAAA,QACX,UAAU;AAAA,QACV,OAAO,GAAGA,EAAQ;AAAA,QAClB,MAAM,GAAGI,IAAO;AAAA,QAChB,KAAK,GAAGC,IAAM;AAAA,MAAA;AAAA,IAChB,CACD;AAEG,QAAAC,IAAOX,EAAI,EAAK;AAEpB,IAAAY,EAAa,MAAM;AACjB,MAAAD,EAAK,QAAQ;AAAA,OACZ,CAAC,GAEJE,EAAad,GAAgB,MAAM;AACjC,MAAAY,EAAK,QAAQ;AAAA,IAAA,GACZ;AAAA,MACD,iBAAiB;AAAA,QACf,SAAS;AAAA,MACX;AAAA,IAAA,CACD,GAEgBG,EAAA,QAAQ,UAAU,MAAM;AACvC,MAAAH,EAAK,QAAQ;AAAA,IAAA,GACZ;AAAA,MACD,SAAS;AAAA,IAAA,CACV,GAEgBG,EAAA,QAAQ,QAAQ,MAAM;AACrC,MAAAH,EAAK,QAAQ;AAAA,IAAA,GACZ;AAAA,MACD,SAAS;AAAA,IAAA,CACV;AAED,aAASI,EAAaC,GAAuB;;AACvC,MAACA,KAAA,QAAAA,EAAM,cACTC,IAAAD,EAAK,YAAL,QAAAC,EAAA,KAAAD,IACAL,EAAK,QAAQ;AAAA,IAEjB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/components/context-menu/createContextMenu.d.ts

@@ -0,0 +1,3 @@
+import type { CreateContextOptions } from './types';
+export declare const createContextMenu: (options: CreateContextOptions) => Promise<unknown> | undefined;
+export declare const destroyContextMenu: () => void;

package/es/components/context-menu/createContextMenu.mjs

@@ -0,0 +1,41 @@
+import { isClient as a } from "@vft/utils";
+import { createVNode as f, render as u } from "vue";
+import v from "./context-menu.vue2.mjs";
+const e = {
+  domList: [],
+  resolve: () => {
+  }
+}, x = function(r) {
+  const { event: t } = r || {};
+  if (t && (t == null || t.preventDefault()), !!a)
+    return new Promise((l) => {
+      const n = document.body, c = document.createElement("div"), i = {
+        ...r
+      };
+      r.event && (i.axis = { x: t.clientX, y: t.clientY }, delete i.event);
+      const d = f(v, i);
+      u(d, c);
+      const s = function() {
+        e.resolve("");
+      };
+      e.domList.push(c);
+      const m = function() {
+        e.domList.forEach((o) => {
+          try {
+            o && n.removeChild(o);
+          } catch {
+          }
+        }), n.removeEventListener("click", s), n.removeEventListener("scroll", s);
+      };
+      e.resolve = function(o) {
+        m(), l(o);
+      }, m(), n.appendChild(c);
+    });
+}, y = function() {
+  e && (e.resolve(""), e.domList = []);
+};
+export {
+  x as createContextMenu,
+  y as destroyContextMenu
+};
+//# sourceMappingURL=createContextMenu.mjs.map

package/es/components/context-menu/createContextMenu.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"createContextMenu.mjs","sources":["../../../../../packages/components/context-menu/createContextMenu.ts"],"sourcesContent":["import { isClient } from '@vft/utils';\nimport { createVNode, render } from 'vue';\nimport contextMenuVue from './context-menu.vue';\nimport type { ContextMenuProps, CreateContextOptions } from './types';\n\nconst menuManager: {\n  domList: Element[];\n  resolve: Fn;\n} = {\n  domList: [],\n  resolve: () => {}\n};\n\nexport const createContextMenu = function (options: CreateContextOptions) {\n  const { event } = options || {};\n\n  // event?.preventDefault() 阻止浏览器的默认右键菜单事件\n  event && event?.preventDefault();\n\n  if (!isClient) {\n    return;\n  }\n  return new Promise((resolve) => {\n    const body = document.body;\n\n    const container = document.createElement('div');\n    const propsData: Partial<ContextMenuProps> = {\n      ...options\n    };\n\n    if (options.event) {\n      propsData.axis = { x: event.clientX, y: event.clientY };\n      // @ts-ignore\n      delete propsData.event;\n    }\n\n    const vm = createVNode(contextMenuVue, propsData);\n    render(vm, container);\n\n    const handleClick = function () {\n      menuManager.resolve('');\n    };\n\n    menuManager.domList.push(container);\n\n    const remove = function () {\n      menuManager.domList.forEach((dom: Element) => {\n        try {\n          dom && body.removeChild(dom);\n        } catch (error) {}\n      });\n      body.removeEventListener('click', handleClick);\n      body.removeEventListener('scroll', handleClick);\n    };\n\n    menuManager.resolve = function (arg) {\n      remove();\n      resolve(arg);\n    };\n    remove();\n    body.appendChild(container);\n    // body.addEventListener('click', handleClick);\n    // body.addEventListener('scroll', handleClick);\n  });\n};\n\nexport const destroyContextMenu = function () {\n  if (menuManager) {\n    menuManager.resolve('');\n    menuManager.domList = [];\n  }\n};\n"],"names":["menuManager","createContextMenu","options","event","isClient","resolve","body","container","propsData","vm","createVNode","contextMenuVue","render","handleClick","remove","dom","arg","destroyContextMenu"],"mappings":";;;AAKA,MAAMA,IAGF;AAAA,EACF,SAAS,CAAC;AAAA,EACV,SAAS,MAAM;AAAA,EAAC;AAClB,GAEaC,IAAoB,SAAUC,GAA+B;AACxE,QAAM,EAAE,OAAAC,EAAA,IAAUD,KAAW;AAK7B,MAFAC,MAASA,KAAA,QAAAA,EAAO,mBAEZ,EAACC;AAGE,WAAA,IAAI,QAAQ,CAACC,MAAY;AAC9B,YAAMC,IAAO,SAAS,MAEhBC,IAAY,SAAS,cAAc,KAAK,GACxCC,IAAuC;AAAA,QAC3C,GAAGN;AAAA,MAAA;AAGL,MAAIA,EAAQ,UACVM,EAAU,OAAO,EAAE,GAAGL,EAAM,SAAS,GAAGA,EAAM,WAE9C,OAAOK,EAAU;AAGb,YAAAC,IAAKC,EAAYC,GAAgBH,CAAS;AAChD,MAAAI,EAAOH,GAAIF,CAAS;AAEpB,YAAMM,IAAc,WAAY;AAC9B,QAAAb,EAAY,QAAQ,EAAE;AAAA,MAAA;AAGZ,MAAAA,EAAA,QAAQ,KAAKO,CAAS;AAElC,YAAMO,IAAS,WAAY;AACb,QAAAd,EAAA,QAAQ,QAAQ,CAACe,MAAiB;AACxC,cAAA;AACK,YAAAA,KAAAT,EAAK,YAAYS,CAAG;AAAA;UACZ;AAAA,QAAA,CAClB,GACIT,EAAA,oBAAoB,SAASO,CAAW,GACxCP,EAAA,oBAAoB,UAAUO,CAAW;AAAA,MAAA;AAGpC,MAAAb,EAAA,UAAU,SAAUgB,GAAK;AAC5B,QAAAF,KACPT,EAAQW,CAAG;AAAA,MAAA,GAENF,KACPR,EAAK,YAAYC,CAAS;AAAA,IAAA,CAG3B;AACH,GAEaU,IAAqB,WAAY;AAC5C,EAAIjB,MACFA,EAAY,QAAQ,EAAE,GACtBA,EAAY,UAAU;AAE1B;"}

package/es/components/context-menu/index.d.ts

@@ -0,0 +1,3 @@
+export { createContextMenu, destroyContextMenu } from './createContextMenu';
+export { useContextMenu } from './useContextMenu';
+export * from './types';

package/es/components/context-menu/index.mjs

@@ -0,0 +1,8 @@
+import { createContextMenu as o, destroyContextMenu as n } from "./createContextMenu.mjs";
+import { useContextMenu as x } from "./useContextMenu.mjs";
+export {
+  o as createContextMenu,
+  n as destroyContextMenu,
+  x as useContextMenu
+};
+//# sourceMappingURL=index.mjs.map

package/es/components/context-menu/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/es/components/context-menu/style/css.mjs

@@ -0,0 +1,3 @@
+import "vft/theme-style/base.css";
+import "vft/theme-style/vft-context-menu.css";
+//# sourceMappingURL=css.mjs.map

package/es/components/context-menu/style/css.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"css.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/es/components/context-menu/style/index.mjs

@@ -0,0 +1,3 @@
+import "../../../theme-style/src/base.scss.mjs";
+import "vft/theme-style/src/context-menu.scss";
+//# sourceMappingURL=index.mjs.map

package/es/components/context-menu/style/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/es/components/context-menu/types.d.ts

@@ -0,0 +1,23 @@
+import { type CSSProperties } from 'vue';
+import { type IconProps } from 'vft/es/components';
+export interface Axis {
+    x: number;
+    y: number;
+}
+export interface ContextMenuItem {
+    text: string;
+    iconCfg?: IconProps;
+    disabled?: boolean;
+    handler?: Fn;
+    divider?: boolean;
+}
+export interface CreateContextOptions {
+    event: MouseEvent;
+    styles?: CSSProperties | Record<string, string>;
+    items?: ContextMenuItem[];
+}
+export interface ContextMenuProps {
+    axis: Axis;
+    styles: CSSProperties;
+    items: ContextMenuItem[];
+}

package/es/components/context-menu/types.mjs

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=types.mjs.map

package/es/components/context-menu/types.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/es/components/context-menu/useContextMenu.d.ts

@@ -0,0 +1,3 @@
+import type { ContextMenuItem } from './types';
+export type { ContextMenuItem };
+export declare function useContextMenu(authRemove?: boolean): (((options: import("./types").CreateContextOptions) => Promise<unknown> | undefined) | (() => void))[];

package/es/components/context-menu/useContextMenu.mjs

@@ -0,0 +1,11 @@
+import { getCurrentInstance as n, onUnmounted as o } from "vue";
+import { destroyContextMenu as t, createContextMenu as r } from "./createContextMenu.mjs";
+function f(e = !0) {
+  return n() && e && o(() => {
+    t();
+  }), [r, t];
+}
+export {
+  f as useContextMenu
+};
+//# sourceMappingURL=useContextMenu.mjs.map

package/es/components/context-menu/useContextMenu.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useContextMenu.mjs","sources":["../../../../../packages/components/context-menu/useContextMenu.ts"],"sourcesContent":["import { onUnmounted, getCurrentInstance } from 'vue';\nimport { createContextMenu, destroyContextMenu } from './createContextMenu';\nimport type { ContextMenuItem } from './types';\n\nexport type { ContextMenuItem };\n\nexport function useContextMenu(authRemove = true) {\n  if (getCurrentInstance() && authRemove) {\n    onUnmounted(() => {\n      destroyContextMenu();\n    });\n  }\n  return [createContextMenu, destroyContextMenu];\n}\n"],"names":["useContextMenu","authRemove","getCurrentInstance","onUnmounted","destroyContextMenu","createContextMenu"],"mappings":";;AAMgB,SAAAA,EAAeC,IAAa,IAAM;AAC5C,SAAAC,OAAwBD,KAC1BE,EAAY,MAAM;AACG,IAAAC;EAAA,CACpB,GAEI,CAACC,GAAmBD,CAAkB;AAC/C;"}

package/es/components/index.d.ts

@@ -10,3 +10,5 @@ export * from './collapse-transition';
 export * from './tooltip';
 export * from './popover';
 export * from './menu';
+export * from './context-menu';
+export * from './multiple-tabs';

package/es/components/index.mjs

@@ -1,41 +1,53 @@
 import { VftDivider as r } from "./divider/index.mjs";
 import { VftIcon as f } from "./icon/index.mjs";
-import { VftAvatar as m } from "./avatar/index.mjs";
-import { VftEmpty as V } from "./empty/index.mjs";
-import { VftResult as n } from "./result/index.mjs";
+import { VftAvatar as x } from "./avatar/index.mjs";
+import { VftEmpty as n } from "./empty/index.mjs";
+import { VftResult as V } from "./result/index.mjs";
 import { VftException as s } from "./exception/index.mjs";
-import { VftTabPane as l, VftTabs as P } from "./tabs/index.mjs";
-import { VftPopper as b } from "./popper/index.mjs";
-import { VftCollapseTransition as E } from "./collapse-transition/index.mjs";
-import { VftTooltip as v } from "./tooltip/index.mjs";
-import { VftPopover as C } from "./popover/index.mjs";
-import { VftMenu as c, VftMenuItem as g, VftMenuItemGroup as A, VftSubMenu as R } from "./menu/index.mjs";
-import { EmptyEnum as D } from "./empty/constants.mjs";
-import { TabsRootContextKey as K } from "./tabs/types.mjs";
-import { default as h } from "./popper/arrow.vue2.mjs";
-import { default as k } from "./popper/trigger.vue2.mjs";
-import { default as z } from "./popper/content.vue2.mjs";
+import { VftTabPane as T, VftTabs as l } from "./tabs/index.mjs";
+import { VftPopper as M } from "./popper/index.mjs";
+import { VftCollapseTransition as C } from "./collapse-transition/index.mjs";
+import { VftTooltip as y } from "./tooltip/index.mjs";
+import { VftPopover as c } from "./popover/index.mjs";
+import { VftMenu as v, VftMenuItem as A, VftMenuItemGroup as D, VftSubMenu as I } from "./menu/index.mjs";
+import { createContextMenu as R, destroyContextMenu as G } from "./context-menu/createContextMenu.mjs";
+import { useContextMenu as S } from "./context-menu/useContextMenu.mjs";
+import { VftMultipleTabs as j } from "./multiple-tabs/index.mjs";
+import { EmptyEnum as q } from "./empty/constants.mjs";
+import { TabsRootContextKey as B } from "./tabs/types.mjs";
+import { default as H } from "./popper/arrow.vue2.mjs";
+import { default as L } from "./popper/trigger.vue2.mjs";
+import { default as O } from "./popper/content.vue2.mjs";
+import { useTabDropdown as U } from "./multiple-tabs/use/use-tab-dropdown.mjs";
+import { initAffixTabs as X, useTabsDrag as Y } from "./multiple-tabs/use/use-multiple-tabs.mjs";
 export {
-  D as EmptyEnum,
-  K as TabsRootContextKey,
-  m as VftAvatar,
-  E as VftCollapseTransition,
+  q as EmptyEnum,
+  B as TabsRootContextKey,
+  x as VftAvatar,
+  C as VftCollapseTransition,
   r as VftDivider,
-  V as VftEmpty,
+  n as VftEmpty,
   s as VftException,
   f as VftIcon,
-  c as VftMenu,
-  g as VftMenuItem,
-  A as VftMenuItemGroup,
-  C as VftPopover,
-  b as VftPopper,
-  h as VftPopperArrow,
-  z as VftPopperContent,
-  k as VftPopperTrigger,
-  n as VftResult,
-  R as VftSubMenu,
-  l as VftTabPane,
-  P as VftTabs,
-  v as VftTooltip
+  v as VftMenu,
+  A as VftMenuItem,
+  D as VftMenuItemGroup,
+  j as VftMultipleTabs,
+  c as VftPopover,
+  M as VftPopper,
+  H as VftPopperArrow,
+  O as VftPopperContent,
+  L as VftPopperTrigger,
+  V as VftResult,
+  I as VftSubMenu,
+  T as VftTabPane,
+  l as VftTabs,
+  y as VftTooltip,
+  R as createContextMenu,
+  G as destroyContextMenu,
+  X as initAffixTabs,
+  S as useContextMenu,
+  U as useTabDropdown,
+  Y as useTabsDrag
 };
 //# sourceMappingURL=index.mjs.map

package/es/components/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}

package/es/components/menu/menu-item.vue2.mjs

@@ -20,12 +20,14 @@ import "../collapse-transition/index.mjs";
 import { VftTooltip as R } from "../tooltip/index.mjs";
 import "../popover/index.mjs";
 import "./index.mjs";
+import "@vft/use";
+import "../multiple-tabs/index.mjs";
 const W = ["title"], b = (
   /* hoist-static*/
   k("menu-item")
 ), X = S({
   name: b.b()
-}), xe = /* @__PURE__ */ S({
+}), Ue = /* @__PURE__ */ S({
   ...X,
   props: {
     index: null,
@@ -42,19 +44,19 @@ const W = ["title"], b = (
   setup(e, { emit: T }) {
     const y = M(), w = k("menu"), a = k("menu-item"), n = e.isAloneUse ? null : V("rootMenu");
     !n && !e.isAloneUse && P(b.b(), "can not inject root menu");
-    const { parentMenu: g, indexPath: h } = L(
+    const { parentMenu: p, indexPath: g } = L(
       y,
       r(() => e.index)
-    ), i = e.isAloneUse ? null : V(`subMenu:${g.value.uid}`);
+    ), i = e.isAloneUse ? null : V(`subMenu:${p.value.uid}`);
     !i && !e.isAloneUse && P(b.b(), "can not inject sub menu");
-    const p = r(() => e.index === (n == null ? void 0 : n.activeIndex)), l = Y({
+    const h = r(() => e.index === (n == null ? void 0 : n.activeIndex)), l = Y({
       index: e.index,
-      indexPath: h,
-      active: p
+      indexPath: g,
+      active: h
     }), z = () => {
       e.disabled || (n == null || n.handleMenuItemClick({
         index: e.index,
-        indexPath: h.value,
+        indexPath: g.value,
         route: e.route
       }), T("click", l));
     }, x = r(() => H(e.icon, "icon")), A = r(() => J(y, "title"));
@@ -70,12 +72,12 @@ const W = ["title"], b = (
           marginY: "0"
         })) : u("", !0),
         f("li", {
-          class: $([e.className, t(a).b(), t(a).is("active", e.isAloneUse ? !1 : t(p)), t(a).is("disabled", e.disabled)]),
+          class: $([e.className, t(a).b(), t(a).is("active", e.isAloneUse ? !1 : t(h)), t(a).is("disabled", e.disabled)]),
           role: "menuitem",
           tabindex: "-1",
           onClick: z
         }, [
-          ((B = (U = t(g)) == null ? void 0 : U.type) == null ? void 0 : B.name) === "vft-menu" && ((C = t(n)) != null && C.props.collapse) && m.$slots.title ? (o(), s(t(R), {
+          ((B = (U = t(p)) == null ? void 0 : U.type) == null ? void 0 : B.name) === "vft-menu" && ((C = t(n)) != null && C.props.collapse) && m.$slots.title ? (o(), s(t(R), {
             key: 0,
             placement: "right",
             "fallback-placements": ["left"],
@@ -110,6 +112,6 @@ const W = ["title"], b = (
   }
 });
 export {
-  xe as default
+  Ue as default
 };
 //# sourceMappingURL=menu-item.vue2.mjs.map

package/es/components/menu/menu-item.vue2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"menu-item.vue2.mjs","sources":["../../../../../packages/components/menu/menu-item.vue"],"sourcesContent":["<script lang=\"ts\">\nconst ns = /* hoist-static*/ useNamespace('menu-item')\n\nimport { defineComponent as DO_defineComponent } from 'vue';\nexport default /*#__PURE__*/ DO_defineComponent({\n  name: ns.b()\n});</script>\n<script lang=\"ts\" setup>\nimport { renderTNode, singleAttrToObj, VNode } from '@vft/utils';\nimport { computed, getCurrentInstance, inject, onBeforeUnmount, onMounted, reactive } from 'vue';\nimport { throwError } from '@vft-ui/utils';\nimport { useNamespace } from '@vft-ui/hooks';\nimport { type RouteLocationRaw } from 'vue-router';\nimport useMenu from './use-menu';\nimport { VftIcon as Icon, type IconProps, VftTooltip as Tooltip, VftDivider } from '@vft-ui/components';\n\nimport type { MenuItemRegistered, MenuProvider, SubMenuProvider } from './types';\n\ninterface Props {\n  /** 唯一标志 */\n  index?: string;\n  /** Vue Router 路径对象 */\n  route?: RouteLocationRaw;\n  /** 是否禁用 */\n  disabled?: boolean;\n  icon?: IconProps;\n  title?: string;\n  isAloneUse?: boolean;\n  divider?: boolean;\n  className?: string\n  reverse?: boolean\n}\n\ndefineProps({\n  \"index\": null,\n  \"route\": null,\n  \"disabled\": { type: Boolean,  },\n  \"icon\": null,\n  \"title\": null,\n  \"isAloneUse\": { type: Boolean,  },\n  \"divider\": { type: Boolean,  },\n  \"className\": null,\n  \"reverse\": { type: Boolean,  }\n})\n\n\n\nconst emit = defineEmits(['click']);\n\n;\n\nconst instance = getCurrentInstance()!;\n\nconst nsMenu = useNamespace('menu');\n\nconst nsMenuItem = useNamespace('menu-item');\n\n// 获取来自 menu.vue 中注入的数据\nconst rootMenu = !__props.isAloneUse ? inject<MenuProvider>('rootMenu') : null;\nif (!rootMenu && !__props.isAloneUse) throwError(ns.b(), 'can not inject root menu');\n\n// indexPath：当前 menu-item 对应的 index 和 vft-sub-menu 的 index，parentMenu 为 vft-sub-menu 组件\nconst { parentMenu, indexPath } = useMenu(\n  instance,\n  computed(() => __props.index!)\n);\n\n// 注入来自 sub-menu 中的 provide 数据\nconst subMenu = !__props.isAloneUse ? inject<SubMenuProvider>(`subMenu:${parentMenu.value.uid}`) : null;\nif (!subMenu && !__props.isAloneUse) throwError(ns.b(), 'can not inject sub menu');\n\n// 当前是否为 active\nconst active = computed(() => __props.index === rootMenu?.activeIndex);\n\nconst item: MenuItemRegistered = reactive({\n  index: __props.index!,\n  indexPath,\n  active\n});\n\n// 点击具体菜单项\nconst handleClick = () => {\n  if (!__props.disabled) {\n    rootMenu?.handleMenuItemClick({\n      index: __props.index!,\n      indexPath: indexPath.value,\n      route: __props.route\n    });\n    emit('click', item);\n  }\n};\n\nconst _icon = computed(() => {\n  return singleAttrToObj(__props.icon, 'icon') as IconProps;\n});\n\nconst title = computed(() => {\n  return renderTNode(instance, 'title');\n});\n\nonMounted(() => {\n  if (!__props.isAloneUse) {\n    // 触发 sub-menu,vue 中的 addSubMenu\n    subMenu?.addSubMenu(item);\n    // 触发 menu.vue 中的 addMenuItem 更新 items\n    rootMenu?.addMenuItem(item);\n  }\n});\n\nonBeforeUnmount(() => {\n  if (!__props.isAloneUse) {\n    subMenu?.removeSubMenu(item);\n    rootMenu?.removeMenuItem(item);\n  }\n});\n</script>\n\n<template>\n  <vft-divider v-if=\"reverse && divider\" marginY=\"0\" />\n  <li :class=\"[className, nsMenuItem.b(), nsMenuItem.is('active', isAloneUse ? false : active), nsMenuItem.is('disabled', disabled)]\" role=\"menuitem\" tabindex=\"-1\" @click=\"handleClick\">\n    <tooltip\n      v-if=\"parentMenu?.type?.name === 'vft-menu' && rootMenu?.props.collapse && $slots.title\"\n      placement=\"right\" :fallback-placements=\"['left']\" persistent>\n      <template #content>\n        <slot name=\"title\" />\n      </template>\n      <div :class=\"nsMenu.be('tooltip', 'trigger')\">\n        <slot />\n      </div>\n    </tooltip>\n    <template v-else>\n      <slot v-if=\"$slots?.default\"/>\n      <template v-else>\n        <Icon v-if=\"_icon?.icon\" v-bind=\"_icon\" />\n        <span :title=\"title\"><v-node :content=\"title\" /></span>\n      </template>\n    </template>\n  </li>\n  <vft-divider v-if=\"!reverse && divider\" marginY=\"0\" />\n</template>\n"],"names":["ns","useNamespace","__default__","DO_defineComponent","instance","getCurrentInstance","nsMenu","nsMenuItem","rootMenu","__props","inject","throwError","parentMenu","indexPath","useMenu","computed","subMenu","active","item","reactive","handleClick","emit","_icon","singleAttrToObj","title","renderTNode","onMounted","onBeforeUnmount"],"mappings":";;;;;;;;;;;;;;;;;;;;;;qBACMA;AAAA;AAAA,EAAuBC,EAAa,WAAW;AAAA,GAGrDC,IAA6BC,EAAmB;AAAA,EAC9C,MAAMH,EAAG,EAAE;AACb,CAAC;;;;;;;;;;;;;;;AA6CD,UAAMI,IAAWC,KAEXC,IAASL,EAAa,MAAM,GAE5BM,IAAaN,EAAa,WAAW,GAGrCO,IAAYC,EAAQ,aAAgD,OAAnCC,EAAqB,UAAU;AAClE,IAAA,CAACF,KAAY,CAACC,EAAQ,cAAuBE,EAAAX,EAAG,EAAE,GAAG,0BAA0B;AAG7E,UAAA,EAAE,YAAAY,GAAY,WAAAC,EAAA,IAAcC;AAAA,MAChCV;AAAA,MACAW,EAAS,MAAMN,EAAQ,KAAM;AAAA,IAAA,GAIzBO,IAAWP,EAAQ,aAA0E,OAA7DC,EAAwB,WAAWE,EAAW,MAAM,KAAK;AAC3F,IAAA,CAACI,KAAW,CAACP,EAAQ,cAAuBE,EAAAX,EAAG,EAAE,GAAG,yBAAyB;AAGjF,UAAMiB,IAASF,EAAS,MAAMN,EAAQ,WAAUD,KAAA,gBAAAA,EAAU,YAAW,GAE/DU,IAA2BC,EAAS;AAAA,MACxC,OAAOV,EAAQ;AAAA,MACf,WAAAI;AAAA,MACA,QAAAI;AAAA,IAAA,CACD,GAGKG,IAAc,MAAM;AACpB,MAACX,EAAQ,aACXD,KAAA,QAAAA,EAAU,oBAAoB;AAAA,QAC5B,OAAOC,EAAQ;AAAA,QACf,WAAWI,EAAU;AAAA,QACrB,OAAOJ,EAAQ;AAAA,MAAA,IAEjBY,EAAK,SAASH,CAAI;AAAA,IACpB,GAGII,IAAQP,EAAS,MACdQ,EAAgBd,EAAQ,MAAM,MAAM,CAC5C,GAEKe,IAAQT,EAAS,MACdU,EAAYrB,GAAU,OAAO,CACrC;AAED,WAAAsB,EAAU,MAAM;AACV,MAACjB,EAAQ,eAEXO,KAAA,QAAAA,EAAS,WAAWE,IAEpBV,KAAA,QAAAA,EAAU,YAAYU;AAAA,IACxB,CACD,GAEDS,EAAgB,MAAM;AAChB,MAAClB,EAAQ,eACXO,KAAA,QAAAA,EAAS,cAAcE,IACvBV,KAAA,QAAAA,EAAU,eAAeU;AAAA,IAC3B,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"menu-item.vue2.mjs","sources":["../../../../../packages/components/menu/menu-item.vue"],"sourcesContent":["<script lang=\"ts\">\nconst ns = /* hoist-static*/ useNamespace('menu-item')\n\nimport { defineComponent as DO_defineComponent } from 'vue';\nexport default /*#__PURE__*/ DO_defineComponent({\n  name: ns.b()\n});</script>\n<script lang=\"ts\" setup>\nimport { renderTNode, singleAttrToObj, VNode } from '@vft/utils';\nimport { computed, getCurrentInstance, inject, onBeforeUnmount, onMounted, reactive } from 'vue';\nimport { throwError } from '@vft-ui/utils';\nimport { useNamespace } from '@vft-ui/hooks';\nimport { type RouteLocationRaw } from 'vue-router';\nimport useMenu from './use-menu';\nimport { VftIcon as Icon, type IconProps, VftTooltip as Tooltip, VftDivider } from '@vft-ui/components';\n\nimport type { MenuItemRegistered, MenuProvider, SubMenuProvider } from './types';\n\ninterface Props {\n  /** 唯一标志 */\n  index?: string;\n  /** Vue Router 路径对象 */\n  route?: RouteLocationRaw;\n  /** 是否禁用 */\n  disabled?: boolean;\n  icon?: IconProps;\n  title?: string;\n  isAloneUse?: boolean;\n  divider?: boolean;\n  className?: string\n  reverse?: boolean\n}\n\ndefineProps({\n  \"index\": null,\n  \"route\": null,\n  \"disabled\": { type: Boolean,  },\n  \"icon\": null,\n  \"title\": null,\n  \"isAloneUse\": { type: Boolean,  },\n  \"divider\": { type: Boolean,  },\n  \"className\": null,\n  \"reverse\": { type: Boolean,  }\n})\n\n\n\nconst emit = defineEmits(['click']);\n\n;\n\nconst instance = getCurrentInstance()!;\n\nconst nsMenu = useNamespace('menu');\n\nconst nsMenuItem = useNamespace('menu-item');\n\n// 获取来自 menu.vue 中注入的数据\nconst rootMenu = !__props.isAloneUse ? inject<MenuProvider>('rootMenu') : null;\nif (!rootMenu && !__props.isAloneUse) throwError(ns.b(), 'can not inject root menu');\n\n// indexPath：当前 menu-item 对应的 index 和 vft-sub-menu 的 index，parentMenu 为 vft-sub-menu 组件\nconst { parentMenu, indexPath } = useMenu(\n  instance,\n  computed(() => __props.index!)\n);\n\n// 注入来自 sub-menu 中的 provide 数据\nconst subMenu = !__props.isAloneUse ? inject<SubMenuProvider>(`subMenu:${parentMenu.value.uid}`) : null;\nif (!subMenu && !__props.isAloneUse) throwError(ns.b(), 'can not inject sub menu');\n\n// 当前是否为 active\nconst active = computed(() => __props.index === rootMenu?.activeIndex);\n\nconst item: MenuItemRegistered = reactive({\n  index: __props.index!,\n  indexPath,\n  active\n});\n\n// 点击具体菜单项\nconst handleClick = () => {\n  if (!__props.disabled) {\n    rootMenu?.handleMenuItemClick({\n      index: __props.index!,\n      indexPath: indexPath.value,\n      route: __props.route\n    });\n    emit('click', item);\n  }\n};\n\nconst _icon = computed(() => {\n  return singleAttrToObj(__props.icon, 'icon') as IconProps;\n});\n\nconst title = computed(() => {\n  return renderTNode(instance, 'title');\n});\n\nonMounted(() => {\n  if (!__props.isAloneUse) {\n    // 触发 sub-menu,vue 中的 addSubMenu\n    subMenu?.addSubMenu(item);\n    // 触发 menu.vue 中的 addMenuItem 更新 items\n    rootMenu?.addMenuItem(item);\n  }\n});\n\nonBeforeUnmount(() => {\n  if (!__props.isAloneUse) {\n    subMenu?.removeSubMenu(item);\n    rootMenu?.removeMenuItem(item);\n  }\n});\n</script>\n\n<template>\n  <vft-divider v-if=\"reverse && divider\" marginY=\"0\" />\n  <li :class=\"[className, nsMenuItem.b(), nsMenuItem.is('active', isAloneUse ? false : active), nsMenuItem.is('disabled', disabled)]\" role=\"menuitem\" tabindex=\"-1\" @click=\"handleClick\">\n    <tooltip\n      v-if=\"parentMenu?.type?.name === 'vft-menu' && rootMenu?.props.collapse && $slots.title\"\n      placement=\"right\" :fallback-placements=\"['left']\" persistent>\n      <template #content>\n        <slot name=\"title\" />\n      </template>\n      <div :class=\"nsMenu.be('tooltip', 'trigger')\">\n        <slot />\n      </div>\n    </tooltip>\n    <template v-else>\n      <slot v-if=\"$slots?.default\"/>\n      <template v-else>\n        <Icon v-if=\"_icon?.icon\" v-bind=\"_icon\" />\n        <span :title=\"title\"><v-node :content=\"title\" /></span>\n      </template>\n    </template>\n  </li>\n  <vft-divider v-if=\"!reverse && divider\" marginY=\"0\" />\n</template>\n"],"names":["ns","useNamespace","__default__","DO_defineComponent","instance","getCurrentInstance","nsMenu","nsMenuItem","rootMenu","__props","inject","throwError","parentMenu","indexPath","useMenu","computed","subMenu","active","item","reactive","handleClick","emit","_icon","singleAttrToObj","title","renderTNode","onMounted","onBeforeUnmount"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;qBACMA;AAAA;AAAA,EAAuBC,EAAa,WAAW;AAAA,GAGrDC,IAA6BC,EAAmB;AAAA,EAC9C,MAAMH,EAAG,EAAE;AACb,CAAC;;;;;;;;;;;;;;;AA6CD,UAAMI,IAAWC,KAEXC,IAASL,EAAa,MAAM,GAE5BM,IAAaN,EAAa,WAAW,GAGrCO,IAAYC,EAAQ,aAAgD,OAAnCC,EAAqB,UAAU;AAClE,IAAA,CAACF,KAAY,CAACC,EAAQ,cAAuBE,EAAAX,EAAG,EAAE,GAAG,0BAA0B;AAG7E,UAAA,EAAE,YAAAY,GAAY,WAAAC,EAAA,IAAcC;AAAA,MAChCV;AAAA,MACAW,EAAS,MAAMN,EAAQ,KAAM;AAAA,IAAA,GAIzBO,IAAWP,EAAQ,aAA0E,OAA7DC,EAAwB,WAAWE,EAAW,MAAM,KAAK;AAC3F,IAAA,CAACI,KAAW,CAACP,EAAQ,cAAuBE,EAAAX,EAAG,EAAE,GAAG,yBAAyB;AAGjF,UAAMiB,IAASF,EAAS,MAAMN,EAAQ,WAAUD,KAAA,gBAAAA,EAAU,YAAW,GAE/DU,IAA2BC,EAAS;AAAA,MACxC,OAAOV,EAAQ;AAAA,MACf,WAAAI;AAAA,MACA,QAAAI;AAAA,IAAA,CACD,GAGKG,IAAc,MAAM;AACpB,MAACX,EAAQ,aACXD,KAAA,QAAAA,EAAU,oBAAoB;AAAA,QAC5B,OAAOC,EAAQ;AAAA,QACf,WAAWI,EAAU;AAAA,QACrB,OAAOJ,EAAQ;AAAA,MAAA,IAEjBY,EAAK,SAASH,CAAI;AAAA,IACpB,GAGII,IAAQP,EAAS,MACdQ,EAAgBd,EAAQ,MAAM,MAAM,CAC5C,GAEKe,IAAQT,EAAS,MACdU,EAAYrB,GAAU,OAAO,CACrC;AAED,WAAAsB,EAAU,MAAM;AACV,MAACjB,EAAQ,eAEXO,KAAA,QAAAA,EAAS,WAAWE,IAEpBV,KAAA,QAAAA,EAAU,YAAYU;AAAA,IACxB,CACD,GAEDS,EAAgB,MAAM;AAChB,MAAClB,EAAQ,eACXO,KAAA,QAAAA,EAAS,cAAcE,IACvBV,KAAA,QAAAA,EAAU,eAAeU;AAAA,IAC3B,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}