@unicom-cloud/ui 0.8.105 → 0.8.106

package/Segmented.js

@@ -3,9 +3,11 @@ import "react";
 import "./config-provider/ConfigProvider.js";
 import "./components/common/hooks/useMergeProps.js";
 import "@unicom-cloud/utils/class-name";
+import "./components/common/utils/is.js";
 import "./components/common/utils/resizeObserver.js";
 import "./config-provider/context.js";
-import { default as d } from "./segmented/index.js";
+import "@unicom-cloud/utils/is";
+import { default as u } from "./segmented/index.js";
 export {
-  d as default
+  u as default
 };

package/package.json

@@ -1 +1 @@
-{"name":"@unicom-cloud/ui","version":"0.8.105","dependencies":{"@unicom-cloud/icons":"latest"},"peerDependencies":{"react":"^18.3.1","react-dom":"^18.3.1","dayjs":"^1.11.10","lodash":"^4.17.21","uuid":"^11.1.0","qrcode.react":"^4.2.0"},"peerDependenciesMeta":{},"type":"module","types":"types/pc/index.d.ts","main":"./index.js","publishConfig":{"registry":"https://registry.npmjs.org/","access":"public"}}
+{"name":"@unicom-cloud/ui","version":"0.8.106","dependencies":{"@unicom-cloud/icons":"latest"},"peerDependencies":{"react":"^18.3.1","react-dom":"^18.3.1","dayjs":"^1.11.10","lodash":"^4.17.21","uuid":"^11.1.0","qrcode.react":"^4.2.0"},"peerDependenciesMeta":{},"type":"module","types":"types/pc/index.d.ts","main":"./index.js","publishConfig":{"registry":"https://registry.npmjs.org/","access":"public"}}

package/segmented/index.js

@@ -1,11 +1,13 @@
-import { jsxs as D, jsx as w, Fragment as te } from "react/jsx-runtime";
-import { forwardRef as ne, useContext as re, useMemo as oe, useState as P, useRef as N, useCallback as se, useEffect as A } from "react";
+import { jsxs as D, jsx as v, Fragment as ne } from "react/jsx-runtime";
+import { forwardRef as re, useContext as oe, useMemo as ie, useState as P, useRef as A, useCallback as se, useEffect as $ } from "react";
 import "../config-provider/ConfigProvider.js";
 import ae from "../components/common/hooks/useMergeProps.js";
 import j from "@unicom-cloud/utils/class-name";
-import { resizeObserver as ie } from "../components/common/utils/resizeObserver.js";
-import le from "../config-provider/context.js";
-const ce = {
+import "../components/common/utils/is.js";
+import { resizeObserver as le } from "../components/common/utils/resizeObserver.js";
+import ce from "../config-provider/context.js";
+import { isNil as ue, isFunction as de } from "@unicom-cloud/utils/is";
+const fe = {
   options: [],
   size: "medium",
   mode: "default",
@@ -14,56 +16,57 @@ const ce = {
   direction: "horizontal",
   showIndicator: !0,
   animationDuration: 300
-}, ue = ne(
-  (B, d) => {
-    const { getPrefixCls: E, componentConfig: M, rtl: K } = re(le), L = ae(
+}, pe = re(
+  (B, p) => {
+    const { getPrefixCls: E, componentConfig: M, rtl: F } = oe(ce), K = ae(
       B,
-      ce,
+      fe,
       M?.Segmented
     ), {
-      style: U,
-      className: F,
+      style: L,
+      className: U,
       options: O = [],
-      defaultValue: y,
+      defaultValue: c,
       value: R,
       size: H,
-      mode: v,
-      disabled: f,
-      block: _,
-      direction: p,
-      showIndicator: $,
-      animationDuration: q,
+      mode: k,
+      disabled: m,
+      block: T,
+      direction: h,
+      showIndicator: C,
+      animationDuration: _,
       name: x,
-      onChange: C,
+      immediateTrigger: q,
+      onChange: u,
       ...G
-    } = L, s = oe(() => O.map((e) => typeof e == "string" ? { value: e, label: e } : e), [O]), [J, S] = P(() => y && s.some((e) => e.value === y) ? y : s[0]?.value || ""), [Q, m] = P({}), c = N(null), k = N([]), V = N(!1), r = E?.("segmented"), T = j(
+    } = K, i = ie(() => O.map((e) => typeof e == "string" ? { value: e, label: e } : e), [O]), [J, S] = P(() => c && i.some((e) => e.value === c) ? c : i[0]?.value || ""), [Q, b] = P({}), d = A(null), I = A([]), V = A(!1), r = E?.("segmented"), W = j(
       r,
       {
-        [`${r}-block`]: _,
-        [`${r}-disabled`]: f,
-        [`${r}-rtl`]: K,
-        [`${r}-${v}`]: v,
-        [`${r}-${p}`]: p
+        [`${r}-block`]: T,
+        [`${r}-disabled`]: m,
+        [`${r}-rtl`]: F,
+        [`${r}-${k}`]: k,
+        [`${r}-${h}`]: h
       },
-      F
-    ), h = R !== void 0, i = h ? R : J, b = se(() => {
-      if (!$ || !c.current) {
-        m((a) => ({ ...a, opacity: 0 }));
+      U
+    ), g = R !== void 0, a = g ? R : J, w = se(() => {
+      if (!C || !d.current) {
+        b((s) => ({ ...s, opacity: 0 }));
         return;
       }
-      const e = s.findIndex(
-        (a) => a?.value === i
+      const e = i.findIndex(
+        (s) => s?.value === a
       );
       if (e === -1) {
-        m((a) => ({ ...a, opacity: 0 }));
+        b((s) => ({ ...s, opacity: 0 }));
         return;
       }
-      const o = k.current[e];
+      const o = I.current[e];
       if (!o) {
-        m((a) => ({ ...a, opacity: 0 }));
+        b((s) => ({ ...s, opacity: 0 }));
         return;
       }
-      const n = c.current.getBoundingClientRect(), t = o.getBoundingClientRect(), l = p === "vertical" ? {
+      const n = d.current.getBoundingClientRect(), t = o.getBoundingClientRect(), l = h === "vertical" ? {
         width: t.width,
         // 垂直模式下宽度撑满
         top: t.top - n.top,
@@ -74,15 +77,15 @@ const ce = {
         height: t.height
         // 水平模式下高度撑满
       };
-      m({
+      b({
         ...l,
         opacity: 1
       });
-    }, [i, s, $, p]), z = (e, o) => {
-      o || f || (h || S(e), C?.(e));
-    }, W = (e, o) => {
-      if (f) return;
-      const n = s.length;
+    }, [a, i, C, h]), z = (e, o) => {
+      o || m || (g || S(e), u?.(e));
+    }, X = (e, o) => {
+      if (m) return;
+      const n = i.length;
       if (n === 0) return;
       let t = o;
       switch (e.key) {
@@ -103,114 +106,114 @@ const ce = {
         default:
           return;
       }
-      for (; t !== o && s[t]?.disabled; )
+      for (; t !== o && i[t]?.disabled; )
         t = (t + (e.key === "ArrowLeft" || e.key === "ArrowUp" ? -1 : 1) + n) % n;
-      const l = s[t]?.value;
-      l && l !== i && (z(l), k.current[t]?.focus());
+      const l = i[t]?.value;
+      l && l !== a && (z(l), I.current[t]?.focus());
     };
-    A(() => {
+    $(() => {
       if (!V.current) {
         V.current = !0;
         return;
       }
-      if (!s.some((e) => e.value === i)) {
-        const e = s[0]?.value || "";
-        h || S(e), C?.(e);
+      if (!i.some((e) => e.value === a)) {
+        const e = i[0]?.value || "";
+        g || S(e), u?.(e);
       }
-    }, [s, i, h, C]), A(() => {
-      b();
-    }, [i, s, b]), A(() => {
-      if (!c.current) return;
-      const e = ie(
-        [c.current],
+    }, [i, a, g, u]), $(() => {
+      q && !ue(c) && de(u) && u(c);
+    }, []), $(() => {
+      w();
+    }, [a, i, w]), $(() => {
+      if (!d.current) return;
+      const e = le(
+        [d.current],
         () => {
-          b();
+          w();
         }
       );
       return () => {
         e();
       };
-    }, [b]);
-    const X = (e, o) => {
+    }, [w]);
+    const Y = (e, o) => {
       if (e.render)
         return e.render(e, o);
       const n = !e.label && !!e.icon;
-      return /* @__PURE__ */ D(te, { children: [
-        e.icon && /* @__PURE__ */ w("span", { className: `${r}-option-icon`, children: e.icon }),
-        !n && e.label && /* @__PURE__ */ w("span", { className: `${r}-option-label`, children: e.label })
+      return /* @__PURE__ */ D(ne, { children: [
+        e.icon && /* @__PURE__ */ v("span", { className: `${r}-option-icon`, children: e.icon }),
+        !n && e.label && /* @__PURE__ */ v("span", { className: `${r}-option-label`, children: e.label })
       ] });
     };
     return /* @__PURE__ */ D(
       "div",
       {
         ref: (e) => {
-          typeof d == "function" ? d(e) : d && (d.current = e), c.current = e;
+          typeof p == "function" ? p(e) : p && (p.current = e), d.current = e;
         },
         ...G,
-        style: U,
-        className: T,
+        style: L,
+        className: W,
         role: "radiogroup",
         children: [
-          !Array.isArray(s) || s.length === 0 ? null : s.map((e, o) => {
+          !Array.isArray(i) || i.length === 0 ? null : i.map((e, o) => {
             if (!e) return null;
             const {
               value: n,
               label: t,
               disabled: l,
-              icon: a,
-              render: fe,
-              ...Y
-            } = e, u = n === i, g = l || f, Z = !t && !!a, ee = [t, n, o].filter(Boolean).join("-");
+              icon: s,
+              render: he,
+              ...Z
+            } = e, f = n === a, y = l || m, ee = !t && !!s, te = [t, n, o].filter(Boolean).join("-");
             return /* @__PURE__ */ D(
               "button",
               {
-                ref: (I) => k.current[o] = I,
+                ref: (N) => I.current[o] = N,
                 className: j(
                   `${r}-option`,
                   `${r}-option-${H}`,
-                  `${r}-option-${v}`,
+                  `${r}-option-${k}`,
                   {
-                    [`${r}-option-active`]: u,
-                    [`${r}-option-disabled`]: g,
-                    [`${r}-option-icon-only`]: Z
+                    [`${r}-option-active`]: f,
+                    [`${r}-option-disabled`]: y,
+                    [`${r}-option-icon-only`]: ee
                   }
                 ),
-                onClick: () => z(n, g),
-                onKeyDown: (I) => W(I, o),
-                disabled: g,
+                onClick: () => z(n, y),
+                onKeyDown: (N) => X(N, o),
+                disabled: y,
                 role: "radio",
-                "aria-checked": u,
-                "aria-disabled": g,
-                tabIndex: u ? 0 : -1,
-                ...Y,
+                "aria-checked": f,
+                "aria-disabled": y,
+                tabIndex: f ? 0 : -1,
+                ...Z,
                 children: [
-                  x && /* @__PURE__ */ w(
+                  x && /* @__PURE__ */ v(
                     "input",
                     {
                       type: "radio",
                       name: x,
                       value: n,
-                      checked: u,
-                      onChange: () => {
-                      },
+                      checked: f,
                       className: `${r}-input`,
                       tabIndex: -1,
                       "aria-hidden": "true"
                     }
                   ),
-                  X(e, u)
+                  Y(e, f)
                 ]
               },
-              ee
+              te
             );
           }),
-          $ && /* @__PURE__ */ w(
+          C && /* @__PURE__ */ v(
             "div",
             {
               className: `${r}-indicator`,
               style: {
                 ...Q,
-                transitionDuration: `${q}ms`
+                transitionDuration: `${_}ms`
               }
             }
           )
@@ -219,7 +222,7 @@ const ce = {
     );
   }
 );
-ue.displayName = "Segmented";
+pe.displayName = "Segmented";
 export {
-  ue as default
+  pe as default
 };