vft 0.0.11 → 0.0.13

package/es/components/popper/trigger.vue2.mjs

@@ -0,0 +1,118 @@
+import { defineComponent as C, getCurrentInstance as h, inject as x, computed as m, onMounted as B, watch as f, onBeforeUnmount as g, openBlock as w, createBlock as M, unref as d, mergeProps as P, withCtx as R, renderSlot as k, createCommentVNode as L } from "vue";
+import { isNil as I } from "lodash";
+import { unrefElement as K } from "@vueuse/core";
+import { OnlyChild as O } from "../slot/only-child.mjs";
+import "@popperjs/core";
+import "../../hooks/use-z-index/index.mjs";
+import { useForwardRef as $ } from "../../hooks/use-forward-ref/index.mjs";
+import "@vue/shared";
+import { isElement as b } from "@vft/utils";
+import { POPPER_INJECTION_KEY as N } from "./constants.mjs";
+const V = C({
+  name: "VftPopperTrigger",
+  inheritAttrs: !1
+}), E = /* @__PURE__ */ C({
+  ...V,
+  props: {
+    virtualRef: null,
+    virtualTriggering: { type: Boolean },
+    onMouseenter: { type: Function },
+    onMouseleave: { type: Function },
+    onClick: { type: Function },
+    onKeydown: { type: Function },
+    onFocus: { type: Function },
+    onBlur: { type: Function },
+    onContextmenu: { type: Function },
+    id: null,
+    open: { type: Boolean }
+  },
+  setup(r, { expose: v }) {
+    const F = h(), { role: a, triggerRef: s } = x(N, void 0);
+    $(s);
+    const p = m(() => c.value ? r.id : void 0), l = m(() => {
+      if (a && a.value === "tooltip")
+        return r.open && r.id ? r.id : void 0;
+    }), c = m(() => {
+      if (a && a.value !== "tooltip")
+        return a.value;
+    }), y = m(() => c.value ? `${r.open}` : void 0);
+    let o;
+    return B(() => {
+      f(
+        () => r.virtualRef,
+        (e) => {
+          e && (s.value = K(e));
+        },
+        {
+          immediate: !0
+        }
+      ), f(
+        s,
+        (e, t) => {
+          o == null || o(), o = void 0, b(e) && ([
+            "onMouseenter",
+            "onMouseleave",
+            "onClick",
+            "onKeydown",
+            "onFocus",
+            "onBlur",
+            "onContextmenu"
+          ].forEach((n) => {
+            var u;
+            const i = F.props[n];
+            i && (e.addEventListener(
+              n.slice(2).toLowerCase(),
+              i
+            ), (u = t == null ? void 0 : t.removeEventListener) == null || u.call(
+              t,
+              n.slice(2).toLowerCase(),
+              i
+            ));
+          }), o = f(
+            [p, l, c, y],
+            (n) => {
+              [
+                "aria-controls",
+                "aria-describedby",
+                "aria-haspopup",
+                "aria-expanded"
+              ].forEach((i, u) => {
+                I(n[u]) ? e.removeAttribute(i) : e.setAttribute(i, n[u]);
+              });
+            },
+            { immediate: !0 }
+          )), b(t) && [
+            "aria-controls",
+            "aria-describedby",
+            "aria-haspopup",
+            "aria-expanded"
+          ].forEach((n) => t.removeAttribute(n));
+        },
+        {
+          immediate: !0
+        }
+      );
+    }), g(() => {
+      o == null || o(), o = void 0;
+    }), v({
+      /**
+       * @description trigger element
+       */
+      triggerRef: s
+    }), (e, t) => r.virtualTriggering ? L("", !0) : (w(), M(d(O), P({ key: 0 }, e.$attrs, {
+      "aria-controls": d(p),
+      "aria-describedby": d(l),
+      "aria-expanded": d(y),
+      "aria-haspopup": d(c)
+    }), {
+      default: R(() => [
+        k(e.$slots, "default")
+      ]),
+      _: 3
+    }, 16, ["aria-controls", "aria-describedby", "aria-expanded", "aria-haspopup"]));
+  }
+});
+export {
+  E as default
+};
+//# sourceMappingURL=trigger.vue2.mjs.map

package/es/components/popper/trigger.vue2.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"trigger.vue2.mjs","sources":["../../../../../packages/components/popper/trigger.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { defineComponent as DO_defineComponent } from 'vue';\nexport default /*#__PURE__*/ DO_defineComponent({\n  name: 'VftPopperTrigger',\n  inheritAttrs: false\n});\n</script>\n<template>\n  <vft-only-child\n    v-if=\"!virtualTriggering\"\n    v-bind=\"$attrs\"\n    :aria-controls=\"ariaControls\"\n    :aria-describedby=\"ariaDescribedby\"\n    :aria-expanded=\"ariaExpanded\"\n    :aria-haspopup=\"ariaHaspopup\"\n  >\n    <slot />\n  </vft-only-child>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, onBeforeUnmount, onMounted, watch, getCurrentInstance } from 'vue';\nimport { isNil } from 'lodash';\nimport { unrefElement } from '@vueuse/core';\nimport { VftOnlyChild } from '@vft-ui/components/slot'\nimport { useForwardRef } from '@vft-ui/hooks';\nimport { POPPER_INJECTION_KEY } from './constants';\nimport { isElement } from '@vft/utils';\n\nimport type { WatchStopHandle } from 'vue';\nimport type { Measurable } from './types';\n\n;\n\ninterface Props {\n  virtualRef?: Measurable\n  virtualTriggering?: boolean\n  onMouseenter?: Function\n  onMouseleave?: Function\n  onClick?: Function\n  onKeydown?: Function\n  onFocus?: Function\n  onBlur?: Function\n  onContextmenu?: Function\n  id?: string\n  open?: boolean\n}\n\ndefineProps({\n  \"virtualRef\": null,\n  \"virtualTriggering\": { type: Boolean,  },\n  \"onMouseenter\": { type: Function,  },\n  \"onMouseleave\": { type: Function,  },\n  \"onClick\": { type: Function,  },\n  \"onKeydown\": { type: Function,  },\n  \"onFocus\": { type: Function,  },\n  \"onBlur\": { type: Function,  },\n  \"onContextmenu\": { type: Function,  },\n  \"id\": null,\n  \"open\": { type: Boolean,  }\n})\n\nconst instance = getCurrentInstance()!;\n\nconst { role, triggerRef } = inject(POPPER_INJECTION_KEY, undefined)!;\n\nuseForwardRef(triggerRef);\n\nconst ariaControls = computed<string | undefined>(() => {\n  return ariaHaspopup.value ? __props.id : undefined;\n});\n\nconst ariaDescribedby = computed<string | undefined>(() => {\n  if (role && role.value === 'tooltip') {\n    return __props.open && __props.id ? __props.id : undefined;\n  }\n  return undefined;\n});\n\nconst ariaHaspopup = computed<string | undefined>(() => {\n  if (role && role.value !== 'tooltip') {\n    return role.value;\n  }\n  return undefined;\n});\n\nconst ariaExpanded = computed<string | undefined>(() => {\n  return ariaHaspopup.value ? `${__props.open}` : undefined;\n});\n\nlet virtualTriggerAriaStopWatch: WatchStopHandle | undefined = undefined;\n\nonMounted(() => {\n  watch(\n    () => __props.virtualRef,\n    (virtualEl) => {\n      if (virtualEl) {\n        triggerRef.value = unrefElement(virtualEl as HTMLElement);\n      }\n    },\n    {\n      immediate: true\n    }\n  );\n\n  watch(\n    triggerRef,\n    (el, prevEl) => {\n      virtualTriggerAriaStopWatch?.();\n      virtualTriggerAriaStopWatch = undefined;\n      if (isElement(el)) {\n        ;(\n          [\n            'onMouseenter',\n            'onMouseleave',\n            'onClick',\n            'onKeydown',\n            'onFocus',\n            'onBlur',\n            'onContextmenu'\n          ] as const\n        ).forEach((eventName) => {\n          const handler: any = instance.props[eventName];\n          if (handler) {\n            ;(el as HTMLElement).addEventListener(\n              eventName.slice(2).toLowerCase(),\n              handler\n            )\n            ;(prevEl as HTMLElement)?.removeEventListener?.(\n              eventName.slice(2).toLowerCase(),\n              handler\n            );\n          }\n        });\n        virtualTriggerAriaStopWatch = watch(\n          [ariaControls, ariaDescribedby, ariaHaspopup, ariaExpanded],\n          (watches) => {\n            ;[\n              'aria-controls',\n              'aria-describedby',\n              'aria-haspopup',\n              'aria-expanded'\n            ].forEach((key, idx) => {\n              isNil(watches[idx])\n                ? el.removeAttribute(key)\n                : el.setAttribute(key, watches[idx]!);\n            });\n          },\n          { immediate: true }\n        );\n      }\n      if (isElement(prevEl)) {\n        ;[\n          'aria-controls',\n          'aria-describedby',\n          'aria-haspopup',\n          'aria-expanded'\n        ].forEach((key) => prevEl.removeAttribute(key));\n      }\n    },\n    {\n      immediate: true\n    }\n  );\n});\n\nonBeforeUnmount(() => {\n  virtualTriggerAriaStopWatch?.();\n  virtualTriggerAriaStopWatch = undefined;\n});\n\ndefineExpose({\n  /**\n   * @description trigger element\n   */\n  triggerRef\n});\n</script>\n"],"names":["__default__","DO_defineComponent","instance","getCurrentInstance","role","triggerRef","inject","POPPER_INJECTION_KEY","useForwardRef","ariaControls","computed","ariaHaspopup","__props","ariaDescribedby","ariaExpanded","virtualTriggerAriaStopWatch","onMounted","watch","virtualEl","unrefElement","el","prevEl","isElement","eventName","handler","_a","watches","key","idx","isNil","onBeforeUnmount","expose"],"mappings":";;;;;;;;;;AAEA,MAAAA,IAA6BC,EAAmB;AAAA,EAC9C,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;;;;;;;;;;;;;;AAyDD,UAAMC,IAAWC,KAEX,EAAE,MAAAC,GAAM,YAAAC,EAAe,IAAAC,EAAOC,GAAsB,MAAS;AAEnE,IAAAC,EAAcH,CAAU;AAElB,UAAAI,IAAeC,EAA6B,MACzCC,EAAa,QAAQC,EAAQ,KAAK,MAC1C,GAEKC,IAAkBH,EAA6B,MAAM;AACrD,UAAAN,KAAQA,EAAK,UAAU;AACzB,eAAOQ,EAAQ,QAAQA,EAAQ,KAAKA,EAAQ,KAAK;AAAA,IAE5C,CACR,GAEKD,IAAeD,EAA6B,MAAM;AAClD,UAAAN,KAAQA,EAAK,UAAU;AACzB,eAAOA,EAAK;AAAA,IAEP,CACR,GAEKU,IAAeJ,EAA6B,MACzCC,EAAa,QAAQ,GAAGC,EAAQ,SAAS,MACjD;AAED,QAAIG;AAEJ,WAAAC,EAAU,MAAM;AACd,MAAAC;AAAA,QACE,MAAML,EAAQ;AAAA,QACd,CAACM,MAAc;AACb,UAAIA,MACSb,EAAA,QAAQc,EAAaD,CAAwB;AAAA,QAE5D;AAAA,QACA;AAAA,UACE,WAAW;AAAA,QACb;AAAA,MAAA,GAGFD;AAAA,QACEZ;AAAA,QACA,CAACe,GAAIC,MAAW;AACgB,UAAAN,KAAA,QAAAA,KACAA,IAAA,QAC1BO,EAAUF,CAAE,MAEZ;AAAA,YACE;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UAAA,EAEF,QAAQ,CAACG,MAAc;;AACjB,kBAAAC,IAAetB,EAAS,MAAMqB,CAAS;AAC7C,YAAIC,MACAJ,EAAmB;AAAA,cACnBG,EAAU,MAAM,CAAC,EAAE,YAAY;AAAA,cAC/BC;AAAA,YAAA,IAEAC,IAAAJ,KAAA,gBAAAA,EAAwB,wBAAxB,QAAAI,EAAA;AAAA,cAAAJ;AAAA,cACAE,EAAU,MAAM,CAAC,EAAE,YAAY;AAAA,cAC/BC;AAAA;AAAA,UAEJ,CACD,GAC6BT,IAAAE;AAAA,YAC5B,CAACR,GAAcI,GAAiBF,GAAcG,CAAY;AAAA,YAC1D,CAACY,MAAY;AACV;AAAA,gBACC;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,cAAA,EACA,QAAQ,CAACC,GAAKC,MAAQ;AACtB,gBAAAC,EAAMH,EAAQE,CAAG,CAAC,IACdR,EAAG,gBAAgBO,CAAG,IACtBP,EAAG,aAAaO,GAAKD,EAAQE,CAAG,CAAE;AAAA,cAAA,CACvC;AAAA,YACH;AAAA,YACA,EAAE,WAAW,GAAK;AAAA,UAAA,IAGlBN,EAAUD,CAAM,KACjB;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UAAA,EACA,QAAQ,CAACM,MAAQN,EAAO,gBAAgBM,CAAG,CAAC;AAAA,QAElD;AAAA,QACA;AAAA,UACE,WAAW;AAAA,QACb;AAAA,MAAA;AAAA,IACF,CACD,GAEDG,EAAgB,MAAM;AACU,MAAAf,KAAA,QAAAA,KACAA,IAAA;AAAA,IAAA,CAC/B,GAEYgB,EAAA;AAAA;AAAA;AAAA;AAAA,MAIX,YAAA1B;AAAA,IAAA,CACD;;;;;;;;;;;;;"}

package/es/components/popper/types.d.ts

@@ -0,0 +1,45 @@
+import type { Options, Placement } from '@popperjs/core';
+import { type StyleValue } from 'vue';
+export type Measurable = {
+    getBoundingClientRect: () => DOMRect;
+};
+export interface CreatePopperInstanceParams {
+    referenceEl: Measurable;
+    popperContentEl: HTMLElement;
+    arrowEl: HTMLElement | undefined;
+}
+export interface PopperCoreConfigProps {
+    boundariesPadding?: number;
+    fallbackPlacements?: Placement[];
+    gpuAcceleration?: boolean;
+    offset?: number;
+    placement?: Placement;
+    popperOptions: Partial<Options>;
+    strategy?: 'fixed' | 'absolute';
+}
+export interface PopperContentProps {
+    boundariesPadding?: number;
+    fallbackPlacements?: Placement[];
+    gpuAcceleration?: boolean;
+    offset?: number;
+    placement?: Placement;
+    popperOptions?: Partial<Options>;
+    strategy?: 'fixed' | 'absolute';
+    id?: string;
+    style?: StyleValue;
+    className?: ClassType;
+    effect?: string;
+    visible?: boolean;
+    enterable?: boolean;
+    pure?: boolean;
+    focusOnShow?: boolean;
+    trapping?: boolean;
+    popperClass?: ClassType;
+    popperStyle?: StyleValue;
+    referenceEl?: HTMLElement;
+    triggerTargetEl?: HTMLElement;
+    stopPopperMouseEvent?: boolean;
+    ariaLabel?: string;
+    virtualTriggering?: boolean;
+    zIndex?: number;
+}

package/es/components/popper/types.mjs

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

package/es/components/popper/types.mjs.map

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

package/es/components/popper/utils.d.ts

@@ -0,0 +1,49 @@
+import type { ComponentPublicInstance } from 'vue';
+import type { MaybeRef } from '@vueuse/core';
+import type { Modifier } from '@popperjs/core';
+import type { Measurable } from './constants';
+import type { PopperCoreConfigProps } from './types';
+export declare const buildPopperOptions: (props: PopperCoreConfigProps, modifiers?: Modifier<any, any>[]) => {
+    modifiers: (Modifier<any, any> | {
+        name: string;
+        options: {
+            offset: number[];
+            padding?: undefined;
+            fallbackPlacements?: undefined;
+            gpuAcceleration?: undefined;
+        };
+    } | {
+        name: string;
+        options: {
+            padding: {
+                top: number;
+                bottom: number;
+                left: number;
+                right: number;
+            };
+            offset?: undefined;
+            fallbackPlacements?: undefined;
+            gpuAcceleration?: undefined;
+        };
+    } | {
+        name: string;
+        options: {
+            padding: number;
+            fallbackPlacements: import("@popperjs/core").Placement[] | undefined;
+            offset?: undefined;
+            gpuAcceleration?: undefined;
+        };
+    } | {
+        name: string;
+        options: {
+            gpuAcceleration: boolean | undefined;
+            offset?: undefined;
+            padding?: undefined;
+            fallbackPlacements?: undefined;
+        };
+    })[];
+    placement: import("@popperjs/core").Placement | undefined;
+    strategy: import("@popperjs/core").PositioningStrategy | undefined;
+    onFirstUpdate?: ((arg0: Partial<import("@popperjs/core").State>) => void) | undefined;
+};
+export declare const unwrapMeasurableEl: ($el: MaybeRef<Measurable | undefined | ComponentPublicInstance>) => HTMLElement | undefined;

package/es/components/popper/utils.mjs

@@ -0,0 +1,56 @@
+import { isClient as f, unrefElement as s } from "@vueuse/core";
+const c = (e, t = []) => {
+  const { placement: o, strategy: i, popperOptions: n } = e, r = {
+    placement: o,
+    strategy: i,
+    ...n,
+    modifiers: [...a(e), ...t]
+  };
+  return l(r, n == null ? void 0 : n.modifiers), r;
+}, p = (e) => {
+  if (f)
+    return s(e);
+};
+function a(e) {
+  const { offset: t, gpuAcceleration: o, fallbackPlacements: i } = e;
+  return [
+    {
+      name: "offset",
+      options: {
+        offset: [0, t ?? 12]
+      }
+    },
+    {
+      name: "preventOverflow",
+      options: {
+        padding: {
+          top: 2,
+          bottom: 2,
+          left: 5,
+          right: 5
+        }
+      }
+    },
+    {
+      name: "flip",
+      options: {
+        padding: 5,
+        fallbackPlacements: i
+      }
+    },
+    {
+      name: "computeStyles",
+      options: {
+        gpuAcceleration: o
+      }
+    }
+  ];
+}
+function l(e, t) {
+  t && (e.modifiers = [...e.modifiers, ...t ?? []]);
+}
+export {
+  c as buildPopperOptions,
+  p as unwrapMeasurableEl
+};
+//# sourceMappingURL=utils.mjs.map

package/es/components/popper/utils.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.mjs","sources":["../../../../../packages/components/popper/utils.ts"],"sourcesContent":["import { isClient, unrefElement } from '@vueuse/core'\n\nimport type { ComponentPublicInstance } from 'vue'\nimport type { MaybeRef } from '@vueuse/core'\nimport type { Modifier } from '@popperjs/core'\nimport type { Measurable } from './constants'\nimport type { PopperCoreConfigProps } from './types'\n\nexport const buildPopperOptions = (\n\tprops: PopperCoreConfigProps,\n\tmodifiers: Modifier<any, any>[] = []\n) => {\n\tconst { placement, strategy, popperOptions } = props\n\tconst options = {\n\t\tplacement,\n\t\tstrategy,\n\t\t...popperOptions,\n\t\tmodifiers: [...genModifiers(props), ...modifiers],\n\t}\n\t\n\tderiveExtraModifiers(options, popperOptions?.modifiers)\n\treturn options\n}\n\nexport const unwrapMeasurableEl = (\n\t$el: MaybeRef<Measurable | undefined | ComponentPublicInstance>\n) => {\n\tif (!isClient) return\n\treturn unrefElement($el as HTMLElement)\n}\n\nfunction genModifiers (options: PopperCoreConfigProps) {\n\tconst { offset, gpuAcceleration, fallbackPlacements } = options\n\treturn [\n\t\t{\n\t\t\tname: 'offset',\n\t\t\toptions: {\n\t\t\t\toffset: [0, offset ?? 12],\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tname: 'preventOverflow',\n\t\t\toptions: {\n\t\t\t\tpadding: {\n\t\t\t\t\ttop: 2,\n\t\t\t\t\tbottom: 2,\n\t\t\t\t\tleft: 5,\n\t\t\t\t\tright: 5,\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tname: 'flip',\n\t\t\toptions: {\n\t\t\t\tpadding: 5,\n\t\t\t\tfallbackPlacements,\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tname: 'computeStyles',\n\t\t\toptions: {\n\t\t\t\tgpuAcceleration,\n\t\t\t},\n\t\t},\n\t]\n}\n\nfunction deriveExtraModifiers (\n\toptions: any,\n\tmodifiers: PopperCoreConfigProps['popperOptions']['modifiers']\n) {\n\tif (modifiers) {\n\t\toptions.modifiers = [...options.modifiers, ...(modifiers ?? [])]\n\t}\n}\n"],"names":["buildPopperOptions","props","modifiers","placement","strategy","popperOptions","options","genModifiers","deriveExtraModifiers","unwrapMeasurableEl","$el","isClient","unrefElement","offset","gpuAcceleration","fallbackPlacements"],"mappings":";AAQO,MAAMA,IAAqB,CACjCC,GACAC,IAAkC,OAC9B;AACJ,QAAM,EAAE,WAAAC,GAAW,UAAAC,GAAU,eAAAC,EAAA,IAAkBJ,GACzCK,IAAU;AAAA,IACf,WAAAH;AAAA,IACA,UAAAC;AAAA,IACA,GAAGC;AAAA,IACH,WAAW,CAAC,GAAGE,EAAaN,CAAK,GAAG,GAAGC,CAAS;AAAA,EAAA;AAG5B,SAAAM,EAAAF,GAASD,KAAA,gBAAAA,EAAe,SAAS,GAC/CC;AACR,GAEaG,IAAqB,CACjCC,MACI;AACJ,MAAKC;AACL,WAAOC,EAAaF,CAAkB;AACvC;AAEA,SAASH,EAAcD,GAAgC;AACtD,QAAM,EAAE,QAAAO,GAAQ,iBAAAC,GAAiB,oBAAAC,EAAA,IAAuBT;AACjD,SAAA;AAAA,IACN;AAAA,MACC,MAAM;AAAA,MACN,SAAS;AAAA,QACR,QAAQ,CAAC,GAAGO,KAAU,EAAE;AAAA,MACzB;AAAA,IACD;AAAA,IACA;AAAA,MACC,MAAM;AAAA,MACN,SAAS;AAAA,QACR,SAAS;AAAA,UACR,KAAK;AAAA,UACL,QAAQ;AAAA,UACR,MAAM;AAAA,UACN,OAAO;AAAA,QACR;AAAA,MACD;AAAA,IACD;AAAA,IACA;AAAA,MACC,MAAM;AAAA,MACN,SAAS;AAAA,QACR,SAAS;AAAA,QACT,oBAAAE;AAAA,MACD;AAAA,IACD;AAAA,IACA;AAAA,MACC,MAAM;AAAA,MACN,SAAS;AAAA,QACR,iBAAAD;AAAA,MACD;AAAA,IACD;AAAA,EAAA;AAEF;AAEA,SAASN,EACRF,GACAJ,GACC;AACD,EAAIA,MACKI,EAAA,YAAY,CAAC,GAAGA,EAAQ,WAAW,GAAIJ,KAAa,CAAA,CAAG;AAEjE;"}

package/es/components/result/result.vue2.mjs

@@ -1,6 +1,10 @@
-import { defineComponent as u, getCurrentInstance as d, useSlots as f, computed as v, h as e } from "vue";
+import { defineComponent as l, getCurrentInstance as d, useSlots as f, computed as v, h as o } from "vue";
 import { singleAttrToObj as _, renderTNode as b } from "@vft/utils";
 import { useNamespace as x } 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 "../divider/index.mjs";
 import { VftIcon as C } from "../icon/index.mjs";
@@ -9,43 +13,48 @@ import "../empty/index.mjs";
 import "./index.mjs";
 import "../exception/index.mjs";
 import "../tabs/index.mjs";
-const o = (
+import "../popper/index.mjs";
+import "../collapse-transition/index.mjs";
+import "../tooltip/index.mjs";
+import "../popover/index.mjs";
+import "../menu/index.mjs";
+const n = (
   /* hoist-static*/
   x("result")
-), I = u({
-  name: o.b()
-}), w = /* @__PURE__ */ u({
+), I = l({
+  name: n.b()
+}), J = /* @__PURE__ */ l({
   ...I,
   props: {
     title: null,
     subTitle: null,
     icon: null
   },
-  setup(a) {
-    var c, l;
-    const m = d(), t = f(), r = v(() => _(a.icon, "icon")), p = (c = r.value) != null && c.icon ? e("div", {
-      class: o.e("icon")
-    }, [e(C, { ...r.value })]) : (l = t.default) == null ? void 0 : l.call(t), i = (n) => {
-      const s = b(m, n);
-      return s ? e(
+  setup(s) {
+    var m, p;
+    const u = d(), t = f(), r = v(() => _(s.icon, "icon")), a = (m = r.value) != null && m.icon ? o("div", {
+      class: n.e("icon")
+    }, [o(C, { ...r.value })]) : (p = t.default) == null ? void 0 : p.call(t), i = (e) => {
+      const c = b(u, e);
+      return c ? o(
         "div",
         {
-          class: o.e(n)
+          class: n.e(e)
         },
-        [e("p", {}, { default: () => s })]
+        [o("p", {}, { default: () => c })]
       ) : null;
     };
-    return () => e(
+    return () => o(
       "div",
-      { class: o.b() },
+      { class: n.b() },
       {
         default: () => [
-          p,
+          a,
           i("title"),
           i("sub-title"),
-          t.extra ? e("div", { class: o.e("extra") }, { default: () => {
-            var n;
-            return (n = t.extra) == null ? void 0 : n.call(t);
+          t.extra ? o("div", { class: n.e("extra") }, { default: () => {
+            var e;
+            return (e = t.extra) == null ? void 0 : e.call(t);
           } }) : null
         ]
       }
@@ -53,6 +62,6 @@ const o = (
   }
 });
 export {
-  w as default
+  J as default
 };
 //# sourceMappingURL=result.vue2.mjs.map

package/es/components/result/result.vue2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"result.vue2.mjs","sources":["../../../../../packages/components/result/result.vue"],"sourcesContent":["<script lang=\"ts\">\nconst ns = /* hoist-static*/ useNamespace('result')\n\nimport { defineComponent as DO_defineComponent } from 'vue';\nexport default /*#__PURE__*/ DO_defineComponent({\n  name: ns.b()\n});</script>\n<script setup lang=\"ts\">\nimport { renderTNode, singleAttrToObj } from '@vft/utils';\nimport { h, getCurrentInstance, computed, useSlots } from 'vue';\nimport { useNamespace } from '@vft-ui/hooks';\nimport { type IconProps, VftIcon } from '@vft-ui/components';\n\ninterface Props {\n  title?: string | number;\n  subTitle?: string | number;\n  icon?: IconProps;\n}\n\ndefineProps({\n  \"title\": null,\n  \"subTitle\": null,\n  \"icon\": null\n})\n\n\n\n;\n\nconst instance = getCurrentInstance()!;\n\nconst slots = useSlots();\n\nconst _icon = computed(() => {\n  return singleAttrToObj(__props.icon, 'icon') as IconProps;\n});\n\nconst vIcon = _icon.value?.icon ? h('div', {\n  class: ns.e('icon')\n}, [h(VftIcon, { ..._icon.value })]) : slots.default?.();\n\nconst vCon = (attrName: string) => {\n  const nodeCon = renderTNode(instance, attrName);\n  return nodeCon ? h(\n    'div',\n    {\n      class: ns.e(attrName)\n    }, [h('p', {}, { default: () => nodeCon })]\n  ) : null;\n};\n\ndefineRender(() => {\n  return (\n    h(\n      'div', { class: ns.b() }, {\n        default: () => [\n          vIcon,\n          vCon('title'),\n          vCon('sub-title'),\n          slots.extra ? h('div', { class: ns.e('extra') }, { default: ()=> slots.extra?.() }) : null\n        ]\n      }\n    )\n  );\n});\n</script>\n"],"names":["ns","useNamespace","__default__","DO_defineComponent","instance","getCurrentInstance","slots","useSlots","_icon","computed","singleAttrToObj","__props","vIcon","_a","h","VftIcon","_b","vCon","attrName","nodeCon","renderTNode"],"mappings":";;;;;;;;;;;AACA,MAAMA;AAAA;AAAA,EAAuBC,EAAa,QAAQ;AAAA,GAGlDC,IAA6BC,EAAmB;AAAA,EAC9C,MAAMH,EAAG,EAAE;AACb,CAAC;;;;;;;;;AAuBD,UAAMI,IAAWC,KAEXC,IAAQC,KAERC,IAAQC,EAAS,MACdC,EAAgBC,EAAQ,MAAM,MAAM,CAC5C,GAEKC,KAAQC,IAAAL,EAAM,UAAN,QAAAK,EAAa,OAAOC,EAAE,OAAO;AAAA,MACzC,OAAOd,EAAG,EAAE,MAAM;AAAA,IACjB,GAAA,CAACc,EAAEC,GAAS,EAAE,GAAGP,EAAM,MAAO,CAAA,CAAC,CAAC,KAAIQ,IAAAV,EAAM,YAAN,gBAAAU,EAAA,KAAAV,IAEjCW,IAAO,CAACC,MAAqB;AAC3B,YAAAC,IAAUC,EAAYhB,GAAUc,CAAQ;AAC9C,aAAOC,IAAUL;AAAA,QACf;AAAA,QACA;AAAA,UACE,OAAOd,EAAG,EAAEkB,CAAQ;AAAA,QACtB;AAAA,QAAG,CAACJ,EAAE,KAAK,CAAC,GAAG,EAAE,SAAS,MAAMK,EAAQ,CAAC,CAAC;AAAA,MACxC,IAAA;AAAA,IAAA;AAGO,WAAA,MAETL;AAAA,MACE;AAAA,MAAO,EAAE,OAAOd,EAAG,IAAI;AAAA,MAAG;AAAA,QACxB,SAAS,MAAM;AAAA,UACbY;AAAA,UACAK,EAAK,OAAO;AAAA,UACZA,EAAK,WAAW;AAAA,UAChBX,EAAM,QAAQQ,EAAE,OAAO,EAAE,OAAOd,EAAG,EAAE,OAAO,EAAE,GAAG,EAAE,SAAS,MAAA;;AAAK,oBAAAa,IAAAP,EAAM,UAAN,gBAAAO,EAAA,KAAAP;AAAA,YAAiB,CAAA,IAAI;AAAA,QACxF;AAAA,MACF;AAAA,IAAA;AAAA;;"}
+{"version":3,"file":"result.vue2.mjs","sources":["../../../../../packages/components/result/result.vue"],"sourcesContent":["<script lang=\"ts\">\nconst ns = /* hoist-static*/ useNamespace('result')\n\nimport { defineComponent as DO_defineComponent } from 'vue';\nexport default /*#__PURE__*/ DO_defineComponent({\n  name: ns.b()\n});</script>\n<script setup lang=\"ts\">\nimport { renderTNode, singleAttrToObj } from '@vft/utils';\nimport { h, getCurrentInstance, computed, useSlots } from 'vue';\nimport { useNamespace } from '@vft-ui/hooks';\nimport { type IconProps, VftIcon } from '@vft-ui/components';\n\ninterface Props {\n  title?: string | number;\n  subTitle?: string | number;\n  icon?: IconProps;\n}\n\ndefineProps({\n  \"title\": null,\n  \"subTitle\": null,\n  \"icon\": null\n})\n\n\n\n;\n\nconst instance = getCurrentInstance()!;\n\nconst slots = useSlots();\n\nconst _icon = computed(() => {\n  return singleAttrToObj(__props.icon, 'icon') as IconProps;\n});\n\nconst vIcon = _icon.value?.icon ? h('div', {\n  class: ns.e('icon')\n}, [h(VftIcon, { ..._icon.value })]) : slots.default?.();\n\nconst vCon = (attrName: string) => {\n  const nodeCon = renderTNode(instance, attrName);\n  return nodeCon ? h(\n    'div',\n    {\n      class: ns.e(attrName)\n    }, [h('p', {}, { default: () => nodeCon })]\n  ) : null;\n};\n\ndefineRender(() => {\n  return (\n    h(\n      'div', { class: ns.b() }, {\n        default: () => [\n          vIcon,\n          vCon('title'),\n          vCon('sub-title'),\n          slots.extra ? h('div', { class: ns.e('extra') }, { default: ()=> slots.extra?.() }) : null\n        ]\n      }\n    )\n  );\n});\n</script>\n"],"names":["ns","useNamespace","__default__","DO_defineComponent","instance","getCurrentInstance","slots","useSlots","_icon","computed","singleAttrToObj","__props","vIcon","_a","h","VftIcon","_b","vCon","attrName","nodeCon","renderTNode"],"mappings":";;;;;;;;;;;;;;;;;;;;AACA,MAAMA;AAAA;AAAA,EAAuBC,EAAa,QAAQ;AAAA,GAGlDC,IAA6BC,EAAmB;AAAA,EAC9C,MAAMH,EAAG,EAAE;AACb,CAAC;;;;;;;;;AAuBD,UAAMI,IAAWC,KAEXC,IAAQC,KAERC,IAAQC,EAAS,MACdC,EAAgBC,EAAQ,MAAM,MAAM,CAC5C,GAEKC,KAAQC,IAAAL,EAAM,UAAN,QAAAK,EAAa,OAAOC,EAAE,OAAO;AAAA,MACzC,OAAOd,EAAG,EAAE,MAAM;AAAA,IACjB,GAAA,CAACc,EAAEC,GAAS,EAAE,GAAGP,EAAM,MAAO,CAAA,CAAC,CAAC,KAAIQ,IAAAV,EAAM,YAAN,gBAAAU,EAAA,KAAAV,IAEjCW,IAAO,CAACC,MAAqB;AAC3B,YAAAC,IAAUC,EAAYhB,GAAUc,CAAQ;AAC9C,aAAOC,IAAUL;AAAA,QACf;AAAA,QACA;AAAA,UACE,OAAOd,EAAG,EAAEkB,CAAQ;AAAA,QACtB;AAAA,QAAG,CAACJ,EAAE,KAAK,CAAC,GAAG,EAAE,SAAS,MAAMK,EAAQ,CAAC,CAAC;AAAA,MACxC,IAAA;AAAA,IAAA;AAGO,WAAA,MAETL;AAAA,MACE;AAAA,MAAO,EAAE,OAAOd,EAAG,IAAI;AAAA,MAAG;AAAA,QACxB,SAAS,MAAM;AAAA,UACbY;AAAA,UACAK,EAAK,OAAO;AAAA,UACZA,EAAK,WAAW;AAAA,UAChBX,EAAM,QAAQQ,EAAE,OAAO,EAAE,OAAOd,EAAG,EAAE,OAAO,EAAE,GAAG,EAAE,SAAS,MAAA;;AAAK,oBAAAa,IAAAP,EAAM,UAAN,gBAAAO,EAAA,KAAAP;AAAA,YAAiB,CAAA,IAAI;AAAA,QACxF;AAAA,MACF;AAAA,IAAA;AAAA;;"}

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

@@ -0,0 +1,2 @@
+export { OnlyChild as VftOnlyChild } from './only-child';
+export * from './only-child';

package/es/components/slot/index.mjs

@@ -0,0 +1,6 @@
+import { OnlyChild as h, OnlyChild as i } from "./only-child.mjs";
+export {
+  h as OnlyChild,
+  i as VftOnlyChild
+};
+//# sourceMappingURL=index.mjs.map

package/es/components/slot/index.mjs.map

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

package/es/components/slot/only-child.d.ts

@@ -0,0 +1,7 @@
+import type { Ref, VNode } from 'vue';
+export declare const OnlyChild: import("vue").DefineComponent<{}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+export type OnlyChildExpose = {
+    forwardRef: Ref<HTMLElement>;
+};

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

@@ -0,0 +1,60 @@
+import { defineComponent as a, inject as s, withDirectives as p, cloneVNode as h, Fragment as N, Text as C, Comment as O, createVNode as g } from "vue";
+import { NOOP as v, isObject as F } from "@vue/shared";
+import { useNamespace as w } from "../../hooks/use-namespace/index.mjs";
+import "@popperjs/core";
+import "lodash";
+import "../../hooks/use-z-index/index.mjs";
+import { FORWARD_REF_INJECTION_KEY as y, useForwardRefDirective as R } from "../../hooks/use-forward-ref/index.mjs";
+import "@vueuse/core";
+import { debugWarn as l } from "../../utils/error.mjs";
+import "@vft/utils";
+const o = "VftOnlyChild", j = /* @__PURE__ */ a({
+  name: o,
+  setup(r, {
+    slots: t,
+    attrs: e
+  }) {
+    const n = s(y), m = R((n == null ? void 0 : n.setForwardRef) ?? v);
+    return () => {
+      var u;
+      const i = (u = t.default) == null ? void 0 : u.call(t, e);
+      if (!i)
+        return null;
+      if (i.length > 1)
+        return l(o, "requires exact only one valid child."), null;
+      const c = d(i);
+      return c ? p(h(c, e), [[m]]) : (l(o, "no valid child node found"), null);
+    };
+  }
+});
+function d(r) {
+  if (!r)
+    return null;
+  const t = r;
+  for (const e of t) {
+    if (F(e))
+      switch (e.type) {
+        case O:
+          continue;
+        case C:
+        case "svg":
+          return f(e);
+        case N:
+          return d(e.children);
+        default:
+          return e;
+      }
+    return f(e);
+  }
+  return null;
+}
+function f(r) {
+  const t = w("only-child");
+  return g("span", {
+    class: t.e("content")
+  }, [r]);
+}
+export {
+  j as OnlyChild
+};
+//# sourceMappingURL=only-child.mjs.map

package/es/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/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/components/sub-menu/style/css.mjs.map

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

package/es/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/components/sub-menu/style/index.mjs.map

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

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

@@ -1,16 +1,19 @@
-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 c, normalizeStyle as T } from "vue";
+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 "@vue/shared";
-import { capitalize as p } from "@vft/utils";
+import "@popperjs/core";
+import "lodash";
+import "../../hooks/use-z-index/index.mjs";
 import { useResizeObserver as D } from "@vueuse/core";
-const G = /* @__PURE__ */ $({
+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), f = j("tabs"), a = g(), m = g(), v = () => {
+    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) => {
@@ -20,14 +23,14 @@ const G = /* @__PURE__ */ $({
           return !1;
         if (!b.active)
           return !0;
-        t = r[`offset${p(z)}`], e = r[`client${p(o)}`];
+        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${p(u)}(${t}px)`
+        transform: `translate${c(u)}(${t}px)`
       };
-    }, n = () => m.value = v();
+    }, n = () => f.value = v();
     N(
       () => s.tabs,
       async () => {
@@ -42,12 +45,12 @@ const G = /* @__PURE__ */ $({
     }), (t, e) => (B(), F("div", {
       ref_key: "barRef",
       ref: a,
-      class: P([c(f).e("active-bar"), c(f).is(c(w))]),
-      style: T(m.value)
+      class: P([p(m).e("active-bar"), p(m).is(p(w))]),
+      style: T(f.value)
     }, null, 6));
   }
 });
 export {
-  G as default
+  M as default
 };
 //# sourceMappingURL=tab-bar.vue2.mjs.map

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

@@ -1 +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;;;;;;;;"}
+{"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;;;;;;;;"}