vft 0.0.50 → 0.0.53

package/es/components/table/table.vue2.js

@@ -0,0 +1,232 @@
+import { defineComponent as q, useAttrs as M, ref as i, computed as p, watch as b, reactive as Y, onMounted as J, resolveComponent as K, openBlock as C, createElementBlock as Q, normalizeClass as x, unref as n, createBlock as L, mergeProps as S, createCommentVNode as N, createVNode as P, createSlots as Z, withCtx as W, withDirectives as _, createElementVNode as D, vShow as ee } from "vue";
+import { VftEmpty as te } from "../empty/index.js";
+import { VftPagination as O } from "../pagination/index.js";
+import { useNamespace as le } from "../../hooks/use-namespace/index.js";
+import "@popperjs/core";
+import "lodash";
+import "../../hooks/use-z-index/index.js";
+import { useDebounceFn as ae, useResizeObserver as ne } from "@vueuse/core";
+import "@vft/utils";
+import "../../utils/ns-cover.js";
+import "@vue/reactivity";
+import "@vue/shared";
+import { VXETable as oe } from "vxe-table";
+import { EmptyEnum as re } from "../empty/constants.js";
+const s = (
+  /* hoist-static*/
+  le("table")
+), ie = q({
+  name: s.b()
+}), Se = /* @__PURE__ */ q({
+  ...ie,
+  props: {
+    maxHeight: null,
+    columns: null,
+    tableData: {
+      default: []
+    },
+    loading: {
+      type: Boolean,
+      default: !1
+    },
+    height: null,
+    pageSize: {
+      default: 50
+    },
+    total: null,
+    defaultSort: {
+      default: {}
+    },
+    tableConfig: {
+      default: {}
+    },
+    sticky: {
+      type: [Boolean, Object]
+    },
+    pagePlacement: {
+      default: "bottom-right"
+    },
+    pageOptions: null
+  },
+  emits: ["page-change", "sort-change", "update:pageNum"],
+  setup(t, {
+    expose: I,
+    emit: v
+  }) {
+    const V = M(), r = i(1), $ = i(0), u = i(), A = ae(() => T(), 120), w = p(() => t.pagePlacement.startsWith("bottom"));
+    b([() => t.loading, () => t.tableData, () => t.columns], () => {
+      A();
+    }, {
+      immediate: !0
+    });
+    function T() {
+      m.data = t.tableData, k(r.value);
+    }
+    oe.formats.mixin({
+      showEmpty({
+        cellValue: e
+      }) {
+        return e || "-";
+      }
+    });
+    const G = p(() => t.columns.filter((e) => (e && e.type !== "seq" && !e.formatter && !e.slots && !e.cellRender && (e.cellRender = {
+      name: "Encrypt"
+    }), e))), U = () => ({
+      maxHeight: "88px",
+      height: "44px"
+    }), X = (e) => {
+      var a;
+      const {
+        column: l
+      } = e;
+      return {
+        maxHeight: ((a = l == null ? void 0 : l.cellRender) == null ? void 0 : a.name) === "Clamp" ? "max-content" : "44px"
+      };
+    }, m = Y({
+      autoResize: !0,
+      sortConfig: {
+        trigger: "cell",
+        remote: !0,
+        defaultSort: {
+          field: "",
+          order: "desc",
+          ...t.defaultSort
+        },
+        orders: ["desc", "asc", null]
+      },
+      seqConfig: {
+        startIndex: $.value
+      },
+      cellClassName: "cellClass",
+      rowClassName: "rowClass",
+      cellStyle: X,
+      rowStyle: U,
+      headerRowClassName: "headerRowClass",
+      headerAlign: "center",
+      columnConfig: {
+        resizable: !0
+        // 每一列是否启用列宽调整
+      },
+      rowConfig: {
+        isHover: !0
+      },
+      scrollY: {
+        mode: "wheel"
+      },
+      scrollX: {
+        enabled: !1
+      },
+      ...t.tableConfig,
+      ...V
+    }), j = (e) => {
+      v("sort-change", e);
+    };
+    b(() => r.value, (e) => {
+      k(e);
+    });
+    const k = (e) => {
+      m.seqConfig && (m.seqConfig.startIndex = (e - 1) * t.pageSize);
+    }, d = i(), z = i(), h = i(!1);
+    let o = i(), f = i();
+    const g = p(() => {
+      var e;
+      return ((e = t.sticky) == null ? void 0 : e.getContainer) || document.documentElement || document.body;
+    });
+    b(() => [u, t.sticky], () => {
+      var e, l, a;
+      (e = u.value) != null && e.$el && t.sticky && ((l = g.value) == null || l.removeEventListener("scroll", y), (a = g.value) == null || a.addEventListener("scroll", y), setTimeout(() => {
+        E();
+      }, 50));
+    }, {
+      immediate: !0,
+      deep: !0
+    });
+    function E() {
+      if (!o.value || !f.value || (y(), !h.value))
+        return;
+      const e = o.value.clientWidth, l = f.value.offsetWidth;
+      d.value.style.width = e - 1 + "px", z.value.style.width = l + "px";
+    }
+    function y() {
+      var B, R, H;
+      if (!((B = u.value) != null && B.$el) || !o.value || !g.value)
+        return;
+      const e = ((R = g.value) == null ? void 0 : R.clientHeight) || window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight, {
+        top: l,
+        bottom: a
+      } = o.value.getBoundingClientRect(), c = ((H = g.value) == null ? void 0 : H.getBoundingClientRect().top) || document.body.getBoundingClientRect().top;
+      h.value = l < e && a > e && a - c > e, d.value.scrollLeft = o.value.scrollLeft;
+    }
+    const F = () => {
+      var l;
+      const e = (l = u.value) == null ? void 0 : l.$el;
+      e && (o.value = e.querySelector(".vxe-table--body-wrapper"), f.value = e.querySelector(".vxe-table--body"), !(!o.value && !f.value) && (o.value.addEventListener("scroll", function(a) {
+        d.value.scrollLeft = a.target.scrollLeft;
+      }), d.value.addEventListener("scroll", function(a) {
+        o.value.scrollLeft = a.target.scrollLeft;
+      })));
+    };
+    return J(() => {
+      t.sticky && (F(), ne(u, () => E()));
+    }), I({
+      table: u
+    }), (e, l) => {
+      const a = K("vxe-grid");
+      return C(), Q("div", {
+        class: x(n(s).b())
+      }, [n(w) ? N("", !0) : (C(), L(n(O), S({
+        key: 0,
+        class: [n(s).e("pager"), n(s).m("pager-" + t.pagePlacement)],
+        layout: "prev, pager, next"
+      }, t.pageOptions, {
+        total: t.total,
+        "page-size": t.pageSize,
+        onCurrentChange: l[0] || (l[0] = (c) => v("page-change", r.value)),
+        "current-page": r.value,
+        "onUpdate:currentPage": l[1] || (l[1] = (c) => r.value = c)
+      }), null, 16, ["class", "total", "page-size", "current-page"])), P(a, S({
+        ref_key: "xGrid",
+        ref: u
+      }, m, {
+        height: t.height,
+        "max-height": t.maxHeight,
+        columns: n(G),
+        data: t.tableData,
+        "auto-resize": "",
+        loading: t.loading,
+        resizable: "",
+        onSortChange: j
+      }), Z({
+        empty: W(() => [P(n(te), {
+          type: n(re).NO_DATA
+        }, null, 8, ["type"])]),
+        _: 2
+      }, [t.sticky ? {
+        name: "bottom",
+        fn: W(() => [_(D("div", {
+          ref_key: "stickyScroll",
+          ref: d,
+          class: x(n(s).e("sticky-scroll-warpper"))
+        }, [D("div", {
+          ref_key: "stickyScrollBar",
+          ref: z,
+          class: x(n(s).e("sticky-scroll-bar"))
+        }, null, 2)], 2), [[ee, h.value]])]),
+        key: "0"
+      } : void 0]), 1040, ["height", "max-height", "columns", "data", "loading"]), n(w) ? (C(), L(n(O), S({
+        key: 1,
+        class: [n(s).e("pager"), n(s).m("pager-" + t.pagePlacement)],
+        layout: "prev, pager, next"
+      }, t.pageOptions, {
+        total: t.total,
+        "page-size": t.pageSize,
+        onCurrentChange: l[2] || (l[2] = (c) => v("page-change", r.value)),
+        "current-page": r.value,
+        "onUpdate:currentPage": l[3] || (l[3] = (c) => r.value = c)
+      }), null, 16, ["class", "total", "page-size", "current-page"])) : N("", !0)], 2);
+    };
+  }
+});
+export {
+  Se as default
+};

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

@@ -0,0 +1,57 @@
+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.js";
+import { useNamespace as j } from "../../hooks/use-namespace/index.js";
+import "@popperjs/core";
+import "lodash";
+import "../../hooks/use-z-index/index.js";
+import { useResizeObserver as D } from "@vueuse/core";
+import { capitalize as c } from "@vft/utils";
+import "../../utils/ns-cover.js";
+import "@vue/reactivity";
+import "@vue/shared";
+const U = /* @__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 {
+  U as default
+};

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

@@ -0,0 +1,235 @@
+import { defineComponent as E, getCurrentInstance as Z, inject as _, ref as g, computed as I, watch as O, onMounted as tt, onUpdated as ot, createVNode as s, nextTick as et } 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 "../image-viewer/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 "@vue/reactivity";
+import "@vue/shared";
+import { EVENT_CODE as k } from "@vft/constants";
+import { TabsRootContextKey as rt } from "./types.js";
+import st from "./tab-bar.vue2.js";
+const V = (
+  /* hoist-static*/
+  K("tab-nav")
+), ct = E({
+  name: V.b()
+}), No = /* @__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 = _(rt);
+    d || it(V.b(), "<vft-tabs><tab-nav /></vft-tabs>");
+    const e = K("tabs"), q = nt(), H = lt(), $ = g(), v = 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 (!v.value)
+        return;
+      const o = v.value[`offset${y(w.value)}`], t = f.value;
+      t && (f.value = t > o ? t - o : 0);
+    }, U = () => {
+      if (!v.value || !h.value)
+        return;
+      const o = h.value[`offset${y(w.value)}`], t = v.value[`offset${y(w.value)}`], i = f.value;
+      o - i <= t || (f.value = o - i > t * 2 ? i + t : o - t);
+    }, R = async () => {
+      const o = h.value;
+      if (!m.value || !$.value || !v.value || !o)
+        return;
+      await et();
+      const t = $.value.querySelector(".is-active");
+      if (!t)
+        return;
+      const i = v.value, b = ["top", "bottom"].includes(d.props.tabPosition), r = t.getBoundingClientRect(), l = i.getBoundingClientRect(), u = b ? o.offsetWidth - l.width : o.offsetHeight - l.height, c = f.value;
+      let a = c;
+      b ? (r.left < l.left && (a = c - (l.left - r.left)), r.right > l.right && (a = c + r.right - l.right)) : (r.top < l.top && (a = c - (l.top - r.top)), r.bottom > l.bottom && (a = c + (r.bottom - l.bottom))), a = Math.max(a, 0), f.value = Math.min(a, u);
+    }, z = () => {
+      if (!h.value || !v.value)
+        return;
+      const o = h.value[`offset${y(w.value)}`], t = v.value[`offset${y(w.value)}`], i = f.value;
+      t < o ? (m.value = m.value || {}, m.value.prev = i, m.value.next = i + t < o, o - i < t && (f.value = o - t)) : (m.value = !1, i > 0 && (f.value = 0));
+    }, X = (o) => {
+      const t = o.code, {
+        up: i,
+        down: b,
+        left: r,
+        right: l
+      } = k;
+      if (![i, b, r, l].includes(t))
+        return;
+      const u = Array.from(o.currentTarget.querySelectorAll("[role=tab]:not(.is-disabled)")), c = u.indexOf(o.target);
+      let a;
+      t === r || 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, (o) => {
+      o === "hidden" ? x.value = !1 : o === "visible" && setTimeout(() => x.value = !0, 50);
+    }), O(H, (o) => {
+      o ? setTimeout(() => x.value = !0, 50) : x.value = !1;
+    }), at($, z), tt(() => setTimeout(() => R(), 0)), ot(() => z()), D({
+      scrollToActiveTab: R,
+      removeFocus: B
+    }), O(() => n.panes, () => M.update(), {
+      flush: "post"
+    });
+    const Y = I(() => {
+      var o, t;
+      return m.value ? [s("span", {
+        class: [e.e("nav-prev"), e.is("disabled", !m.value.prev)],
+        onClick: j
+      }, [(o = n.arrowLeftIconCfg) != null && o.icon ? s(T, n.arrowLeftIconCfg, null) : null]), s("span", {
+        class: [e.e("nav-next"), e.is("disabled", !m.value.next)],
+        onClick: U
+      }, [(t = n.arrowRightIconCfg) != null && t.icon ? s(T, n.arrowRightIconCfg, null) : null])] : null;
+    }), G = I(() => {
+      var o;
+      return (o = n.panes) == null ? void 0 : o.map((t, i) => {
+        var N, F, L;
+        const b = t.uid, r = t.props.disabled, l = t.props.name ?? t.index ?? `${i}`, u = !r && (t.isClosable || n.editable);
+        t.index = `${i}`;
+        const c = u ? s("span", {
+          class: "is-icon-close",
+          onClick: (p) => C("tabRemove", t, p)
+        }, [(N = n.closeIconCfg) != null && N.icon ? s(T, n.closeIconCfg, null) : null]) : null, a = ((L = (F = t.slots).label) == null ? void 0 : L.call(F)) || t.props.label, Q = !r && t.active ? 0 : -1;
+        return s("div", {
+          ref: `tab-${b}`,
+          class: [e.e("item"), e.is(d.props.tabPosition), e.is("active", t.active), e.is("disabled", r), e.is("closable", u), e.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: (p) => {
+            B(), C("tabClick", t, l, p);
+          },
+          onContextmenu: (p) => {
+            p.preventDefault(), C("tabContextmenu", {
+              pane: t,
+              index: i,
+              event: p
+            });
+          },
+          onKeydown: (p) => {
+            u && (p.code === k.delete || p.code === k.backspace) && C("tabRemove", t, p);
+          }
+        }, [a, c]);
+      });
+    }), J = n.editable || n.addable ? s("span", {
+      class: e.e("new-tab"),
+      tabindex: "0",
+      onClick: () => C("tabAdd"),
+      onKeydown: (o) => {
+        o.code === k.enter && C("tabAdd");
+      }
+    }, [(A = n.addIconCfg) != null && A.icon ? s(T, n.addIconCfg, null) : null]) : null;
+    return () => s("div", {
+      ref: $,
+      class: [e.e("nav-wrap"), e.is("scrollable", !!m.value), e.is(d.props.tabPosition)]
+    }, [Y.value, s("div", {
+      class: e.e("nav-scroll"),
+      ref: v
+    }, [s("div", {
+      class: [e.e("nav"), e.is(d.props.tabPosition), e.is("stretch", n.stretch && ["top", "bottom"].includes(d.props.tabPosition))],
+      ref: h,
+      style: W.value,
+      role: "tablist",
+      onKeydown: X
+    }, [n.type ? null : s(st, {
+      tabs: [...n.panes]
+    }, null), G.value]), J])]);
+  }
+});
+export {
+  No as default
+};

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

@@ -0,0 +1,64 @@
+import { defineComponent as b, getCurrentInstance as y, useSlots as C, inject as B, ref as u, 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";
+import "@vue/reactivity";
+import "@vue/shared";
+const I = ["id", "aria-hidden", "aria-labelledby"], i = (
+  /* hoist-static*/
+  D("tab-pane")
+), K = b({
+  name: i.b()
+}), W = /* @__PURE__ */ b({
+  ...K,
+  props: {
+    label: null,
+    name: null,
+    closable: { type: Boolean },
+    disabled: { type: Boolean },
+    lazy: { type: Boolean }
+  },
+  setup(a) {
+    const n = y(), f = C(), o = B(j);
+    o || P(i.b(), "usage: <vft-tabs><vft-tab-pane /></vft-tabs/>");
+    const r = u(), v = d(() => a.closable || o.props.closable), e = p(() => o.currentName.value === (a.name ?? r.value)), c = u(e.value), l = d(() => a.name ?? r.value), h = p(() => !a.lazy || c.value || e.value);
+    g(e, (s) => {
+      s && (c.value = !0);
+    });
+    const m = w({
+      uid: n.uid,
+      slots: f,
+      props: n.props,
+      paneName: l,
+      active: e,
+      index: r,
+      isClosable: v,
+      attrs: n.attrs
+    });
+    return N(() => {
+      o.registerPane(m);
+    }), k(() => {
+      o.unregisterPane(m.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 {
+  W as default
+};