@das-fed/ui 6.4.0-hot.25 → 6.4.0-hot.27

package/packages/components/tabs/index.js

@@ -1,88 +1,100 @@
 import '@das-fed/ui/packages/components/tabs/style.css';
-import { withInstall as Q } from "@das-fed/utils/with-install/index";
-import { setThemeRule as X } from "@das-fed/web/packages/theme/index";
-import { ref as S, computed as i, onMounted as Y, defineComponent as Z, useCssVars as ee, unref as s, openBlock as d, createBlock as B, mergeProps as V, createSlots as K, withCtx as b, renderSlot as p, createCommentVNode as u, createElementBlock as c, Fragment as k, renderList as N, normalizeStyle as te, withDirectives as L, createTextVNode as O, toDisplayString as $, createVNode as oe, createElementVNode as ae, normalizeClass as re } from "vue";
-import { DasIcon as se } from "@das-fed/ui/packages/components/icon/index";
+import { withInstall as J } from "@das-fed/utils/with-install/index";
+import { setThemeRule as Q } from "@das-fed/web/packages/theme/index";
+import { ref as w, computed as u, onMounted as X, defineComponent as Y, openBlock as i, createBlock as B, unref as r, mergeProps as j, createSlots as V, withCtx as b, renderSlot as y, createCommentVNode as c, createElementBlock as f, Fragment as g, renderList as K, normalizeStyle as Z, withDirectives as L, createTextVNode as $, toDisplayString as D, createVNode as ee, createElementVNode as te, normalizeClass as ae } from "vue";
+import { DasIcon as oe } from "@das-fed/ui/packages/components/icon/index";
 import { vDasTooltip as I } from "@das-fed/ui/packages/components/text-tooltip/index";
-import { Tabs as le, TabPane as ne } from "ant-design-vue";
+import { Tabs as se, TabPane as le } from "ant-design-vue";
 import "ant-design-vue/es/tabs/style/css";
-import { ElPopover as ie } from "element-plus";
+import { ElPopover as re } from "element-plus";
 import "element-plus/es/components/popover/style/css";
-import { t as z } from "@das-fed/web/packages/i18n/index";
-const de = (o) => /^[+-]?\d+(\.\d+)?(px|em|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc|%)$/.test(o), R = (o) => {
-  if (o)
-    return typeof o == "string" && de(o) ? o : o + "px";
-}, ue = (o, y) => {
-  const e = S({}), m = S([
+import { t as R } from "@das-fed/web/packages/i18n/index";
+const ne = (a) => /^[+-]?\d+(\.\d+)?(px|em|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc|%)$/.test(a), z = (a) => {
+  if (a)
+    return typeof a == "string" && ne(a) ? a : a + "px";
+}, ie = (a, m) => {
+  const e = w({}), p = w([
     {
       key: "all",
-      name: z("关闭全部页签"),
+      name: R("关闭全部页签"),
       disabled: !1,
       hidden: !1
     },
     {
       key: "other",
-      name: z("关闭其他页签"),
+      name: R("关闭其他页签"),
       disabled: !1,
-      hidden: (a, l) => a.length === 1
+      hidden: (o, l) => o.length === 1
     },
     {
       key: "right",
-      name: z("关闭右侧页签"),
+      name: R("关闭右侧页签"),
       disabled: !1,
-      hidden: (a, l) => a.findIndex((E) => {
-        var x, w;
-        return E[(x = o.defualtProps) == null ? void 0 : x.key] === l[(w = o.defualtProps) == null ? void 0 : w.key];
-      }) === a.length - 1
+      hidden: (o, l) => o.findIndex((k) => {
+        var E, x;
+        return k[(E = a.defualtProps) == null ? void 0 : E.key] === l[(x = a.defualtProps) == null ? void 0 : x.key];
+      }) === o.length - 1
     }
-  ]), g = i(() => o.constomMenuList && o.constomMenuList.length ? o.constomMenuList : m.value), C = i(() => {
-    let a;
-    return o.width && (a = R(o.width)), a;
-  }), F = i(() => {
-    let a = o.type === "lattice" ? "65px" : void 0;
-    return o.tabWidth && (a = R(o.tabWidth)), a;
-  }), A = i(() => {
-    let a;
-    return o.tabMaxWidth && (a = R(o.tabMaxWidth)), a;
-  }), T = S(!1), v = S(), D = (a) => {
+  ]), F = u(() => a.constomMenuList && a.constomMenuList.length ? a.constomMenuList : p.value), C = u(() => {
+    let o;
+    return a.width && (o = z(a.width)), o;
+  }), T = u(() => {
+    let o = a.type === "lattice" ? "65px" : void 0;
+    return a.tabWidth && (o = z(a.tabWidth)), o;
+  }), S = u(() => {
+    let o;
+    return a.tabMaxWidth && (o = z(a.tabMaxWidth)), o;
+  }), A = w(!1), v = w(), M = (o) => {
     Object.keys(e.value).forEach((l) => {
-      (T.value || l != a) && (e.value[l] = !1);
+      (A.value || l != o) && (e.value[l] = !1);
     });
-  }, h = (a) => {
-    const l = a.target.parentElement;
-    T.value = !l.classList.contains("ant-tabs-tab-btn");
-  }, M = (a, l) => {
+  }, h = (o) => {
+    const l = o.target.parentElement;
+    A.value = !l.classList.contains("ant-tabs-tab-btn");
+  }, O = (o, l) => {
     var P;
-    y("menuClick", a, l), (P = v.value) != null && P.length && v.value.forEach((E) => {
-      E.hide();
+    m("menuClick", o, l), (P = v.value) != null && P.length && v.value.forEach((k) => {
+      k.hide();
     });
   };
-  return Y(() => {
-    o.contextmenu && o.options.forEach((a) => {
+  return X(() => {
+    a.contextmenu && a.options.forEach((o) => {
       var l;
-      (l = o.defualtProps) != null && l.key && (e.value[a[o.defualtProps.key]] = !1);
+      (l = a.defualtProps) != null && l.key && (e.value[o[a.defualtProps.key]] = !1);
     });
   }), {
     realWidth: C,
-    realMenuList: g,
-    realTabWidth: F,
-    realTabMaxWidth: A,
+    realMenuList: F,
+    realTabWidth: T,
+    realTabMaxWidth: S,
     tabsMenuPoppver: v,
     poppverVisible: e,
-    menuClick: M,
-    beforeEnter: D,
+    menuClick: O,
+    beforeEnter: M,
     onContextmenu: h
   };
-}, ce = {
+}, N = {
+  "--das-ui-tabs-color": {
+    kjl: "#666666",
+    ssl: "#999999",
+    cjb: "#666666"
+  },
+  "--das-ui-tabs-bg-color": {
+    kjl: "#FAFAFA",
+    ssl: "#161834",
+    cjb: "#FAFAFA"
+  }
+}, de = {
   key: 1,
   class: "das-tab-label"
-}, fe = { class: "das-tabs-contextmenu-list" }, be = ["onClick"], ve = {
+}, ue = { class: "das-tabs-contextmenu-list" }, ce = ["onClick"], fe = {
   key: 1,
   style: { position: "relative", top: "-5px", "font-size": "18px" }
-}, pe = "#666666", ye = "#D9D9D9", me = /* @__PURE__ */ Z({
+}, be = "#666666", ve = "#D9D9D9", ye = /* @__PURE__ */ Y({
   inheritAttrs: !1,
   __name: "Tabs",
   props: {
+    theme: { default: "default" },
     activeKey: {},
     type: { default: "line" },
     isStrict: { type: Boolean, default: !1 },
@@ -108,117 +120,125 @@ const de = (o) => /^[+-]?\d+(\.\d+)?(px|em|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc|%)
     hideOverflow: { type: Boolean }
   },
   emits: ["update:activeKey", "tabClick", "menuClick"],
-  setup(o, { emit: y }) {
-    ee((t) => ({
-      "8fa71bbc": s(x),
-      "327b3634": s(w),
-      "0280db4d": J.value
-    }));
-    const e = o, m = S(), g = (t) => {
-      var f;
-      v("tabClick", t), (f = m.value) == null || f.$el.click();
-    }, C = i({
+  setup(a, { emit: m }) {
+    const e = a, p = w(), F = (t) => {
+      var d;
+      v("tabClick", t), (d = p.value) == null || d.$el.click();
+    }, C = u({
       get: () => e.activeKey ?? "",
       set: (t) => v("update:activeKey", t)
-    }), F = i(() => e.options.filter((f) => !f.hidden)), A = (t) => e.isStrict ? !!(t.contentSlot && t[e.defualtProps.key] === C.value) : !!t.contentSlot, T = i(() => e.moreIconType ? e.moreIconType : e.type === "lattice" ? "default" : "arrow"), v = y, D = i(() => e.type === "lattice" ? "line" : e.type), h = i(() => {
+    }), T = u(() => e.options.filter((d) => !d.hidden)), S = (t) => e.isStrict ? !!(t.contentSlot && t[e.defualtProps.key] === C.value) : !!t.contentSlot, A = u(() => e.moreIconType ? e.moreIconType : e.type === "lattice" ? "default" : "arrow"), v = m, M = u(() => e.type === "lattice" ? "line" : e.type), h = u(() => {
       if (e.type === "card")
         return e.size ? e.size : "large";
       if (e.type === "line")
         return e.size ? e.size : "medium";
       if (e.type === "editable-card")
         return e.size ? e.size : "small";
-    }), M = e.type === "editable-card" ? "#FAFAFA" : "#FFFFFF", a = i(() => e.fontColor ? e.fontColor : pe), l = i(() => e.backgroudColor ? e.backgroudColor : M), P = i(() => e.borderColor ? e.borderColor : ye), E = i(() => ({
-      ...e.tabsStyle,
-      "--das-ui-tabs-custom-color": a.value,
-      "--das-ui-tabs-custom-bg-color": l.value,
-      "--das-ui-tabs-custom-border-color": P.value
-    })), {
-      realTabWidth: x,
-      realTabMaxWidth: w,
-      realWidth: _,
-      menuClick: j,
-      tabsMenuPoppver: G,
-      realMenuList: q,
-      poppverVisible: W,
-      beforeEnter: H,
-      onContextmenu: U
-    } = ue(e, v), J = i(() => {
+    }), O = e.type === "editable-card" ? "#FAFAFA" : "#FFFFFF", o = u(() => {
+      let t = {};
+      return e != null && e.fontColor && (t["--das-ui-tabs-color"] = e.fontColor), e != null && e.backgroudColor && (t["--das-ui-tabs-bg-color"] = e.backgroudColor), e != null && e.borderColor && (t["--das-ui-tabs-border-color"] = e.borderColor), t;
+    }), l = u(() => {
       if (e.tabPadding) return e.tabPadding;
-      if (x.value || w.value) return "0";
+      if (k.value || E.value) return "0";
       if (e.type === "line") return "0 20px";
       if (e.type === "card") {
         if (h.value === "large") return "0 40px";
         if (h.value === "medium" || h.value === "small") return "0 24px";
       }
       if (e.type === "lattice") return "0 20px";
-    });
-    return (t, f) => F.value && F.value.length ? (d(), B(s(le), V({
+    }), P = u(() => {
+      const t = {};
+      return e.theme !== "default" && Object.keys(N).forEach((d) => {
+        t[d] = N[d][e.theme];
+      }), {
+        ...e.tabsStyle,
+        "--das-ui-tabs-color": be,
+        "--das-ui-tabs-bg-color": O,
+        "--das-ui-tabs-border-color": ve,
+        "---das-ui-tabs-tab-width": k.value,
+        "---das-ui-tabs-tab-max-width": E.value,
+        "---das-ui-tabs-tab-padding": l.value,
+        ...t,
+        ...o.value
+      };
+    }), {
+      realTabWidth: k,
+      realTabMaxWidth: E,
+      realWidth: x,
+      menuClick: _,
+      tabsMenuPoppver: G,
+      realMenuList: q,
+      poppverVisible: W,
+      beforeEnter: H,
+      onContextmenu: U
+    } = ie(e, v);
+    return (t, d) => T.value && T.value.length ? (i(), B(r(se), j({
       key: 0,
       ref_key: "tabsContainerRef",
-      ref: m,
+      ref: p,
       class: ["das-tabs", t.type, h.value, t.hideOverflow ? "hide-overflow" : ""],
-      style: E.value,
-      type: D.value,
+      style: P.value,
+      type: M.value,
       hideAdd: t.hideAdd,
       activeKey: C.value,
-      "onUpdate:activeKey": f[1] || (f[1] = (r) => C.value = r)
-    }, t.$attrs, { onTabClick: g }), K({
+      "onUpdate:activeKey": d[1] || (d[1] = (s) => C.value = s)
+    }, t.$attrs, { onTabClick: F }), V({
       moreIcon: b(() => [
-        p(t.$slots, "moreIcon", {}, () => [
-          T.value === "arrow" ? (d(), B(s(se), {
+        y(t.$slots, "moreIcon", {}, () => [
+          A.value === "arrow" ? (i(), B(r(oe), {
             key: 0,
             icon: "fold",
             size: "small",
             "icon-color": "rgb(102, 102, 102)"
-          })) : u("v-if", !0),
-          T.value === "default" ? (d(), c("div", ve, "...")) : u("v-if", !0)
+          })) : c("v-if", !0),
+          A.value === "default" ? (i(), f("div", fe, "...")) : c("v-if", !0)
         ], !0)
       ]),
       default: b(() => [
-        (d(!0), c(
-          k,
+        (i(!0), f(
+          g,
           null,
-          N(F.value, (r) => (d(), B(s(ne), {
-            style: te({ width: s(_) }),
-            key: r[t.defualtProps.key],
+          K(T.value, (s) => (i(), B(r(le), {
+            style: Z({ width: r(x) }),
+            key: s[t.defualtProps.key],
             tab: void 0,
-            disabled: r.disabled,
-            forceRender: r.forceRender
-          }, K({
+            disabled: s.disabled,
+            forceRender: s.forceRender
+          }, V({
             tab: b(() => [
-              u(" 无右键菜单 "),
-              t.contextmenu ? (d(), c(
-                k,
+              c(" 无右键菜单 "),
+              t.contextmenu ? (i(), f(
+                g,
                 { key: 1 },
                 [
-                  u(" 有右键菜单 "),
-                  oe(s(ie), V({
+                  c(" 有右键菜单 "),
+                  ee(r(re), j({
                     ref_for: !0,
                     ref_key: "tabsMenuPoppver",
                     ref: G,
-                    visible: s(W)[r[t.defualtProps.key]],
-                    "onUpdate:visible": (n) => s(W)[r[t.defualtProps.key]] = n,
+                    visible: r(W)[s[t.defualtProps.key]],
+                    "onUpdate:visible": (n) => r(W)[s[t.defualtProps.key]] = n,
                     "popper-class": "das-tabs-contextmenu",
                     "show-arrow": !1,
                     placement: "bottom-start",
                     trigger: "contextmenu",
                     width: 106
                   }, t.menuPoppverAttrs, {
-                    onBeforeEnter: (n) => s(H)(r[t.defualtProps.key])
+                    onBeforeEnter: (n) => r(H)(s[t.defualtProps.key])
                   }), {
                     reference: b(() => [
-                      u(" @slot  自定义选项卡头显示文字"),
-                      r.tabSlot ? p(t.$slots, r.tabSlot, { key: 0 }, void 0, !0) : L((d(), c(
+                      c(" @slot  自定义选项卡头显示文字"),
+                      s.tabSlot ? y(t.$slots, s.tabSlot, { key: 0 }, void 0, !0) : L((i(), f(
                         "div",
                         {
                           key: 1,
                           class: "das-tab-label",
-                          onContextmenu: f[0] || (f[0] = //@ts-ignore
-                          (...n) => s(U) && s(U)(...n))
+                          onContextmenu: d[0] || (d[0] = //@ts-ignore
+                          (...n) => r(U) && r(U)(...n))
                         },
                         [
-                          O(
-                            $(r[t.defualtProps.tab]),
+                          $(
+                            D(s[t.defualtProps.tab]),
                             1
                             /* TEXT */
                           )
@@ -226,34 +246,34 @@ const de = (o) => /^[+-]?\d+(\.\d+)?(px|em|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc|%)
                         32
                         /* NEED_HYDRATION */
                       )), [
-                        [s(I)]
+                        [r(I)]
                       ])
                     ]),
                     default: b(() => [
-                      ae("ul", fe, [
-                        (d(!0), c(
-                          k,
+                      te("ul", ue, [
+                        (i(!0), f(
+                          g,
                           null,
-                          N(s(q), (n) => (d(), c(
-                            k,
+                          K(r(q), (n) => (i(), f(
+                            g,
                             null,
                             [
-                              (typeof n.hidden == "function" ? !n.hidden(t.options, r) : !n.hidden) ? L((d(), c("li", {
+                              (typeof n.hidden == "function" ? !n.hidden(t.options, s) : !n.hidden) ? L((i(), f("li", {
                                 key: n.key,
-                                class: re([
+                                class: ae([
                                   "das-tabs-contextmenu-item",
-                                  (typeof n.disabled == "function" ? n.disabled(t.options, r) : n.disabled) ? "is-disabled" : ""
+                                  (typeof n.disabled == "function" ? n.disabled(t.options, s) : n.disabled) ? "is-disabled" : ""
                                 ]),
-                                onClick: (Ce) => s(j)(n, r)
+                                onClick: (ke) => r(_)(n, s)
                               }, [
-                                O(
-                                  $(n.name),
+                                $(
+                                  D(n.name),
                                   1
                                   /* TEXT */
                                 )
-                              ], 10, be)), [
-                                [s(I)]
-                              ]) : u("v-if", !0)
+                              ], 10, ce)), [
+                                [r(I)]
+                              ]) : c("v-if", !0)
                             ],
                             64
                             /* STABLE_FRAGMENT */
@@ -269,19 +289,19 @@ const de = (o) => /^[+-]?\d+(\.\d+)?(px|em|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc|%)
                 ],
                 2112
                 /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
-              )) : (d(), c(
-                k,
+              )) : (i(), f(
+                g,
                 { key: 0 },
                 [
-                  u(" @slot  自定义选项卡头显示文字"),
-                  r.tabSlot ? p(t.$slots, r.tabSlot, { key: 0 }, void 0, !0) : L((d(), c("div", ce, [
-                    O(
-                      $(r[t.defualtProps.tab]),
+                  c(" @slot  自定义选项卡头显示文字"),
+                  s.tabSlot ? y(t.$slots, s.tabSlot, { key: 0 }, void 0, !0) : L((i(), f("div", de, [
+                    $(
+                      D(s[t.defualtProps.tab]),
                       1
                       /* TEXT */
                     )
                   ])), [
-                    [s(I)]
+                    [r(I)]
                   ])
                 ],
                 64
@@ -289,24 +309,24 @@ const de = (o) => /^[+-]?\d+(\.\d+)?(px|em|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc|%)
               ))
             ]),
             default: b(() => [
-              A(r) ? (d(), c(
-                k,
+              S(s) ? (i(), f(
+                g,
                 { key: 0 },
                 [
-                  u(" @slot  自定义显示内容"),
-                  p(t.$slots, r.contentSlot, {}, void 0, !0)
+                  c(" @slot  自定义显示内容"),
+                  y(t.$slots, s.contentSlot, {}, void 0, !0)
                 ],
                 64
                 /* STABLE_FRAGMENT */
-              )) : u("v-if", !0)
+              )) : c("v-if", !0)
             ]),
             _: 2
             /* DYNAMIC */
           }, [
-            r.closeIconSlot ? {
+            s.closeIconSlot ? {
               name: "closeIcon",
               fn: b(() => [
-                p(t.$slots, r.closeIconSlot, {}, void 0, !0)
+                y(t.$slots, s.closeIconSlot, {}, void 0, !0)
               ]),
               key: "0"
             } : void 0
@@ -321,27 +341,26 @@ const de = (o) => /^[+-]?\d+(\.\d+)?(px|em|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc|%)
       t.$slots.leftExtra ? {
         name: "leftExtra",
         fn: b(() => [
-          u(" @slot tabbar 上左侧额外的元素 "),
-          p(t.$slots, "leftExtra", {}, void 0, !0)
+          c(" @slot tabbar 上左侧额外的元素 "),
+          y(t.$slots, "leftExtra", {}, void 0, !0)
         ]),
         key: "0"
       } : void 0,
       t.$slots.rightExtra ? {
         name: "rightExtra",
         fn: b(() => [
-          p(t.$slots, "rightExtra", {}, void 0, !0)
+          y(t.$slots, "rightExtra", {}, void 0, !0)
         ]),
         key: "1"
       } : void 0
-    ]), 1040, ["class", "style", "type", "hideAdd", "activeKey"])) : u("v-if", !0);
+    ]), 1040, ["class", "style", "type", "hideAdd", "activeKey"])) : c("v-if", !0);
   }
-}), he = (o, y) => {
-  const e = o.__vccOpts || o;
-  for (const [m, g] of y)
-    e[m] = g;
+}), me = (a, m) => {
+  const e = a.__vccOpts || a;
+  for (const [p, F] of m)
+    e[p] = F;
   return e;
-}, ke = /* @__PURE__ */ he(me, [["__scopeId", "data-v-2eec86e3"]]), ge = {
-  "--das-ui-tabs-color": "#666666",
+}, pe = /* @__PURE__ */ me(ye, [["__scopeId", "data-v-1b6336e0"]]), he = {
   "--das-ui-tabs-active-color": "#5582F3",
   "--das-ui-tabs-menu-color": "#212121",
   "--das-ui-tabs-menu-hover-bg-color": "#F5F5F5",
@@ -351,12 +370,11 @@ const de = (o) => /^[+-]?\d+(\.\d+)?(px|em|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc|%)
   "--das-ui-tabs-menu-disabled-bg--color": "#ffffff",
   "--das-ui-edit-tabs-bg-color": "#FAFAFA",
   "--das-ui-card-tabs-bg-color": "#F5F5F5",
-  "--das-ui-card-tabs-active-color": "#5582F3",
-  "--das-ui-tabs-border-color": "#D9D9D9"
+  "--das-ui-card-tabs-active-color": "#5582F3"
 };
-X(ge);
-const Be = Q(ke), Le = { name: "Tabs 页签" };
+Q(he);
+const Me = J(pe), Oe = { name: "Tabs 页签" };
 export {
-  Be as DasTabs,
-  Le as default
+  Me as DasTabs,
+  Oe as default
 };

package/packages/components/tabs/src/style-theme.d.ts

@@ -0,0 +1,13 @@
+declare const _default: {
+    '--das-ui-tabs-color': {
+        kjl: string;
+        ssl: string;
+        cjb: string;
+    };
+    '--das-ui-tabs-bg-color': {
+        kjl: string;
+        ssl: string;
+        cjb: string;
+    };
+};
+export default _default;