vft 0.0.11 → 0.0.14

package/es/packages/components/slot/only-child.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"only-child.mjs","sources":["../../../../../../packages/components/slot/only-child.tsx"],"sourcesContent":["import {\n  Comment,\n  Fragment,\n  Text,\n  cloneVNode,\n  defineComponent,\n  inject,\n  withDirectives,\n} from 'vue'\nimport { NOOP, isObject } from '@vue/shared'\nimport {\n  FORWARD_REF_INJECTION_KEY,\n  useForwardRefDirective,\n  useNamespace,\n} from '@vft-ui/hooks'\nimport { debugWarn } from '@vft-ui/utils'\n\nimport type { Ref, VNode } from 'vue'\n\nconst NAME = 'VftOnlyChild'\n\nexport const OnlyChild = defineComponent({\n  name: NAME,\n  setup(_, { slots, attrs }) {\n    const forwardRefInjection = inject(FORWARD_REF_INJECTION_KEY)\n    const forwardRefDirective = useForwardRefDirective(\n      forwardRefInjection?.setForwardRef ?? NOOP\n    )\n    return () => {\n      const defaultSlot = slots.default?.(attrs)\n      if (!defaultSlot) return null\n\n      if (defaultSlot.length > 1) {\n        debugWarn(NAME, 'requires exact only one valid child.')\n        return null\n      }\n\n      const firstLegitNode = findFirstLegitChild(defaultSlot)\n      if (!firstLegitNode) {\n        debugWarn(NAME, 'no valid child node found')\n        return null\n      }\n\n      return withDirectives(cloneVNode(firstLegitNode!, attrs), [\n        [forwardRefDirective],\n      ])\n    }\n  },\n})\n\nfunction findFirstLegitChild(node: VNode[] | undefined): VNode | null {\n  if (!node) return null\n  const children = node as VNode[]\n  for (const child of children) {\n    /**\n     * when user uses h(Fragment, [text]) to render plain string,\n     * this switch case just cannot handle, when the value is primitives\n     * we should just return the wrapped string\n     */\n    if (isObject(child)) {\n      switch (child.type) {\n        case Comment:\n          continue\n        case Text:\n        case 'svg':\n          return wrapTextContent(child)\n        case Fragment:\n          return findFirstLegitChild(child.children as VNode[])\n        default:\n          return child\n      }\n    }\n    return wrapTextContent(child)\n  }\n  return null\n}\n\nfunction wrapTextContent(s: string | VNode) {\n  const ns = useNamespace('only-child')\n  return <span class={ns.e('content')}>{s}</span>\n}\n\nexport type OnlyChildExpose = {\n  forwardRef: Ref<HTMLElement>\n}\n"],"names":["NAME","OnlyChild","defineComponent","name","setup","_","slots","attrs","forwardRefInjection","inject","FORWARD_REF_INJECTION_KEY","forwardRefDirective","useForwardRefDirective","setForwardRef","NOOP","defaultSlot","default","length","debugWarn","firstLegitNode","findFirstLegitChild","withDirectives","cloneVNode","node","children","child","isObject","type","Comment","Text","wrapTextContent","Fragment","s","ns","useNamespace","_createVNode","e"],"mappings":";;;;;;;;;;AAmBA,MAAMA,IAAO,gBAEAC,IAAYC,gBAAAA,EAAgB;AAAA,EACvCC,MAAMH;AAAAA,EACNI,MAAMC,GAAG;AAAA,IAAEC,OAAAA;AAAAA,IAAOC,OAAAA;AAAAA,EAAM,GAAG;AACzB,UAAMC,IAAsBC,EAAOC,CAAyB,GACtDC,IAAsBC,GAC1BJ,KAAAA,gBAAAA,EAAqBK,kBAAiBC,CAAI;AAE5C,WAAO,MAAM;;AACX,YAAMC,KAAcT,IAAAA,EAAMU,YAANV,gBAAAA,EAAAA,KAAAA,GAAgBC;AACpC,UAAI,CAACQ;AAAa,eAAO;AAEzB,UAAIA,EAAYE,SAAS;AACvBC,eAAAA,EAAUlB,GAAM,sCAAsC,GAC/C;AAGT,YAAMmB,IAAiBC,EAAoBL,CAAW;AACtD,aAAKI,IAKEE,EAAeC,EAAWH,GAAiBZ,CAAK,GAAG,CACxD,CAACI,CAAmB,CAAC,CACtB,KANCO,EAAUlB,GAAM,2BAA2B,GACpC;AAAA;EAOb;AACF,CAAC;AAED,SAASoB,EAAoBG,GAAyC;AACpE,MAAI,CAACA;AAAM,WAAO;AAClB,QAAMC,IAAWD;AACjB,aAAWE,KAASD,GAAU;AAM5B,QAAIE,EAASD,CAAK;AAChB,cAAQA,EAAME,MAAI;AAAA,QAChB,KAAKC;AACH;AAAA,QACF,KAAKC;AAAAA,QACL,KAAK;AACH,iBAAOC,EAAgBL,CAAK;AAAA,QAC9B,KAAKM;AACH,iBAAOX,EAAoBK,EAAMD,QAAQ;AAAA,QAC3C;AACE,iBAAOC;AAAAA,MAAK;AAGlB,WAAOK,EAAgBL,CAAK;AAAA,EAC9B;AACA,SAAO;AACT;AAEA,SAASK,EAAgBE,GAAmB;AAC1C,QAAMC,IAAKC,EAAa,YAAY;AACpC,SAAAC,EAAA,QAAA;AAAA,IAAA,OAAoBF,EAAGG,EAAE,SAAS;AAAA,EAAC,GAAA,CAAGJ,CAAC,CAAA;AACzC;"}

package/es/packages/components/sub-menu/style/css.mjs

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

package/es/packages/components/sub-menu/style/css.mjs.map

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

package/es/packages/components/sub-menu/style/index.mjs

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

package/es/packages/components/sub-menu/style/index.mjs.map

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

package/es/packages/components/tab-pane/style/css.mjs.map

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

package/es/packages/components/tab-pane/style/index.mjs.map

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

package/es/packages/components/tabs/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../../../../packages/components/tabs/index.ts"],"sourcesContent":["import { withInstall, withNoopInstall } from '@vft-ui/utils'\nimport Tabs from './tabs.vue';\nimport TabPane from './tab-pane.vue';\n\nexport const VftTabs = withInstall(Tabs, { TabPane })\nexport const VftTabPane = withNoopInstall(TabPane)\nexport default VftTabs\n\nexport * from './types';\n"],"names":["VftTabs","withInstall","Tabs","TabPane","VftTabPane","withNoopInstall"],"mappings":";;;;;;;AAIO,MAAMA,IAAUC,EAAYC,GAAM,EAAA,SAAEC,GAAS,GACvCC,IAAaC,EAAgBF,CAAO;"}

package/es/packages/components/tabs/style/css.mjs.map

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

package/es/packages/components/tabs/style/index.mjs.map

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

package/es/packages/components/tabs/tab-bar.vue2.mjs

@@ -0,0 +1,56 @@
+import { defineComponent as $, getCurrentInstance as S, inject as C, ref as g, watch as N, nextTick as R, computed as k, openBlock as B, createElementBlock as F, normalizeClass as P, unref as p, normalizeStyle as T } from "vue";
+import { TabsRootContextKey as L } from "./types.mjs";
+import { useNamespace as j } from "../../hooks/use-namespace/index.mjs";
+import "@popperjs/core";
+import "lodash";
+import "../../hooks/use-z-index/index.mjs";
+import { useResizeObserver as D } from "@vueuse/core";
+import "@vue/shared";
+import { capitalize as c } from "@vft/utils";
+const M = /* @__PURE__ */ $({
+  __name: "tab-bar",
+  props: {
+    tabs: null
+  },
+  setup(h, { expose: x }) {
+    const s = h, _ = S(), l = C(L), m = j("tabs"), a = g(), f = g(), v = () => {
+      let t = 0, e = 0;
+      const o = ["top", "bottom"].includes(l.props.tabPosition) ? "width" : "height", u = o === "width" ? "x" : "y", z = u === "x" ? "left" : "top";
+      return s.tabs.every((b) => {
+        var d, y;
+        const r = (y = (d = _.parent) == null ? void 0 : d.refs) == null ? void 0 : y[`tab-${b.uid}`];
+        if (!r)
+          return !1;
+        if (!b.active)
+          return !0;
+        t = r[`offset${c(z)}`], e = r[`client${c(o)}`];
+        const i = window.getComputedStyle(r);
+        return o === "width" && (s.tabs.length > 1 && (e -= Number.parseFloat(i.paddingLeft) + Number.parseFloat(i.paddingRight)), t += Number.parseFloat(i.paddingLeft)), !1;
+      }), {
+        [o]: `${e}px`,
+        transform: `translate${c(u)}(${t}px)`
+      };
+    }, n = () => f.value = v();
+    N(
+      () => s.tabs,
+      async () => {
+        await R(), n();
+      },
+      { immediate: !0 }
+    );
+    const w = k(() => l.props.tabPosition);
+    return D(a, () => n()), x({
+      ref: a,
+      update: n
+    }), (t, e) => (B(), F("div", {
+      ref_key: "barRef",
+      ref: a,
+      class: P([p(m).e("active-bar"), p(m).is(p(w))]),
+      style: T(f.value)
+    }, null, 6));
+  }
+});
+export {
+  M as default
+};
+//# sourceMappingURL=tab-bar.vue2.mjs.map

package/es/packages/components/tabs/tab-bar.vue2.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab-bar.vue2.mjs","sources":["../../../../../../packages/components/tabs/tab-bar.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { type TabsPaneContext, TabsRootContextKey } from './types';\nimport { useNamespace } from '@vft-ui/hooks';\nimport { capitalize } from '@vft/utils';\nimport { getCurrentInstance, inject, nextTick, ref, watch, computed } from 'vue';\nimport { useResizeObserver } from '@vueuse/core';\n\nimport type { CSSProperties } from 'vue';\n\nconst props = defineProps({\n  \"tabs\": null\n});\n\nconst instance = getCurrentInstance()!;\nconst rootTabs = inject(TabsRootContextKey)!;\n\nconst ns = useNamespace('tabs');\n\nconst barRef = ref<HTMLDivElement>();\nconst barStyle = ref<CSSProperties>();\n\nconst getBarStyle = (): CSSProperties => {\n  let offset = 0;\n  let tabSize = 0;\n\n  const sizeName = ['top', 'bottom'].includes(rootTabs.props.tabPosition!)\n    ? 'width'\n    : 'height';\n  const sizeDir = sizeName === 'width' ? 'x' : 'y';\n  const position = sizeDir === 'x' ? 'left' : 'top';\n\n  props.tabs.every((tab) => {\n    const $el = instance.parent?.refs?.[`tab-${tab.uid}`] as HTMLElement;\n    if (!$el) return false;\n\n    if (!tab.active) {\n      return true;\n    }\n    offset = $el[`offset${capitalize(position)}`];\n    tabSize = $el[`client${capitalize(sizeName)}`];\n\n    const tabStyles = window.getComputedStyle($el);\n\n    if (sizeName === 'width') {\n      if (props.tabs.length > 1) {\n        tabSize -=\n          Number.parseFloat(tabStyles.paddingLeft) +\n          Number.parseFloat(tabStyles.paddingRight);\n      }\n      offset += Number.parseFloat(tabStyles.paddingLeft);\n    }\n    return false;\n  });\n\n  return {\n    [sizeName]: `${tabSize}px`,\n    transform: `translate${capitalize(sizeDir)}(${offset}px)`\n  };\n};\n\nconst update = () => (barStyle.value = getBarStyle());\n\nwatch(\n  () => props.tabs,\n  async () => {\n    await nextTick();\n    update();\n  },\n  { immediate: true }\n);\n\nconst _tabPosition = computed(() => {\n  return rootTabs.props.tabPosition!;\n});\n\nuseResizeObserver(barRef, () => update());\n\ndefineExpose({\n  ref: barRef,\n  update\n});\n</script>\n\n<template>\n  <div\n    ref=\"barRef\"\n    :class=\"[ns.e('active-bar'), ns.is(_tabPosition)]\"\n    :style=\"barStyle\"\n  />\n</template>\n"],"names":["instance","getCurrentInstance","rootTabs","inject","TabsRootContextKey","ns","useNamespace","barRef","ref","barStyle","getBarStyle","offset","tabSize","sizeName","sizeDir","position","props","tab","$el","_b","_a","capitalize","tabStyles","update","watch","nextTick","_tabPosition","computed","useResizeObserver","expose"],"mappings":";;;;;;;;;;;;;;;iBAaMA,IAAWC,KACXC,IAAWC,EAAOC,CAAkB,GAEpCC,IAAKC,EAAa,MAAM,GAExBC,IAASC,KACTC,IAAWD,KAEXE,IAAc,MAAqB;AACvC,UAAIC,IAAS,GACTC,IAAU;AAER,YAAAC,IAAW,CAAC,OAAO,QAAQ,EAAE,SAASX,EAAS,MAAM,WAAY,IACnE,UACA,UACEY,IAAUD,MAAa,UAAU,MAAM,KACvCE,IAAWD,MAAY,MAAM,SAAS;AAEtC,aAAAE,EAAA,KAAK,MAAM,CAACC,MAAQ;;AACxB,cAAMC,KAAMC,KAAAC,IAAApB,EAAS,WAAT,gBAAAoB,EAAiB,SAAjB,gBAAAD,EAAwB,OAAOF,EAAI;AAC/C,YAAI,CAACC;AAAY,iBAAA;AAEb,YAAA,CAACD,EAAI;AACA,iBAAA;AAET,QAAAN,IAASO,EAAI,SAASG,EAAWN,CAAQ,GAAG,GAC5CH,IAAUM,EAAI,SAASG,EAAWR,CAAQ,GAAG;AAEvC,cAAAS,IAAY,OAAO,iBAAiBJ,CAAG;AAE7C,eAAIL,MAAa,YACXG,EAAM,KAAK,SAAS,MAEpBJ,KAAA,OAAO,WAAWU,EAAU,WAAW,IACvC,OAAO,WAAWA,EAAU,YAAY,IAElCX,KAAA,OAAO,WAAWW,EAAU,WAAW,IAE5C;AAAA,MAAA,CACR,GAEM;AAAA,QACL,CAACT,CAAQ,GAAG,GAAGD;AAAA,QACf,WAAW,YAAYS,EAAWP,CAAO,KAAKH;AAAA,MAAA;AAAA,IAChD,GAGIY,IAAS,MAAOd,EAAS,QAAQC,EAAY;AAEnD,IAAAc;AAAA,MACE,MAAMR,EAAM;AAAA,MACZ,YAAY;AACV,cAAMS,EAAS,GACRF;MACT;AAAA,MACA,EAAE,WAAW,GAAK;AAAA,IAAA;AAGd,UAAAG,IAAeC,EAAS,MACrBzB,EAAS,MAAM,WACvB;AAEiB,WAAA0B,EAAArB,GAAQ,MAAMgB,EAAA,CAAQ,GAE3BM,EAAA;AAAA,MACX,KAAKtB;AAAA,MACL,QAAAgB;AAAA,IAAA,CACD;;;;;;;;"}

package/es/packages/components/tabs/tab-nav.vue2.mjs

@@ -0,0 +1,185 @@
+import { defineComponent as E, getCurrentInstance as Z, inject as _, ref as g, computed as I, watch as O, onMounted as tt, onUpdated as et, createVNode as c, nextTick as ot } from "vue";
+import "@vue/shared";
+import { throwError as nt } from "../../utils/error.mjs";
+import "../divider/index.mjs";
+import { VftIcon as T } from "../icon/index.mjs";
+import "../avatar/index.mjs";
+import "../empty/index.mjs";
+import "../result/index.mjs";
+import "../exception/index.mjs";
+import "./index.mjs";
+import "../popper/index.mjs";
+import "../collapse-transition/index.mjs";
+import "../tooltip/index.mjs";
+import "../popover/index.mjs";
+import "../menu/index.mjs";
+import { capitalize as y } from "@vft/utils";
+import "@vft/use";
+import "../multiple-tabs/index.mjs";
+import { useNamespace as K } from "../../hooks/use-namespace/index.mjs";
+import "@popperjs/core";
+import "lodash";
+import "../../hooks/use-z-index/index.mjs";
+import { useDocumentVisibility as lt, useWindowFocus as at, useResizeObserver as st } from "@vueuse/core";
+import { EVENT_CODE as k } from "@vft/constants";
+import { TabsRootContextKey as it } from "./types.mjs";
+import ct from "./tab-bar.vue2.mjs";
+const V = (
+  /* hoist-static*/
+  K("tab-nav")
+), rt = E({
+  name: V.b()
+}), Lt = /* @__PURE__ */ E({
+  ...rt,
+  props: {
+    panes: null,
+    editable: {
+      type: Boolean
+    },
+    addable: {
+      type: Boolean
+    },
+    type: null,
+    stretch: {
+      type: Boolean
+    },
+    closeIconCfg: null,
+    addIconCfg: null,
+    arrowLeftIconCfg: null,
+    arrowRightIconCfg: null
+  },
+  emits: ["tabClick", "tabRemove", "tabAdd", "tabContextmenu"],
+  setup(l, {
+    expose: D,
+    emit: C
+  }) {
+    var A;
+    const M = Z(), m = _(it);
+    m || nt(V.b(), "<vft-tabs><tab-nav /></vft-tabs>");
+    const o = K("tabs"), q = lt(), H = at(), $ = g(), b = g(), h = g(), f = g(!1), v = g(0), S = g(!1), x = g(!0), w = I(() => ["top", "bottom"].includes(m.props.tabPosition) ? "width" : "height"), W = I(() => ({
+      transform: `translate${w.value === "width" ? "X" : "Y"}(-${v.value}px)`
+    })), j = () => {
+      if (!b.value)
+        return;
+      const e = b.value[`offset${y(w.value)}`], t = v.value;
+      t && (v.value = t > e ? t - e : 0);
+    }, U = () => {
+      if (!b.value || !h.value)
+        return;
+      const e = h.value[`offset${y(w.value)}`], t = b.value[`offset${y(w.value)}`], n = v.value;
+      e - n <= t || (v.value = e - n > t * 2 ? n + t : e - t);
+    }, R = async () => {
+      const e = h.value;
+      if (!f.value || !$.value || !b.value || !e)
+        return;
+      await ot();
+      const t = $.value.querySelector(".is-active");
+      if (!t)
+        return;
+      const n = b.value, p = ["top", "bottom"].includes(m.props.tabPosition), i = t.getBoundingClientRect(), a = n.getBoundingClientRect(), u = p ? e.offsetWidth - a.width : e.offsetHeight - a.height, r = v.value;
+      let s = r;
+      p ? (i.left < a.left && (s = r - (a.left - i.left)), i.right > a.right && (s = r + i.right - a.right)) : (i.top < a.top && (s = r - (a.top - i.top)), i.bottom > a.bottom && (s = r + (i.bottom - a.bottom))), s = Math.max(s, 0), v.value = Math.min(s, u);
+    }, z = () => {
+      if (!h.value || !b.value)
+        return;
+      const e = h.value[`offset${y(w.value)}`], t = b.value[`offset${y(w.value)}`], n = v.value;
+      t < e ? (f.value = f.value || {}, f.value.prev = n, f.value.next = n + t < e, e - n < t && (v.value = e - t)) : (f.value = !1, n > 0 && (v.value = 0));
+    }, X = (e) => {
+      const t = e.code, {
+        up: n,
+        down: p,
+        left: i,
+        right: a
+      } = k;
+      if (![n, p, i, a].includes(t))
+        return;
+      const u = Array.from(e.currentTarget.querySelectorAll("[role=tab]:not(.is-disabled)")), r = u.indexOf(e.target);
+      let s;
+      t === i || t === n ? r === 0 ? s = u.length - 1 : s = r - 1 : r < u.length - 1 ? s = r + 1 : s = 0, u[s].focus(), u[s].click(), P();
+    }, P = () => {
+      x.value && (S.value = !0);
+    }, B = () => S.value = !1;
+    O(q, (e) => {
+      e === "hidden" ? x.value = !1 : e === "visible" && setTimeout(() => x.value = !0, 50);
+    }), O(H, (e) => {
+      e ? setTimeout(() => x.value = !0, 50) : x.value = !1;
+    }), st($, z), tt(() => setTimeout(() => R(), 0)), et(() => z()), D({
+      scrollToActiveTab: R,
+      removeFocus: B
+    }), O(() => l.panes, () => M.update(), {
+      flush: "post"
+    });
+    const Y = I(() => {
+      var e, t;
+      return f.value ? [c("span", {
+        class: [o.e("nav-prev"), o.is("disabled", !f.value.prev)],
+        onClick: j
+      }, [(e = l.arrowLeftIconCfg) != null && e.icon ? c(T, l.arrowLeftIconCfg, null) : null]), c("span", {
+        class: [o.e("nav-next"), o.is("disabled", !f.value.next)],
+        onClick: U
+      }, [(t = l.arrowRightIconCfg) != null && t.icon ? c(T, l.arrowRightIconCfg, null) : null])] : null;
+    }), G = I(() => {
+      var e;
+      return (e = l.panes) == null ? void 0 : e.map((t, n) => {
+        var N, F, L;
+        const p = t.uid, i = t.props.disabled, a = t.props.name ?? t.index ?? `${n}`, u = !i && (t.isClosable || l.editable);
+        t.index = `${n}`;
+        const r = u ? c("span", {
+          class: "is-icon-close",
+          onClick: (d) => C("tabRemove", t, d)
+        }, [(N = l.closeIconCfg) != null && N.icon ? c(T, l.closeIconCfg, null) : null]) : null, s = ((L = (F = t.slots).label) == null ? void 0 : L.call(F)) || t.props.label, Q = !i && t.active ? 0 : -1;
+        return c("div", {
+          ref: `tab-${p}`,
+          class: [o.e("item"), o.is(m.props.tabPosition), o.is("active", t.active), o.is("disabled", i), o.is("closable", u), o.is("focus", S.value)],
+          id: `tab-${a}`,
+          key: `tab-${p}`,
+          "aria-controls": `pane-${a}`,
+          role: "tab",
+          "aria-selected": t.active,
+          tabindex: Q,
+          onFocus: () => P(),
+          onBlur: () => B(),
+          onClick: (d) => {
+            B(), C("tabClick", t, a, d);
+          },
+          onContextmenu: (d) => {
+            d.preventDefault(), C("tabContextmenu", {
+              pane: t,
+              index: n,
+              event: d
+            });
+          },
+          onKeydown: (d) => {
+            u && (d.code === k.delete || d.code === k.backspace) && C("tabRemove", t, d);
+          }
+        }, [s, r]);
+      });
+    }), J = l.editable || l.addable ? c("span", {
+      class: o.e("new-tab"),
+      tabindex: "0",
+      onClick: () => C("tabAdd"),
+      onKeydown: (e) => {
+        e.code === k.enter && C("tabAdd");
+      }
+    }, [(A = l.addIconCfg) != null && A.icon ? c(T, l.addIconCfg, null) : null]) : null;
+    return () => c("div", {
+      ref: $,
+      class: [o.e("nav-wrap"), o.is("scrollable", !!f.value), o.is(m.props.tabPosition)]
+    }, [Y.value, c("div", {
+      class: o.e("nav-scroll"),
+      ref: b
+    }, [c("div", {
+      class: [o.e("nav"), o.is(m.props.tabPosition), o.is("stretch", l.stretch && ["top", "bottom"].includes(m.props.tabPosition))],
+      ref: h,
+      style: W.value,
+      role: "tablist",
+      onKeydown: X
+    }, [l.type ? null : c(ct, {
+      tabs: [...l.panes]
+    }, null), G.value]), J])]);
+  }
+});
+export {
+  Lt as default
+};
+//# sourceMappingURL=tab-nav.vue2.mjs.map

package/es/packages/components/tabs/tab-nav.vue2.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab-nav.vue2.mjs","sources":["../../../../../../packages/components/tabs/tab-nav.vue"],"sourcesContent":["<script lang=\"tsx\">\nconst ns_nav = /* hoist-static*/ useNamespace('tab-nav')\n\nimport { defineComponent as DO_defineComponent } from 'vue';\nexport default /*#__PURE__*/ DO_defineComponent({\n\tname: ns_nav.b()\n});</script>\n<script lang=\"tsx\" setup>\nimport { throwError } from '@vft-ui/utils';\nimport {\n  computed,\n  type CSSProperties,\n  getCurrentInstance,\n  inject,\n  nextTick,\n  onMounted,\n  onUpdated,\n  ref,\n  watch\n} from 'vue';\nimport { type IconProps, VftIcon } from '@vft-ui/components';\nimport { useNamespace } from '@vft-ui/hooks';\nimport { capitalize } from '@vft/utils';\nimport { EVENT_CODE } from '@vft/constants';\nimport { TabsRootContextKey } from './types';\nimport type { TabsPaneContext, TabsType, Scrollable } from './types';\nimport { useDocumentVisibility, useResizeObserver, useWindowFocus } from '@vueuse/core';\nimport TabBar from './tab-bar.vue';\n\ninterface TabNavProps {\n  panes: TabsPaneContext[];\n  /** 标签是否同时可增加和关闭 */\n  editable?: boolean;\n  /** 标签是否可增加 */\n  addable?: boolean;\n  /** tab 类型 */\n  type?: TabsType;\n  stretch?: boolean;\n  /** 图标配置 */\n  closeIconCfg?: IconProps;\n  addIconCfg?: IconProps;\n  arrowLeftIconCfg?: IconProps;\n  arrowRightIconCfg?: IconProps;\n}\n\ndefineProps({\n  \"panes\": null,\n  \"editable\": { type: Boolean,  },\n  \"addable\": { type: Boolean,  },\n  \"type\": null,\n  \"stretch\": { type: Boolean,  },\n  \"closeIconCfg\": null,\n  \"addIconCfg\": null,\n  \"arrowLeftIconCfg\": null,\n  \"arrowRightIconCfg\": null\n})\n\nconst emit = defineEmits(['tabClick', 'tabRemove', 'tabAdd', 'tabContextmenu']);\n\n\n\n;\n\nconst vm = getCurrentInstance()!;\n\n// 获取从 index.vue 提供的数据信息\nconst rootTabs = inject(TabsRootContextKey)!;\nif (!rootTabs) throwError(ns_nav.b(), `<vft-tabs><tab-nav /></vft-tabs>`)\n\nconst ns = useNamespace('tabs');\nconst visibility = useDocumentVisibility();\nconst focused = useWindowFocus();\n\n// 整个 nav dom 包含前进后退 btn (vft-tabs__nav-wrap)\nconst el$ = ref<HTMLDivElement>();\n// el$ 子节点 包含 newButton (vft-tabs__nav-scroll)\nconst navScroll$ = ref<HTMLDivElement>();\n// navScroll$ 子节点 (vft-tabs__nav)\nconst nav$ = ref<HTMLDivElement>();\n\n/** 是否展示左右滚动 */\nconst scrollable = ref<false | Scrollable>(false);\n// 记录滚动时的偏移量\nconst navOffset = ref(0);\nconst isFocus = ref(false);\nconst focusable = ref(true);\n\n// 根据 tabPosition 确定 sizeName 是 width or height\nconst sizeName = computed(() => ['top', 'bottom'].includes(rootTabs.props.tabPosition!) ? 'width' : 'height');\n\n// 设置 tab 导航栏的 translateX or translateY 的偏移量\nconst navStyle = computed<CSSProperties>(() => {\n  const dir = sizeName.value === 'width' ? 'X' : 'Y';\n  return {\n    transform: `translate${dir}(-${navOffset.value}px)`\n  };\n});\n\n// 向前滚动\nconst scrollPrev = () => {\n  if (!navScroll$.value) return;\n  const containerSize =\n    navScroll$.value[`offset${capitalize(sizeName.value)}`];\n  const currentOffset = navOffset.value;\n\n  if (!currentOffset) return;\n\n  navOffset.value = currentOffset > containerSize ? currentOffset - containerSize : 0;\n};\n\n// 向后滚动\nconst scrollNext = () => {\n  if (!navScroll$.value || !nav$.value) return;\n\n  const navSize = nav$.value[`offset${capitalize(sizeName.value)}`];\n  const containerSize =\n    navScroll$.value[`offset${capitalize(sizeName.value)}`];\n  const currentOffset = navOffset.value;\n\n  if (navSize - currentOffset <= containerSize) return;\n\n  navOffset.value = navSize - currentOffset > containerSize * 2\n    ? currentOffset + containerSize\n    : navSize - containerSize;\n};\n\n// 滚动到激活的 tab 主要是获取 navOffset 的值\nconst scrollToActiveTab = async() => {\n  const nav = nav$.value;\n  if (!scrollable.value || !el$.value || !navScroll$.value || !nav) return;\n\n  await nextTick();\n\n  const activeTab = el$.value.querySelector('.is-active');\n  if (!activeTab) return;\n\n  const navScroll = navScroll$.value;\n  const isHorizontal = ['top', 'bottom'].includes(\n    rootTabs.props.tabPosition!\n  );\n  const activeTabBounding = activeTab.getBoundingClientRect();\n  // vft-tabs__nav-scroll\n  const navScrollBounding = navScroll.getBoundingClientRect();\n  const maxOffset = isHorizontal\n    ? nav.offsetWidth - navScrollBounding.width\n    : nav.offsetHeight - navScrollBounding.height;\n\n  const currentOffset = navOffset.value;\n\n  let newOffset = currentOffset;\n\n  if (isHorizontal) {\n    if (activeTabBounding.left < navScrollBounding.left) {\n      newOffset =\n        currentOffset - (navScrollBounding.left - activeTabBounding.left);\n    }\n    if (activeTabBounding.right > navScrollBounding.right) {\n      newOffset =\n        currentOffset + activeTabBounding.right - navScrollBounding.right;\n    }\n  } else {\n    if (activeTabBounding.top < navScrollBounding.top) {\n      newOffset =\n        currentOffset - (navScrollBounding.top - activeTabBounding.top);\n    }\n    if (activeTabBounding.bottom > navScrollBounding.bottom) {\n      newOffset =\n        currentOffset +\n        (activeTabBounding.bottom - navScrollBounding.bottom);\n    }\n  }\n  newOffset = Math.max(newOffset, 0);\n  navOffset.value = Math.min(newOffset, maxOffset);\n};\n\nconst update = () => {\n  if (!nav$.value || !navScroll$.value) return;\n  // 根据 position 的不同 获取 nav$(vft-tabs__nav) 的 offsetWidth or offsetHeight\n  const navSize = nav$.value[`offset${capitalize(sizeName.value)}`];\n  // 获取到 navScroll$ 的 offsetWidth or offsetHeight\n  const containerSize = navScroll$.value[`offset${capitalize(sizeName.value)}`];\n  // 获取到当前的偏移量\n  const currentOffset = navOffset.value;\n  // 由于 navScroll$ 的 overflow 是 hidden，所以当 vft-tabs__nav 撑开时其宽度可能会超过 vft-tabs__nav-scroll\n  if (containerSize < navSize) {\n    scrollable.value = scrollable.value || {};\n    scrollable.value.prev = currentOffset;\n    scrollable.value.next = currentOffset + containerSize < navSize;\n    if (navSize - currentOffset < containerSize) {\n      navOffset.value = navSize - containerSize;\n    }\n  } else {\n    scrollable.value = false;\n    if (currentOffset > 0) {\n      navOffset.value = 0;\n    }\n  }\n};\n\nconst changeTab = (e: KeyboardEvent) => {\n  const code = e.code;\n\n  const { up, down, left, right } = EVENT_CODE;\n  if (![up, down, left, right].includes(code)) return;\n\n  // 左右上下键更换tab\n  const tabList = Array.from(\n    (e.currentTarget as HTMLDivElement).querySelectorAll<HTMLDivElement>(\n      '[role=tab]:not(.is-disabled)'\n    )\n  );\n  const currentIndex = tabList.indexOf(e.target as HTMLDivElement);\n\n  let nextIndex: number;\n  if (code === left || code === up) {\n    // left\n    if (currentIndex === 0) {\n      // first\n      nextIndex = tabList.length - 1;\n    } else {\n      nextIndex = currentIndex - 1;\n    }\n  } else {\n    // right\n    if (currentIndex < tabList.length - 1) {\n      // not last\n      nextIndex = currentIndex + 1;\n    } else {\n      nextIndex = 0;\n    }\n  }\n  tabList[nextIndex].focus(); // 改变焦点元素\n  tabList[nextIndex].click(); // 选中下一个tab\n  setFocus();\n};\n\nconst setFocus = () => {\n  if (focusable.value) isFocus.value = true;\n};\nconst removeFocus = () => (isFocus.value = false);\n\nwatch(visibility, (visibility) => {\n  if (visibility === 'hidden') {\n    focusable.value = false;\n  } else if (visibility === 'visible') {\n    setTimeout(() => (focusable.value = true), 50);\n  }\n});\n\nwatch(focused, (focused) => {\n  if (focused) {\n    setTimeout(() => (focusable.value = true), 50);\n  } else {\n    focusable.value = false;\n  }\n});\n\n// 监听 resize 触发 update\nuseResizeObserver(el$, update);\n\nonMounted(() => setTimeout(() => scrollToActiveTab(), 0));\nonUpdated(() => update());\n\ndefineExpose({\n  scrollToActiveTab,\n  removeFocus\n});\n\nwatch(\n  () => __props.panes,\n  () => vm.update(),\n  { flush: 'post' }\n);\n\n// 前进后退标签\nconst scrollBtn = computed(() => {\n  return scrollable.value\n    ? [\n      <span\n        class={[\n          ns.e('nav-prev'),\n          ns.is('disabled', !scrollable.value.prev)\n        ]}\n        onClick={scrollPrev}\n      >\n        {__props.arrowLeftIconCfg?.icon ? <VftIcon {...__props.arrowLeftIconCfg}></VftIcon> : null}\n      </span>,\n      <span\n        class={[\n          ns.e('nav-next'),\n          ns.is('disabled', !scrollable.value.next)\n        ]}\n        onClick={scrollNext}\n      >\n         {__props.arrowRightIconCfg?.icon ? <VftIcon {...__props.arrowRightIconCfg}></VftIcon> : null}\n      </span>\n    ]\n    : null;\n});\n\n// 渲染 tab-pane\nconst tabs = computed(() => {\n  return __props.panes?.map((pane, index) => {\n    const uid = pane.uid;\n    const disabled = pane.props.disabled;\n    const tabName = pane.props.name ?? pane.index ?? `${index}`;\n    const closable = !disabled && (pane.isClosable || __props.editable);\n    pane.index = `${index}`;\n\n    // 关闭标签图标\n    const btnClose = closable ? (\n      <span class=\"is-icon-close\" onClick={(ev: MouseEvent) => emit('tabRemove', pane, ev)}>\n        {__props.closeIconCfg?.icon ? <VftIcon {...__props.closeIconCfg}></VftIcon> : null}\n      </span>\n    ) : null;\n\n    const tabLabelContent = pane.slots.label?.() || pane.props.label;\n    const tabindex = !disabled && pane.active ? 0 : -1;\n\n    return (\n      <div\n        ref={`tab-${uid}`}\n        class={[\n          ns.e('item'),\n          ns.is(rootTabs.props.tabPosition!),\n          ns.is('active', pane.active),\n          ns.is('disabled', disabled),\n          ns.is('closable', closable),\n          ns.is('focus', isFocus.value)\n        ]}\n        id={`tab-${tabName}`}\n        key={`tab-${uid}`}\n        aria-controls={`pane-${tabName}`}\n        role=\"tab\"\n        aria-selected={pane.active}\n        tabindex={tabindex}\n        onFocus={() => setFocus()}\n        onBlur={() => removeFocus()}\n        onClick={(ev: MouseEvent) => {\n          removeFocus();\n          emit('tabClick', pane, tabName, ev);\n        }}\n        onContextmenu={(event) => {\n          event.preventDefault();\n          emit('tabContextmenu', { pane, index, event });\n        }}\n        onKeydown={(ev: KeyboardEvent) => {\n          if (\n            closable &&\n            (ev.code === EVENT_CODE.delete ||\n              ev.code === EVENT_CODE.backspace)\n          ) {\n            emit('tabRemove', pane, ev);\n          }\n        }}\n      >\n        {...[tabLabelContent, btnClose]}\n      </div>\n    );\n  });\n});\n\n// 增加 tab 的 dom\nconst newButton =\n  __props.editable || __props.addable ? (\n    <span\n      class={ns.e('new-tab')}\n      tabindex=\"0\"\n      onClick={() => emit('tabAdd')}\n      onKeydown={(ev: KeyboardEvent) => {\n        if (ev.code === EVENT_CODE.enter) emit('tabAdd');\n      }}\n    >\n      {__props.addIconCfg?.icon ? <VftIcon {...__props.addIconCfg}></VftIcon> : null}\n    </span>\n  ) : null;\n\ndefineRender(() => {\n  return (\n    <div\n      ref={el$}\n      class={[\n        ns.e('nav-wrap'),\n        ns.is('scrollable', !!scrollable.value),\n        ns.is(rootTabs.props.tabPosition!)\n      ]}\n    >\n      {scrollBtn.value}\n      <div class={ns.e('nav-scroll')} ref={navScroll$}>\n        <div\n          class={[\n            ns.e('nav'),\n            ns.is(rootTabs.props.tabPosition!),\n            ns.is(\n              'stretch',\n              __props.stretch &&\n              ['top', 'bottom'].includes(rootTabs.props.tabPosition!)\n            )\n          ]}\n          ref={nav$}\n          style={navStyle.value}\n          role=\"tablist\"\n          onKeydown={changeTab}\n        >\n          {...[\n            !__props.type ? <TabBar tabs={[...__props.panes]} /> : null,\n            tabs.value\n          ]}\n        </div>\n        {newButton}\n      </div>\n    </div>\n  );\n});\n</script>\n"],"names":["ns_nav","useNamespace","__default__","DO_defineComponent","name","b","vm","getCurrentInstance","rootTabs","inject","TabsRootContextKey","throwError","ns","visibility","useDocumentVisibility","focused","useWindowFocus","el$","ref","navScroll$","nav$","scrollable","navOffset","isFocus","focusable","sizeName","computed","includes","props","tabPosition","navStyle","transform","value","scrollPrev","containerSize","capitalize","currentOffset","scrollNext","navSize","scrollToActiveTab","nav","nextTick","activeTab","querySelector","navScroll","isHorizontal","activeTabBounding","getBoundingClientRect","navScrollBounding","maxOffset","offsetWidth","width","offsetHeight","height","newOffset","left","right","top","bottom","Math","max","min","update","prev","next","changeTab","e","code","up","down","EVENT_CODE","tabList","Array","from","currentTarget","querySelectorAll","currentIndex","indexOf","target","nextIndex","length","focus","click","setFocus","removeFocus","watch","setTimeout","useResizeObserver","onMounted","onUpdated","expose","__props","panes","flush","scrollBtn","_createVNode","is","arrowLeftIconCfg","icon","VftIcon","arrowRightIconCfg","tabs","map","pane","index","uid","disabled","tabName","closable","isClosable","editable","btnClose","ev","emit","closeIconCfg","tabLabelContent","slots","label","tabindex","active","onFocus","onBlur","event","preventDefault","delete","backspace","newButton","addable","onClick","enter","addIconCfg","stretch","type","TabBar"],"mappings":"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"}

package/es/packages/components/tabs/tab-pane.vue2.mjs

@@ -0,0 +1,63 @@
+import { defineComponent as b, getCurrentInstance as y, useSlots as C, inject as B, ref as m, computed as d, watch as g, reactive as w, onMounted as N, onUnmounted as k, unref as t, withDirectives as x, openBlock as z, createElementBlock as R, normalizeClass as S, renderSlot as _, vShow as $, createCommentVNode as E } from "vue";
+import "@vue/shared";
+import { throwError as P } from "../../utils/error.mjs";
+import { TabsRootContextKey as j } from "./types.mjs";
+import { useNamespace as D } from "../../hooks/use-namespace/index.mjs";
+import "@popperjs/core";
+import "lodash";
+import "../../hooks/use-z-index/index.mjs";
+import { eagerComputed as p } from "@vueuse/core";
+import "@vft/utils";
+const I = ["id", "aria-hidden", "aria-labelledby"], i = (
+  /* hoist-static*/
+  D("tab-pane")
+), K = b({
+  name: i.b()
+}), O = /* @__PURE__ */ b({
+  ...K,
+  props: {
+    label: null,
+    name: null,
+    closable: { type: Boolean },
+    disabled: { type: Boolean },
+    lazy: { type: Boolean }
+  },
+  setup(o) {
+    const n = y(), f = C(), a = B(j);
+    a || P(i.b(), "usage: <vft-tabs><vft-tab-pane /></vft-tabs/>");
+    const r = m(), v = d(() => o.closable || a.props.closable), e = p(() => a.currentName.value === (o.name ?? r.value)), c = m(e.value), l = d(() => o.name ?? r.value), h = p(() => !o.lazy || c.value || e.value);
+    g(e, (s) => {
+      s && (c.value = !0);
+    });
+    const u = w({
+      uid: n.uid,
+      slots: f,
+      props: n.props,
+      paneName: l,
+      active: e,
+      index: r,
+      isClosable: v,
+      attrs: n.attrs
+    });
+    return N(() => {
+      a.registerPane(u);
+    }), k(() => {
+      a.unregisterPane(u.uid);
+    }), (s, M) => t(h) ? x((z(), R("div", {
+      key: 0,
+      id: `pane-${t(l)}`,
+      class: S(t(i).b()),
+      role: "tabpanel",
+      "aria-hidden": !t(e),
+      "aria-labelledby": `tab-${t(l)}`
+    }, [
+      _(s.$slots, "default")
+    ], 10, I)), [
+      [$, t(e)]
+    ]) : E("", !0);
+  }
+});
+export {
+  O as default
+};
+//# sourceMappingURL=tab-pane.vue2.mjs.map

package/es/packages/components/tabs/tab-pane.vue2.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab-pane.vue2.mjs","sources":["../../../../../../packages/components/tabs/tab-pane.vue"],"sourcesContent":["<script lang=\"ts\">\nconst ns = /* hoist-static*/ useNamespace('tab-pane')\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 { throwError } from '@vft-ui/utils';\nimport { type TabsPaneContext, TabsRootContextKey } from './types';\nimport { useNamespace } from '@vft-ui/hooks';\nimport {\n  computed,\n  getCurrentInstance,\n  inject,\n  onMounted,\n  onUnmounted,\n  reactive,\n  ref,\n  useSlots,\n  watch\n} from 'vue';\nimport { eagerComputed } from '@vueuse/core';\n\ninterface TabPaneProps {\n  /** 选项卡标题 */\n  label?: string;\n  /** 与选项卡绑定值 value 对应的标识符，表示选项卡别名 */\n  name?: Numberish;\n  /** 标签是否可关闭 */\n  closable?: boolean;\n  /** 是否禁用 */\n  disabled?: boolean;\n  /** 标签是否延迟渲染 */\n  lazy?: boolean;\n}\n\ndefineProps({\n  \"label\": null,\n  \"name\": null,\n  \"closable\": { type: Boolean,  },\n  \"disabled\": { type: Boolean,  },\n  \"lazy\": { type: Boolean,  }\n})\n\n\n\n;\n\nconst vm = getCurrentInstance()!;\n\nconst slots = useSlots();\n\nconst tabsRoot = inject(TabsRootContextKey)!;\n\nif (!tabsRoot)\n\tthrowError(ns.b(), 'usage: <vft-tabs><vft-tab-pane /></vft-tabs/>')\n\nconst index = ref<string>();\n// 可关闭\nconst isClosable = computed(() => __props.closable || tabsRoot.props.closable);\n// 激活\nconst active = eagerComputed(() => {\n  return tabsRoot.currentName.value === (__props.name ?? index.value);\n});\n\nconst loaded = ref(active.value);\n\nconst paneName = computed(() => __props.name ?? index.value);\n\nconst shouldBeRender = eagerComputed(() => {\n  return !__props.lazy || loaded.value || active.value;\n});\n\nwatch(active, (val) => {\n  if (val) loaded.value = true;\n});\n\nconst pane = reactive({\n  uid: vm.uid,\n  slots,\n  props: vm.props as unknown as TabPaneProps,\n  paneName,\n  active,\n  index,\n  isClosable,\n  attrs: vm.attrs\n});\n\n\nonMounted(() => {\n  tabsRoot.registerPane(pane as TabsPaneContext);\n});\n\nonUnmounted(() => {\n  tabsRoot.unregisterPane(pane.uid);\n});\n</script>\n\n<template>\n  <div v-if=\"shouldBeRender\" v-show=\"active\" :id=\"`pane-${paneName}`\" :class=\"ns.b()\"\n    role=\"tabpanel\" :aria-hidden=\"!active\" :aria-labelledby=\"`tab-${paneName}`\">\n    <slot />\n  </div>\n</template>\n"],"names":["ns","useNamespace","__default__","DO_defineComponent","vm","getCurrentInstance","slots","useSlots","tabsRoot","inject","TabsRootContextKey","throwError","index","ref","isClosable","computed","__props","active","eagerComputed","loaded","paneName","shouldBeRender","watch","val","pane","reactive","onMounted","onUnmounted"],"mappings":";;;;;;;;;;oDACMA;AAAA;AAAA,EAAuBC,EAAa,UAAU;AAAA,GAGpDC,IAA6BC,EAAmB;AAAA,EAC9C,MAAMH,EAAG,EAAE;AACb,CAAC;;;;;;;;;;AA2CD,UAAMI,IAAKC,KAELC,IAAQC,KAERC,IAAWC,EAAOC,CAAkB;AAE1C,IAAKF,KACOG,EAAAX,EAAG,EAAE,GAAG,+CAA+C;AAEnE,UAAMY,IAAQC,KAERC,IAAaC,EAAS,MAAMC,EAAQ,YAAYR,EAAS,MAAM,QAAQ,GAEvES,IAASC,EAAc,MACpBV,EAAS,YAAY,WAAWQ,EAAQ,QAAQJ,EAAM,MAC9D,GAEKO,IAASN,EAAII,EAAO,KAAK,GAEzBG,IAAWL,EAAS,MAAMC,EAAQ,QAAQJ,EAAM,KAAK,GAErDS,IAAiBH,EAAc,MAC5B,CAACF,EAAQ,QAAQG,EAAO,SAASF,EAAO,KAChD;AAEK,IAAAK,EAAAL,GAAQ,CAACM,MAAQ;AACjB,MAAAA,MAAKJ,EAAO,QAAQ;AAAA,IAAA,CACzB;AAED,UAAMK,IAAOC,EAAS;AAAA,MACpB,KAAKrB,EAAG;AAAA,MACR,OAAAE;AAAA,MACA,OAAOF,EAAG;AAAA,MACV,UAAAgB;AAAA,MACA,QAAAH;AAAA,MACA,OAAAL;AAAA,MACA,YAAAE;AAAA,MACA,OAAOV,EAAG;AAAA,IAAA,CACX;AAGD,WAAAsB,EAAU,MAAM;AACd,MAAAlB,EAAS,aAAagB,CAAuB;AAAA,IAAA,CAC9C,GAEDG,EAAY,MAAM;AACP,MAAAnB,EAAA,eAAegB,EAAK,GAAG;AAAA,IAAA,CACjC;;;;;;;;;;;;;;"}

package/es/packages/components/tabs/tabs.vue2.mjs

@@ -0,0 +1,156 @@
+import { defineComponent as y, getCurrentInstance as g, useSlots as M, ref as h, watch as I, nextTick as D, computed as l, createVNode as s, provide as F } from "vue";
+import { useNamespace as O } from "../../hooks/use-namespace/index.mjs";
+import "@popperjs/core";
+import "lodash";
+import "../../hooks/use-z-index/index.mjs";
+import "@vueuse/core";
+import "@vue/shared";
+import { isNumberish as f, isUndefined as p } from "@vft/utils";
+import { useOrderedChildren as U } from "../../hooks/use-ordered-children/index.mjs";
+import { UPDATE_MODEL_EVENT as $ } from "@vft/constants";
+import K from "./tab-nav.vue2.mjs";
+import { TabsRootContextKey as S } from "./types.mjs";
+const r = (
+  /* hoist-static*/
+  O("tabs")
+), j = y({
+  name: r.b()
+}), ne = /* @__PURE__ */ y({
+  ...j,
+  props: {
+    type: {
+      default: ""
+    },
+    closable: {
+      type: Boolean
+    },
+    addable: {
+      type: Boolean,
+      default: !1
+    },
+    modelValue: null,
+    editable: {
+      type: Boolean
+    },
+    tabPosition: {
+      default: "top"
+    },
+    beforeLeave: {
+      type: Function
+    },
+    stretch: {
+      type: Boolean
+    },
+    closeIconCfg: null,
+    addIconCfg: null,
+    arrowLeftIconCfg: null,
+    arrowRightIconCfg: null
+  },
+  emits: {
+    [$]: (t) => f(t),
+    /** 点击 */
+    tabClick: (t, d) => d instanceof Event,
+    /** 右键点击 */
+    tabContextMenu: (t, d, a) => a instanceof Event,
+    tabChange: (t) => f(t),
+    edit: (t, d) => ["remove", "add"].includes(d),
+    /** 移除 */
+    tabRemove: (t) => f(t),
+    /** 增加 */
+    tabAdd: () => !0
+  },
+  setup(t, {
+    expose: d,
+    emit: a
+  }) {
+    const w = g(), i = M(), u = h(), c = h(t.modelValue ?? "0"), T = (e) => {
+      c.value = e, a("update:modelValue", e), a("tabChange", e);
+    }, m = async (e) => {
+      var n, o, C;
+      if (!(c.value === e || p(e)))
+        try {
+          await ((n = t.beforeLeave) == null ? void 0 : n.call(t, e, c.value)) !== !1 && (T(e), (C = (o = u.value) == null ? void 0 : o.removeFocus) == null || C.call(o));
+        } catch {
+        }
+    }, R = (e, n, o) => {
+      e.props.disabled || (m(n), a("tabClick", e, o));
+    }, L = (e, n) => {
+      e.props.disabled || p(e.props.name) || (n.stopPropagation(), a("edit", e.props.name, "remove"), a("tabRemove", e.props.name));
+    };
+    I(() => t.modelValue, (e) => m(e)), I(c, async () => {
+      var e;
+      await D(), (e = u.value) == null || e.scrollToActiveTab();
+    });
+    const N = () => {
+      a("edit", void 0, "add"), a("tabAdd");
+    }, x = (e, n, o) => {
+      a("tabContextMenu", e, n, o);
+    }, b = l(() => {
+      var e;
+      return s("div", {
+        class: r.e("content")
+      }, [(e = i.default) == null ? void 0 : e.call(i)]);
+    }), {
+      children: P,
+      addChild: k,
+      removeChild: A
+    } = U(g(), "vft-tab-pane");
+    F(S, {
+      props: w.props,
+      currentName: c,
+      registerPane: k,
+      unregisterPane: A
+    }), d({
+      currentName: c
+    });
+    const E = l(() => ({
+      icon: "vi-add",
+      color: "black",
+      size: 12,
+      ...t.addIconCfg
+    })), V = l(() => ({
+      icon: "vi-close",
+      size: 12,
+      ...t.closeIconCfg
+    })), z = l(() => ({
+      icon: "vi-arrow-left",
+      size: 18,
+      ...t.arrowLeftIconCfg
+    })), B = l(() => ({
+      icon: "vi-arrow-right",
+      size: 18,
+      ...t.arrowRightIconCfg
+    })), v = l(() => {
+      var e;
+      return s("div", {
+        class: [r.e("header"), r.is(t.tabPosition)]
+      }, [s(K, {
+        ref: u,
+        currentName: c.value,
+        panes: P.value,
+        stretch: t.stretch,
+        closeIconCfg: V.value,
+        addIconCfg: E.value,
+        arrowRightIconCfg: B.value,
+        arrowLeftIconCfg: z.value,
+        editable: t.editable,
+        addable: t.addable,
+        type: t.type,
+        onTabClick: R,
+        onTabRemove: L,
+        onTabAdd: N,
+        onTabContextmenu: x
+      }, null), (e = i.headerRight) == null ? void 0 : e.call(i)]);
+    });
+    return () => s("div", {
+      class: [r.b(), r.m(t.tabPosition), {
+        [r.m("card")]: t.type === "card",
+        [r.m("border-card")]: t.type === "border-card"
+      }]
+    }, [...t.tabPosition !== "bottom" ? [v.value, b.value] : [b.value, v.value]]);
+  }
+});
+export {
+  ne as default
+};
+//# sourceMappingURL=tabs.vue2.mjs.map

package/es/packages/components/tabs/tabs.vue2.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabs.vue2.mjs","sources":["../../../../../../packages/components/tabs/tabs.vue"],"sourcesContent":["<script lang=\"tsx\">\nconst ns = /* hoist-static*/ useNamespace('tabs')\n\nimport { defineComponent as DO_defineComponent } from 'vue';\nexport default /*#__PURE__*/ DO_defineComponent({\n  name: ns.b()\n});</script>\n<script setup lang=\"tsx\">\nimport { type IconProps } from '@vft-ui/components';\nimport { useNamespace, useOrderedChildren } from '@vft-ui/hooks';\nimport { UPDATE_MODEL_EVENT } from '@vft/constants';\nimport { isNumberish, isUndefined } from '@vft/utils';\nimport { computed, getCurrentInstance, nextTick, provide, ref, useSlots, watch } from 'vue';\nimport TabNav from './tab-nav.vue';\nimport { type TabsPaneContext, type TabsProps, TabsRootContextKey, type TabsType } from './types';\n\ninterface TabsProps {\n  /** 风格类型 */\n  type?: TabsType;\n  /** 标签是否可关闭 */\n  closable?: boolean;\n  /** 标签是否可增加 */\n  addable?: boolean;\n  /** 绑定值，选中选项卡的 name */\n  modelValue: Numberish;\n  /** 标签是否同时可增加和关闭 */\n  editable?: boolean;\n  /** 选项卡所在位置 */\n  tabPosition?: 'top' | 'right' | 'bottom' | 'left';\n  /** 切换标签之前的钩子函数， 若返回 false  或者返回被 reject 的 Promise，则阻止切换 */\n  beforeLeave?: Function;\n  /** 是否自动撑开宽度 */\n  stretch?: boolean;\n  /** icon 配置 */\n  closeIconCfg?: IconProps;\n  addIconCfg?: IconProps;\n  arrowLeftIconCfg?: IconProps;\n  arrowRightIconCfg?: IconProps;\n}\n\ndefineProps({\n  \"type\": { default: '' },\n  \"closable\": { type: Boolean,  },\n  \"addable\": { type: Boolean, default: false },\n  \"modelValue\": null,\n  \"editable\": { type: Boolean,  },\n  \"tabPosition\": { default: 'top' },\n  \"beforeLeave\": { type: Function,  },\n  \"stretch\": { type: Boolean,  },\n  \"closeIconCfg\": null,\n  \"addIconCfg\": null,\n  \"arrowLeftIconCfg\": null,\n  \"arrowRightIconCfg\": null\n})\n\nconst emit = defineEmits({\n  [UPDATE_MODEL_EVENT]: (name: Numberish) => isNumberish(name),\n  /** 点击 */\n  tabClick: (pane: TabsPaneContext, ev: Event) => ev instanceof Event,\n  /** 右键点击 */\n  tabContextMenu: (pane: TabsPaneContext, index: number, ev: Event) => ev instanceof Event,\n  tabChange: (name: Numberish) => isNumberish(name),\n  edit: (paneName: Numberish | undefined, action: 'remove' | 'add') =>\n    ['remove', 'add'].includes(action),\n  /** 移除 */\n  tabRemove: (name: Numberish) => isNumberish(name),\n  /** 增加 */\n  tabAdd: () => true\n});\n\n\n\n;\n\nconst vm = getCurrentInstance()!;\n\nconst slots = useSlots();\n\n// tab-nav 实例\nconst nav$ = ref();\n\n// 默认的激活的 tab\nconst currentName = ref<Numberish>(__props.modelValue ?? '0');\n\n// 更新当前 current tab 触发 tabChange 以及更新 modelValue\nconst changeCurrentName = (value: Numberish) => {\n  currentName.value = value;\n  emit('update:modelValue', value);\n  emit('tabChange', value);\n};\n\n// value 值为当前点击的 tab 值\nconst setCurrentName = async (value?: Numberish) => {\n  // 如果 currentName 等于原值，或者 value 不存在，不执行\n  if (currentName.value === value || isUndefined(value)) return;\n\n  try {\n    // 切换标签之前的钩子函数， 若返回 false  或者返回被 reject 的 Promise，则阻止切换 */\n    const canLeave = await __props.beforeLeave?.(value, currentName.value);\n    if (canLeave !== false) {\n      // 更新 tab 值\n      changeCurrentName(value);\n      //\n      nav$.value?.removeFocus?.();\n    }\n  } catch {}\n};\n\n/**\n * @description tab 点击事件\n * @author wfd\n * @date 2022/10/18 09:07\n * @example\n * @param {TabsPaneContext} tab 当前被点击的 tab 信息\n * @param {Numberish} tabName 被点击的 tab 值\n * @param {Event} event\n */\nconst handleTabClick = (tab: TabsPaneContext, tabName: Numberish, event: Event) => {\n  // 如果 TabPaneProps 中设置了 disabled 则禁止点击\n  if (tab.props.disabled) return;\n  // 更新 currentName\n  setCurrentName(tabName);\n  // 抛出 tabClick 事件\n  emit('tabClick', tab, event);\n};\n\nconst handleTabRemove = (pane: TabsPaneContext, ev: Event) => {\n  if (pane.props.disabled || isUndefined(pane.props.name)) return;\n  ev.stopPropagation();\n  emit('edit', pane.props.name, 'remove');\n  emit('tabRemove', pane.props.name);\n};\n\n// 监听 modelValue 改变触发改变 currentName\nwatch(\n  () => __props.modelValue,\n  (modelValue) => setCurrentName(modelValue)\n);\n\n// 当前激活的 tab 变化触发 nav$ scrollToActiveTab 方法\nwatch(currentName, async () => {\n  await nextTick();\n  nav$.value?.scrollToActiveTab();\n});\n\n// 增加 tab 事件\nconst handleTabAdd = () => {\n  emit('edit', undefined, 'add');\n  emit('tabAdd');\n};\n\nconst handleContextmenu = (pane: TabsPaneContext, index: number, ev: Event) => {\n  emit('tabContextMenu', pane, index, ev);\n};\n\n// 默认渲染的内容区域\nconst panels = computed(() => {\n  return <div class={ns.e('content')}>{slots.default?.()}</div>;\n});\n\n// 找出当前 tab 组件下 vft-tab-pane 的组件实例对象\nconst { children: panes, addChild: registerPane, removeChild: unregisterPane } = useOrderedChildren<TabsPaneContext>(getCurrentInstance()!, 'vft-tab-pane');\n\nprovide(TabsRootContextKey, {\n  props: vm.props as unknown as TabsProps,\n  currentName,\n  registerPane,\n  unregisterPane\n});\n\ndefineExpose({\n  currentName\n});\n\n// 图标相关\nconst _addIconCfg = computed(() => {\n  return {\n    icon: 'vi-add',\n    color: 'black',\n    size: 12,\n    ...__props.addIconCfg\n  };\n});\n\nconst _closeIconCfg = computed(() => {\n  return {\n    icon: 'vi-close',\n    size: 12,\n    ...__props.closeIconCfg\n  };\n});\n\nconst _arrowLeftIconCfg = computed(() => {\n  return {\n    icon: 'vi-arrow-left',\n    size: 18,\n    ...__props.arrowLeftIconCfg\n  };\n});\n\nconst _arrowRightIconCfg = computed(() => {\n  return {\n    icon: 'vi-arrow-right',\n    size: 18,\n    ...__props.arrowRightIconCfg\n  };\n});\n\nconst header = computed(() => {\n  return (\n    <div class={[ns.e('header'), ns.is(__props.tabPosition)]}>\n      <TabNav\n        ref={nav$}\n        currentName={currentName.value}\n        panes={panes.value}\n        stretch={__props.stretch}\n        closeIconCfg={_closeIconCfg.value}\n        addIconCfg={_addIconCfg.value}\n        arrowRightIconCfg={_arrowRightIconCfg.value}\n        arrowLeftIconCfg={_arrowLeftIconCfg.value}\n        editable={__props.editable}\n        addable={__props.addable}\n        type={__props.type}\n        onTabClick={handleTabClick}\n        onTabRemove={handleTabRemove}\n        onTabAdd={handleTabAdd}\n        onTabContextmenu={handleContextmenu}\n      />\n      {slots.headerRight?.()}\n    </div>\n  );\n});\n\ndefineRender(() => {\n  return (\n    <div\n      class={[\n        ns.b(),\n        ns.m(__props.tabPosition),\n        {\n          [ns.m('card')]: __props.type === 'card',\n          [ns.m('border-card')]: __props.type === 'border-card'\n        }\n      ]}\n    >\n      {...__props.tabPosition !== 'bottom' ? [header.value, panels.value] : [panels.value, header.value]}\n    </div>\n  );\n});\n</script>\n"],"names":["ns","useNamespace","__default__","DO_defineComponent","name","b","vm","getCurrentInstance","slots","useSlots","nav$","ref","currentName","__props","modelValue","changeCurrentName","value","emit","setCurrentName","isUndefined","beforeLeave","removeFocus","handleTabClick","tab","tabName","event","props","disabled","handleTabRemove","pane","ev","stopPropagation","watch","nextTick","scrollToActiveTab","handleTabAdd","undefined","handleContextmenu","index","panels","computed","_createVNode","e","default","children","panes","addChild","registerPane","removeChild","unregisterPane","useOrderedChildren","provide","TabsRootContextKey","expose","_addIconCfg","icon","color","size","addIconCfg","_closeIconCfg","closeIconCfg","_arrowLeftIconCfg","arrowLeftIconCfg","_arrowRightIconCfg","arrowRightIconCfg","header","is","tabPosition","TabNav","stretch","editable","addable","type","headerRight","m"],"mappings":"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"}

package/es/packages/components/tabs/types.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.mjs","sources":["../../../../../../packages/components/tabs/types.ts"],"sourcesContent":["import type { ComputedRef, InjectionKey, Ref, Slots, UnwrapRef } from 'vue';\nimport { type IconProps } from '@vft-ui/components';\n\nexport type TabsPaneContext = UnwrapRef<{\n  uid: number;\n  slots: Slots;\n  props: TabPaneProps;\n  paneName: ComputedRef<string | number | undefined>;\n  active: ComputedRef<boolean>;\n  index: Ref<string | undefined>;\n  isClosable: ComputedRef<boolean>;\n  attrs: Record<string, any>;\n}>;\n\nexport type TabsType = 'card' | 'border-card' | '';\n\nexport interface TabsRootContext {\n  props: TabsProps;\n  currentName: Ref<string | number>;\n  registerPane: (pane: TabsPaneContext) => void;\n  unregisterPane: (uid: number) => void;\n}\n\nexport interface TabPaneProps {\n  /** 选项卡标题   */\n  label: string;\n  /** 与选项卡绑定值 value 对应的标识符，表示选项卡别名   */\n  name: Numberish;\n  /** 标签是否可关闭   */\n  closable: boolean;\n  /** 是否禁用   */\n  disabled: boolean;\n  /** 标签是否延迟渲染   */\n  lazy: boolean;\n}\n\nexport interface TabsProps {\n  /** 风格类型 */\n  type?: TabsType;\n  /** 标签是否可关闭 */\n  closable?: boolean;\n  /** 标签是否可增加 */\n  addable?: boolean;\n  /** 绑定值，选中选项卡的 name */\n  modelValue: Numberish;\n  /** 标签是否同时可增加和关闭 */\n  editable?: boolean;\n  /** 选项卡所在位置 */\n  tabPosition?: 'top' | 'right' | 'bottom' | 'left';\n  /** 切换标签之前的钩子函数， 若返回 false  或者返回被 reject 的 Promise，则阻止切换 */\n  beforeLeave?: Function;\n  stretch?: boolean;\n  closeIconCfg?: IconProps;\n  addIconCfg?: IconProps;\n  arrowLeftIconCfg?: IconProps;\n  arrowRightIconCfg?: IconProps;\n}\n\nexport const TabsRootContextKey: InjectionKey<TabsRootContext> = Symbol('tabsRootContextKey');\n\nexport interface Scrollable {\n  next?: boolean;\n  prev?: number;\n}\n\nexport type TabsPanes = Record<number, TabsPaneContext>;\n"],"names":["TabsRootContextKey"],"mappings":"AA0Da,MAAAA,IAAoD,OAAO,oBAAoB;"}

package/es/packages/components/tooltip/constants.mjs

@@ -0,0 +1,5 @@
+const o = Symbol("vftTooltip");
+export {
+  o as TOOLTIP_INJECTION_KEY
+};
+//# sourceMappingURL=constants.mjs.map

package/es/packages/components/tooltip/constants.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.mjs","sources":["../../../../../../packages/components/tooltip/constants.ts"],"sourcesContent":["import type { InjectionKey, Ref } from 'vue';\n\nexport type Arrayable<T> = T | T[];\nexport type TooltipTriggerType = 'hover' | 'focus' | 'click' | 'contextmenu';\n\nexport type VftTooltipInjectionContext = {\n  controlled: Ref<boolean>\n  id: Ref<string>\n  open: Ref<boolean>\n  trigger: Ref<Arrayable<TooltipTriggerType>>\n  onOpen: (e?: Event) => void\n  onClose: (e?: Event) => void\n  onToggle: (e: Event) => void\n  onShow: () => void\n  onHide: () => void\n  onBeforeShow: () => void\n  onBeforeHide: () => void\n  updatePopper: () => void\n}\n\nexport const TOOLTIP_INJECTION_KEY: InjectionKey<VftTooltipInjectionContext> = Symbol('vftTooltip');\n"],"names":["TOOLTIP_INJECTION_KEY"],"mappings":"AAoBa,MAAAA,IAAkE,OAAO,YAAY;"}

package/es/packages/components/tooltip/content.vue.mjs

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