@das-fed/upf-ui 6.4.0-dev.313 → 6.4.0-dev.314

package/packages/components/tooltip/index.d.ts

@@ -3,13 +3,13 @@ declare const DasTooltipRef: () => import("vue").Ref<({
     $data: {};
     $props: {
         readonly selfPopperClass?: string | undefined;
-        readonly effect?: "dark" | "light" | undefined;
-        readonly placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | undefined;
+        readonly effect?: ("dark" | "light") | undefined;
+        readonly placement?: ("top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end") | undefined;
         readonly customClass?: string | undefined;
         readonly content?: string | undefined;
         readonly disabled?: boolean | undefined;
         readonly text?: string | undefined;
-        readonly row?: number | string | undefined;
+        readonly row?: (number | string) | undefined;
         readonly textWidth?: string | undefined;
         readonly textHtml?: boolean | undefined;
         readonly isMaxheight?: boolean | undefined;
@@ -98,13 +98,13 @@ declare const DasTooltipRef: () => import("vue").Ref<({
     $data: {};
     $props: {
         readonly selfPopperClass?: string | undefined;
-        readonly effect?: "dark" | "light" | undefined;
-        readonly placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | undefined;
+        readonly effect?: ("dark" | "light") | undefined;
+        readonly placement?: ("top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end") | undefined;
         readonly customClass?: string | undefined;
         readonly content?: string | undefined;
         readonly disabled?: boolean | undefined;
         readonly text?: string | undefined;
-        readonly row?: number | string | undefined;
+        readonly row?: (number | string) | undefined;
         readonly textWidth?: string | undefined;
         readonly textHtml?: boolean | undefined;
         readonly isMaxheight?: boolean | undefined;

package/packages/components/tooltip/index.js

@@ -1,15 +1,15 @@
-import { defineComponent as L, useCssVars as _, useAttrs as z, computed as p, ref as v, onMounted as D, onBeforeMount as P, openBlock as s, createBlock as I, unref as b, mergeProps as O, withCtx as m, createVNode as W, createElementVNode as M, normalizeClass as $, renderSlot as R, createElementBlock as i, Fragment as h, createTextVNode as q, toDisplayString as B, createCommentVNode as g, normalizeStyle as F, nextTick as X } from "vue";
-import { setI18nRule as Y, t as A } from "@das-fed/upf-web/packages/i18n/index";
-import { withInstall as j } from "@das-fed/upf-utils/with-install/index";
-import { DasScrollbar as G } from "@das-fed/upf-ui/packages/components/scrollbar/index";
-import { ElTooltip as J } from "element-plus";
+import { defineComponent as L, useCssVars as z, useAttrs as D, computed as c, ref as v, onMounted as P, onBeforeMount as I, openBlock as s, createBlock as O, unref as b, mergeProps as W, withCtx as m, createVNode as q, createElementVNode as M, normalizeClass as $, renderSlot as R, createElementBlock as a, Fragment as h, createTextVNode as F, toDisplayString as B, createCommentVNode as g, normalizeStyle as X, nextTick as Y } from "vue";
+import { setI18nRule as A, t as j } from "@das-fed/upf-web/packages/i18n/index";
+import { withInstall as G } from "@das-fed/upf-utils/with-install/index";
+import { DasScrollbar as J } from "@das-fed/upf-ui/packages/components/scrollbar/index";
+import { ElTooltip as K } from "element-plus";
 import "element-plus/es/components/tooltip/style/css"
 import '@das-fed/upf-ui/packages/components/tooltip/style.css';
 ;
-const K = {
+const Q = {
   key: 0,
   class: "das-tooltip-virtual-placeholder"
-}, Q = ["innerHTML"], U = { key: 1 }, Z = /* @__PURE__ */ L({
+}, U = ["innerHTML"], Z = { key: 1 }, _ = /* @__PURE__ */ L({
   __name: "index",
   props: {
     selfPopperClass: { default: "" },
@@ -25,64 +25,64 @@ const K = {
     isMaxheight: { type: Boolean, default: !0 }
   },
   emits: ["show", "hide"],
-  setup(r, { expose: c, emit: a }) {
-    _((e) => ({
-      "65704ba4": E.value
+  setup(t, { expose: f, emit: r }) {
+    z((e) => ({
+      v65704ba4: E.value
     }));
-    const n = r, d = a, l = z(), V = p(() => {
-      const e = "virtual-triggering" in l || "virtualTriggering" in l || l["virtual-triggering"] !== void 0 || l.virtualTriggering !== void 0, t = "virtual-ref" in l || "virtualRef" in l || l["virtual-ref"] !== void 0 || l.virtualRef !== void 0;
-      return e || t;
-    }), w = v(), y = v(!1), E = p(() => Number(n.row)), H = p(() => n.disabled ?? (n.text ? !y.value : !1)), C = p(() => n.content || n.text), S = (e) => {
-      y.value = e.target.scrollHeight > e.target.clientHeight;
+    const l = t, d = r, i = D(), V = c(() => {
+      const e = "virtual-triggering" in i || "virtualTriggering" in i || i["virtual-triggering"] !== void 0 || i.virtualTriggering !== void 0, o = "virtual-ref" in i || "virtualRef" in i || i["virtual-ref"] !== void 0 || i.virtualRef !== void 0;
+      return e || o;
+    }), x = v(), w = v(!1), E = c(() => Number(l.row)), H = c(() => l.disabled ?? (l.text ? !w.value : !1)), y = c(() => l.content || l.text), S = (e) => {
+      w.value = e.target.scrollHeight > e.target.clientHeight;
     }, N = (e) => {
-      d("show", e), window.addEventListener("wheel", f);
-    }, k = (e) => {
-      d("hide", e), window.removeEventListener("wheel", f);
-    }, f = (e) => {
-      const t = document.querySelector('[id^="el-popper-container"]');
-      if (!t) return;
-      const o = t.querySelector(".das-ui-tooltip-popper");
+      d("show", e), window.addEventListener("wheel", p);
+    }, C = (e) => {
+      d("hide", e), window.removeEventListener("wheel", p);
+    }, p = (e) => {
+      const o = document.querySelector('[id^="el-popper-container"]');
       if (!o) return;
-      const x = e.clientX, T = e.clientY, u = o == null ? void 0 : o.getBoundingClientRect();
-      o && x >= u.left && x <= u.right && T >= u.top && T <= u.bottom || (o.style.display = "none", o.style.opacity = "0", X(() => {
-        k();
+      const n = o.querySelector(".das-ui-tooltip-popper");
+      if (!n) return;
+      const k = e.clientX, T = e.clientY, u = n == null ? void 0 : n.getBoundingClientRect();
+      n && k >= u.left && k <= u.right && T >= u.top && T <= u.bottom || (n.style.display = "none", n.style.opacity = "0", Y(() => {
+        C();
       }));
     };
-    return D(() => {
-    }), P(() => {
-      window.removeEventListener("wheel", f);
-    }), c({
-      $tooltipRef: w
-    }), (e, t) => (s(), I(b(J), O({
+    return P(() => {
+    }), I(() => {
+      window.removeEventListener("wheel", p);
+    }), f({
+      $tooltipRef: x
+    }), (e, o) => (s(), O(b(K), W({
       ref_key: "$tooltipRef",
-      ref: w,
+      ref: x,
       class: "das-ui-tooltip",
       disabled: H.value,
-      effect: e.effect,
-      placement: e.placement,
-      "popper-class": `das-ui-tooltip-popper ${e.isMaxheight ? "max-height" : ""} ${e.selfPopperClass}`,
+      effect: t.effect,
+      placement: t.placement,
+      "popper-class": `das-ui-tooltip-popper ${t.isMaxheight ? "max-height" : ""} ${t.selfPopperClass}`,
       "hide-after": 100,
       "show-after": 100
     }, e.$attrs, {
       onShow: N,
-      onHide: k
+      onHide: C
     }), {
       content: m(() => [
-        W(b(G), null, {
+        q(b(J), null, {
           default: m(() => [
             M(
               "div",
               {
-                class: $({ "max-height": e.isMaxheight, "das-popper-content": !0 })
+                class: $({ "max-height": t.isMaxheight, "das-popper-content": !0 })
               },
               [
                 R(e.$slots, "content", {}, void 0, !0),
-                C.value && !e.$slots.content ? (s(), i(
+                y.value && !e.$slots.content ? (s(), a(
                   h,
                   { key: 0 },
                   [
-                    q(
-                      B(C.value),
+                    F(
+                      B(y.value),
                       1
                       /* TEXT */
                     )
@@ -100,40 +100,40 @@ const K = {
         })
       ]),
       default: m(() => [
-        V.value ? (s(), i("span", K, " ")) : (s(), i(
+        V.value ? (s(), a("span", Q, " ")) : (s(), a(
           h,
           { key: 1 },
           [
             g(" 默认 slot 内容 "),
             R(e.$slots, "default", {}, () => [
-              e.text ? (s(), i(
+              t.text ? (s(), a(
                 "div",
                 {
                   key: 0,
-                  onMouseenter: t[0] || (t[0] = (o) => S(o)),
-                  class: $(`das-tooltip-text-wrap ${e.customClass}`),
-                  style: F({ width: n.textWidth })
+                  onMouseenter: o[0] || (o[0] = (n) => S(n)),
+                  class: $(`das-tooltip-text-wrap ${t.customClass}`),
+                  style: X({ width: l.textWidth })
                 },
                 [
-                  e.textHtml ? (s(), i("div", {
+                  t.textHtml ? (s(), a("div", {
                     key: 0,
-                    innerHTML: e.text
-                  }, null, 8, Q)) : (s(), i(
+                    innerHTML: t.text
+                  }, null, 8, U)) : (s(), a(
                     "div",
-                    U,
-                    B(e.text),
+                    Z,
+                    B(t.text),
                     1
                     /* TEXT */
                   ))
                 ],
                 38
                 /* CLASS, STYLE, NEED_HYDRATION */
-              )) : (s(), i(
+              )) : (s(), a(
                 h,
                 { key: 1 },
                 [
                   g(" 当没有 text 且没有 slot 内容时，提供一个占位元素避免 ElOnlyChild 错误 "),
-                  t[1] || (t[1] = M(
+                  o[1] || (o[1] = M(
                     "span",
                     { class: "das-tooltip-virtual-placeholder" },
                     " ",
@@ -154,16 +154,16 @@ const K = {
       /* FORWARDED */
     }, 16, ["disabled", "effect", "placement", "popper-class"]));
   }
-}), ee = (r, c) => {
-  const a = r.__vccOpts || r;
-  for (const [n, d] of c)
-    a[n] = d;
-  return a;
-}, te = /* @__PURE__ */ ee(Z, [["__scopeId", "data-v-e1652f58"]]), oe = { 文字提示: { "zh-CN": "文字提示", en: "Text Prompt", "zh-MO": "文字提示", _appCode: "framework" } };
-Y(oe);
-const de = () => v(null), ue = j(te), pe = { name: `Tooltip ${A("文字提示")}` };
+}), ee = (t, f) => {
+  const r = t.__vccOpts || t;
+  for (const [l, d] of f)
+    r[l] = d;
+  return r;
+}, te = /* @__PURE__ */ ee(_, [["__scopeId", "data-v-e1652f58"]]), oe = { 文字提示: { "zh-CN": "文字提示", en: "Text Prompt", "zh-MO": "文字提示", _appCode: "framework" } };
+A(oe);
+const de = () => v(null), ue = G(te), ce = { name: `Tooltip ${j("文字提示")}` };
 export {
   ue as DasTooltip,
   de as DasTooltipRef,
-  pe as default
+  ce as default
 };

package/packages/components/tooltip/style.css

@@ -1 +1 @@
-.das-ui-tooltip-popper.el-popper{max-width:360px;box-shadow:0 4px 10px 0 var(--upf-text-tooltip-shadow-color, rgba(38, 38, 38, .16));border:1px solid var(--upf-text-tooltip-border, var(--upf-border-color, #d9d9d9));font-size:var(--das-ui-font-size-sm);padding:0;border-radius:var(--upf-border-radius, 4px)}.das-ui-tooltip-popper.el-popper .el-popper__arrow{width:10px;height:10px}.das-ui-tooltip-popper.el-popper[data-popper-placement^=top]>.el-popper__arrow{bottom:-5px!important}.das-ui-tooltip-popper.el-popper[data-popper-placement^=bottom]>.el-popper__arrow{top:-5px!important}.das-ui-tooltip-popper.el-popper[data-popper-placement^=left]>.el-popper__arrow{right:-5px!important}.das-ui-tooltip-popper.el-popper[data-popper-placement^=right]>.el-popper__arrow{left:-5px!important}.das-ui-tooltip-popper.el-popper .das-popper-content{padding:7px 12px}.das-ui-tooltip-popper.el-popper .max-height{max-height:298px}.das-ui-tooltip-popper.el-popper.is-light{color:var(--upf-text-tooltip-text, var(--upf-text-primary, #212121));background-color:var(--upf-text-tooltip-bg, var(--upf-bg-elevated, #ffffff))}.das-ui-tooltip-popper.el-popper.is-light:after{position:absolute;z-index:-1;top:0;right:0;bottom:0;left:0;content:"";background:var(--upf-text-tooltip-bg, var(--upf-bg-elevated, #ffffff));border-radius:inherit}.das-ui-tooltip-popper.el-popper.is-light .el-popper__arrow:before{height:10px;width:10px;background-color:var(--upf-text-tooltip-bg, var(--upf-bg-elevated, #ffffff));border-color:var(--upf-text-tooltip-border, var(--upf-border-color, #d9d9d9));border-radius:0!important}.das-ui-tooltip-popper.el-popper.is-light[data-popper-placement^=top] .el-popper__arrow:before{box-shadow:2px 2px 5px var(--upf-text-tooltip-shadow-color, rgba(38, 38, 38, .16))}.das-ui-tooltip-popper.el-popper.is-light[data-popper-placement^=bottom] .el-popper__arrow:before{box-shadow:-2px -2px 5px var(--upf-text-tooltip-shadow-color, rgba(38, 38, 38, .16))}.das-ui-tooltip-popper.el-popper.is-light[data-popper-placement^=left] .el-popper__arrow:before{box-shadow:3px 0 6px var(--upf-text-tooltip-shadow-color, rgba(38, 38, 38, .16)),0 -2px 6px var(--upf-text-tooltip-shadow-color, rgba(38, 38, 38, .16))}.das-ui-tooltip-popper.el-popper.is-light[data-popper-placement^=right] .el-popper__arrow:before{box-shadow:0 3px 6px var(--upf-text-tooltip-shadow-color, rgba(38, 38, 38, .16)),-2px 0 6px var(--upf-text-tooltip-shadow-color, rgba(38, 38, 38, .16))}.das-tooltip-text-wrap[data-v-e1652f58]{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;line-clamp:var(--65704ba4);-webkit-line-clamp:var(--65704ba4)}.das-tooltip-virtual-placeholder[data-v-e1652f58]{position:absolute;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none}
+.das-ui-tooltip-popper.el-popper{max-width:360px;box-shadow:0 4px 10px 0 var(--upf-text-tooltip-shadow-color, rgba(38, 38, 38, .16));border:1px solid var(--upf-text-tooltip-border, var(--upf-border-color, #d9d9d9));font-size:var(--das-ui-font-size-sm);padding:0;border-radius:var(--upf-border-radius, 4px)}.das-ui-tooltip-popper.el-popper .el-popper__arrow{width:10px;height:10px}.das-ui-tooltip-popper.el-popper[data-popper-placement^=top]>.el-popper__arrow{bottom:-5px!important}.das-ui-tooltip-popper.el-popper[data-popper-placement^=bottom]>.el-popper__arrow{top:-5px!important}.das-ui-tooltip-popper.el-popper[data-popper-placement^=left]>.el-popper__arrow{right:-5px!important}.das-ui-tooltip-popper.el-popper[data-popper-placement^=right]>.el-popper__arrow{left:-5px!important}.das-ui-tooltip-popper.el-popper .das-popper-content{padding:7px 12px}.das-ui-tooltip-popper.el-popper .max-height{max-height:298px}.das-ui-tooltip-popper.el-popper.is-light{color:var(--upf-text-tooltip-text, var(--upf-text-primary, #212121));background-color:var(--upf-text-tooltip-bg, var(--upf-bg-elevated, #ffffff))}.das-ui-tooltip-popper.el-popper.is-light:after{position:absolute;z-index:-1;top:0;right:0;bottom:0;left:0;content:"";background:var(--upf-text-tooltip-bg, var(--upf-bg-elevated, #ffffff));border-radius:inherit}.das-ui-tooltip-popper.el-popper.is-light .el-popper__arrow:before{height:10px;width:10px;background-color:var(--upf-text-tooltip-bg, var(--upf-bg-elevated, #ffffff));border-color:var(--upf-text-tooltip-border, var(--upf-border-color, #d9d9d9));border-radius:0!important}.das-ui-tooltip-popper.el-popper.is-light[data-popper-placement^=top] .el-popper__arrow:before{box-shadow:2px 2px 5px var(--upf-text-tooltip-shadow-color, rgba(38, 38, 38, .16))}.das-ui-tooltip-popper.el-popper.is-light[data-popper-placement^=bottom] .el-popper__arrow:before{box-shadow:-2px -2px 5px var(--upf-text-tooltip-shadow-color, rgba(38, 38, 38, .16))}.das-ui-tooltip-popper.el-popper.is-light[data-popper-placement^=left] .el-popper__arrow:before{box-shadow:3px 0 6px var(--upf-text-tooltip-shadow-color, rgba(38, 38, 38, .16)),0 -2px 6px var(--upf-text-tooltip-shadow-color, rgba(38, 38, 38, .16))}.das-ui-tooltip-popper.el-popper.is-light[data-popper-placement^=right] .el-popper__arrow:before{box-shadow:0 3px 6px var(--upf-text-tooltip-shadow-color, rgba(38, 38, 38, .16)),-2px 0 6px var(--upf-text-tooltip-shadow-color, rgba(38, 38, 38, .16))}.das-tooltip-text-wrap[data-v-e1652f58]{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;line-clamp:var(--v65704ba4);-webkit-line-clamp:var(--v65704ba4)}.das-tooltip-virtual-placeholder[data-v-e1652f58]{position:absolute;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none}