@unicom-cloud/ui 0.8.107 → 0.8.108

package/color-picker/utils.js

@@ -1,89 +1,90 @@
 import s from "@unicom-cloud/utils/tinycolor";
-const R = (t) => t.sort((r, n) => r.percent - n.percent), H = (t, r, n) => Object.keys(t).reduce(
+import c from "lodash/isArray";
+const k = (t) => t.sort((n, r) => n.percent - r.percent), w = (t, n, r) => Object.keys(t).reduce(
   (e, o) => ({
     ...e,
-    [o]: t[o] + (r[o] - t[o]) * n
+    [o]: t[o] + (n[o] - t[o]) * r
   }),
   { ...t }
-), b = (t) => t.map(({ color: r, percent: n }) => `${r} ${n}%`).join(", "), w = (t) => `linear-gradient(to right, ${b(t)})`, G = (t) => Array.isArray(t) ? w(t) : t, k = (t, r, n, e) => e < 1 ? `rgba(${t}, ${r}, ${n}, ${e.toFixed(2)})` : `rgb(${t}, ${r}, ${n})`, q = (t, r, n, e) => e < 1 ? new s({ r: t, g: r, b: n, a: e }).toHexString() : new s({ r: t, g: r, b: n }).toHexString(), p = (t) => {
-  const r = new s({
+), C = (t) => t.map(({ color: n, percent: r }) => `${n} ${r}%`).join(", "), I = (t) => `linear-gradient(to right, ${C(t)})`, q = (t) => c(t) ? I(t) : t, F = (t, n, r, e) => e < 1 ? `rgba(${t}, ${n}, ${r}, ${e.toFixed(2)})` : `rgb(${t}, ${n}, ${r})`, S = (t, n, r, e) => e < 1 ? new s({ r: t, g: n, b: r, a: e }).toHexString() : new s({ r: t, g: n, b: r }).toHexString(), l = (t) => {
+  const n = new s({
     h: t.h * 360,
     s: t.s * 100,
     v: t.v * 100
-  }), n = r.toRgb(), e = r.toHex();
+  }), r = n.toRgb(), e = n.toHex();
   return {
     hsv: t,
-    rgb: n,
+    rgb: r,
     hex: e
   };
-}, c = () => Math.random().toFixed(10).slice(2), A = (t, r) => t.map((n) => {
-  const e = new s(n.color).toHsv_();
+}, i = () => Math.random().toFixed(10).slice(2), j = (t, n) => t.map((r) => {
+  const e = new s(r.color).toHsv_();
   return {
-    id: c(),
-    color: p(e),
-    alpha: r ? 100 : e.a,
-    percent: n.percent
+    id: i(),
+    color: l(e),
+    alpha: n ? 100 : e.a,
+    percent: r.percent
   };
-}), F = (t, r, n) => {
-  const e = t.findIndex((a) => a.percent === r);
+}), P = (t, n, r) => {
+  const e = t.findIndex((a) => a.percent === n);
   if (e !== -1)
     return {
       ...t[e],
-      id: n ?? c()
+      id: r ?? i()
     };
   const o = t.findIndex(
-    (a) => a.percent > r
-  ), l = o - 1, {
-    color: d,
-    alpha: g,
-    percent: i
-  } = t[l], {
-    color: u,
-    alpha: x,
-    percent: f
-  } = t[o], h = H(
+    (a) => a.percent > n
+  ), d = o - 1, {
+    color: g,
+    alpha: u,
+    percent: p
+  } = t[d], {
+    color: x,
+    alpha: f,
+    percent: m
+  } = t[o], h = w(
     {
-      ...d.rgb,
-      a: g
+      ...g.rgb,
+      a: u
     },
     {
-      ...u.rgb,
-      a: x
+      ...x.rgb,
+      a: f
     },
-    (r - i) / (f - i)
-  ), { r: m, g: $, b: y, a: v } = h;
+    (n - p) / (m - p)
+  ), { r: $, g: v, b: H, a: b } = h;
   return {
-    id: n ?? c(),
-    color: p(
+    id: r ?? i(),
+    color: l(
       new s({
-        r: m,
-        g: $,
-        b: y
+        r: $,
+        g: v,
+        b: H
       }).toHsv_()
     ),
-    alpha: v,
-    percent: r
+    alpha: b,
+    percent: n
   };
-}, S = (t, r) => t.h === r.h && t.s === r.s && t.v === r.v, C = (t, r) => t.r === r.r && t.g === r.g && t.b === r.b && t.a === r.a, j = (t, r) => typeof t == "string" && typeof r == "string" ? t === r : Array.isArray(t) && Array.isArray(r) ? t.length === r.length && t.every((n, e) => {
-  const o = r[e];
-  return C(
-    new s(n.color).toRgba(),
+}, T = (t, n) => t.h === n.h && t.s === n.s && t.v === n.v, R = (t, n) => t.r === n.r && t.g === n.g && t.b === n.b && t.a === n.a, _ = (t, n) => typeof t == "string" && typeof n == "string" ? t === n : c(t) && c(n) ? t.length === n.length && t.every((r, e) => {
+  const o = n[e];
+  return R(
+    new s(r.color).toRgba(),
     new s(o.color).toRgba()
-  ) && n.percent === o.percent;
+  ) && r.percent === o.percent;
 }) : !1;
 export {
-  S as equalsHsv,
-  C as equalsRgba,
-  q as formatHex,
-  k as formatRgba,
-  F as getColorByGradients,
-  p as getColorFromHsv,
-  b as getGradientString,
-  c as getRandomId,
-  j as isEqualsColors,
-  A as mapValueToGradientColor,
-  H as mix,
-  G as renderBackground,
-  w as renderGradientBackground,
-  R as sortGradientColors
+  T as equalsHsv,
+  R as equalsRgba,
+  S as formatHex,
+  F as formatRgba,
+  P as getColorByGradients,
+  l as getColorFromHsv,
+  C as getGradientString,
+  i as getRandomId,
+  _ as isEqualsColors,
+  j as mapValueToGradientColor,
+  w as mix,
+  q as renderBackground,
+  I as renderGradientBackground,
+  k as sortGradientColors
 };

package/components/common/empty/index.js

@@ -2,7 +2,7 @@ import { jsxs as N, jsx as s } from "react/jsx-runtime";
 import $ from "@unicom-cloud/icons/IconUiEmpty";
 import { UI_COMMON_PREFIX as g } from "@unicom-cloud/utils/constant/ui";
 import { memo as x, forwardRef as u } from "react";
-import { SpaceVertical as C } from "../space/index.js";
+import C from "../space/index.js";
 import r from "@unicom-cloud/utils/class-name";
 const E = (n, c) => {
   const {
@@ -24,7 +24,7 @@ const E = (n, c) => {
     }
   ) : o ? /* @__PURE__ */ s("div", { className: r(`${e}-icon`, `${t}-icon`), children: o }) : /* @__PURE__ */ s($, { className: r(`${e}-icon`, `${t}-icon`) });
   return /* @__PURE__ */ N(
-    C,
+    C.Vertical,
     {
       ref: c,
       className: r(e, t, p),

package/components/common/flex/index.js

@@ -1,64 +1,73 @@
 import { jsx as d } from "react/jsx-runtime";
-import { UI_COMMON_PREFIX as j } from "@unicom-cloud/utils/constant/ui";
-import { forwardRef as x, useMemo as C } from "react";
-import I from "../hooks/useMergeProps.js";
-import P from "@unicom-cloud/utils/class-name";
+import { UI_COMMON_PREFIX as G } from "@unicom-cloud/utils/constant/ui";
+import { forwardRef as y } from "react";
+import O from "../hooks/useMergeProps.js";
+import I from "@unicom-cloud/utils/class-name";
 import "../utils/is.js";
-import { GAP_SIZE_MAP as y } from "./interface.js";
-import { isBoolean as V, isArray as _, isString as A } from "@unicom-cloud/utils/is";
-const O = (o) => A(o) && Object.keys(y).includes(o), m = (o, r, t) => {
-  t !== void 0 && (O(t) ? o[r] = y[t] : o[r] = typeof t == "number" ? `${t}px` : t);
-}, S = (o = {}, r, t = "gap") => (r === void 0 || (_(r) ? (m(o, "rowGap", r[0]), m(o, "columnGap", r[1])) : m(o, t, r)), o), b = {
+import { GAP_SIZE_MAP as x } from "./interface.js";
+import { isBoolean as M, isArray as P, isString as S } from "@unicom-cloud/utils/is";
+function p(e, i, t) {
+  if (t === void 0)
+    return;
+  S(t) && Object.keys(x).includes(t) ? e[i] = x[t] : e[i] = t;
+}
+function V(e = {}, i, t = "gap") {
+  return i === void 0 || (P(i) ? (p(e, "rowGap", i[0]), p(e, "columnGap", i[1] ?? i[0])) : p(e, t, i)), e;
+}
+const _ = {
   component: "div",
   gap: "small"
-}, a = x((o, r) => {
-  const t = I(o, b, {}), {
-    className: g,
-    style: c,
-    flex: l,
-    gap: f,
-    children: u,
-    direction: e,
-    justify: i,
-    align: n,
-    component: N = "div",
-    wrap: s,
-    rtl: w,
-    ...F
-  } = t, p = `${j}-flex`, G = C(() => {
-    const M = {
-      display: "flex",
-      ...S({}, f),
-      ...s !== void 0 && {
-        flexWrap: V(s) ? s ? "wrap" : "nowrap" : s
-      },
-      ...!!n && { alignItems: n },
-      ...!!i && { justifyContent: i },
-      ...!!e && { flexDirection: e },
-      ...!!l && { flex: l }
-    };
-    return { ...c, ...M };
-  }, [f, s, n, i, e, l, c]);
-  return /* @__PURE__ */ d(
-    N,
+}, m = y((e, i) => {
+  const t = O(e, _, {}), {
+    className: r,
+    style: $,
+    flex: u,
+    gap: j,
+    children: N,
+    direction: s,
+    justify: l,
+    align: f,
+    component: w = "div",
+    wrap: a,
+    rtl: F,
+    inline: c,
+    ...C
+  } = t, o = `${G}-flex`, n = {
+    display: c ? "inline-flex" : "flex"
+  };
+  return "wrap" in t && (n.flexWrap = M(a) ? a ? "wrap" : "nowrap" : a), "flex" in t && (n.flex = u), f && (n.alignItems = f), l && (n.justifyContent = l), s && (n.flexDirection = s), Object.assign(n, V({}, j), $), /* @__PURE__ */ d(
+    w,
     {
-      ref: r,
-      style: G,
-      className: P(p, g, {
-        [`${p}-rtl`]: w,
-        [`${p}-${e}`]: e,
-        [`${p}-${i}`]: i,
-        [`${p}-${n}`]: n
-      }),
-      ...F,
-      children: u
+      ref: i,
+      style: n,
+      className: I(
+        o,
+        {
+          [`${o}-rtl`]: F,
+          [`${o}-inline`]: c
+        },
+        !!s && `${o}-flex-direction-${s}`,
+        !!l && `${o}-justify-content-${l}`,
+        !!f && `${o}-align-items-${f}`,
+        r
+      ),
+      ...C,
+      children: N
     }
   );
-}), $ = x((o, r) => /* @__PURE__ */ d(a, { ref: r, ...o, direction: "column" }));
-a.Vertical = $;
-a.displayName = "Flex";
-$.displayName = "Flex.Vertical";
+});
+m.displayName = "Flex";
+const g = y(
+  (e, i) => {
+    const { direction: t = "column", ...r } = e;
+    return /* @__PURE__ */ d(m, { ...r, ref: i, direction: t });
+  }
+);
+g.displayName = "FlexVertical";
+const U = Object.assign(m, {
+  Vertical: g
+});
 export {
-  $ as FlexVertical,
-  a as default
+  g as FlexVertical,
+  U as default
 };

package/components/common/flex/interface.js

@@ -1,9 +1,9 @@
-const p = {
-  mini: "4px",
-  small: "8px",
-  medium: "12px",
-  large: "20px"
+const m = {
+  mini: 4,
+  small: 8,
+  medium: 16,
+  large: 24
 };
 export {
-  p as GAP_SIZE_MAP
+  m as GAP_SIZE_MAP
 };

package/components/common/hooks/useInterval.js

@@ -1,18 +1,18 @@
 import { useRef as l, useEffect as s } from "react";
-function o(t, e) {
+function f(t, e) {
   const r = l(null), n = l(), u = () => {
-    e !== null && (r.current = setInterval(() => {
+    e !== null && (r.current = window.setInterval(() => {
       n.current();
     }, e));
   }, c = () => {
-    r.current && clearInterval(r.current);
-  }, a = () => {
+    r.current && window.clearInterval(r.current);
+  }, o = () => {
     c(), u();
   };
   return s(() => {
     n.current = t;
-  }, [t]), s(() => (u(), c), [e]), a;
+  }, [t]), s(() => (u(), c), [e]), o;
 }
 export {
-  o as default
+  f as default
 };

package/components/common/space/index.js

@@ -1,53 +1,49 @@
-import { jsx as s, jsxs as _ } from "react/jsx-runtime";
-import { UI_COMMON_PREFIX as b } from "@unicom-cloud/utils/constant/ui";
-import O from "lodash/isArray";
-import R from "lodash/isNumber";
-import { forwardRef as f, Fragment as k } from "react";
-import E from "../hooks/useMergeProps.js";
-import F from "@unicom-cloud/utils/class-name";
-import { toArray as L } from "../utils/toArray.js";
-const u = {
-  mini: 4,
-  small: 8,
-  medium: 16,
-  large: 24
-}, U = {
+import { jsx as s, jsxs as M } from "react/jsx-runtime";
+import { UI_COMMON_PREFIX as _ } from "@unicom-cloud/utils/constant/ui";
+import b from "lodash/isArray";
+import O from "lodash/isNumber";
+import { forwardRef as d, Fragment as R } from "react";
+import { GAP_SIZE_MAP as f } from "../flex/interface.js";
+import k from "../hooks/useMergeProps.js";
+import E from "@unicom-cloud/utils/class-name";
+import { toArray as F } from "../utils/toArray.js";
+const L = {
   size: "small",
   direction: "horizontal"
-}, d = f(
-  function(a, $) {
-    const y = E(a, U, {}), {
-      className: N,
-      style: S,
-      children: h,
-      gap: G,
-      size: w,
-      direction: n = "horizontal",
-      align: x,
-      alignItems: P,
-      justifyContent: l,
-      wrap: V,
-      split: p,
-      rtl: j,
-      ...z
-    } = y, t = `${b}-space`, r = G ?? w, m = P ?? x ?? (n === "horizontal" ? "center" : ""), A = F(
+}, l = d(
+  (a, n) => {
+    const g = k(a, L, {}), {
+      className: y,
+      style: N,
+      children: S,
+      gap: h,
+      size: G,
+      direction: i = "horizontal",
+      align: w,
+      alignItems: x,
+      justifyContent: p,
+      wrap: P,
+      split: m,
+      rtl: V,
+      ...j
+    } = g, t = `${_}-space`, r = h ?? G, u = x ?? w ?? (i === "horizontal" ? "center" : ""), z = E(
       t,
       {
-        [`${t}-${n}`]: n,
-        [`${t}-justify-content-${l}`]: l,
-        [`${t}-align-items-${m}`]: m,
-        [`${t}-rtl`]: j
+        [`${t}-${i}`]: i,
+        [`${t}-justify-content-${p}`]: p,
+        [`${t}-align-items-${u}`]: u,
+        [`${t}-rtl`]: V
       },
-      V ? `${t}-wrap` : `${t}-no-wrap`,
-      N
-    ), i = (e) => R(e) ? e : u[e] ?? u.small, C = {
+      P ? `${t}-wrap` : `${t}-no-wrap`,
+      y
+    ), c = (e) => O(e) ? e : f[e] ?? f.small, A = {
       ...(() => {
         if (typeof r == "string" || typeof r == "number")
           return {
-            gap: `${i(r)}px`
+            gap: `${c(r)}px`
           };
-        if (O(r)) {
-          const e = i(r[1]), o = i(r[0]);
+        if (b(r)) {
+          const e = c(r[1]), o = c(r[0]);
           return {
             rowGap: `${e}px`,
             columnGap: `${o}px`
@@ -55,22 +51,26 @@ const u = {
         }
         return {};
       })(),
-      ...S
-    }, v = L(h);
-    return /* @__PURE__ */ s("div", { ref: $, className: A, style: C, ...z, children: v.map((e, o) => {
-      const I = e?.key ?? o, M = p != null && o > 0;
-      return /* @__PURE__ */ _(k, { children: [
-        M && /* @__PURE__ */ s("div", { className: `${t}-item-split`, children: p }),
+      ...N
+    }, v = F(S);
+    return /* @__PURE__ */ s("div", { ref: n, className: z, style: A, ...j, children: v.map((e, o) => {
+      const C = e?.key ?? o, I = m != null && o > 0;
+      return /* @__PURE__ */ M(R, { children: [
+        I && /* @__PURE__ */ s("div", { className: `${t}-item-split`, children: m }),
         /* @__PURE__ */ s("div", { className: `${t}-item`, children: e })
-      ] }, I);
+      ] }, C);
     }) });
   }
-), g = f((c, a) => /* @__PURE__ */ s(d, { ref: a, ...c, direction: "vertical" })), T = Object.assign(d, {
-  displayName: "Space",
-  Vertical: g
+);
+l.displayName = "Space";
+const $ = d(
+  (a, n) => /* @__PURE__ */ s(l, { ...a, ref: n, direction: "vertical" })
+);
+$.displayName = "SpaceVertical";
+const T = Object.assign(l, {
+  Vertical: $
 });
-g.displayName = "Space.Vertical";
 export {
-  g as SpaceVertical,
+  $ as SpaceVertical,
   T as default
 };