vft 0.0.43 → 0.0.45

package/es/components/tooltip/content.vue2.js

@@ -0,0 +1,174 @@
+import { defineComponent as E, ref as v, inject as U, computed as o, onBeforeUnmount as W, unref as t, watch as y, openBlock as b, createBlock as h, Teleport as Y, createVNode as q, Transition as F, withCtx as C, withDirectives as G, mergeProps as Q, renderSlot as X, createCommentVNode as B, vShow as Z } from "vue";
+import { useNamespace as _ } from "../../hooks/use-namespace/index.js";
+import "@popperjs/core";
+import "lodash";
+import "../../hooks/use-z-index/index.js";
+import { onClickOutside as ee } from "@vueuse/core";
+import "@vft/utils";
+import { composeEventHandlers as T } from "../../utils/event.js";
+import "../../utils/ns-cover.js";
+import { usePopperContainerId as te } from "../../hooks/use-popper-container/index.js";
+import "../popper/index.js";
+import { TOOLTIP_INJECTION_KEY as ne } from "./constants.js";
+import oe from "../popper/content.vue2.js";
+const ae = E({
+  name: "VftTooltipContent",
+  inheritAttrs: !1
+}), be = /* @__PURE__ */ E({
+  ...ae,
+  props: {
+    boundariesPadding: { default: 0 },
+    fallbackPlacements: null,
+    gpuAcceleration: { type: Boolean, default: !0 },
+    offset: { default: 12 },
+    placement: { default: "bottom" },
+    popperOptions: { default: {} },
+    strategy: { default: "absolute" },
+    style: null,
+    className: null,
+    effect: { default: "dark" },
+    enterable: { type: Boolean, default: !0 },
+    pure: { type: Boolean },
+    focusOnShow: { type: Boolean, default: !1 },
+    trapping: { type: Boolean, default: !1 },
+    popperClass: null,
+    popperStyle: null,
+    referenceEl: null,
+    triggerTargetEl: null,
+    stopPopperMouseEvent: { type: Boolean, default: !0 },
+    virtualTriggering: { type: Boolean },
+    zIndex: null,
+    showAfter: { default: 0 },
+    hideAfter: { default: 200 },
+    appendTo: null,
+    content: { default: "" },
+    rawContent: { type: Boolean, default: !1 },
+    persistent: { type: Boolean },
+    ariaLabel: null,
+    visible: { type: Boolean, default: null },
+    transition: { default: "vft-fade-in-linear" },
+    teleported: { type: Boolean, default: !0 },
+    disabled: { type: Boolean }
+  },
+  setup(e, { expose: k }) {
+    const { selector: P } = te(), w = _("tooltip"), l = v(null), c = v(!1), {
+      controlled: p,
+      id: O,
+      open: r,
+      trigger: u,
+      onClose: i,
+      onOpen: A,
+      onShow: N,
+      onHide: S,
+      onBeforeShow: f,
+      onBeforeHide: d
+    } = U(ne, void 0), L = o(() => e.transition || `${w.namespace.value}-fade-in-linear`), I = o(() => process.env.NODE_ENV === "test" ? !0 : e.persistent);
+    W(() => {
+      c.value = !0;
+    });
+    const $ = o(() => t(I) ? !0 : t(r)), m = o(() => e.disabled ? !1 : t(r)), x = o(() => e.appendTo || P.value), M = o(() => e.style ?? {}), R = o(() => !t(r)), z = () => {
+      S();
+    }, g = () => {
+      if (t(p))
+        return !0;
+    }, V = T(g, () => {
+      e.enterable && t(u) === "hover" && A();
+    }), D = T(g, () => {
+      t(u) === "hover" && i();
+    }), j = () => {
+      var n, a;
+      (a = (n = l.value) == null ? void 0 : n.updatePopper) == null || a.call(n), f == null || f();
+    }, H = () => {
+      d == null || d();
+    }, J = () => {
+      N(), s = ee(
+        o(() => {
+          var n;
+          return (n = l.value) == null ? void 0 : n.popperContentRef;
+        }),
+        () => {
+          if (t(p))
+            return;
+          t(u) !== "hover" && i();
+        }
+      );
+    }, K = () => {
+      e.virtualTriggering || i();
+    };
+    let s;
+    return y(
+      () => t(r),
+      (n) => {
+        n || s == null || s();
+      },
+      {
+        flush: "post"
+      }
+    ), y(
+      () => e.content,
+      () => {
+        var n, a;
+        (a = (n = l.value) == null ? void 0 : n.updatePopper) == null || a.call(n);
+      }
+    ), k({
+      /**
+       * @description el-popper-content component instance
+       */
+      contentRef: l
+    }), (n, a) => (b(), h(Y, {
+      disabled: !e.teleported,
+      to: t(x)
+    }, [
+      q(F, {
+        name: t(L),
+        onAfterLeave: z,
+        onBeforeEnter: j,
+        onAfterEnter: J,
+        onBeforeLeave: H
+      }, {
+        default: C(() => [
+          t($) ? G((b(), h(t(oe), Q({
+            key: 0,
+            id: t(O),
+            ref_key: "contentRef",
+            ref: l
+          }, n.$attrs, {
+            "aria-label": e.ariaLabel,
+            "aria-hidden": t(R),
+            "boundaries-padding": e.boundariesPadding,
+            "fallback-placements": e.fallbackPlacements,
+            "gpu-acceleration": e.gpuAcceleration,
+            offset: e.offset,
+            placement: e.placement,
+            "popper-options": e.popperOptions,
+            strategy: e.strategy,
+            effect: e.effect,
+            enterable: e.enterable,
+            pure: e.pure,
+            "popper-class": e.popperClass,
+            "popper-style": [e.popperStyle, t(M)],
+            "reference-el": e.referenceEl,
+            "trigger-target-el": e.triggerTargetEl,
+            visible: t(m),
+            "z-index": e.zIndex,
+            onMouseenter: t(V),
+            onMouseleave: t(D),
+            onBlur: K,
+            onClose: t(i)
+          }), {
+            default: C(() => [
+              c.value ? B("", !0) : X(n.$slots, "default", { key: 0 })
+            ]),
+            _: 3
+          }, 16, ["id", "aria-label", "aria-hidden", "boundaries-padding", "fallback-placements", "gpu-acceleration", "offset", "placement", "popper-options", "strategy", "effect", "enterable", "pure", "popper-class", "popper-style", "reference-el", "trigger-target-el", "visible", "z-index", "onMouseenter", "onMouseleave", "onClose"])), [
+            [Z, t(m)]
+          ]) : B("", !0)
+        ]),
+        _: 3
+      }, 8, ["name"])
+    ], 8, ["disabled", "to"]));
+  }
+});
+export {
+  be as default
+};

package/es/components/tooltip/index.js

@@ -0,0 +1,10 @@
+import { withInstall as t } from "../../utils/vue/install.js";
+import "vue";
+import "@vft/utils";
+import "../../utils/ns-cover.js";
+import o from "./tooltip.vue2.js";
+const a = t(o);
+export {
+  a as VftTooltip,
+  a as default
+};

package/es/components/tooltip/tooltip.vue.js

@@ -0,0 +1,4 @@
+import f from "./tooltip.vue2.js";
+export {
+  f as default
+};

package/es/components/tooltip/tooltip.vue2.js

@@ -0,0 +1,224 @@
+import { defineComponent as k, ref as r, computed as P, provide as I, readonly as S, unref as i, watch as M, onDeactivated as N, openBlock as f, createBlock as h, withCtx as g, createVNode as b, renderSlot as w, createCommentVNode as v, createElementBlock as B, toDisplayString as $ } from "vue";
+import { EVENT_CODE as C } from "@vft/constants";
+import { VftPopper as x } from "../popper/index.js";
+import { isBoolean as H } from "@vft/utils";
+import "../config-provider/hooks/use-global-config.js";
+import "@popperjs/core";
+import "lodash";
+import "../../hooks/use-z-index/index.js";
+import { useId as L } from "../../hooks/use-id/index.js";
+import { usePopperContainer as z } from "../../hooks/use-popper-container/index.js";
+import { useDelayedToggle as D } from "../../hooks/use-delayed-toggle/index.js";
+import "@vueuse/core";
+import "../../utils/ns-cover.js";
+import { TOOLTIP_INJECTION_KEY as K } from "./constants.js";
+import V from "./trigger.vue2.js";
+import J from "./content.vue2.js";
+import { useTooltipModelToggle as U } from "./utils.js";
+import Y from "../popper/arrow.vue2.js";
+const j = ["innerHTML"], q = { key: 1 }, G = k({
+  name: "vft-tooltip"
+}), pe = /* @__PURE__ */ k({
+  ...G,
+  props: {
+    role: { default: "tooltip" },
+    showArrow: { type: Boolean, default: !0 },
+    arrowOffset: { default: 5 },
+    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 },
+    boundariesPadding: { default: 0 },
+    fallbackPlacements: null,
+    gpuAcceleration: { type: Boolean, default: !0 },
+    offset: { default: 12 },
+    placement: { default: "bottom" },
+    popperOptions: { default: {} },
+    strategy: { default: "absolute" },
+    style: null,
+    className: null,
+    effect: { default: "dark" },
+    visible: { type: Boolean, default: null },
+    enterable: { type: Boolean, default: !0 },
+    pure: { type: Boolean },
+    focusOnShow: { type: Boolean, default: !1 },
+    trapping: { type: Boolean, default: !1 },
+    popperClass: null,
+    popperStyle: null,
+    referenceEl: null,
+    triggerTargetEl: null,
+    stopPopperMouseEvent: { type: Boolean, default: !0 },
+    ariaLabel: null,
+    zIndex: null,
+    showAfter: { default: 0 },
+    hideAfter: { default: 200 },
+    appendTo: null,
+    content: { default: "" },
+    rawContent: { type: Boolean, default: !1 },
+    persistent: { type: Boolean },
+    transition: { default: "vft-fade-in-linear" },
+    teleported: { type: Boolean, default: !0 },
+    disabled: { type: Boolean },
+    trigger: { default: "hover" },
+    triggerKeys: { default: [C.enter, C.space] }
+  },
+  emits: ["before-show", "before-hide", "show", "hide", "open", "close"],
+  setup(e, { expose: T, emit: a }) {
+    z();
+    const A = L(), u = r(), d = r(), m = () => {
+      var o;
+      const t = i(u);
+      t && ((o = t.popperInstanceRef) == null || o.update());
+    }, n = r(!1), l = r(), { show: E, hide: s, hasUpdateHandler: O } = U({
+      indicator: n,
+      toggleReason: l
+    }), { onOpen: c, onClose: p } = D({
+      showAfter: e.showAfter,
+      hideAfter: e.hideAfter,
+      open: E,
+      close: s
+    }), R = P(() => H(e.visible) && !O.value);
+    I(K, {
+      controlled: R,
+      id: A,
+      open: S(n),
+      trigger: e.trigger,
+      onOpen: (t) => {
+        c(t);
+      },
+      onClose: (t) => {
+        p(t);
+      },
+      onToggle: (t) => {
+        i(n) ? p(t) : c(t);
+      },
+      onShow: () => {
+        a("show", l.value);
+      },
+      onHide: () => {
+        a("hide", l.value);
+      },
+      onBeforeShow: () => {
+        a("before-show", l.value);
+      },
+      onBeforeHide: () => {
+        a("before-hide", l.value);
+      },
+      updatePopper: m
+    }), M(
+      () => e.disabled,
+      (t) => {
+        t && n.value && (n.value = !1);
+      }
+    );
+    const F = () => {
+      var o, y;
+      const t = (y = (o = d.value) == null ? void 0 : o.contentRef) == null ? void 0 : y.popperContentRef;
+      return t && t.contains(document.activeElement);
+    };
+    return N(() => n.value && s()), T({
+      /**
+       * @description el-popper component instance
+       */
+      popperRef: u,
+      /**
+       * @description el-tooltip-content component instance
+       */
+      contentRef: d,
+      /**
+       * @description validate current focus event is trigger inside el-tooltip-content
+       */
+      isFocusInsideContent: F,
+      /**
+       * @description update el-popper component instance
+       */
+      updatePopper: m,
+      /**
+       * @description expose onOpen function to mange el-tooltip open state
+       */
+      onOpen: c,
+      /**
+       * @description expose onOpen function to mange el-tooltip open state
+       */
+      onClose: p,
+      /**
+       * @description expose hide function
+       */
+      hide: s
+    }), (t, o) => (f(), h(i(x), {
+      ref_key: "popperRef",
+      ref: u,
+      role: e.role
+    }, {
+      default: g(() => [
+        b(V, {
+          disabled: e.disabled,
+          trigger: e.trigger,
+          "trigger-keys": e.triggerKeys,
+          "virtual-ref": e.virtualRef,
+          "virtual-triggering": e.virtualTriggering
+        }, {
+          default: g(() => [
+            t.$slots.default ? w(t.$slots, "default", { key: 0 }) : v("", !0)
+          ]),
+          _: 3
+        }, 8, ["disabled", "trigger", "trigger-keys", "virtual-ref", "virtual-triggering"]),
+        b(J, {
+          ref_key: "contentRef",
+          ref: d,
+          "aria-label": e.ariaLabel,
+          "boundaries-padding": e.boundariesPadding,
+          content: e.content,
+          disabled: e.disabled,
+          effect: e.effect,
+          enterable: e.enterable,
+          "fallback-placements": e.fallbackPlacements,
+          "hide-after": e.hideAfter,
+          "gpu-acceleration": e.gpuAcceleration,
+          offset: e.offset,
+          persistent: e.persistent,
+          "popper-class": e.popperClass,
+          "popper-style": e.popperStyle,
+          placement: e.placement,
+          "popper-options": e.popperOptions,
+          pure: e.pure,
+          "raw-content": e.rawContent,
+          "reference-el": e.referenceEl,
+          "trigger-target-el": e.triggerTargetEl,
+          "show-after": e.showAfter,
+          strategy: e.strategy,
+          teleported: e.teleported,
+          transition: e.transition,
+          "virtual-triggering": e.virtualTriggering,
+          "z-index": e.zIndex,
+          "append-to": e.appendTo
+        }, {
+          default: g(() => [
+            w(t.$slots, "content", {}, () => [
+              e.rawContent ? (f(), B("span", {
+                key: 0,
+                innerHTML: e.content
+              }, null, 8, j)) : (f(), B("span", q, $(e.content), 1))
+            ]),
+            e.showArrow ? (f(), h(i(Y), {
+              key: 0,
+              "arrow-offset": e.arrowOffset
+            }, null, 8, ["arrow-offset"])) : v("", !0)
+          ]),
+          _: 3
+        }, 8, ["aria-label", "boundaries-padding", "content", "disabled", "effect", "enterable", "fallback-placements", "hide-after", "gpu-acceleration", "offset", "persistent", "popper-class", "popper-style", "placement", "popper-options", "pure", "raw-content", "reference-el", "trigger-target-el", "show-after", "strategy", "teleported", "transition", "virtual-triggering", "z-index", "append-to"])
+      ]),
+      _: 3
+    }, 8, ["role"]));
+  }
+});
+export {
+  pe as default
+};

package/es/components/tooltip/trigger.vue.js

@@ -0,0 +1,4 @@
+import f from "./trigger.vue2.js";
+export {
+  f as default
+};

package/es/components/tooltip/trigger.vue2.js

@@ -0,0 +1,90 @@
+import { defineComponent as a, inject as E, ref as K, openBlock as O, createBlock as w, unref as e, normalizeClass as b, withCtx as D, renderSlot as N } from "vue";
+import { EVENT_CODE as g } from "@vft/constants";
+import "../popper/index.js";
+import "@vft/utils";
+import { composeEventHandlers as r } from "../../utils/event.js";
+import "../../utils/ns-cover.js";
+import { useNamespace as F } from "../../hooks/use-namespace/index.js";
+import "@popperjs/core";
+import "lodash";
+import "../../hooks/use-z-index/index.js";
+import "@vueuse/core";
+import { TOOLTIP_INJECTION_KEY as I } from "./constants.js";
+import { whenTrigger as i } from "./utils.js";
+import R from "../popper/trigger.vue2.js";
+const V = a({
+  name: "VftTooltipTrigger"
+}), U = /* @__PURE__ */ a({
+  ...V,
+  props: {
+    disabled: { type: Boolean },
+    trigger: { default: "hover" },
+    triggerKeys: { default: [g.enter, g.space] },
+    virtualRef: null,
+    virtualTriggering: { type: Boolean }
+  },
+  setup(t, { expose: f }) {
+    const m = F("tooltip"), { controlled: d, id: v, open: p, onOpen: u, onClose: s, onToggle: l } = E(
+      I,
+      void 0
+    ), C = K(null), n = () => {
+      if (e(d) || t.disabled)
+        return !0;
+    }, T = r(
+      n,
+      i(t.trigger, "hover", u)
+    ), h = r(
+      n,
+      i(t.trigger, "hover", s)
+    ), y = r(
+      n,
+      i(t.trigger, "click", (o) => {
+        o.button === 0 && l(o);
+      })
+    ), B = r(
+      n,
+      i(t.trigger, "focus", u)
+    ), M = r(
+      n,
+      i(t.trigger, "focus", s)
+    ), k = r(
+      n,
+      i(t.trigger, "contextmenu", (o) => {
+        o.preventDefault(), l(o);
+      })
+    ), x = r(
+      n,
+      (o) => {
+        const { code: c } = o;
+        t.triggerKeys.includes(c) && (o.preventDefault(), l(o));
+      }
+    );
+    return f({
+      /**
+       * @description trigger element
+       */
+      triggerRef: C
+    }), (o, c) => (O(), w(e(R), {
+      id: e(v),
+      "virtual-ref": t.virtualRef,
+      open: e(p),
+      "virtual-triggering": t.virtualTriggering,
+      class: b(e(m).e("trigger")),
+      onBlur: e(M),
+      onClick: e(y),
+      onContextmenu: e(k),
+      onFocus: e(B),
+      onMouseenter: e(T),
+      onMouseleave: e(h),
+      onKeydown: e(x)
+    }, {
+      default: D(() => [
+        N(o.$slots, "default")
+      ]),
+      _: 3
+    }, 8, ["id", "virtual-ref", "open", "virtual-triggering", "class", "onBlur", "onClick", "onContextmenu", "onFocus", "onMouseenter", "onMouseleave", "onKeydown"]));
+  }
+});
+export {
+  U as default
+};

package/es/components/tooltip/utils.js

@@ -0,0 +1,19 @@
+import "../config-provider/hooks/use-global-config.js";
+import { unref as t } from "vue";
+import "@popperjs/core";
+import "lodash";
+import "../../hooks/use-z-index/index.js";
+import "@vueuse/core";
+import { isArray as m } from "@vft/utils";
+import "../../utils/ns-cover.js";
+import { createModelToggleComposable as p } from "../../hooks/use-model-toggle/index.js";
+const l = (o, r) => m(o) ? o.includes(r) : o === r, M = (o, r, e) => (i) => {
+  l(t(o), r) && e(i);
+}, {
+  useModelToggle: b
+} = p("visible");
+export {
+  l as isTriggerType,
+  b as useTooltipModelToggle,
+  M as whenTrigger
+};

package/es/constants/index.js

@@ -0,0 +1,16 @@
+import { EVENT_CODE as e } from "./aria.js";
+import { WEEK_DAYS as p, datePickTypes as t } from "./date.js";
+import { CHANGE_EVENT as m, INPUT_EVENT as N, UPDATE_MODEL_EVENT as _ } from "./event.js";
+import { INSTALLED_KEY as x } from "./key.js";
+import { componentSizeMap as n, componentSizes as A } from "./size.js";
+export {
+  m as CHANGE_EVENT,
+  e as EVENT_CODE,
+  N as INPUT_EVENT,
+  x as INSTALLED_KEY,
+  _ as UPDATE_MODEL_EVENT,
+  p as WEEK_DAYS,
+  n as componentSizeMap,
+  A as componentSizes,
+  t as datePickTypes
+};

package/es/defaults.js

@@ -0,0 +1,7 @@
+import { makeInstaller as o } from "./make-installer.js";
+import r from "./component.js";
+import t from "./plugin.js";
+const n = o([...r, ...t]);
+export {
+  n as default
+};

package/es/hooks/index.js

@@ -0,0 +1,37 @@
+import { _bem as r, defaultNamespace as t, namespaceContextKey as s, useGetDerivedNamespace as p, useNamespace as u } from "./use-namespace/index.js";
+import { useCursor as a } from "./use-cursor/index.js";
+import { usePopper as x } from "./use-popper/index.js";
+import { defaultInitialZIndex as n, useZIndex as l, zIndexContextKey as I } from "./use-z-index/index.js";
+import { FORWARD_REF_INJECTION_KEY as C, useForwardRef as g, useForwardRefDirective as c } from "./use-forward-ref/index.js";
+import { ID_INJECTION_KEY as T, useId as E, useIdInjection as _ } from "./use-id/index.js";
+import { usePopperContainer as R, usePopperContainerId as F } from "./use-popper-container/index.js";
+import { useDelayedToggle as O } from "./use-delayed-toggle/index.js";
+import { useTimeout as M } from "./use-timeout/index.js";
+import { useOrderedChildren as b } from "./use-ordered-children/index.js";
+import { createModelToggleComposable as w, useModelToggle as J, useModelToggleEmits as Y } from "./use-model-toggle/index.js";
+export {
+  C as FORWARD_REF_INJECTION_KEY,
+  T as ID_INJECTION_KEY,
+  r as _bem,
+  w as createModelToggleComposable,
+  n as defaultInitialZIndex,
+  t as defaultNamespace,
+  s as namespaceContextKey,
+  a as useCursor,
+  O as useDelayedToggle,
+  g as useForwardRef,
+  c as useForwardRefDirective,
+  p as useGetDerivedNamespace,
+  E as useId,
+  _ as useIdInjection,
+  J as useModelToggle,
+  Y as useModelToggleEmits,
+  u as useNamespace,
+  b as useOrderedChildren,
+  x as usePopper,
+  R as usePopperContainer,
+  F as usePopperContainerId,
+  M as useTimeout,
+  l as useZIndex,
+  I as zIndexContextKey
+};

package/es/hooks/use-delayed-toggle/index.js

@@ -0,0 +1,20 @@
+import { unref as n } from "vue";
+import { useTimeout as u } from "../use-timeout/index.js";
+const f = ({ showAfter: t = 0, hideAfter: r = 200, open: s, close: m }) => {
+  const { registerTimeout: e } = u();
+  return {
+    onOpen: (o) => {
+      e(() => {
+        s(o);
+      }, n(t));
+    },
+    onClose: (o) => {
+      e(() => {
+        m(o);
+      }, n(r));
+    }
+  };
+};
+export {
+  f as useDelayedToggle
+};

package/es/hooks/use-id/index.js

@@ -0,0 +1,29 @@
+import { getCurrentInstance as n, inject as i, computed as c, unref as s } from "vue";
+import { isClient as u } from "@vueuse/core";
+import "@vft/utils";
+import { debugWarn as d } from "../../utils/error.js";
+import "../../utils/ns-cover.js";
+import { useGetDerivedNamespace as p } from "../use-namespace/index.js";
+const r = {
+  prefix: Math.floor(Math.random() * 1e4),
+  current: 0
+}, m = Symbol("elIdInjection"), I = () => n() ? i(m, r) : r, N = (o) => {
+  const e = I();
+  !u && e === r && d(
+    "IdInjection",
+    `Looks like you are using server rendering, you must provide a id provider to ensure the hydration process to be succeed
+usage: app.provide(ID_INJECTION_KEY, {
+  prefix: number,
+  current: number,
+})`
+  );
+  const t = p();
+  return c(
+    () => s(o) || `${t.value}-id-${e.prefix}-${e.current++}`
+  );
+};
+export {
+  m as ID_INJECTION_KEY,
+  N as useId,
+  I as useIdInjection
+};