@vtable-guild/vtable-guild 2.2.2 → 2.3.0

package/dist/core/src/components/Tooltip.mjs

@@ -0,0 +1,321 @@
+import { defineComponent as F, ref as b, computed as i, watch as H, nextTick as B, onMounted as I, onBeforeUnmount as V, createVNode as r, Fragment as X, Teleport as D, Transition as N } from "vue";
+import { useTheme as Y } from "../composables/useTheme.mjs";
+const j = {
+  slots: {
+    content: ["text-white max-w-[250px] break-words relative", "text-[length:var(--vtg-tooltip-font-size)]", "leading-[1.5715]", "bg-[color:var(--vtg-tooltip-bg)]", "rounded-[var(--vtg-tooltip-border-radius)]", "p-[var(--vtg-tooltip-padding)]", "shadow-[0_6px_16px_0_rgba(0,0,0,0.08),0_3px_6px_-4px_rgba(0,0,0,0.12),0_9px_28px_8px_rgba(0,0,0,0.05)]"].join(" "),
+    arrow: "absolute block pointer-events-none",
+    arrowOuter: "absolute w-0 h-0",
+    arrowInner: "absolute w-0 h-0"
+  },
+  defaultVariants: {}
+}, q = /* @__PURE__ */ F({
+  name: "VTooltip",
+  props: {
+    title: {
+      type: [String, Object],
+      default: void 0
+    },
+    placement: {
+      type: String,
+      default: "top"
+    },
+    open: {
+      type: Boolean,
+      default: void 0
+    },
+    mouseEnterDelay: {
+      type: Number,
+      default: 0.1
+    },
+    mouseLeaveDelay: {
+      type: Number,
+      default: 0.1
+    },
+    color: {
+      type: String,
+      default: void 0
+    },
+    arrow: {
+      type: Boolean,
+      default: !0
+    },
+    destroyOnHide: {
+      type: Boolean,
+      default: !1
+    },
+    block: {
+      type: Boolean,
+      default: !1
+    },
+    ui: {
+      type: Object,
+      default: void 0
+    },
+    class: {
+      type: String,
+      default: void 0
+    }
+  },
+  setup(e, {
+    slots: m
+  }) {
+    const {
+      slots: c
+    } = Y("tooltip", j, e), L = b(null), R = b(null), w = b(!1);
+    let f = null, h = null;
+    const y = i(() => e.open !== void 0), s = i(() => y.value ? e.open : w.value), T = b({
+      top: 0,
+      left: 0
+    });
+    let n = null;
+    function S() {
+      const t = L.value, d = R.value;
+      if (!t || !d) return;
+      const o = t.getBoundingClientRect(), a = d.getBoundingClientRect(), v = window.scrollX, x = window.scrollY;
+      let p = 0, u = 0;
+      const g = 8;
+      switch (e.placement) {
+        case "top":
+          p = o.top + x - a.height - g, u = o.left + v + o.width / 2 - a.width / 2;
+          break;
+        case "bottom":
+          p = o.bottom + x + g, u = o.left + v + o.width / 2 - a.width / 2;
+          break;
+        case "left":
+          p = o.top + x + o.height / 2 - a.height / 2, u = o.left + v - a.width - g;
+          break;
+        case "right":
+          p = o.top + x + o.height / 2 - a.height / 2, u = o.right + v + g;
+          break;
+      }
+      T.value = {
+        top: p,
+        left: u
+      };
+    }
+    function l() {
+      n !== null && cancelAnimationFrame(n), n = requestAnimationFrame(() => {
+        n = null, S();
+      });
+    }
+    function z() {
+      window.addEventListener("resize", l), window.addEventListener("scroll", l, !0);
+    }
+    function _() {
+      window.removeEventListener("resize", l), window.removeEventListener("scroll", l, !0);
+    }
+    function $() {
+      f && (clearTimeout(f), f = null), h && (clearTimeout(h), h = null);
+    }
+    function k() {
+      y.value || ($(), f = setTimeout(() => {
+        w.value = !0;
+      }, e.mouseEnterDelay * 1e3));
+    }
+    function C() {
+      y.value || ($(), h = setTimeout(() => {
+        w.value = !1;
+      }, e.mouseLeaveDelay * 1e3));
+    }
+    H(s, (t) => {
+      t ? (z(), B(() => l())) : _();
+    }), H(() => e.placement, () => {
+      s.value && B(() => l());
+    }), I(() => {
+      s.value && (z(), B(() => l()));
+    }), V(() => {
+      $(), _(), n !== null && (cancelAnimationFrame(n), n = null);
+    });
+    const E = i(() => {
+      switch (e.placement) {
+        case "top":
+          return {
+            bottom: "-7px",
+            left: "50%",
+            width: "14px",
+            height: "8px",
+            transform: "translateX(-50%)"
+          };
+        case "bottom":
+          return {
+            top: "-7px",
+            left: "50%",
+            width: "14px",
+            height: "8px",
+            transform: "translateX(-50%)"
+          };
+        case "left":
+          return {
+            right: "-7px",
+            top: "50%",
+            width: "8px",
+            height: "14px",
+            transform: "translateY(-50%)"
+          };
+        case "right":
+          return {
+            left: "-7px",
+            top: "50%",
+            width: "8px",
+            height: "14px",
+            transform: "translateY(-50%)"
+          };
+        default:
+          return {
+            bottom: "-7px",
+            left: "50%",
+            width: "14px",
+            height: "8px",
+            transform: "translateX(-50%)"
+          };
+      }
+    }), O = i(() => {
+      const t = e.color ?? "var(--vtg-tooltip-arrow-outer-color, var(--vtg-tooltip-bg))";
+      switch (e.placement) {
+        case "top":
+          return {
+            left: "0",
+            top: "0",
+            borderLeft: "7px solid transparent",
+            borderRight: "7px solid transparent",
+            borderTop: `8px solid ${t}`
+          };
+        case "bottom":
+          return {
+            left: "0",
+            top: "0",
+            borderLeft: "7px solid transparent",
+            borderRight: "7px solid transparent",
+            borderBottom: `8px solid ${t}`
+          };
+        case "left":
+          return {
+            left: "0",
+            top: "0",
+            borderTop: "7px solid transparent",
+            borderBottom: "7px solid transparent",
+            borderLeft: `8px solid ${t}`
+          };
+        case "right":
+          return {
+            left: "0",
+            top: "0",
+            borderTop: "7px solid transparent",
+            borderBottom: "7px solid transparent",
+            borderRight: `8px solid ${t}`
+          };
+        default:
+          return {
+            left: "0",
+            top: "0",
+            borderLeft: "7px solid transparent",
+            borderRight: "7px solid transparent",
+            borderTop: `8px solid ${t}`
+          };
+      }
+    }), M = i(() => {
+      const t = e.color ?? "var(--vtg-tooltip-bg)";
+      switch (e.placement) {
+        case "top":
+          return {
+            left: "1px",
+            top: "0",
+            borderLeft: "6px solid transparent",
+            borderRight: "6px solid transparent",
+            borderTop: `7px solid ${t}`
+          };
+        case "bottom":
+          return {
+            left: "1px",
+            top: "1px",
+            borderLeft: "6px solid transparent",
+            borderRight: "6px solid transparent",
+            borderBottom: `7px solid ${t}`
+          };
+        case "left":
+          return {
+            left: "0",
+            top: "1px",
+            borderTop: "6px solid transparent",
+            borderBottom: "6px solid transparent",
+            borderLeft: `7px solid ${t}`
+          };
+        case "right":
+          return {
+            left: "1px",
+            top: "1px",
+            borderTop: "6px solid transparent",
+            borderBottom: "6px solid transparent",
+            borderRight: `7px solid ${t}`
+          };
+        default:
+          return {
+            left: "1px",
+            top: "0",
+            borderLeft: "6px solid transparent",
+            borderRight: "6px solid transparent",
+            borderTop: `7px solid ${t}`
+          };
+      }
+    }), A = i(() => e.destroyOnHide ? s.value : !0);
+    return () => {
+      const t = m.title?.() ?? e.title;
+      if (t == null)
+        return m.default?.();
+      const d = r("span", {
+        ref: L,
+        onMouseenter: k,
+        onMouseleave: C,
+        style: e.block ? {
+          display: "flex",
+          flex: "1 1 auto",
+          minWidth: 0
+        } : {
+          display: "inline-flex"
+        }
+      }, [m.default?.()]), o = e.color ? {
+        background: e.color,
+        borderColor: e.color
+      } : void 0;
+      return r(X, null, [d, r(D, {
+        to: "body"
+      }, {
+        default: () => [r(N, {
+          enterActiveClass: "vtg-tooltip-enter-active",
+          leaveActiveClass: "vtg-tooltip-leave-active",
+          enterFromClass: "vtg-tooltip-enter-from",
+          leaveToClass: "vtg-tooltip-leave-to"
+        }, {
+          default: () => [A.value && s.value && r("div", {
+            ref: R,
+            role: "tooltip",
+            onMouseenter: k,
+            onMouseleave: C,
+            style: {
+              position: "absolute",
+              top: `${T.value.top}px`,
+              left: `${T.value.left}px`,
+              zIndex: 1070,
+              pointerEvents: "none"
+            }
+          }, [r("div", {
+            class: c.content(),
+            style: o
+          }, [t, e.arrow && r("div", {
+            class: c.arrow(),
+            style: E.value
+          }, [r("div", {
+            class: c.arrowOuter(),
+            style: O.value
+          }, null), r("div", {
+            class: c.arrowInner(),
+            style: M.value
+          }, null)])])])]
+        })]
+      })]);
+    };
+  }
+});
+export {
+  q as default
+};

package/dist/core/src/components/VTableGuildConfigProvider.mjs

@@ -0,0 +1,77 @@
+import { defineComponent as p, inject as O, computed as c, reactive as h, provide as y } from "vue";
+import { mergeDeep as b } from "../utils/mergeDeep.mjs";
+import { normalizeVtgClassPrefix as P } from "../utils/classPrefix.mjs";
+import { mergeThemeConfigs as x } from "../composables/useTheme.mjs";
+import { VTABLE_GUILD_INJECTION_KEY as a } from "../plugin/index.mjs";
+const M = /* @__PURE__ */ p({
+  name: "VTableGuildConfigProvider",
+  props: {
+    theme: {
+      type: Object,
+      default: void 0
+    },
+    cssMode: {
+      type: String,
+      default: void 0
+    },
+    classPrefix: {
+      type: String,
+      default: void 0
+    },
+    locale: {
+      type: String,
+      default: void 0
+    },
+    locales: {
+      type: Object,
+      default: void 0
+    },
+    localeOverrides: {
+      type: Object,
+      default: void 0
+    }
+  },
+  setup(t, {
+    slots: i
+  }) {
+    const e = O(a, null), u = c(() => {
+      const r = e?.theme ?? {}, n = t.theme ?? {};
+      if (!Object.keys(n).length) return r;
+      const v = /* @__PURE__ */ new Set([...Object.keys(r), ...Object.keys(n)]), d = {};
+      for (const l of v) {
+        const o = r[l], s = n[l];
+        d[l] = o && s ? x(o, s) : s ?? o;
+      }
+      return d;
+    }), f = c(() => ({
+      ...e?.locales ?? {},
+      ...t.locales ?? {}
+    })), m = c(() => b(e?.localeOverrides ?? {}, t.localeOverrides)), g = h({
+      get themePreset() {
+        return e?.themePreset ?? "antdv";
+      },
+      get cssMode() {
+        return t.cssMode ?? e?.cssMode ?? "prebuilt";
+      },
+      get classPrefix() {
+        return P(t.classPrefix ?? e?.classPrefix);
+      },
+      get theme() {
+        return u.value;
+      },
+      get locale() {
+        return t.locale ?? e?.locale ?? "zh-CN";
+      },
+      get locales() {
+        return f.value;
+      },
+      get localeOverrides() {
+        return m.value;
+      }
+    });
+    return y(a, g), () => i.default?.();
+  }
+});
+export {
+  M as default
+};

package/dist/core/src/components/VirtualList/Filler.mjs

@@ -0,0 +1,55 @@
+import { defineComponent as u, createVNode as f } from "vue";
+const d = /* @__PURE__ */ u({
+  name: "VirtualFiller",
+  props: {
+    prefixCls: String,
+    height: Number,
+    offsetY: Number,
+    offsetX: Number,
+    scrollWidth: Number,
+    onInnerResize: Function,
+    innerProps: Object,
+    rtl: Boolean,
+    extra: Object
+  },
+  setup(e, {
+    slots: o
+  }) {
+    let n = null, i = null;
+    const s = (t) => {
+      i !== t && (n && i && n.unobserve(i), i = t, t && (n || (n = new ResizeObserver((r) => {
+        const l = r[0];
+        l && l.target.offsetHeight && e.onInnerResize && e.onInnerResize();
+      })), n.observe(t)));
+    };
+    return () => {
+      let t = {}, r = {
+        display: "flex",
+        flexDirection: "column"
+      };
+      return e.offsetY !== void 0 && (t = {
+        height: `${e.height}px`,
+        position: "relative",
+        overflow: "hidden"
+      }, r = {
+        ...r,
+        transform: `translateY(${e.offsetY}px)`,
+        [e.rtl ? "marginRight" : "marginLeft"]: `-${e.offsetX || 0}px`,
+        position: "absolute",
+        left: 0,
+        right: 0,
+        top: 0
+      }), f("div", {
+        style: t
+      }, [f("div", {
+        ref: s,
+        style: r,
+        class: e.prefixCls ? `${e.prefixCls}-holder-inner` : void 0,
+        ...e.innerProps
+      }, [o.default?.(), e.extra])]);
+    };
+  }
+});
+export {
+  d as default
+};

package/dist/core/src/components/VirtualList/Item.mjs

@@ -0,0 +1,29 @@
+import { defineComponent as l, shallowRef as f, cloneVNode as o } from "vue";
+function i(n) {
+  return n.filter((t) => t != null && typeof t != "boolean");
+}
+const a = /* @__PURE__ */ l({
+  name: "VirtualItem",
+  props: {
+    setRef: {
+      type: Function,
+      required: !0
+    }
+  },
+  setup(n, {
+    slots: t
+  }) {
+    const r = f(null), u = (e) => {
+      r.value !== e && (r.value = e, n.setRef(e));
+    };
+    return () => {
+      const e = i(t.default?.() ?? [])[0];
+      return e ? o(e, {
+        ref: u
+      }) : null;
+    };
+  }
+});
+export {
+  a as default
+};