vft 0.0.48 → 0.0.50

package/es/packages/components/menu/sub-menu.vue2.js

@@ -0,0 +1,281 @@
+import { defineComponent as Z, getCurrentInstance as Y, computed as r, inject as D, ref as x, reactive as _, watch as ee, provide as oe, onMounted as te, onBeforeUnmount as re, useSlots as ne, h as i, Fragment as le, withDirectives as ie, vShow as ae } from "vue";
+import "../divider/index.js";
+import { VftIcon as H } from "../icon/index.js";
+import "../avatar/index.js";
+import "../empty/index.js";
+import "../result/index.js";
+import "../tabs/index.js";
+import "../popper/index.js";
+import { VftCollapseTransition as ue } from "../collapse-transition/index.js";
+import { VftTooltip as pe } from "../tooltip/index.js";
+import "../popover/index.js";
+import "./index.js";
+import { singleAttrToObj as se, renderTNode as me } from "@vft/utils";
+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 I } from "../../hooks/use-namespace/index.js";
+import "@popperjs/core";
+import "lodash";
+import "../../hooks/use-z-index/index.js";
+import { useTimeoutFn as L } from "@vueuse/core";
+import { throwError as U } from "../../utils/error.js";
+import "../../utils/ns-cover.js";
+import ce from "./use-menu.js";
+import { useMenuCssVar as de } from "./use-menu-css-var.js";
+const S = (
+  /* hoist-static*/
+  I("sub-menu")
+), ve = Z({
+  name: S.b()
+}), $o = /* @__PURE__ */ Z({
+  ...ve,
+  props: {
+    index: null,
+    showTimeout: {
+      default: 300
+    },
+    hideTimeout: {
+      default: 300
+    },
+    popperClass: null,
+    disabled: {
+      type: Boolean
+    },
+    popperAppendToBody: {
+      type: Boolean,
+      default: void 0
+    },
+    popperOffset: {
+      default: 6
+    },
+    expandIcon: {
+      default: {}
+    },
+    collapseIcon: {
+      default: {}
+    },
+    title: null,
+    icon: null,
+    showArrow: {
+      type: Boolean,
+      default: !0
+    },
+    toolTipCfg: null
+  },
+  setup(o, {
+    expose: q
+  }) {
+    const v = Y(), {
+      indexPath: h,
+      parentMenu: z
+    } = ce(v, r(() => o.index)), u = I("menu"), p = I("sub-menu"), e = D("rootMenu");
+    e || U(S.b(), "can not inject root menu");
+    const a = D(`subMenu:${z.value.uid}`);
+    a || U(S.b(), "can not inject sub menu");
+    const T = x({});
+    let s;
+    const B = x(!1), G = x(), A = x(null), P = r(() => c.value === "horizontal" && M.value ? "bottom-start" : "right-start"), M = r(() => a.level === 0), w = r(() => o.popperAppendToBody === void 0 ? M.value : Boolean(o.popperAppendToBody)), J = r(() => e.props.collapse ? `${u.namespace.value}-zoom-in-left` : `${u.namespace.value}-zoom-in-top`), K = r(() => c.value === "horizontal" && M.value ? ["bottom-start", "bottom-end", "top-start", "top-end", "right-start", "left-start"] : ["right-start", "left-start", "bottom-start", "bottom-end", "top-start", "top-end"]), m = r(() => e.openedMenus.includes(o.index)), f = r(() => {
+      let t = !1;
+      return Object.values(T.value).forEach((l) => {
+        l.active && (t = !0);
+      }), o.index === e.activeIndex && (t = !0), t;
+    }), j = r(() => e.props.backgroundColor || ""), E = r(() => e.props.activeTextColor || ""), F = r(() => e.props.textColor || ""), c = r(() => e.props.mode), C = _({
+      index: o.index,
+      indexPath: h,
+      active: f
+    }), $ = r(() => c.value !== "horizontal" ? {
+      color: F.value
+    } : {
+      borderBottomColor: f.value ? e.props.activeTextColor ? E.value : "" : "transparent",
+      color: f.value ? E.value : F.value
+    }), Q = () => {
+      var t, l, n;
+      return (n = (l = (t = A.value) == null ? void 0 : t.popperRef) == null ? void 0 : l.popperInstanceRef) == null ? void 0 : n.destroy();
+    }, W = (t) => {
+      t || Q();
+    }, O = () => {
+      e.props.menuTrigger === "hover" && e.props.mode === "horizontal" || e.props.collapse && e.props.mode === "vertical" || o.disabled || e.handleSubMenuClick({
+        index: o.index,
+        indexPath: h.value,
+        active: f.value
+      });
+    }, g = (t, l = o.showTimeout) => {
+      var n;
+      t.type !== "focus" && (e.props.menuTrigger === "click" && e.props.mode === "horizontal" || !e.props.collapse && e.props.mode === "vertical" || o.disabled || (a.mouseInChild.value = !0, s == null || s(), {
+        stop: s
+      } = L(() => {
+        e.openMenu(o.index, h.value);
+      }, l), w.value && ((n = z.value.vnode.el) == null || n.dispatchEvent(new MouseEvent("mouseenter")))));
+    }, y = (t = !1) => {
+      var l, n;
+      e.props.menuTrigger === "click" && e.props.mode === "horizontal" || !e.props.collapse && e.props.mode === "vertical" || (s == null || s(), a.mouseInChild.value = !1, {
+        stop: s
+      } = L(() => !B.value && e.closeMenu(o.index, h.value), o.hideTimeout), w.value && t && ((l = v.parent) == null ? void 0 : l.type.name) === "vft-sub-menu" && ((n = a.handleMouseleave) == null || n.call(a, !0)));
+    };
+    ee(() => e.props.collapse, (t) => W(Boolean(t)));
+    {
+      const t = (n) => {
+        T.value[n.index] = n;
+      }, l = (n) => {
+        delete T.value[n.index];
+      };
+      oe(`subMenu:${v.uid}`, {
+        addSubMenu: t,
+        removeSubMenu: l,
+        handleMouseleave: y,
+        mouseInChild: B,
+        level: a.level + 1
+      });
+    }
+    q({
+      opened: m
+    }), te(() => {
+      e.addSubMenu(C), a.addSubMenu(C);
+    }), re(() => {
+      a.removeSubMenu(C), e.removeSubMenu(C);
+    });
+    const d = ne(), X = r(() => c.value === "horizontal" && M.value || c.value === "vertical" && !e.props.collapse ? {
+      icon: "ico-ep:arrow-down",
+      size: 20,
+      ...o.expandIcon
+    } : {
+      icon: "ico-ep:arrow-right",
+      size: 18,
+      ...o.collapseIcon
+    }), V = r(() => se(o.icon, "icon")), N = r(() => me(v, "title"));
+    return () => {
+      var R;
+      const t = [(R = V.value) != null && R.icon ? i(H, {
+        ...V.value
+      }) : null, i("span", {
+        class: o.showArrow ? p.e("text") : "",
+        title: v.props.title
+      }, N.value), o.showArrow ? i(H, {
+        class: p.e("icon-arrow"),
+        ...X.value,
+        style: {
+          transform: m.value ? "rotateZ(180deg)" : "none"
+        }
+      }) : !1], l = de(e.props, a.level + 1), n = e.isMenuPopup ? i(pe, {
+        ref: A,
+        visible: m.value,
+        effect: "light",
+        pure: !0,
+        offset: o.popperOffset,
+        showArrow: !1,
+        persistent: !0,
+        popperClass: o.popperClass,
+        placement: P.value,
+        teleported: w.value,
+        fallbackPlacements: K.value,
+        transition: J.value,
+        gpuAcceleration: !1,
+        ...o.toolTipCfg
+      }, {
+        content: () => {
+          var b;
+          return i("div", {
+            class: [u.m(c.value), u.m("popup-container"), o.popperClass],
+            onMouseenter: (k) => g(k, 100),
+            onMouseleave: () => y(!0),
+            onFocus: (k) => g(k, 100)
+          }, [i("ul", {
+            class: [u.b(), u.m("popup"), u.m(`popup-${P.value}`)],
+            style: l.value
+          }, [(b = d.default) == null ? void 0 : b.call(d)])]);
+        },
+        default: () => i("div", {
+          class: p.e("title"),
+          style: [$.value, {
+            backgroundColor: j.value
+          }],
+          onClick: O
+        }, t)
+      }) : (
+        /**
+         *  Fragment 碎片化节点，可以让 dom 没有根节点
+         *
+         *  以下是无需 tooltip 渲染的组件，通常是侧边栏没有折叠的时候
+         */
+        i(le, {}, [N.value ? i("div", {
+          class: p.e("title"),
+          style: [$.value, {
+            backgroundColor: j.value
+          }],
+          ref: G,
+          onClick: O
+        }, t) : null, i(ue, {}, {
+          default: () => {
+            var b;
+            return ie(i("ul", {
+              role: "menu",
+              class: [u.b(), u.m("inline")],
+              style: l.value
+            }, [(b = d.default) == null ? void 0 : b.call(d)]), [[ae, m.value]]);
+          }
+        })])
+      );
+      return i("li", {
+        class: [p.b(), p.is("active", f.value), p.is("opened", m.value), p.is("disabled", o.disabled)],
+        role: "menuitem",
+        ariaHaspopup: !0,
+        ariaExpanded: m.value,
+        onMouseenter: g,
+        onMouseleave: () => y(!0),
+        onFocus: g
+      }, [n]);
+    };
+  }
+});
+export {
+  $o as default
+};

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

@@ -0,0 +1,16 @@
+import { withInstallFunction as s } from "../../utils/vue/install.js";
+import "vue";
+import "@vft/utils";
+import "lodash";
+import "@vueuse/core";
+import "../../utils/ns-cover.js";
+import e from "./method.js";
+import { messageDefaults as n, messageTypes as u } from "./types.js";
+const f = s(e, "$message");
+export {
+  f as Message,
+  f as VftMessage,
+  f as default,
+  n as messageDefaults,
+  u as messageTypes
+};

package/es/packages/components/multiple-tabs/multiple-tabs.vue2.js

@@ -0,0 +1,196 @@
+import { defineComponent as _, ref as b, computed as h, watchEffect as D, unref as r, openBlock as x, createElementBlock as T, normalizeClass as E, normalizeStyle as H, createVNode as R, withCtx as C, Fragment as K, renderList as F, createBlock as U } from "vue";
+import { useRouterHelper as $, getRouterKeyPath as c, listenerRouteChange as j } from "@vft/router";
+import { useMultipleTabStore as q, useTabs as G } from "@vft/store";
+import { useRefs as J } from "@vft/use";
+import "@vft/utils";
+import "lodash";
+import "@vueuse/core";
+import { generateCssVars as S } from "../../utils/ns-cover.js";
+import L from "hotkeys-js";
+import { useRouter as O, onBeforeRouteLeave as Q } from "vue-router";
+import { useNamespace as W } from "../../hooks/use-namespace/index.js";
+import "@popperjs/core";
+import "../../hooks/use-z-index/index.js";
+import "../divider/index.js";
+import "../icon/index.js";
+import "../avatar/index.js";
+import "../empty/index.js";
+import "../result/index.js";
+import { VftTabs as X, VftTabPane as Y } from "../tabs/index.js";
+import "../popper/index.js";
+import "../collapse-transition/index.js";
+import "../tooltip/index.js";
+import "../popover/index.js";
+import "../menu/index.js";
+import { initAffixTabs as Z, useTabsDrag as tt } from "./use/use-multiple-tabs.js";
+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 et from "./tab-content.vue2.js";
+const P = (
+  /* hoist-static*/
+  W("multiple-tabs")
+), ot = _({
+  name: P.b()
+}), Te = /* @__PURE__ */ _({
+  ...ot,
+  props: {
+    tabsStyle: null,
+    contextMenuStyle: null,
+    canDrag: { type: Boolean }
+  },
+  setup(f) {
+    const i = Z();
+    f.canDrag && tt(i);
+    const u = q(), n = b(""), a = b(0), d = b(), v = O(), { go: g } = $(), s = h(() => u.getTabList.filter((t) => {
+      var e;
+      return !((e = t.meta) != null && e.hideTab);
+    }));
+    D(() => {
+      var t;
+      if (n.value) {
+        const e = s.value.findIndex((o) => c(o) === n.value);
+        e === -1 ? a.value = ((t = s.value) == null ? void 0 : t.length) - 1 : a.value = e, a.value = a.value < (i == null ? void 0 : i.length) ? (i == null ? void 0 : i.length) - 1 : a.value;
+      }
+    }), Q(() => {
+      d.value = r(v.currentRoute);
+    }), j((t) => {
+      if (!t)
+        return;
+      const { meta: e = {} } = t, { currentActivePath: o, hideTab: m } = e, l = m ? o : null, p = c(t);
+      if (n.value !== p && (n.value = p), l) {
+        let y = v.getRoutes().find((z) => z.path === o);
+        y && u.addTab(y, r(d), a.value, t);
+      } else
+        u.addTab(r(t), r(d), a.value);
+    });
+    function M(t) {
+      var m, l;
+      if (n.value === t.paneName)
+        return;
+      const e = s.value[t.attrs.index];
+      n.value = t.paneName;
+      const o = (l = (m = e == null ? void 0 : e.meta) == null ? void 0 : m.hideActiveRoute) == null ? void 0 : l.fullPath;
+      g(o || e.fullPath || e.path);
+    }
+    function k(t) {
+      u.closeTabByKey(t, v);
+    }
+    const [B, I] = J();
+    function N(t) {
+      const e = t.pane.attrs.index, o = t.event;
+      B.value[e].handleContext(o);
+    }
+    const w = h(() => ({ ...S({
+      padding: "4px 0 0",
+      "header-height": "26px",
+      "item-color": "#5C5C5C",
+      "item-bg-color": "#f8f8f8",
+      "font-size": "13px",
+      "item-padding": "0 10px",
+      "close-icon-left": "8px",
+      "item-distance": "10px",
+      "item-max-width": "348px",
+      "scroll-padding": "0 20px",
+      "header-margin": "0 0 0 8px"
+    }, "tabs"), ...f.tabsStyle })), { closeCurrent: V } = G();
+    L("command+e, ctrl+e", function() {
+      return V(), !1;
+    });
+    const A = h(() => ({
+      ...S({
+        border: "1px solid #dcdfe6",
+        "sub-item-height": "40px",
+        "item-min-width": "150px"
+      }, "menu"),
+      ...f.contextMenuStyle
+    }));
+    return (t, e) => (x(), T("div", {
+      class: E(r(P).b()),
+      style: H(r(w))
+    }, [
+      R(r(X), {
+        "model-value": n.value,
+        "onUpdate:modelValue": e[0] || (e[0] = (o) => n.value = o),
+        type: "card",
+        onTabClick: M,
+        onTabRemove: k,
+        onTabContextMenu: N,
+        closeIconCfg: { color: "white" }
+      }, {
+        default: C(() => [
+          (x(!0), T(K, null, F(r(s), (o, m) => {
+            var l;
+            return x(), U(r(Y), {
+              key: r(c)(o) + m,
+              closable: !((l = o.meta) != null && l.affix),
+              index: m,
+              name: r(c)(o)
+            }, {
+              label: C(() => {
+                var p;
+                return [
+                  R(et, {
+                    contextMenuStyle: r(A),
+                    affixNum: (p = r(i)) == null ? void 0 : p.length,
+                    ref_for: !0,
+                    ref: r(I)(m),
+                    tabItem: o
+                  }, null, 8, ["contextMenuStyle", "affixNum", "tabItem"])
+                ];
+              }),
+              _: 2
+            }, 1032, ["closable", "index", "name"]);
+          }), 128))
+        ]),
+        _: 1
+      }, 8, ["model-value"])
+    ], 6));
+  }
+});
+export {
+  Te as default
+};

package/es/packages/components/multiple-tabs/tab-content.vue2.js

@@ -0,0 +1,99 @@
+import { defineComponent as l, computed as u, openBlock as c, createElementBlock as s, unref as r, withModifiers as f, toDisplayString as x } from "vue";
+import "@vft/utils";
+import "@vft/use";
+import "../divider/index.js";
+import "../icon/index.js";
+import "../avatar/index.js";
+import "../empty/index.js";
+import "../result/index.js";
+import "../tabs/index.js";
+import "../popper/index.js";
+import "../collapse-transition/index.js";
+import "../tooltip/index.js";
+import "../popover/index.js";
+import "../menu/index.js";
+import "./multiple-tabs.vue2.js";
+import { useTabDropdown as b } from "./use/use-tab-dropdown.js";
+import "vue-router";
+import "@vft/store";
+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 "../config-provider/hooks/use-global-config.js";
+import "@popperjs/core";
+import "lodash";
+import "../../hooks/use-z-index/index.js";
+import "@vueuse/core";
+import "../../utils/ns-cover.js";
+import { useContextMenu as d } from "../context-menu/useContextMenu.js";
+const C = ["title", "onContextmenu"], At = /* @__PURE__ */ l({
+  __name: "tab-content",
+  props: {
+    tabItem: null,
+    affixNum: null,
+    contextMenuStyle: null
+  },
+  setup(t, { expose: p }) {
+    const [e] = d(), m = u(() => t.tabItem.meta && t.tabItem.meta.title), { getDropMenuList: n, handleContextMenu: a } = b(t.tabItem, t.affixNum);
+    function i(o) {
+      a(t.tabItem)(o), e({
+        event: o,
+        styles: t.contextMenuStyle,
+        items: n.value
+      });
+    }
+    return p({
+      handleContext: i
+    }), (o, M) => (c(), s("span", {
+      title: r(m),
+      class: "vft-multiple-tabs__title",
+      onContextmenu: f(i, ["stop"])
+    }, x(r(m)), 41, C));
+  }
+});
+export {
+  At as default
+};

package/es/packages/components/overlay/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 "./overlay.vue2.js";
+const s = t(o);
+export {
+  s as VftOverlay,
+  s as default
+};

package/es/packages/components/page-wrapper/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 r from "./page-wrapper.vue2.js";
+const s = t(r);
+export {
+  s as VftPageWrapper,
+  s as default
+};

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

@@ -0,0 +1,15 @@
+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 "./pagination.vue2.js";
+import { usePagination as l, vftPaginationKey as P } from "./usePagination.js";
+const e = t(o);
+export {
+  e as VftPagination,
+  e as default,
+  l as usePagination,
+  P as vftPaginationKey
+};

package/es/packages/components/pagination/pagination.vue.js

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