@unicom-cloud/ui 0.8.44 → 0.8.46

package/cascader/panel/List.js

@@ -0,0 +1,275 @@
+import { jsx as d, Fragment as I, jsxs as K } from "react/jsx-runtime";
+import { TransitionGroup as z } from "@unicom-cloud/react-transition-group";
+import G from "lodash/isEqualWith";
+import S from "lodash/isFunction";
+import H from "lodash/isString";
+import J, { useState as Q, useCallback as _, useEffect as M } from "react";
+import { getMultipleCheckValue as X } from "../util.js";
+import Y from "../../hooks/useForceUpdate.js";
+import Z from "../../hooks/useRefs.js";
+import ee from "../../hooks/useUpdateEffect.js";
+import te from "../../utils/CSSTransition.js";
+import L from "@unicom-cloud/utils/class-name";
+import { on as le, off as R } from "../../utils/dom.js";
+import { isObject as re } from "../../utils/is.js";
+import { Enter as ie, ArrowLeft as ae, ArrowRight as ne, ArrowUp as se, ArrowDown as T, Esc as ce } from "../../utils/keyCode.js";
+/* empty css                     */
+/* empty css                                  */
+import de from "../../virtual-list/VirtualList.js";
+import ue from "./Option.js";
+const fe = (l) => {
+  for (let n = 0; n < l.length; n++)
+    if (!l[n].disabled)
+      return l[n];
+}, F = (l) => {
+  if (l && l.disabled) {
+    let n = l;
+    for (; n.parent && n.parent.disabled; )
+      n = n.parent;
+    return n;
+  }
+  return l;
+}, U = (l, n) => l < 0 ? n : l > n ? 0 : l, De = (l) => {
+  var P;
+  const [n, W] = Z(), C = Y(), {
+    store: u,
+    prefixCls: s,
+    value: x,
+    multiple: f,
+    renderFooter: A,
+    renderOption: p,
+    showEmptyChildren: j,
+    loadMore: E,
+    renderEmpty: v,
+    rtl: V,
+    icons: B
+  } = l, [a, k] = Q(
+    u.findNodeByValue(x && x[x.length - 1]) || null
+  ), g = u.getOptions(), O = (e) => {
+    var r;
+    (r = l.onChange) == null || r.call(l, e);
+  }, N = async (e) => {
+    if (!e.isLeaf && S(E) && !e.children) {
+      e.setLoading(!0), C();
+      try {
+        const r = await E(
+          e.pathValue,
+          e.pathValue.length
+        );
+        u.appendOptionChildren(e, r), u.setNodeCheckedByValue(l.value);
+      } catch (r) {
+        console.error(r);
+      }
+      e.setLoading(!1), C();
+    }
+  }, b = async (e, r = !0) => {
+    !e || e.disabled || (k(e), N(e), !f && r && (l.changeOnSelect || e.isLeaf) && O([e.pathValue]));
+  }, $ = (e, r) => {
+    const i = X(l.value, u, e, r);
+    e === a && C(), k(e), l.changeOnSelect || N(e), O(i);
+  }, D = _(
+    (e = a) => {
+      var i;
+      let r = e;
+      for (; r; )
+        (i = n[r._level]) == null || i.scrollTo({
+          index: r._index,
+          options: { block: "nearest" }
+        }), r = r._level < 1 ? null : r.parent;
+    },
+    [a]
+  ), w = _(
+    (e) => {
+      var t;
+      const r = e.key;
+      let i;
+      switch (r) {
+        case ce.key: {
+          e.preventDefault(), (t = l.onEsc) == null || t.call(l);
+          break;
+        }
+        case T.key:
+        case se.key: {
+          if (!a)
+            i = fe(g);
+          else {
+            const c = F(a), o = c.parent && c.parent.children || g, m = r === T.key ? 1 : -1;
+            let h = U(
+              c._index + m,
+              o.length - 1
+            );
+            for (; h !== c._index && (i = o[h], i.disabled); )
+              h = U(h + m, o.length - 1);
+          }
+          return D(i), b(i, !1), e.preventDefault(), !1;
+        }
+        case ne.key:
+          return a && !a.disabled && (i = (a.children || [])[0] || a, b(i, !1)), e.preventDefault(), !1;
+        case ae.key: {
+          if (a) {
+            const c = F(a);
+            i = c.parent || c;
+          }
+          return b(i, !1), e.preventDefault(), !1;
+        }
+        case ie.key:
+          return a && (f ? $(a, !a._checked) : b(a)), e.preventDefault(), !1;
+      }
+    },
+    [a]
+  );
+  ee(() => {
+    k((e) => {
+      let r;
+      if (e && e.pathValue && e.pathValue.length) {
+        const i = e.pathValue;
+        let t = { children: g };
+        i.map((c) => {
+          const m = (t.children || []).find((h) => h.value === c);
+          m && (t = m, r = m);
+        });
+      }
+      return r;
+    });
+  }, [u]), M(() => {
+    l.popupVisible && g.length && setTimeout(D);
+  }, [l.popupVisible]), M(() => {
+    const e = l.getTriggerElement();
+    if (e)
+      return l.popupVisible ? le(e, "keydown", w) : R(e, "keydown", w), () => {
+        R(e, "keydown", w);
+      };
+  }, [l.popupVisible, w]);
+  const y = (() => {
+    const e = [g];
+    return (a ? a.getPathNodes() : []).forEach((i) => {
+      i && i.children && e.push(i.children);
+    }), e;
+  })(), q = S(l.dropdownColumnRender) ? l.dropdownColumnRender : (e) => e;
+  return !y.length || !((P = y[0]) != null && P.length) ? /* @__PURE__ */ d(I, { children: v() }) : /* @__PURE__ */ d(z, { component: J.Fragment, children: y.map((e, r) => {
+    const i = A ? A(r, a || null) : null;
+    return e.length === 0 && !j ? null : /* @__PURE__ */ d(
+      te,
+      {
+        timeout: {
+          enter: 300,
+          exit: 0
+        },
+        classNames: "cascaderSlide",
+        onEnter: (t) => {
+          t && (t.style.marginLeft = `-${t.scrollWidth}px`);
+        },
+        onEntering: (t) => {
+          t && (t.style.marginLeft = "0px");
+        },
+        onEntered: (t) => {
+          t && (t.style.marginLeft = "");
+        },
+        children: /* @__PURE__ */ d(
+          "div",
+          {
+            className: L(`${s}-list-column`, {
+              [`${s}-list-column-virtual`]: l.virtualListProps && l.virtualListProps.threshold !== null,
+              [`${s}-list-column-rtl`]: V
+            }),
+            style: {
+              zIndex: y.length - r,
+              ...l.dropdownMenuColumnStyle
+            },
+            children: q(
+              /* @__PURE__ */ K(
+                "div",
+                {
+                  className: L(`${s}-list-wrapper`, {
+                    [`${s}-list-wrapper-with-footer`]: i !== null
+                  }),
+                  children: [
+                    e.length === 0 ? v == null ? void 0 : v(l.virtualListProps ? "100%" : 120) : /* @__PURE__ */ d(
+                      de,
+                      {
+                        needFiller: !1,
+                        threshold: l.virtualListProps ? 100 : null,
+                        data: e,
+                        isStaticItemHeight: !0,
+                        itemKey: "value",
+                        ...re(l.virtualListProps) ? l.virtualListProps : {},
+                        wrapper: "ul",
+                        role: "menu",
+                        ref: (t) => W(t, r),
+                        className: L(
+                          `${s}-list`,
+                          `${s}-list-select`,
+                          {
+                            [`${s}-list-multiple`]: f,
+                            [`${s}-list-rtl`]: V
+                          }
+                        ),
+                        children: (t) => {
+                          let c = !1;
+                          return a && (c = a.pathValue[r] === t.value), /* @__PURE__ */ d(
+                            "li",
+                            {
+                              tabIndex: 0,
+                              role: "menuitem",
+                              "aria-haspopup": !t.isLeaf,
+                              "aria-expanded": c && !t.isLeaf,
+                              "aria-disabled": t.disabled,
+                              title: H(t.label) ? t.label : void 0,
+                              className: L(`${s}-list-item`, {
+                                [`${s}-list-item-active`]: c,
+                                [`${s}-list-item-disabled`]: t.disabled
+                              }),
+                              children: /* @__PURE__ */ d(
+                                ue,
+                                {
+                                  prefixCls: s,
+                                  rtl: V,
+                                  multiple: f,
+                                  option: t,
+                                  selected: !f && t.isLeaf && G(l.value, t.pathValue),
+                                  icons: B,
+                                  onMouseEnter: () => {
+                                    t.disabled || l.expandTrigger === "hover" && (k(t), !t.isLeaf && N(t));
+                                  },
+                                  renderOption: p && (() => p(t._data, r)),
+                                  onClickOption: () => {
+                                    t.isLeaf && f && !t.disableCheckbox ? $(t, !t._checked) : b(t);
+                                  },
+                                  onMultipleChecked: (o) => {
+                                    $(t, o);
+                                  },
+                                  onDoubleClickOption: l.onDoubleClickOption
+                                }
+                              )
+                            },
+                            t.value
+                          );
+                        }
+                      }
+                    ),
+                    i && /* @__PURE__ */ d(
+                      "div",
+                      {
+                        className: `${s}-list-footer`,
+                        onMouseDown: (t) => {
+                          t.stopPropagation();
+                        },
+                        children: i
+                      }
+                    )
+                  ]
+                }
+              ),
+              r
+            )
+          }
+        )
+      },
+      r
+    );
+  }) });
+};
+export {
+  De as default,
+  U as getLegalIndex
+};

package/cascader/panel/Option.js

@@ -0,0 +1,35 @@
+import { jsxs as c, Fragment as s, jsx as r } from "react/jsx-runtime";
+/* empty css                     */
+/* empty css                              */
+import b from "../../checkbox/Checkbox.js";
+const u = (i) => {
+  const { prefixCls: d, multiple: n, option: e, renderOption: l, selected: a, icons: o } = i, t = e.disabled || n && e.disableCheckbox;
+  return /* @__PURE__ */ c(s, { children: [
+    n ? /* @__PURE__ */ r(
+      b,
+      {
+        disabled: t,
+        checked: e._checked,
+        indeterminate: e._halfChecked,
+        onChange: i.onMultipleChecked,
+        value: e.value
+      }
+    ) : "",
+    /* @__PURE__ */ c(
+      "div",
+      {
+        className: `${d}-list-item-label`,
+        onClick: e.disabled ? void 0 : i.onClickOption,
+        onMouseEnter: i.onMouseEnter,
+        onDoubleClick: t ? void 0 : i.onDoubleClickOption,
+        children: [
+          l ? l() : e.label,
+          e.isLeaf ? a && o.checked : e.loading ? o.loading : o.next
+        ]
+      }
+    )
+  ] });
+};
+export {
+  u as default
+};

package/cascader/panel/Search.js

@@ -0,0 +1,171 @@
+import { jsx as f, jsxs as $, Fragment as w } from "react/jsx-runtime";
+import R from "@unicom-cloud/scroll-into-view-if-needed";
+import B from "lodash/isEqualWith";
+import O from "lodash/isFunction";
+import L from "lodash/isString";
+import { useState as E, useRef as P, useEffect as F } from "react";
+import { getMultipleCheckValue as D } from "../util.js";
+/* empty css                     */
+/* empty css                              */
+import K from "../../checkbox/Checkbox.js";
+import q from "../../hooks/useIsFirstRender.js";
+import M from "../../hooks/useUpdateEffect.js";
+import S from "@unicom-cloud/utils/class-name";
+import { on as T, off as W } from "../../utils/dom.js";
+import { isObject as z } from "../../utils/is.js";
+import { Enter as G, ArrowUp as J, ArrowDown as V, Esc as Q } from "../../utils/keyCode.js";
+/* empty css                                  */
+import X from "../../virtual-list/VirtualList.js";
+const A = (t, r) => t < 0 ? r : t > r ? 0 : t, Y = (t, r, s) => {
+  let p = r;
+  if (L(r)) {
+    const l = r.toUpperCase().indexOf(t.toUpperCase());
+    if (l > -1) {
+      const m = r.substring(0, l + 1), k = r.substring(l + t.length);
+      p = /* @__PURE__ */ $(w, { children: [
+        m,
+        /* @__PURE__ */ f("span", { className: `${s}-highlight`, children: r.substring(l, t.length + 1) }),
+        k
+      ] });
+    }
+  }
+  return p;
+}, ke = (t) => {
+  const {
+    store: r,
+    prefixCls: s,
+    multiple: p,
+    onChange: l,
+    inputValue: m,
+    renderEmpty: k,
+    style: H,
+    defaultActiveFirstOption: N,
+    rtl: I,
+    icons: U
+  } = t, x = t.value || [], [c, _] = E(
+    r.searchNodeByLabel(m) || []
+  ), g = P(), v = P(), j = q(), [h, y] = E(
+    N ? 0 : -1
+  ), C = (e, n, b) => {
+    if (b.stopPropagation(), !e.disabled)
+      if (p) {
+        const d = D(
+          t.value,
+          r,
+          e,
+          n
+        );
+        l == null || l(d);
+      } else
+        l == null || l([e.pathValue]);
+  };
+  return M(() => {
+    _(r.searchNodeByLabel(m));
+  }, [m, r]), M(() => {
+    y((e) => e > c.length - 1 ? N ? 0 : -1 : e);
+  }, [c]), F(() => {
+    const e = t.getTriggerElement();
+    if (!e)
+      return;
+    const n = (b) => {
+      var a;
+      b.stopPropagation();
+      const d = b.key;
+      switch (d) {
+        case Q.key:
+          return (a = t.onEsc) == null || a.call(t), !1;
+        case V.key:
+        case J.key: {
+          v.current = !0;
+          const u = V.key === d ? 1 : -1;
+          let i = A(
+            h + u,
+            c.length - 1
+          );
+          for (; i !== h && c[i].disabled; )
+            i = A(i + u, c.length - 1);
+          return y(i), !1;
+        }
+        case G.key: {
+          const u = c[h];
+          if (u) {
+            const i = x.some((o) => B(o, u.pathValue));
+            C(u, !i, b);
+          }
+          return !1;
+        }
+      }
+    };
+    return T(e, "keydown", n), () => {
+      W(e, "keydown", n);
+    };
+  }, [c, h, x]), F(() => {
+    var n;
+    const e = g.current;
+    e && (v.current || j) && R(e, {
+      behavior: "instant",
+      block: "nearest",
+      scrollMode: "if-needed",
+      boundary: (n = e.parentNode) == null ? void 0 : n.parentNode
+    });
+  }, [h, c]), g.current = null, c.length ? /* @__PURE__ */ f("div", { className: `${s}-list-wrapper`, children: /* @__PURE__ */ f(
+    X,
+    {
+      needFiller: !1,
+      wrapper: "ul",
+      role: "menu",
+      style: H,
+      data: c,
+      isStaticItemHeight: !0,
+      threshold: t.virtualListProps ? 100 : null,
+      ...z(t.virtualListProps) ? t.virtualListProps : {},
+      onMouseMove: () => {
+        v.current = !1;
+      },
+      className: S(`${s}-list`, `${s}-list-search`, {
+        [`${s}-list-multiple`]: p,
+        [`${s}-list-rtl`]: I
+      }),
+      children: (e, n) => {
+        const d = e.getPathNodes().map((o) => /* @__PURE__ */ $("span", { children: [
+          o.label,
+          o.isLeaf ? "" : " / "
+        ] }, `${o.label}_${o._level}`)), a = e._checked, u = { checked: a }, i = O(t.renderOption) ? t.renderOption(m, e._data, u) : Y(m, d, s);
+        return /* @__PURE__ */ f(
+          "li",
+          {
+            title: L(i) ? i : L(d) ? d : void 0,
+            role: "menuitem",
+            "aria-disabled": e.disabled,
+            ref: (o) => {
+              n === h && (g.current = o), a && !g.current && (g.current = o);
+            },
+            className: S(`${s}-list-search-item`, {
+              [`${s}-list-search-item-active`]: a,
+              [`${s}-list-search-item-hover`]: n === h,
+              [`${s}-list-search-item-disabled`]: e.disabled
+            }),
+            onClick: (o) => {
+              C(e, !a, o);
+            },
+            onMouseEnter: () => {
+              !v.current && !e.disabled && y(n);
+            },
+            onMouseLeave: () => {
+              !v.current && !e.disabled && y(N ? 0 : -1);
+            },
+            children: /* @__PURE__ */ f("div", { className: `${s}-list-item-label`, children: O(t.renderOption) ? i : p ? /* @__PURE__ */ f(K, { checked: a, disabled: e.disabled, children: i }) : /* @__PURE__ */ $(w, { children: [
+              i,
+              a && /* @__PURE__ */ f("span", { className: `${s}-check-icon`, children: U.checked })
+            ] }) })
+          },
+          n
+        );
+      }
+    }
+  ) }) : /* @__PURE__ */ f(w, { children: k == null ? void 0 : k() });
+};
+export {
+  ke as default,
+  A as getLegalIndex
+};

package/cascader/util.js

@@ -0,0 +1,66 @@
+import V from "./base/store.js";
+const a = "__pqb_cascader__", g = "parent", N = "child", w = {
+  cascader: "cascader",
+  select: "select"
+};
+function k(e) {
+  return {
+    showEmptyChildren: e.showEmptyChildren,
+    changeOnSelect: e.changeOnSelect,
+    lazyload: !!e.loadMore,
+    fieldNames: e.fieldNames,
+    filterOption: e.filterOption,
+    showParent: e.mode === "multiple" && !e.changeOnSelect && e.checkedStrategy === g
+  };
+}
+function O(e, t) {
+  const n = t ? Array.isArray(t[0]) ? t : [t] : [];
+  return new V(e.options || [], n, k(e));
+}
+const _ = (e) => (e || []).reduce((c, s) => (c.add([].concat(s).join(a)), c), /* @__PURE__ */ new Set()), d = (e, t) => {
+  const n = t || [];
+  return e.has(n.join(a));
+}, j = (e, t) => {
+  const n = t || [];
+  return e.delete(n.join(a));
+}, A = (e, t, n) => {
+  let c = [];
+  if (e === void 0 ? c = [] : t ? c = e : c = [e], n && n.config.showParent) {
+    const s = n.getCheckedNodes(), h = _(
+      s.map((o) => o.pathValue)
+    ), i = [], l = {};
+    return c.map((o) => {
+      o.some((f, r, S) => {
+        const u = S.slice(0, r + 1), m = d(h, u);
+        return m && !l[u.join(a)] && (i.push(u), l[u.join(a)] = 1), m;
+      });
+    }), i;
+  }
+  return c;
+}, y = (e) => {
+  const t = (n) => Array.isArray(n) ? n.every((c) => c._checked || c.disabled ? !0 : t(c.children)) : !1;
+  return e._halfChecked && t(e == null ? void 0 : e.children);
+}, v = (e, t, n, c) => {
+  const s = c && y(n) ? !1 : c, h = t.getCheckedNodes().reduce((r, S) => (r.add(S.pathValue.join(a)), r), /* @__PURE__ */ new Set());
+  n.setCheckedState(s);
+  const l = t.getCheckedNodes().map((r) => r.pathValue), o = _(l), f = /* @__PURE__ */ new Set();
+  return e.filter((r) => {
+    if (!d(h, r) || d(o, r))
+      return f.add(r.join(a)), !0;
+  }).concat(
+    l.filter((r) => !d(f, r))
+  );
+};
+export {
+  w as PANEL_MODE,
+  N as SHOW_CHILD,
+  g as SHOW_PARENT,
+  a as ValueSeparator,
+  A as formatValue,
+  k as getConfig,
+  v as getMultipleCheckValue,
+  O as getStore,
+  j as removeValueFromSet,
+  _ as transformValuesToSet,
+  d as valueInSet
+};

package/checkbox/Checkbox.js

@@ -0,0 +1,111 @@
+import { jsxs as g, jsx as s, Fragment as F } from "react/jsx-runtime";
+import U from "@unicom-cloud/icons/IconUiCheck";
+import D from "@unicom-cloud/icons/IconUiMinus";
+import N from "lodash/isFunction";
+import H from "lodash/isNil";
+import f, { useRef as L, useContext as $, useEffect as O, useCallback as S } from "react";
+/* empty css                  */
+import "../config-provider/ConfigProvider.js";
+import W from "../hooks/useMergeProps.js";
+import q from "../hooks/useMergeValue.js";
+import z from "../IconHover.js";
+import A from "@unicom-cloud/utils/class-name";
+import B from "../utils/omit.js";
+import J, { CheckboxGroupContext as K } from "./Group.js";
+import Q from "./useCheckbox.js";
+import { ConfigContext as T } from "../config-provider/context.js";
+function X(v, G) {
+  const h = L(null), { getPrefixCls: V, componentConfig: C, rtl: y } = $(T), e = W(
+    v,
+    {},
+    C == null ? void 0 : C.Checkbox
+  ), t = $(K), o = V("checkbox"), { onGroupChange: n } = t, i = { ...e };
+  t.isCheckboxGroup && (i.checked = t.checkboxGroupValue.indexOf(e.value) !== -1, i.disabled = "disabled" in e ? e.disabled : t.disabled);
+  const {
+    disabled: l,
+    children: m,
+    className: P,
+    value: d,
+    style: R,
+    indeterminate: u,
+    error: E,
+    ...r
+  } = i, [k, I] = q(!1, {
+    value: i.checked,
+    defaultValue: i.defaultChecked
+  }), M = A(
+    o,
+    {
+      [`${o}-disabled`]: !!l,
+      [`${o}-indeterminate`]: !!u,
+      [`${o}-checked`]: k,
+      [`${o}-rtl`]: y,
+      error: E
+    },
+    P
+  );
+  O(() => (t.registerValue(d), () => {
+    t.unRegisterValue(d);
+  }), [d]);
+  const j = S(
+    (c) => {
+      var a;
+      c.persist(), c.stopPropagation(), I(c.target.checked), t.isCheckboxGroup && (n == null || n(e.value, c.target.checked, c)), (a = e.onChange) == null || a.call(e, c.target.checked, c);
+    },
+    [n, t.isCheckboxGroup, e.onChange, e.value]
+  ), w = f.useCallback(
+    (c) => {
+      var a;
+      N(e.children) && (c.preventDefault(), h.current && h.current.click()), (a = r.onClick) == null || a.call(r, c);
+    },
+    [e.children, r.onClick]
+  );
+  let b = { strokeWidth: 10 }, p = /* @__PURE__ */ s(U, { className: `${o}-mask-icon`, ...b });
+  return i.icon && (f.isValidElement(i.icon) ? p = f.cloneElement(i.icon, {
+    className: `${o}-mask-icon`,
+    style: { ...b }
+  }) : p = i.icon), u && (p = /* @__PURE__ */ s(D, { className: `${o}-mask-icon`, ...b })), /* @__PURE__ */ g(
+    "label",
+    {
+      ref: G,
+      "aria-disabled": l,
+      ...B(r, ["onChange"]),
+      onClick: w,
+      className: M,
+      style: R,
+      children: [
+        /* @__PURE__ */ s(
+          "input",
+          {
+            value: d,
+            disabled: !!l,
+            ref: h,
+            checked: !!k,
+            onChange: j,
+            onClick: (c) => c.stopPropagation(),
+            type: "checkbox"
+          }
+        ),
+        N(m) ? m({ checked: k, indeterminate: u }) : /* @__PURE__ */ g(F, { children: [
+          /* @__PURE__ */ s(
+            z,
+            {
+              prefix: o,
+              className: `${o}-mask-wrapper`,
+              disabled: k || l || u,
+              children: /* @__PURE__ */ s("div", { className: `${o}-mask`, children: p })
+            }
+          ),
+          !H(m) && /* @__PURE__ */ s("span", { className: `${o}-text`, children: m })
+        ] })
+      ]
+    }
+  );
+}
+const x = f.forwardRef(X);
+x.displayName = "Checkbox";
+x.Group = J;
+x.useCheckbox = Q;
+export {
+  x as default
+};