@unicom-cloud/ui 0.8.96 → 0.8.98

package/menu/Item.js

@@ -1,90 +1,90 @@
-import { jsxs as k, jsx as o, Fragment as D } from "react/jsx-runtime";
+import { jsxs as N, jsx as o, Fragment as D } from "react/jsx-runtime";
 import F from "../dist/scroll-into-view-if-needed/src/index.js";
 import { forwardRef as O, useContext as j, useRef as B, useEffect as K } from "react";
 import U from "../components/common/hooks/useIsFirstRender.js";
 import z from "../tooltip/index.js";
 import A from "@unicom-cloud/utils/class-name";
 import { Enter as H } from "@unicom-cloud/utils/constant/keyboardCode";
-import { omit as x } from "../components/common/utils/omit.js";
+import { omit as h } from "../components/common/utils/omit.js";
 import V from "./Indent.js";
 import W from "./context.js";
 import { PROPS_NEED_TO_BE_PASSED_IN_SUBMENU as q } from "./util.js";
-function G(T, p) {
+function G(b, c) {
   const {
-    _key: f,
-    children: i,
-    level: m,
+    _key: a,
+    children: s,
+    level: i,
     disabled: l,
-    className: _,
-    style: $,
-    wrapper: S = "div",
-    onClick: c,
-    renderItemInTooltip: u,
-    ...w
-  } = T, {
+    className: x,
+    style: E,
+    wrapper: T = "div",
+    onClick: _,
+    renderItemInTooltip: d,
+    ...$
+  } = b, {
     prefixCls: t,
-    mode: y,
-    collapse: a,
-    inDropdown: C,
-    levelIndent: R,
-    selectedKeys: I,
-    autoScrollIntoView: g,
-    scrollConfig: v,
-    tooltipProps: r,
-    onClickMenuItem: d
-  } = j(W), n = B(null), M = U(), N = y === "vertical" && m > 1, P = a && !C && m === 1, s = I && ~I.indexOf(f);
+    mode: p,
+    collapse: m,
+    inDropdown: M,
+    levelIndent: P,
+    selectedKeys: f,
+    autoScrollIntoView: u,
+    scrollConfig: S,
+    tooltipProps: y,
+    onClickMenuItem: w
+  } = j(W), r = B(null), R = U(), I = p === "vertical" && i > 1, v = m && !M && i === 1, n = f && ~f.indexOf(a);
   K(() => {
-    const e = s && g;
-    n.current && e && setTimeout(
+    const e = n && u;
+    r.current && e && setTimeout(
       () => {
-        n.current && F(n.current, {
+        r.current && F(r.current, {
           behavior: "smooth",
           block: "start",
           scrollMode: "if-needed",
           boundary: document.body,
-          ...v
+          ...S
         });
       },
-      M ? 500 : 0
+      R ? 500 : 0
     );
-  }, [s, g]);
-  const h = (e) => {
-    l || (d == null || d(f, e), c == null || c(e));
-  }, b = /* @__PURE__ */ k(
-    S,
+  }, [n, u]);
+  const k = (e) => {
+    l || (w?.(a, e), _?.(e));
+  }, g = /* @__PURE__ */ N(
+    T,
     {
       tabIndex: l ? -1 : 0,
       role: "menuitem",
       ref: (e) => {
-        p = e, n.current = p;
+        c = e, r.current = c;
       },
-      style: $,
+      style: E,
       className: A(
         `${t}-item`,
         {
           [`${t}-disabled`]: l,
-          [`${t}-selected`]: s,
+          [`${t}-selected`]: n,
           // 存在缩进dom
-          [`${t}-item-indented`]: N && !a
+          [`${t}-item-indented`]: I && !m
         },
-        _
+        x
       ),
-      onClick: h,
+      onClick: k,
       onKeyDown: (e) => {
-        e.key === H.key && h(e);
+        e.key === H.key && k(e);
       },
-      ...x(
-        w,
+      ...h(
+        $,
         ["key", "_key"].concat(q)
       ),
       children: [
-        N && !a ? /* @__PURE__ */ k(D, { children: [
+        I && !m ? /* @__PURE__ */ N(D, { children: [
           /* @__PURE__ */ o(
             V,
             {
               prefixCls: t,
-              levelIndent: R,
-              level: m
+              levelIndent: P,
+              level: i
             }
           ),
           /* @__PURE__ */ o(
@@ -94,32 +94,32 @@ function G(T, p) {
               style: {
                 display: "block"
               },
-              children: i
+              children: s
             }
           )
-        ] }) : i,
-        s && y === "horizontal" ? /* @__PURE__ */ o("div", { className: `${t}-selected-label` }) : null
+        ] }) : s,
+        n && p === "horizontal" ? /* @__PURE__ */ o("div", { className: `${t}-selected-label` }) : null
       ]
     }
   );
-  return P ? /* @__PURE__ */ o(
+  return v ? /* @__PURE__ */ o(
     z,
     {
       trigger: "hover",
       position: "right",
-      content: typeof u == "function" ? u() : /* @__PURE__ */ o("span", { children: i }),
+      content: typeof d == "function" ? d() : /* @__PURE__ */ o("span", { children: s }),
       triggerProps: {
         className: `${t}-item-tooltip`,
-        ...(r == null ? void 0 : r.triggerProps) || {}
+        ...y?.triggerProps || {}
       },
-      ...x(r, ["triggerProps"]),
-      children: b
+      ...h(y, ["triggerProps"]),
+      children: g
     }
-  ) : b;
+  ) : g;
 }
-const J = O(G), E = J;
-E.displayName = "MenuItem";
-E.menuType = "MenuItem";
+const J = O(G), C = J;
+C.displayName = "MenuItem";
+C.menuType = "MenuItem";
 export {
-  E as default
+  C as default
 };

package/menu/Menu.js

@@ -1,184 +1,182 @@
-import { jsx as c, jsxs as de, Fragment as fe } from "react/jsx-runtime";
-import Me from "@unicom-cloud/icons/IconUiMenuFold";
-import he from "@unicom-cloud/icons/IconUiMenuUnfold";
-import Ce from "lodash/isPlainObject";
-import { forwardRef as ve, useContext as y, useRef as U, useMemo as Ie, useEffect as xe } from "react";
+import { jsx as c, jsxs as me, Fragment as de } from "react/jsx-runtime";
+import fe from "@unicom-cloud/icons/IconUiMenuFold";
+import Ce from "@unicom-cloud/icons/IconUiMenuUnfold";
+import Me from "lodash/isPlainObject";
+import { forwardRef as he, useContext as I, useRef as $, useMemo as Ie, useEffect as xe } from "react";
 import "../config-provider/ConfigProvider.js";
-import be from "../components/common/hooks/useForceUpdate.js";
-import Ke from "../components/common/hooks/useId.js";
-import ye from "../components/common/hooks/useKeyboardEvent.js";
-import Se from "../components/common/hooks/useMergeProps.js";
-import S from "../components/common/hooks/useMergeValue.js";
-import { SiderContext as $e } from "../layout/Sider.js";
-import ge from "@unicom-cloud/utils/class-name";
-import { omit as Oe } from "../components/common/utils/omit.js";
-import _ from "./context.js";
-import Pe from "./Item.js";
-import Ee from "./ItemGroup.js";
-import we from "./OverflowWrap.js";
-import Ne from "./sub-menu/index.js";
-import { generateInfoMap as Be, processChildren as Ue } from "./util.js";
-import _e from "../config-provider/context.js";
-const Fe = "light", ze = {
+import ve from "../components/common/hooks/useForceUpdate.js";
+import be from "../components/common/hooks/useId.js";
+import ge from "../components/common/hooks/useKeyboardEvent.js";
+import Ke from "../components/common/hooks/useMergeProps.js";
+import x from "../components/common/hooks/useMergeValue.js";
+import { SiderContext as ye } from "../layout/Sider.js";
+import Se from "@unicom-cloud/utils/class-name";
+import { omit as Pe } from "../components/common/utils/omit.js";
+import O from "./context.js";
+import $e from "./Item.js";
+import Oe from "./ItemGroup.js";
+import Ee from "./OverflowWrap.js";
+import we from "./sub-menu/index.js";
+import { generateInfoMap as Ne, processChildren as Be } from "./util.js";
+import Ue from "../config-provider/context.js";
+const _e = "light", Fe = {
   mode: "vertical",
   selectable: !0,
   ellipsis: !0
 };
-function Te(F, z) {
-  const { getPrefixCls: f, componentConfig: M, rtl: T } = y(_e), V = Se(
-    F,
-    ze,
-    M == null ? void 0 : M.Menu
+function ze(E, w) {
+  const { getPrefixCls: N, componentConfig: B, rtl: U } = I(Ue), _ = Ke(
+    E,
+    Fe,
+    B?.Menu
   ), {
-    style: j,
-    children: h,
-    className: A,
-    prefixCls: D,
-    mode: l,
-    theme: G,
+    style: F,
+    children: f,
+    className: z,
+    prefixCls: T,
+    mode: r,
+    theme: V,
     icons: p,
-    levelIndent: H,
-    collapse: R,
+    levelIndent: j,
+    collapse: A,
     inDropdown: u,
-    selectable: L,
-    triggerProps: Q,
-    tooltipProps: W,
+    selectable: D,
+    triggerProps: G,
+    tooltipProps: H,
     ellipsis: C,
-    accordion: v,
-    autoOpen: q,
-    autoScrollIntoView: J,
-    scrollConfig: X,
-    hasCollapseButton: Y,
-    defaultOpenKeys: Z,
-    defaultSelectedKeys: k,
-    openKeys: ee,
-    selectedKeys: te,
-    onClickSubMenu: I,
-    onClickMenuItem: x,
-    onCollapseChange: b,
+    accordion: M,
+    autoOpen: R,
+    autoScrollIntoView: L,
+    scrollConfig: k,
+    hasCollapseButton: Q,
+    defaultOpenKeys: W,
+    defaultSelectedKeys: q,
+    openKeys: J,
+    selectedKeys: X,
+    onClickSubMenu: Y,
+    onClickMenuItem: Z,
+    onCollapseChange: ee,
     onEllipsisChange: oe,
-    ...$
-  } = V, [r, g] = S([], {
-    defaultValue: Z,
-    value: ee
-  }), [ne, re] = S([], {
-    defaultValue: k,
-    value: te
-  }), [m, se] = S(!1, {
-    value: R
-  }), le = y(_), { siderCollapsed: ie } = y($e), o = D || (f == null ? void 0 : f("menu")), d = ie || m || u || l === "popButton", O = G || le.theme || Fe, i = U([]), P = U([]), ce = be(), pe = ye(), E = Ie(() => Be(h), [h]), ae = Ke(`${o}-`), K = $.id || ae;
+    ...v
+  } = _, [l, b] = x([], {
+    defaultValue: W,
+    value: J
+  }), [te, ne] = x([], {
+    defaultValue: q,
+    value: X
+  }), [m, re] = x(!1, {
+    value: A
+  }), se = I(O), { siderCollapsed: le } = I(ye), t = T || N?.("menu"), d = le || m || u || r === "popButton", g = V || se.theme || _e, i = $([]), K = $([]), ie = ve(), ce = ge(), y = Ie(() => Ne(f), [f]), pe = be(`${t}-`), h = v.id || pe;
   xe(() => {
-    let e = r.filter(
-      (t) => i.current.indexOf(t) !== -1
+    let e = l.filter(
+      (o) => i.current.indexOf(o) !== -1
     );
-    if (q) {
-      const t = i.current.filter(
-        (n) => P.current.indexOf(n) === -1
+    if (R) {
+      const o = i.current.filter(
+        (s) => K.current.indexOf(s) === -1
       );
-      e = r.concat(t);
+      e = l.concat(o);
     }
-    g(v ? e.slice(0, 1) : e), P.current = i.current.slice();
+    b(M ? e.slice(0, 1) : e), K.current = i.current.slice();
   }, [i.current.toString()]);
-  const w = l !== "horizontal" && l !== "popButton" && !u && Y, ue = () => {
-    const e = Ue(h, { level: 1 }), t = m ? p && p.collapseActive || /* @__PURE__ */ c(he, {}) : p && p.collapseDefault || /* @__PURE__ */ c(Me, {}), n = () => {
-      const s = !m;
-      se(s), b == null || b(s);
+  const S = r !== "horizontal" && r !== "popButton" && !u && Q, ae = () => {
+    const e = Be(f, { level: 1 }), o = m ? p && p.collapseActive || /* @__PURE__ */ c(Ce, {}) : p && p.collapseDefault || /* @__PURE__ */ c(fe, {}), s = () => {
+      const n = !m;
+      re(n), ee?.(n);
     };
-    return /* @__PURE__ */ de(fe, { children: [
-      /* @__PURE__ */ c("div", { className: `${o}-inner`, children: l === "horizontal" && C !== !1 ? /* @__PURE__ */ c(
-        we,
+    return /* @__PURE__ */ me(de, { children: [
+      /* @__PURE__ */ c("div", { className: `${t}-inner`, children: r === "horizontal" && C !== !1 ? /* @__PURE__ */ c(
+        Ee,
         {
-          ellipsisText: Ce(C) ? C.text : "···",
+          ellipsisText: Me(C) ? C.text : "···",
           onEllipsisChange: oe,
           children: e
         }
       ) : e }),
-      w && /* @__PURE__ */ c(
+      S && /* @__PURE__ */ c(
         "div",
         {
           tabIndex: 0,
           role: "button",
-          "aria-controls": K,
+          "aria-controls": h,
           "aria-expanded": !m,
-          className: `${o}-collapse-button`,
-          onClick: n,
-          ...pe({ onPressEnter: n }),
-          children: t
+          className: `${t}-collapse-button`,
+          onClick: s,
+          ...ce({ onPressEnter: s }),
+          children: o
         }
       )
     ] });
-  }, N = { ...j };
-  return d && !u && delete N.width, /* @__PURE__ */ c(
+  }, P = { ...F };
+  return d && !u && delete P.width, /* @__PURE__ */ c(
     "div",
     {
-      id: w ? K : void 0,
+      id: S ? h : void 0,
       role: "menu",
-      ...Oe($, ["isMenu"]),
-      ref: z,
-      style: N,
-      className: ge(
-        o,
-        `${o}-${O}`,
-        `${o}-${l === "horizontal" ? "horizontal" : "vertical"}`,
+      ...Pe(v, ["isMenu"]),
+      ref: w,
+      style: P,
+      className: Se(
+        t,
+        `${t}-${g}`,
+        `${t}-${r === "horizontal" ? "horizontal" : "vertical"}`,
         {
-          [`${o}-collapse`]: d,
+          [`${t}-collapse`]: d,
           // 缩起状态自动变成 pop 模式
-          [`${o}-pop`]: l === "pop" || d,
-          [`${o}-pop-button`]: l === "popButton",
-          [`${o}-rtl`]: T
+          [`${t}-pop`]: r === "pop" || d,
+          [`${t}-pop-button`]: r === "popButton",
+          [`${t}-rtl`]: U
         },
-        A
+        z
       ),
       children: /* @__PURE__ */ c(
-        _.Provider,
+        O.Provider,
         {
           value: {
-            mode: l,
-            theme: O,
+            mode: r,
+            theme: g,
             collapse: d,
-            levelIndent: H,
+            levelIndent: j,
             inDropdown: u,
-            selectedKeys: ne,
-            openKeys: r,
+            selectedKeys: te,
+            openKeys: l,
             icons: p,
-            triggerProps: Q,
-            tooltipProps: W,
-            autoScrollIntoView: J,
-            scrollConfig: X,
+            triggerProps: G,
+            tooltipProps: H,
+            autoScrollIntoView: L,
+            scrollConfig: k,
             // pass props directly
-            id: K,
-            prefixCls: o,
-            collectInlineMenuKeys: (e, t) => {
-              t ? i.current = i.current.filter(
-                (n) => n !== e
-              ) : i.current.push(e), ce();
+            id: h,
+            prefixCls: t,
+            collectInlineMenuKeys: (e, o) => {
+              o ? i.current = i.current.filter(
+                (s) => s !== e
+              ) : i.current.push(e), ie();
             },
-            onClickMenuItem: (e, t) => {
-              var n;
-              L && re([e]), x == null || x(e, t, (n = E[e]) == null ? void 0 : n.keyPath);
+            onClickMenuItem: (e, o) => {
+              D && ne([e]), Z?.(e, o, y[e]?.keyPath);
             },
-            onClickSubMenu: (e, t, n) => {
-              var B;
-              let s = [...r];
-              n === "inline" && ((r == null ? void 0 : r.indexOf(e)) > -1 ? v && t === 1 ? s = [] : s = r.filter((me) => me !== e) : v && t === 1 ? s = [e] : s = r.concat([e])), g(s), I == null || I(e, s, (B = E[e]) == null ? void 0 : B.keyPath);
+            onClickSubMenu: (e, o, s) => {
+              let n = [...l];
+              s === "inline" && (l?.indexOf(e) > -1 ? M && o === 1 ? n = [] : n = l.filter((ue) => ue !== e) : M && o === 1 ? n = [e] : n = l.concat([e])), b(n), Y?.(e, n, y[e]?.keyPath);
             }
           },
-          children: ue()
+          children: ae()
         }
       )
     }
   );
 }
-const Ve = ve(Te), a = Ve;
+const Te = he(ze), a = Te;
 a.displayName = "Menu";
-a.Item = Pe;
-a.SubMenu = Ne;
-a.ItemGroup = Ee;
+a.Item = $e;
+a.SubMenu = we;
+a.ItemGroup = Oe;
 a.__PQB_MENU__ = !0;
 export {
-  Pe as MenuItem,
-  Ee as MenuItemGroup,
-  Ne as MenuSubMenu,
-  Ne as SubMenu,
+  $e as MenuItem,
+  Oe as MenuItemGroup,
+  we as MenuSubMenu,
+  we as SubMenu,
   a as default
 };

package/menu/OverflowWrap.js

@@ -1,89 +1,88 @@
-import { jsx as b } from "react/jsx-runtime";
-import p, { useContext as $, useRef as T, useState as k, useEffect as A } from "react";
+import { jsx as h } from "react/jsx-runtime";
+import a, { useContext as $, useRef as T, useState as k, useEffect as A } from "react";
 import H from "@unicom-cloud/utils/class-name";
-import { resizeObserverEffect as U } from "../components/common/utils/resizeObserverEffect.js";
-import { getStyle as x } from "../components/common/utils/style.js";
+import { resizeObserver as U } from "../components/common/utils/resizeObserver.js";
+import { getStyle as C } from "../components/common/utils/style.js";
 import j from "./context.js";
 import q from "./sub-menu/index.js";
 const z = 5;
-function C(o) {
+function S(o) {
   return o && Math.ceil(+o.getBoundingClientRect().width);
 }
-function O(o) {
-  const s = Number(o.replace("px", ""));
-  return isNaN(s) ? 0 : s;
+function g(o) {
+  const l = Number(o.replace("px", ""));
+  return isNaN(l) ? 0 : l;
 }
 const K = (o) => {
-  const { children: s, ellipsisText: g = "···", onEllipsisChange: v } = o, { prefixCls: d } = $(j), c = T(null), [f, E] = k(null), M = `${d}-overflow-sub-menu`, R = `${d}-overflow-hidden-menu-item`, N = `${d}-overflow-sub-menu-mirror`, h = (e) => {
-    if (e !== f) {
-      const t = p.Children.toArray(s), n = e === null;
-      v == null || v({
+  const { children: l, ellipsisText: x = "···", onEllipsisChange: O } = o, { prefixCls: d } = $(j), i = T(null), [c, E] = k(null), v = `${d}-overflow-sub-menu`, R = `${d}-overflow-hidden-menu-item`, w = `${d}-overflow-sub-menu-mirror`, b = (e) => {
+    if (e !== c) {
+      const t = a.Children.toArray(l), n = e === null;
+      O?.({
         lastVisibleIndex: n ? t.length - 1 : e,
         overflowNodes: n ? [] : t.slice(e + 1)
       }), E(e);
     }
   };
   function y() {
-    if (!c.current)
+    if (!i.current)
       return;
-    const e = c.current, t = C(e) - z, n = [].slice.call(e.children);
-    let r = 0, l = 0, m = 0;
-    for (let u = 0; u < n.length; u++) {
-      const i = n[u], a = i.className.split(" "), L = a.indexOf(M) > -1, W = a.indexOf(N) > -1;
+    const e = i.current, t = S(e) - z, n = [].slice.call(e.children);
+    let s = 0, u = 0, f = 0;
+    for (let m = 0; m < n.length; m++) {
+      const r = n[m], N = r.className.split(" "), L = N.indexOf(v) > -1, W = N.indexOf(w) > -1;
       if (L)
         continue;
-      const w = C(i) + O(x(i, "marginLeft")) + O(x(i, "marginRight"));
+      const p = S(r) + g(C(r, "marginLeft")) + g(C(r, "marginRight"));
       if (W) {
-        m = w;
+        f = p;
         continue;
       }
-      if (l += w, l > t) {
-        h(
+      if (u += p, u > t) {
+        b(
           // 判断如果将最后一个菜单项换为 ... 是否会超出宽度
-          r - (l - w + m <= t ? 1 : 2)
+          s - (u - p + f <= t ? 1 : 2)
         );
         return;
       }
-      r++;
+      s++;
     }
-    h(null);
+    b(null);
   }
-  const S = (e, t = !1) => /* @__PURE__ */ b(
+  const M = (e, t = !1) => /* @__PURE__ */ h(
     q,
     {
-      title: /* @__PURE__ */ b("span", { children: g }),
-      className: t ? N : M,
+      title: /* @__PURE__ */ h("span", { children: x }),
+      className: t ? w : v,
       children: e
     },
     `pqb-menu-overflow-sub-menu${t ? "-mirror" : ""}`
   ), I = () => {
     let e = null;
-    const t = S(null, !0), n = p.Children.map(s, (r, l) => {
-      var u;
-      let m = r;
-      if (f !== null && (l > f && (m = p.cloneElement(r, {
+    const t = M(null, !0), n = a.Children.map(l, (s, u) => {
+      let f = s;
+      if (c !== null && (u > c && (f = a.cloneElement(s, {
         className: H(
           R,
-          (u = r == null ? void 0 : r.props) == null ? void 0 : u.className
+          s?.props?.className
         )
-      })), l === f + 1)) {
-        const i = p.Children.toArray(s).slice(f + 1).map(
-          (a) => p.cloneElement(a, {
-            key: a.props._key
+      })), u === c + 1)) {
+        const m = a.Children.toArray(l).slice(c + 1).map(
+          (r) => a.cloneElement(r, {
+            key: r.props._key
           })
         );
-        e = S(i);
+        e = M(m);
       }
-      return m;
+      return f;
     }) ?? [];
     return [t, ...n, e];
   };
   return A(() => {
-    const e = U([c.current], y);
+    const e = U([i.current], y);
     return () => {
       e();
     };
-  }, [c.current]), /* @__PURE__ */ b("div", { className: `${d}-overflow-wrap`, ref: c, children: I() });
+  }, [i.current]), /* @__PURE__ */ h("div", { className: `${d}-overflow-wrap`, ref: i, children: I() });
 };
 export {
   K as default