@unicom-cloud/ui 0.8.41

package/ColorPicker.js

@@ -0,0 +1,588 @@
+import { jsx as n, jsxs as x } from "react/jsx-runtime";
+import "./chunk/DP2rzg_V.js";
+import "./chunk/C6Kfwj0f.js";
+import "./chunk/RnTpOC5-.js";
+import { a as M, I as D } from "./chunk/Bl5t8Z6F.js";
+import "./chunk/BVC51EZ7.js";
+import { a as S } from "./chunk/Dc_89PVN.js";
+import "./Tag.js";
+import "./chunk/DF-4xm4m.js";
+import J from "./Trigger.js";
+import { S as K } from "./chunk/BdWYJb9B.js";
+import Q from "lodash/isFunction";
+import Z from "lodash/isNil";
+import ee, { useState as z, useRef as O, useEffect as F, useContext as R, useMemo as H, useCallback as ne } from "react";
+import te from "./Copy.js";
+import re from "./hooks/useMergeProps.js";
+import A from "@unicom-cloud/utils/class-name";
+import w from "@unicom-cloud/utils/tinycolor";
+import G from "./Tooltip.js";
+import { colors as _, palette as oe } from "@unicom-cloud/utils/ui-color";
+import ie from "./hooks/useIsFirstRender.js";
+import X from "./hooks/useMergeValue.js";
+function U(e, i) {
+  return e < 0 ? 0 : e > i ? 1 : e / i;
+}
+function Y({ value: e, onChange: i }) {
+  const [a, g] = z(!1), u = O(), m = O();
+  function s(o) {
+    const { clientX: t, clientY: p } = o;
+    if (!u.current)
+      return;
+    const b = u.current.getBoundingClientRect(), C = [
+      U(t - b.x, b.width),
+      U(p - b.y, b.height)
+    ];
+    (C[0] !== e[0] || C[1] !== e[1]) && (i == null || i(C));
+  }
+  function r() {
+    g(!1), window.removeEventListener("mousemove", l), window.removeEventListener("mouseup", r), window.removeEventListener("contextmenu", r);
+  }
+  function d() {
+    g(!0), window.addEventListener("mousemove", l), window.addEventListener("mouseup", r), window.addEventListener("contextmenu", r);
+  }
+  function v(o) {
+    s(o), d();
+  }
+  function l(o) {
+    o.preventDefault(), o.buttons > 0 ? s(o) : r();
+  }
+  return F(() => () => {
+    r();
+  }, []), {
+    active: a,
+    blockRef: u,
+    handlerRef: m,
+    onMouseDown: v
+  };
+}
+const W = ({
+  x: e,
+  type: i = "hue",
+  color: a,
+  onChange: g,
+  style: u
+}) => {
+  const { getPrefixCls: m } = R(S), s = m("color-picker"), { r, g: d, b: v } = a.rgb, { blockRef: l, handlerRef: o, onMouseDown: t } = Y({
+    value: [e, 0],
+    onChange: (b) => g(b[0])
+  }), p = () => /* @__PURE__ */ n(
+    "div",
+    {
+      ref: o,
+      style: {
+        left: `${e * 100}%`
+      },
+      className: `${s}-handler`,
+      children: /* @__PURE__ */ n(
+        "div",
+        {
+          className: `${s}-handler-center`,
+          style: { backgroundColor: a.string }
+        }
+      )
+    }
+  );
+  return i === "alpha" ? /* @__PURE__ */ n("div", { className: `${s}-control-bar-bg`, children: /* @__PURE__ */ n(
+    "div",
+    {
+      ref: l,
+      className: A(
+        `${s}-control-bar`,
+        `${s}-control-bar-alpha`,
+        `${s}-control-bar-alpha`
+      ),
+      style: {
+        background: `linear-gradient(to right, rgba(0, 0, 0, 0), rgb(${r}, ${d}, ${v}))`,
+        ...u
+      },
+      onMouseDown: t,
+      children: p()
+    }
+  ) }) : /* @__PURE__ */ n(
+    "div",
+    {
+      ref: l,
+      style: u,
+      className: A(`${s}-control-bar`, `${s}-control-bar-hue`),
+      onMouseDown: t,
+      children: p()
+    }
+  );
+}, q = ({ value: e, onChange: i }) => {
+  const { getPrefixCls: a } = R(S), g = a("color-picker");
+  return /* @__PURE__ */ n(
+    M,
+    {
+      className: `${g}-input-alpha`,
+      size: "mini",
+      min: 0,
+      max: 100,
+      value: Math.round(e * 100),
+      suffix: "%",
+      onChange: (u) => i(u / 100)
+    }
+  );
+}, se = ({
+  color: e,
+  alpha: i,
+  onHsvChange: a,
+  onAlphaChange: g,
+  disabledAlpha: u
+}) => {
+  const { getPrefixCls: m } = R(S), s = m("color-picker"), [r, d] = z(e.hex);
+  F(() => {
+    e.hex !== r && d(e.hex);
+  }, [e]);
+  const v = (t) => {
+    var b;
+    const p = ((b = t.match(/[a-fA-F0-9]*/g)) == null ? void 0 : b.join("")) ?? "";
+    p !== r && d(p.toUpperCase());
+  }, l = () => {
+    let t = new w(r);
+    t.ok || (t = new w({
+      r: 255,
+      g: 0,
+      b: 0
+    }));
+    const p = t.toHsv_();
+    a(p);
+  }, o = (t) => {
+    let p = t.clipboardData.getData("Text");
+    p.startsWith("#") && (p = p.slice(1)), v(p), t.preventDefault();
+  };
+  return /* @__PURE__ */ x(D.Group, { className: `${s}-input-group`, compact: !0, children: [
+    /* @__PURE__ */ n(
+      D,
+      {
+        className: `${s}-input-hex`,
+        prefix: "#",
+        size: "mini",
+        maxLength: 6,
+        value: r,
+        onChange: v,
+        onBlur: l,
+        onPressEnter: l,
+        onPaste: o
+      }
+    ),
+    !u && /* @__PURE__ */ n(q, { value: i, onChange: g })
+  ] });
+}, le = ({
+  color: e,
+  alpha: i,
+  onHsvChange: a,
+  onAlphaChange: g,
+  disabledAlpha: u
+}) => {
+  const { getPrefixCls: m } = R(S), s = m("color-picker"), r = (o) => {
+    const t = new w({
+      r: o.r,
+      g: o.g,
+      b: o.b
+    }).toHsv_();
+    a(t);
+  }, { r: d, g: v, b: l } = e.rgb;
+  return /* @__PURE__ */ x(D.Group, { className: `${s}-input-group`, compact: !0, children: [
+    /* @__PURE__ */ n(
+      M,
+      {
+        size: "mini",
+        min: 0,
+        max: 255,
+        hideControl: !0,
+        value: d,
+        onChange: (o) => r({ r: o, g: v, b: l })
+      }
+    ),
+    /* @__PURE__ */ n(
+      M,
+      {
+        size: "mini",
+        min: 0,
+        max: 255,
+        hideControl: !0,
+        value: v,
+        onChange: (o) => r({ r: d, g: o, b: l })
+      }
+    ),
+    /* @__PURE__ */ n(
+      M,
+      {
+        size: "mini",
+        min: 0,
+        max: 255,
+        hideControl: !0,
+        value: l,
+        onChange: (o) => r({ r: d, g: v, b: o })
+      }
+    ),
+    !u && /* @__PURE__ */ n(q, { value: i, onChange: g })
+  ] });
+}, ce = ({ color: e, onChange: i }) => {
+  const { getPrefixCls: a } = R(S), g = a("color-picker"), { h: u, s: m, v: s } = e.hsv, { blockRef: r, handlerRef: d, onMouseDown: v } = Y({
+    value: [m, 1 - s],
+    onChange: (t) => i(t[0], 1 - t[1])
+  }), l = H(() => new w({ h: u * 360, s: 100, v: 100 }).toRgbString(), [u]), o = () => /* @__PURE__ */ n(
+    "div",
+    {
+      ref: d,
+      className: `${g}-handler`,
+      style: {
+        top: `${(1 - s) * 100}%`,
+        left: `${m * 100}%`
+      }
+    }
+  );
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      ref: r,
+      className: `${g}-palette`,
+      style: { backgroundColor: l },
+      onMouseDown: v,
+      children: o()
+    }
+  );
+}, ae = ({
+  color: e,
+  alpha: i,
+  disabledAlpha: a,
+  colorString: g,
+  historyColors: u,
+  presetColors: m,
+  showHistory: s,
+  showPreset: r,
+  renderPreset: d,
+  renderHistory: v,
+  renderPickSection: l,
+  renderFooter: o,
+  onHsvChange: t,
+  onAlphaChange: p
+}) => {
+  const { getPrefixCls: b, locale: C } = R(S), f = b("color-picker"), [I, $] = z("hex"), { h: c, s: k, v: P } = e.hsv, N = H(() => {
+    if (!s)
+      return [];
+    const h = new Set(u ?? []);
+    return Array.from(h);
+  }, [u, s]), y = (h) => {
+    let V = new w(h);
+    V.ok || (V = new w({
+      r: 255,
+      g: 0,
+      b: 0
+    })), t(V.toHsv_());
+  }, E = () => I === "rgb" ? /* @__PURE__ */ n(
+    le,
+    {
+      color: e,
+      alpha: i,
+      onHsvChange: t,
+      onAlphaChange: p,
+      disabledAlpha: a
+    }
+  ) : /* @__PURE__ */ n(
+    se,
+    {
+      color: e,
+      alpha: i,
+      onHsvChange: t,
+      onAlphaChange: p,
+      disabledAlpha: a
+    }
+  ), L = (h) => /* @__PURE__ */ n(G, { mini: !0, content: h, color: h, children: /* @__PURE__ */ n(
+    "div",
+    {
+      className: `${f}-color-block`,
+      onClick: () => {
+        y(h);
+      },
+      children: /* @__PURE__ */ n(
+        "div",
+        {
+          className: `${f}-block`,
+          style: { backgroundColor: h }
+        }
+      )
+    },
+    h
+  ) }, h), B = () => v ? v() : s ? /* @__PURE__ */ x("div", { className: `${f}-colors-section`, children: [
+    /* @__PURE__ */ n("div", { className: `${f}-colors-text`, children: C.ColorPicker.history }),
+    /* @__PURE__ */ n("div", { className: `${f}-colors-wrapper`, children: N != null && N.length ? /* @__PURE__ */ n("div", { className: `${f}-colors-list`, children: N.map(L) }) : /* @__PURE__ */ n("span", { className: `${f}-colors-empty`, children: C.ColorPicker.empty }) })
+  ] }) : null, T = () => {
+    var h;
+    return d ? d() : r ? /* @__PURE__ */ x("div", { className: `${f}-colors-section`, children: [
+      /* @__PURE__ */ n("div", { className: `${f}-colors-text`, children: C.ColorPicker.preset }),
+      /* @__PURE__ */ n("div", { className: `${f}-colors-wrapper`, children: /* @__PURE__ */ n("div", { className: `${f}-colors-list`, children: (h = m == null ? void 0 : m.map) == null ? void 0 : h.call(m, L) }) })
+    ] }) : null;
+  }, j = () => l ? l() : s || r ? /* @__PURE__ */ x("div", { className: `${f}-panel-colors`, children: [
+    B(),
+    T()
+  ] }) : null;
+  return /* @__PURE__ */ x("div", { className: `${f}-panel`, children: [
+    /* @__PURE__ */ n(ce, { color: e, onChange: (h, V) => t({ h: c, s: h, v: V }) }),
+    /* @__PURE__ */ x("div", { className: `${f}-panel-control`, children: [
+      /* @__PURE__ */ x("div", { className: `${f}-control-wrapper`, children: [
+        /* @__PURE__ */ x("div", { children: [
+          /* @__PURE__ */ n(
+            W,
+            {
+              type: "hue",
+              x: c,
+              color: e,
+              onChange: (h) => t({ h, s: k, v: P })
+            }
+          ),
+          !a && /* @__PURE__ */ n(
+            W,
+            {
+              type: "alpha",
+              x: i,
+              color: e,
+              onChange: p
+            }
+          )
+        ] }),
+        /* @__PURE__ */ n(G, { mini: !0, content: e.hex8String, color: e.string, children: /* @__PURE__ */ n(
+          "div",
+          {
+            className: `${f}-preview`,
+            style: { backgroundColor: e.string }
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ x("div", { className: `${f}-input-wrapper`, children: [
+        /* @__PURE__ */ n(
+          K,
+          {
+            className: `${f}-select-type`,
+            size: "mini",
+            options: [
+              {
+                value: "hex",
+                label: "HEX"
+              },
+              // {
+              //   value: 'hsl',
+              //   label: 'HSL',
+              // },
+              {
+                value: "rgb",
+                label: "RGB"
+              }
+            ],
+            value: I,
+            triggerProps: {
+              className: `${f}-type-dropdown`,
+              getPopupContainer() {
+                return window.document.body;
+              }
+            },
+            onChange: $
+          }
+        ),
+        /* @__PURE__ */ n("div", { className: `${f}-group-wrapper`, children: E() })
+      ] })
+    ] }),
+    j(),
+    typeof o == "function" ? o() : null
+  ] });
+};
+new w("#eee");
+const ue = [
+  Object.entries(_).map(([e, i], a, g) => oe({ color: i, level: 4 })),
+  Object.entries(_).map(([e, i], a, g) => i),
+  !1,
+  !1,
+  !1,
+  !1
+  // '#00B42A',
+  // '#3C7EFF',
+  // '#FF7D00',
+  // '#F76965',
+  // '#F7BA1E',
+  // '#F5319D',
+  // '#D91AD9',
+  // '#9FDB1D',
+  // '#FADC19',
+  // '#722ED1',
+  // '#3491FA',
+  // '#7BE188',
+  // '#93BEFF',
+  // '#FFCF8B',
+  // '#FBB0A7',
+  // '#FCE996',
+  // '#FB9DC7',
+  // '#F08EE6',
+  // '#DCF190',
+  // '#FDFA94',
+  // '#C396ED',
+  // '#9FD4FD',
+].flat(1 / 0).filter(Boolean), me = (e) => {
+  const { format: i, onChange: a, disabledAlpha: g } = e ?? {}, u = ie(), [m, s] = X("", e), r = H(() => new w(m).toHsv_(), [m]), [d, v] = X(!1, {
+    defaultValue: e.defaultPopupVisible,
+    value: e.popupVisible
+  }), [l, o] = z({
+    h: r.h,
+    s: r.s,
+    v: r.v
+  }), [t, p] = z(r.a), b = H(() => {
+    let c = new w({
+      h: l.h * 360,
+      s: l.s * 100,
+      v: l.v * 100,
+      a: t
+    });
+    const k = c.toRgb(), { r: P, g: N, b: y } = k;
+    return {
+      hsv: l,
+      rgb: k,
+      rgbString: c.toRgbString(),
+      hex: c.toHex(),
+      hexString: c.toHexString(),
+      hex8String: c.toHex8String(),
+      string: `rgba(${P}, ${N}, ${y}, ${t.toFixed(2)})`,
+      tiny: c,
+      alpha: t
+    };
+  }, [l, t, i]), C = H(() => i === "rgb" ? b.rgbString : t < 1 ? b.hex8String : b.hexString, [b]);
+  F(() => {
+    s(C), !u && (a == null || a(C));
+  }, [C]);
+  const f = ne(
+    (c) => {
+      var k;
+      if (c && m !== C) {
+        const { h: P, s: N, v: y, a: E } = r;
+        o({ h: P, s: N, v: y }), p(E);
+      }
+      c !== d && ((k = e.onVisibleChange) == null || k.call(e, c), "popupVisible" in e || v(c));
+    },
+    [e.onVisibleChange, d, m]
+  );
+  return {
+    value: m,
+    popupVisible: d,
+    color: b,
+    alpha: t,
+    onHsvChange: (c) => {
+      o(c), g && t !== 100 && p(100);
+    },
+    onAlphaChange: (c) => {
+      p(c);
+    },
+    onVisibleChange: f
+  };
+}, de = {
+  size: "default",
+  presetColors: ue
+};
+function pe(e, i) {
+  const { getPrefixCls: a, componentConfig: g } = R(S), u = re(
+    e,
+    de,
+    g == null ? void 0 : g.ColorPicker
+  ), {
+    style: m,
+    className: s,
+    size: r,
+    disabled: d,
+    disabledAlpha: v = !1,
+    triggerProps: l = {},
+    unmountOnExit: o,
+    showText: t,
+    historyColors: p,
+    presetColors: b,
+    showHistory: C,
+    showPreset: f,
+    renderFooter: I
+  } = u, $ = a("color-picker"), {
+    value: c,
+    popupVisible: k,
+    color: P,
+    alpha: N,
+    colorString: y,
+    onHsvChange: E,
+    onAlphaChange: L,
+    onVisibleChange: B
+  } = me(u);
+  return /* @__PURE__ */ n(
+    J,
+    {
+      popup: () => /* @__PURE__ */ n(
+        ae,
+        {
+          color: P,
+          alpha: N,
+          colorString: y,
+          historyColors: p,
+          presetColors: b,
+          showHistory: C,
+          showPreset: f,
+          onHsvChange: E,
+          onAlphaChange: L,
+          disabledAlpha: v,
+          renderFooter: I
+        }
+      ),
+      trigger: "click",
+      position: "bl",
+      popupAlign: {
+        top: 8,
+        bottom: 8,
+        left: 8,
+        right: 8
+      },
+      disabled: d,
+      popupVisible: k,
+      classNames: "slideDynamicOrigin",
+      unmountOnExit: o,
+      ...l,
+      onVisibleChange: B,
+      children: (() => {
+        const h = Q(e.triggerElement) ? e.triggerElement({ value: c }) : e.triggerElement;
+        return Z(h) ? /* @__PURE__ */ x(
+          "div",
+          {
+            className: A($, s, {
+              [`${$}-size-${r}`]: r,
+              [`${$}-disabled`]: d
+            }),
+            style: m,
+            ref: i,
+            children: [
+              /* @__PURE__ */ n(
+                "div",
+                {
+                  className: `${$}-preview`,
+                  style: { backgroundColor: c }
+                }
+              ),
+              !!t && /* @__PURE__ */ x("div", { className: `${$}-value`, children: [
+                c,
+                !d && /* @__PURE__ */ n(te, { text: c, className: `${$}-copy` })
+              ] }),
+              /* @__PURE__ */ n(
+                "input",
+                {
+                  className: `${$}-input`,
+                  value: c,
+                  disabled: d,
+                  readOnly: !0
+                }
+              ),
+              u.extra
+            ]
+          }
+        ) : h;
+      })()
+    }
+  );
+}
+const fe = ee.forwardRef(
+  pe
+);
+fe.displayName = "ColorPicker";
+export {
+  fe as default
+};

package/Comment.js

@@ -0,0 +1,74 @@
+import { jsxs as n, jsx as a } from "react/jsx-runtime";
+import "./chunk/DP2rzg_V.js";
+import g from "lodash/isPlainObject";
+import N from "lodash/isString";
+import { forwardRef as v, useContext as u } from "react";
+import { a as C } from "./chunk/Dc_89PVN.js";
+import x from "./hooks/useMergeProps.js";
+import d from "@unicom-cloud/utils/class-name";
+import { pickDataAttributes as P } from "./utils/pick.js";
+const j = {
+  datetime: "left",
+  actions: "left"
+}, y = {
+  align: "left"
+};
+function b(f, p) {
+  const { getPrefixCls: $, componentConfig: s, rtl: h } = u(C), e = x(
+    f,
+    y,
+    s == null ? void 0 : s.Comment
+  ), t = $("comment"), { actions: m, author: r, avatar: i, content: o, datetime: l } = e, c = {
+    ...j,
+    ...g(e.align) ? e.align : {
+      datetime: e.align,
+      actions: e.align
+    }
+  };
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      ref: p,
+      className: d(
+        `${t}`,
+        { [`${t}-rtl`]: h },
+        e.className
+      ),
+      style: e.style,
+      ...P(e),
+      children: [
+        i && /* @__PURE__ */ a("div", { className: d(`${t}-avatar`), children: N(i) ? /* @__PURE__ */ a("img", { src: i, alt: "comment-avatar" }) : i }),
+        /* @__PURE__ */ n("div", { className: `${t}-inner`, children: [
+          /* @__PURE__ */ n("div", { className: `${t}-inner-content`, children: [
+            (r || l) && /* @__PURE__ */ n(
+              "div",
+              {
+                className: `${t}-title ${t}-title-align-${c.datetime}`,
+                children: [
+                  r && /* @__PURE__ */ a("span", { className: `${t}-author`, children: r }),
+                  l && /* @__PURE__ */ a("span", { className: `${t}-datetime`, children: l })
+                ]
+              }
+            ),
+            o && /* @__PURE__ */ a("div", { className: `${t}-content`, children: o }),
+            m && /* @__PURE__ */ a(
+              "div",
+              {
+                className: `${t}-actions ${t}-actions-align-${c.actions}`,
+                children: m
+              }
+            )
+          ] }),
+          e.children && /* @__PURE__ */ a("div", { className: `${t}-inner-comment`, children: e.children })
+        ] })
+      ]
+    }
+  );
+}
+const A = v(
+  b
+);
+A.displayName = "Comment";
+export {
+  A as default
+};

package/ConfigProvider.js

@@ -0,0 +1,8 @@
+import "./chunk/DP2rzg_V.js";
+import { b as t } from "./chunk/Dc_89PVN.js";
+import { C as f, a as i } from "./chunk/Dc_89PVN.js";
+export {
+  f as ConfigConsumer,
+  i as ConfigContext,
+  t as default
+};