vft 0.0.47 → 0.0.50

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

@@ -0,0 +1,232 @@
+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 r, nextTick as ot } from "vue";
+import { capitalize as y } from "@vft/utils";
+import { throwError as it } from "../../utils/error.js";
+import "lodash";
+import { useDocumentVisibility as nt, useWindowFocus as lt, useResizeObserver as at } from "@vueuse/core";
+import "../../utils/ns-cover.js";
+import "../divider/index.js";
+import { VftIcon as T } from "../icon/index.js";
+import "../avatar/index.js";
+import "../empty/index.js";
+import "../result/index.js";
+import "./index.js";
+import "../popper/index.js";
+import "../collapse-transition/index.js";
+import "../tooltip/index.js";
+import "../popover/index.js";
+import "../menu/index.js";
+import "@vft/use";
+import "../multiple-tabs/multiple-tabs.vue2.js";
+import "@vft/router";
+import "@vft/store";
+import "vue-router";
+import "../header-layout/index.js";
+import "../footer-layout/index.js";
+import "../iframe-layout/index.js";
+import "../router-view-content/index.js";
+import "../logo/index.js";
+import "../back-top/index.js";
+import "../config-provider/index.js";
+import "../descriptions/index.js";
+import "../full-screen/index.js";
+import "../icon-text/index.js";
+import "../image/index.js";
+import "../input/index.js";
+import "../link/index.js";
+import "../pagination/index.js";
+import "../tag/index.js";
+import "../side-menu/index.js";
+import "../qrcode/index.js";
+import "../overlay/index.js";
+import "../clamp/index.js";
+import "../clamp-toggle/index.js";
+import "../page-wrapper/index.js";
+import "../exception/index.js";
+import "../search/index.js";
+import "../form/index.js";
+import "../button/index.js";
+import "../checkbox/index.js";
+import "../radio/index.js";
+import "../switch/index.js";
+import "../color-picker/index.js";
+import "../scrollbar/index.js";
+import "../dropdown/index.js";
+import "../virtual-list/components/fixed-size-list.js";
+import "../virtual-list/components/dynamic-size-list.js";
+import "../virtual-list/components/fixed-size-grid.js";
+import "../virtual-list/components/dynamic-size-grid.js";
+import "../virtual-list/props.js";
+import "../select-v2/index.js";
+import "../verify-code/index.js";
+import "../table/index.js";
+import "../md-container/index.js";
+import "../md-comment/index.js";
+import "../md-tabs/index.js";
+import "../md-vue-playground/index.js";
+import "../md-code-demo/index.js";
+import "../md-code-tabs/index.js";
+import "../message/index.js";
+import { useNamespace as K } from "../../hooks/use-namespace/index.js";
+import "@popperjs/core";
+import "../../hooks/use-z-index/index.js";
+import { EVENT_CODE as k } from "@vft/constants";
+import { TabsRootContextKey as st } from "./types.js";
+import rt from "./tab-bar.vue2.js";
+const V = (
+  /* hoist-static*/
+  K("tab-nav")
+), ct = E({
+  name: V.b()
+}), Re = /* @__PURE__ */ E({
+  ...ct,
+  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(n, {
+    expose: D,
+    emit: C
+  }) {
+    var A;
+    const M = Z(), d = _(st);
+    d || it(V.b(), "<vft-tabs><tab-nav /></vft-tabs>");
+    const o = K("tabs"), q = nt(), H = lt(), $ = g(), p = g(), h = g(), m = g(!1), f = g(0), S = g(!1), x = g(!0), w = I(() => ["top", "bottom"].includes(d.props.tabPosition) ? "width" : "height"), W = I(() => ({
+      transform: `translate${w.value === "width" ? "X" : "Y"}(-${f.value}px)`
+    })), j = () => {
+      if (!p.value)
+        return;
+      const e = p.value[`offset${y(w.value)}`], t = f.value;
+      t && (f.value = t > e ? t - e : 0);
+    }, U = () => {
+      if (!p.value || !h.value)
+        return;
+      const e = h.value[`offset${y(w.value)}`], t = p.value[`offset${y(w.value)}`], i = f.value;
+      e - i <= t || (f.value = e - i > t * 2 ? i + t : e - t);
+    }, R = async () => {
+      const e = h.value;
+      if (!m.value || !$.value || !p.value || !e)
+        return;
+      await ot();
+      const t = $.value.querySelector(".is-active");
+      if (!t)
+        return;
+      const i = p.value, b = ["top", "bottom"].includes(d.props.tabPosition), s = t.getBoundingClientRect(), l = i.getBoundingClientRect(), u = b ? e.offsetWidth - l.width : e.offsetHeight - l.height, c = f.value;
+      let a = c;
+      b ? (s.left < l.left && (a = c - (l.left - s.left)), s.right > l.right && (a = c + s.right - l.right)) : (s.top < l.top && (a = c - (l.top - s.top)), s.bottom > l.bottom && (a = c + (s.bottom - l.bottom))), a = Math.max(a, 0), f.value = Math.min(a, u);
+    }, z = () => {
+      if (!h.value || !p.value)
+        return;
+      const e = h.value[`offset${y(w.value)}`], t = p.value[`offset${y(w.value)}`], i = f.value;
+      t < e ? (m.value = m.value || {}, m.value.prev = i, m.value.next = i + t < e, e - i < t && (f.value = e - t)) : (m.value = !1, i > 0 && (f.value = 0));
+    }, X = (e) => {
+      const t = e.code, {
+        up: i,
+        down: b,
+        left: s,
+        right: l
+      } = k;
+      if (![i, b, s, l].includes(t))
+        return;
+      const u = Array.from(e.currentTarget.querySelectorAll("[role=tab]:not(.is-disabled)")), c = u.indexOf(e.target);
+      let a;
+      t === s || t === i ? c === 0 ? a = u.length - 1 : a = c - 1 : c < u.length - 1 ? a = c + 1 : a = 0, u[a].focus(), u[a].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;
+    }), at($, z), tt(() => setTimeout(() => R(), 0)), et(() => z()), D({
+      scrollToActiveTab: R,
+      removeFocus: B
+    }), O(() => n.panes, () => M.update(), {
+      flush: "post"
+    });
+    const Y = I(() => {
+      var e, t;
+      return m.value ? [r("span", {
+        class: [o.e("nav-prev"), o.is("disabled", !m.value.prev)],
+        onClick: j
+      }, [(e = n.arrowLeftIconCfg) != null && e.icon ? r(T, n.arrowLeftIconCfg, null) : null]), r("span", {
+        class: [o.e("nav-next"), o.is("disabled", !m.value.next)],
+        onClick: U
+      }, [(t = n.arrowRightIconCfg) != null && t.icon ? r(T, n.arrowRightIconCfg, null) : null])] : null;
+    }), G = I(() => {
+      var e;
+      return (e = n.panes) == null ? void 0 : e.map((t, i) => {
+        var N, F, L;
+        const b = t.uid, s = t.props.disabled, l = t.props.name ?? t.index ?? `${i}`, u = !s && (t.isClosable || n.editable);
+        t.index = `${i}`;
+        const c = u ? r("span", {
+          class: "is-icon-close",
+          onClick: (v) => C("tabRemove", t, v)
+        }, [(N = n.closeIconCfg) != null && N.icon ? r(T, n.closeIconCfg, null) : null]) : null, a = ((L = (F = t.slots).label) == null ? void 0 : L.call(F)) || t.props.label, Q = !s && t.active ? 0 : -1;
+        return r("div", {
+          ref: `tab-${b}`,
+          class: [o.e("item"), o.is(d.props.tabPosition), o.is("active", t.active), o.is("disabled", s), o.is("closable", u), o.is("focus", S.value)],
+          id: `tab-${l}`,
+          key: `tab-${b}`,
+          "aria-controls": `pane-${l}`,
+          role: "tab",
+          "aria-selected": t.active,
+          tabindex: Q,
+          onFocus: () => P(),
+          onBlur: () => B(),
+          onClick: (v) => {
+            B(), C("tabClick", t, l, v);
+          },
+          onContextmenu: (v) => {
+            v.preventDefault(), C("tabContextmenu", {
+              pane: t,
+              index: i,
+              event: v
+            });
+          },
+          onKeydown: (v) => {
+            u && (v.code === k.delete || v.code === k.backspace) && C("tabRemove", t, v);
+          }
+        }, [a, c]);
+      });
+    }), J = n.editable || n.addable ? r("span", {
+      class: o.e("new-tab"),
+      tabindex: "0",
+      onClick: () => C("tabAdd"),
+      onKeydown: (e) => {
+        e.code === k.enter && C("tabAdd");
+      }
+    }, [(A = n.addIconCfg) != null && A.icon ? r(T, n.addIconCfg, null) : null]) : null;
+    return () => r("div", {
+      ref: $,
+      class: [o.e("nav-wrap"), o.is("scrollable", !!m.value), o.is(d.props.tabPosition)]
+    }, [Y.value, r("div", {
+      class: o.e("nav-scroll"),
+      ref: p
+    }, [r("div", {
+      class: [o.e("nav"), o.is(d.props.tabPosition), o.is("stretch", n.stretch && ["top", "bottom"].includes(d.props.tabPosition))],
+      ref: h,
+      style: W.value,
+      role: "tablist",
+      onKeydown: X
+    }, [n.type ? null : r(rt, {
+      tabs: [...n.panes]
+    }, null), G.value]), J])]);
+  }
+});
+export {
+  Re as default
+};

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

@@ -0,0 +1,62 @@
+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 "@vft/utils";
+import { throwError as P } from "../../utils/error.js";
+import "lodash";
+import { eagerComputed as p } from "@vueuse/core";
+import "../../utils/ns-cover.js";
+import { TabsRootContextKey as j } from "./types.js";
+import { useNamespace as D } from "../../hooks/use-namespace/index.js";
+import "@popperjs/core";
+import "../../hooks/use-z-index/index.js";
+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
+};

package/es/packages/components/tag/index.js

@@ -0,0 +1,12 @@
+import { withInstall as t } from "../../utils/vue/install.js";
+import "vue";
+import "@vft/utils";
+import "lodash";
+import "@vueuse/core";
+import "../../utils/ns-cover.js";
+import o from "./tag.vue2.js";
+const l = t(o);
+export {
+  l as VftTag,
+  l as default
+};

package/es/packages/components/tag/tag.vue2.js

@@ -0,0 +1,76 @@
+import { defineComponent as m, useSlots as d, computed as f, createVNode as n, Transition as p, isVNode as b } from "vue";
+import { VftIcon as y } from "../icon/index.js";
+import { useNamespace as g } from "../../hooks/use-namespace/index.js";
+import "@popperjs/core";
+import "lodash";
+import "../../hooks/use-z-index/index.js";
+import "@vueuse/core";
+import "@vft/utils";
+import "../../utils/ns-cover.js";
+import "../form/index.js";
+import { useFormSize as h } from "../form/hooks/use-form-common-props.js";
+function k(e) {
+  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !b(e);
+}
+const F = /* @__PURE__ */ m({
+  __name: "tag",
+  props: {
+    closable: {
+      type: Boolean
+    },
+    type: null,
+    hit: {
+      type: Boolean
+    },
+    disableTransitions: {
+      type: Boolean,
+      default: !0
+    },
+    color: null,
+    size: null,
+    effect: {
+      default: "light"
+    },
+    round: {
+      type: Boolean
+    }
+  },
+  emits: ["close", "click"],
+  setup(e, {
+    emit: c
+  }) {
+    const l = d(), i = h(), t = g("tag"), s = f(() => [t.b(), t.is("closable", e.closable), t.m(e.type), t.m(i.value), t.m(e.effect), t.is("hit", e.hit), t.is("round", e.round)]), r = (o) => {
+      c("close", o);
+    }, u = (o) => {
+      c("click", o);
+    }, a = () => {
+      var o;
+      return n("span", {
+        class: s.value,
+        style: {
+          backgroundColor: e.color
+        },
+        onClick: u
+      }, [n("span", {
+        class: t.e("content")
+      }, [(o = l.default) == null ? void 0 : o.call(l)]), e.closable ? n("div", {
+        class: t.e("close"),
+        onClick: r
+      }, [n(y, {
+        icon: "ico-ep:close"
+      }, null)]) : ""]);
+    };
+    return () => {
+      let o;
+      return e.disableTransitions ? a() : n(p, {
+        name: `${t.namespace.value}-zoom-in-center`,
+        appear: !0
+      }, k(o = a()) ? o : {
+        default: () => [o]
+      });
+    };
+  }
+});
+export {
+  F as default
+};

package/es/packages/components/tag/types.js

@@ -0,0 +1 @@
+

package/es/packages/components/tooltip/index.js

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

package/es/packages/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 "lodash";
+import "@vueuse/core";
+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 "../../hooks/use-z-index/index.js";
+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/packages/components/tooltip/types.js

@@ -0,0 +1 @@
+

package/es/packages/components/types.js

@@ -0,0 +1 @@
+

package/es/packages/components/verify-code/index.js

@@ -0,0 +1,12 @@
+import { withInstall as t } from "../../utils/vue/install.js";
+import "vue";
+import "@vft/utils";
+import "lodash";
+import "@vueuse/core";
+import "../../utils/ns-cover.js";
+import o from "./verify-code.vue2.js";
+const s = t(o);
+export {
+  s as VftVerifyCode,
+  s as default
+};

package/es/packages/components/verify-code/style/css.js

@@ -0,0 +1,2 @@
+import "vft/theme-style/base.css";
+import "vft/theme-style/vft-verify-code.css";

package/es/packages/components/verify-code/style/index.js

@@ -0,0 +1,2 @@
+import "vft/theme-style/src/base.scss";
+import "vft/theme-style/src/verify-code.scss";

package/es/packages/components/verify-code/useImageVerify.js

@@ -0,0 +1,46 @@
+import { ref as u, onMounted as d } from "vue";
+function v(l = 152, e = 40) {
+  const n = u(), f = u("");
+  function a(r) {
+    f.value = r;
+  }
+  function t() {
+    n.value && (f.value = g(n.value, l, e));
+  }
+  return d(() => {
+    t();
+  }), {
+    domRef: n,
+    imgCode: f,
+    setImgCode: a,
+    getImgCode: t
+  };
+}
+function o(l, e) {
+  return Math.floor(Math.random() * (e - l) + l);
+}
+function c(l, e) {
+  const n = o(l, e), f = o(l, e), a = o(l, e);
+  return `rgb(${n},${f},${a})`;
+}
+function g(l, e, n) {
+  let f = "";
+  const a = "0123456789", t = l.getContext("2d");
+  if (!t)
+    return f;
+  t.fillStyle = c(180, 230), t.fillRect(0, 0, e, n);
+  for (let r = 0; r < 4; r += 1) {
+    const s = a[o(0, a.length)];
+    f += s;
+    const i = o(18, 41), m = o(-30, 30);
+    t.font = `${i}px Simhei`, t.textBaseline = "top", t.fillStyle = c(80, 150), t.save(), t.translate(30 * r + 23, 15), t.rotate(m * Math.PI / 180), t.fillText(s, -15 + 5, -15), t.restore();
+  }
+  for (let r = 0; r < 5; r += 1)
+    t.beginPath(), t.moveTo(o(0, e), o(0, n)), t.lineTo(o(0, e), o(0, n)), t.strokeStyle = c(180, 230), t.closePath(), t.stroke();
+  for (let r = 0; r < 41; r += 1)
+    t.beginPath(), t.arc(o(0, e), o(0, n), 1, 0, 2 * Math.PI), t.closePath(), t.fillStyle = c(150, 200), t.fill();
+  return f;
+}
+export {
+  v as default
+};

package/es/packages/components/verify-code/verify-code.vue.js

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

package/es/packages/components/verify-code/verify-code.vue2.js

@@ -0,0 +1,46 @@
+import { defineComponent as m, computed as f, openBlock as a, createElementBlock as l, normalizeStyle as u, unref as o, createElementVNode as p } from "vue";
+import { useNamespace as g } from "../../hooks/use-namespace/index.js";
+import "@popperjs/core";
+import "lodash";
+import "../../hooks/use-z-index/index.js";
+import "@vueuse/core";
+import { addUnit as r } from "@vft/utils";
+import "../../utils/ns-cover.js";
+import w from "./useImageVerify.js";
+const y = ["width", "height"], k = (
+  /* hoist-static*/
+  g("verify-code")
+), C = m({
+  name: k.b()
+}), z = /* @__PURE__ */ m({
+  ...C,
+  props: {
+    height: { default: 40 },
+    width: { default: 150 }
+  },
+  setup(e, { expose: n }) {
+    const d = f(() => ({
+      width: r(e.width),
+      height: r(e.height)
+    })), { domRef: c, imgCode: h, getImgCode: t } = w();
+    return n({
+      getImgCode: t,
+      code: h
+    }), (v, i) => (a(), l("div", {
+      style: u(o(d))
+    }, [
+      p("canvas", {
+        ref_key: "domRef",
+        ref: c,
+        width: e.width,
+        height: e.height,
+        class: "cursor-pointer",
+        onClick: i[0] || (i[0] = //@ts-ignore
+        (...s) => o(t) && o(t)(...s))
+      }, null, 8, y)
+    ], 4));
+  }
+});
+export {
+  z as default
+};