@notificationapi/react 0.0.30 → 0.0.32

package/dist/assets/button.js

@@ -1,600 +1,1405 @@
-import * as j from "react";
-import a, { forwardRef as Co, useContext as _, useMemo as Fo, useState as mo, Children as Vo, useEffect as po, createRef as qo } from "react";
-import { c as O } from "./index3.js";
-import { h as Xo, j as Uo, k as Jo, e as Ko, o as Qo, W as Yo } from "./index4.js";
-import { a as yo, h as Zo, e as vo, c as ko, j as oe, d as ee, m as L, k as M, g as te, u as I, l as ne, n as re, D as ie, o as le } from "./colors.js";
-var ae = function(o, e) {
-  var t = {};
-  for (var n in o)
-    Object.prototype.hasOwnProperty.call(o, n) && e.indexOf(n) < 0 && (t[n] = o[n]);
-  if (o != null && typeof Object.getOwnPropertySymbols == "function")
-    for (var r = 0, n = Object.getOwnPropertySymbols(o); r < n.length; r++)
-      e.indexOf(n[r]) < 0 && Object.prototype.propertyIsEnumerable.call(o, n[r]) && (t[n[r]] = o[n[r]]);
-  return t;
+import * as ee from "react";
+import u, { forwardRef as ie, useState as ye, useRef as j, useEffect as ne, useMemo as te, useContext as he, Children as pt, createRef as Ct } from "react";
+import { c as L, f as _, d as Xe, _ as P, b as yt, e as U, a as fe } from "./presets.js";
+import { l as St, u as xt, m as Ht, n as $t, e as Bt, o as Et, W as _t } from "./index3.js";
+import { a as Ye, l as Ot, e as Ue, c as Rt, n as Lt, d as wt, o as Nt, p as Pt, q as Je, s as Ke, t as Qe, m as ae, v as me, g as Dt, u as re, k as zt, w as It, D as jt, j as Tt } from "./colors.js";
+var Mt = function(e, t) {
+  var r = {};
+  for (var o in e) Object.prototype.hasOwnProperty.call(e, o) && t.indexOf(o) < 0 && (r[o] = e[o]);
+  if (e != null && typeof Object.getOwnPropertySymbols == "function") for (var n = 0, o = Object.getOwnPropertySymbols(e); n < o.length; n++)
+    t.indexOf(o[n]) < 0 && Object.prototype.propertyIsEnumerable.call(e, o[n]) && (r[o[n]] = e[o[n]]);
+  return r;
 };
-const $o = /* @__PURE__ */ j.createContext(void 0), ce = (o) => {
+const Ze = /* @__PURE__ */ ee.createContext(void 0), At = (e) => {
   const {
-    getPrefixCls: e,
-    direction: t
-  } = j.useContext(yo), {
-    prefixCls: n,
-    size: r,
+    getPrefixCls: t,
+    direction: r
+  } = ee.useContext(Ye), {
+    prefixCls: o,
+    size: n,
     className: i
-  } = o, l = ae(o, ["prefixCls", "size", "className"]), c = e("btn-group", n), [, , m] = Zo();
-  let u = "";
-  switch (r) {
+  } = e, s = Mt(e, ["prefixCls", "size", "className"]), a = t("btn-group", o), [, , l] = Ot();
+  let c = "";
+  switch (n) {
     case "large":
-      u = "lg";
+      c = "lg";
       break;
     case "small":
-      u = "sm";
+      c = "sm";
       break;
   }
   if (process.env.NODE_ENV !== "production") {
-    const f = vo("Button.Group");
-    process.env.NODE_ENV !== "production" && f(!r || ["large", "small", "middle"].includes(r), "usage", "Invalid prop `size`.");
-  }
-  const p = O(c, {
-    [`${c}-${u}`]: u,
-    [`${c}-rtl`]: t === "rtl"
-  }, i, m);
-  return /* @__PURE__ */ j.createElement($o.Provider, {
-    value: r
-  }, /* @__PURE__ */ j.createElement("div", Object.assign({}, l, {
-    className: p
+    const g = Ue("Button.Group");
+    process.env.NODE_ENV !== "production" && g(!n || ["large", "small", "middle"].includes(n), "usage", "Invalid prop `size`.");
+  }
+  const d = L(a, {
+    [`${a}-${c}`]: c,
+    [`${a}-rtl`]: r === "rtl"
+  }, i, l);
+  return /* @__PURE__ */ ee.createElement(Ze.Provider, {
+    value: n
+  }, /* @__PURE__ */ ee.createElement("div", Object.assign({}, s, {
+    className: d
   })));
-}, bo = /^[\u4e00-\u9fa5]{2}$/, q = bo.test.bind(bo);
-function Ge(o) {
-  return o === "danger" ? {
+}, Ge = /^[\u4E00-\u9FA5]{2}$/, Se = Ge.test.bind(Ge);
+function Mr(e) {
+  return e === "danger" ? {
     danger: !0
   } : {
-    type: o
+    type: e
   };
 }
-function fo(o) {
-  return typeof o == "string";
+function We(e) {
+  return typeof e == "string";
 }
-function z(o) {
-  return o === "text" || o === "link";
+function oe(e) {
+  return e === "text" || e === "link";
 }
-function se(o, e) {
-  if (o == null)
+function Gt(e, t) {
+  if (e == null)
     return;
-  const t = e ? " " : "";
-  return typeof o != "string" && typeof o != "number" && fo(o.type) && q(o.props.children) ? ko(o, {
-    children: o.props.children.split("").join(t)
-  }) : fo(o) ? q(o) ? /* @__PURE__ */ a.createElement("span", null, o.split("").join(t)) : /* @__PURE__ */ a.createElement("span", null, o) : oe(o) ? /* @__PURE__ */ a.createElement("span", null, o) : o;
+  const r = t ? " " : "";
+  return typeof e != "string" && typeof e != "number" && We(e.type) && Se(e.props.children) ? Rt(e, {
+    children: e.props.children.split("").join(r)
+  }) : We(e) ? Se(e) ? /* @__PURE__ */ u.createElement("span", null, e.split("").join(r)) : /* @__PURE__ */ u.createElement("span", null, e) : Lt(e) ? /* @__PURE__ */ u.createElement("span", null, e) : e;
 }
-function de(o, e) {
-  let t = !1;
-  const n = [];
-  return a.Children.forEach(o, (r) => {
-    const i = typeof r, l = i === "string" || i === "number";
-    if (t && l) {
-      const c = n.length - 1, m = n[c];
-      n[c] = `${m}${r}`;
+function Wt(e, t) {
+  let r = !1;
+  const o = [];
+  return u.Children.forEach(e, (n) => {
+    const i = typeof n, s = i === "string" || i === "number";
+    if (r && s) {
+      const a = o.length - 1, l = o[a];
+      o[a] = `${l}${n}`;
     } else
-      n.push(r);
-    t = l;
-  }), a.Children.map(n, (r) => se(r, e));
+      o.push(n);
+    r = s;
+  }), u.Children.map(o, (n) => Gt(n, t));
 }
-const Bo = /* @__PURE__ */ Co((o, e) => {
+const ke = /* @__PURE__ */ ie((e, t) => {
   const {
-    className: t,
-    style: n,
-    children: r,
+    className: r,
+    style: o,
+    children: n,
     prefixCls: i
-  } = o, l = O(`${i}-icon`, t);
-  return /* @__PURE__ */ a.createElement("span", {
-    ref: e,
-    className: l,
-    style: n
-  }, r);
-}), ho = /* @__PURE__ */ Co((o, e) => {
+  } = e, s = L(`${i}-icon`, r);
+  return /* @__PURE__ */ u.createElement("span", {
+    ref: t,
+    className: s,
+    style: o
+  }, n);
+}), Ve = /* @__PURE__ */ ie((e, t) => {
   const {
-    prefixCls: t,
-    className: n,
-    style: r,
-    iconClassName: i,
-    iconPosition: l = "start"
-  } = o, c = O(n, {
-    [`${t}-loading-icon-end`]: l === "end",
-    [`${t}-loading-icon`]: l === "start"
-  });
-  return /* @__PURE__ */ a.createElement(Bo, {
-    prefixCls: t,
-    className: c,
-    style: r,
-    ref: e
-  }, /* @__PURE__ */ a.createElement(Xo, {
+    prefixCls: r,
+    className: o,
+    style: n,
+    iconClassName: i
+  } = e, s = L(`${r}-loading-icon`, o);
+  return /* @__PURE__ */ u.createElement(ke, {
+    prefixCls: r,
+    className: s,
+    style: n,
+    ref: t
+  }, /* @__PURE__ */ u.createElement(St, {
     className: i
   }));
-}), F = () => ({
+}), ve = () => ({
   width: 0,
   opacity: 0,
   transform: "scale(0)"
-}), V = (o) => ({
-  width: o.scrollWidth,
+}), be = (e) => ({
+  width: e.scrollWidth,
   opacity: 1,
   transform: "scale(1)"
-}), ue = (o) => {
+}), Vt = (e) => {
   const {
-    prefixCls: e,
-    loading: t,
-    existIcon: n,
-    className: r,
-    style: i,
-    iconPosition: l
-  } = o, c = !!t;
-  return n ? /* @__PURE__ */ a.createElement(ho, {
-    prefixCls: e,
-    className: r,
-    style: i,
-    iconPosition: l
-  }) : /* @__PURE__ */ a.createElement(ee, {
-    visible: c,
+    prefixCls: t,
+    loading: r,
+    existIcon: o,
+    className: n,
+    style: i
+  } = e, s = !!r;
+  return o ? /* @__PURE__ */ u.createElement(Ve, {
+    prefixCls: t,
+    className: n,
+    style: i
+  }) : /* @__PURE__ */ u.createElement(wt, {
+    visible: s,
     // We do not really use this motionName
-    motionName: `${e}-loading-icon-motion`,
-    motionLeave: c,
+    motionName: `${t}-loading-icon-motion`,
+    motionLeave: s,
     removeOnLeave: !0,
-    onAppearStart: F,
-    onAppearActive: V,
-    onEnterStart: F,
-    onEnterActive: V,
-    onLeaveStart: V,
-    onLeaveActive: F
-  }, (m, u) => {
+    onAppearStart: ve,
+    onAppearActive: be,
+    onEnterStart: ve,
+    onEnterActive: be,
+    onLeaveStart: be,
+    onLeaveActive: ve
+  }, (a, l) => {
     let {
-      className: p,
-      style: f
-    } = m;
-    return /* @__PURE__ */ a.createElement(ho, {
-      prefixCls: e,
-      className: r,
-      style: Object.assign(Object.assign({}, i), f),
-      ref: u,
-      iconClassName: p,
-      iconPosition: l
+      className: c,
+      style: d
+    } = a;
+    return /* @__PURE__ */ u.createElement(Ve, {
+      prefixCls: t,
+      className: n,
+      style: Object.assign(Object.assign({}, i), d),
+      ref: l,
+      iconClassName: c
     });
   });
-}, So = (o, e) => ({
+}, Fe = (e, t) => ({
   // Border
-  [`> span, > ${o}`]: {
+  [`> span, > ${e}`]: {
     "&:not(:last-child)": {
-      [`&, & > ${o}`]: {
+      [`&, & > ${e}`]: {
         "&:not(:disabled)": {
-          borderInlineEndColor: e
+          borderInlineEndColor: t
         }
       }
     },
     "&:not(:first-child)": {
-      [`&, & > ${o}`]: {
+      [`&, & > ${e}`]: {
         "&:not(:disabled)": {
-          borderInlineStartColor: e
+          borderInlineStartColor: t
         }
       }
     }
   }
-}), ge = (o) => {
+}), Ft = (e) => {
   const {
-    componentCls: e,
-    fontSize: t,
-    lineWidth: n,
-    groupBorderColor: r,
+    componentCls: t,
+    fontSize: r,
+    lineWidth: o,
+    groupBorderColor: n,
     colorErrorHover: i
-  } = o;
+  } = e;
   return {
-    [`${e}-group`]: [
+    [`${t}-group`]: [
       {
         position: "relative",
         display: "inline-flex",
         // Border
-        [`> span, > ${e}`]: {
+        [`> span, > ${t}`]: {
           "&:not(:last-child)": {
-            [`&, & > ${e}`]: {
+            [`&, & > ${t}`]: {
               borderStartEndRadius: 0,
               borderEndEndRadius: 0
             }
           },
           "&:not(:first-child)": {
-            marginInlineStart: o.calc(n).mul(-1).equal(),
-            [`&, & > ${e}`]: {
+            marginInlineStart: e.calc(o).mul(-1).equal(),
+            [`&, & > ${t}`]: {
               borderStartStartRadius: 0,
               borderEndStartRadius: 0
             }
           }
         },
-        [e]: {
+        [t]: {
           position: "relative",
           zIndex: 1,
-          "&:hover,\n          &:focus,\n          &:active": {
+          "&:hover, &:focus, &:active": {
             zIndex: 2
           },
           "&[disabled]": {
             zIndex: 0
           }
         },
-        [`${e}-icon-only`]: {
-          fontSize: t
+        [`${t}-icon-only`]: {
+          fontSize: r
         }
       },
       // Border Color
-      So(`${e}-primary`, r),
-      So(`${e}-danger`, i)
+      Fe(`${t}-primary`, n),
+      Fe(`${t}-danger`, i)
     ]
   };
-}, Oo = (o) => {
+}, $ = Math.round;
+function pe(e, t) {
+  const r = e.replace(/^[^(]*\((.*)/, "$1").replace(/\).*/, "").match(/\d*\.?\d+%?/g) || [], o = r.map((n) => parseFloat(n));
+  for (let n = 0; n < 3; n += 1)
+    o[n] = t(o[n] || 0, r[n] || "", n);
+  return r[3] ? o[3] = r[3].includes("%") ? o[3] / 100 : o[3] : o[3] = 1, o;
+}
+const qe = (e, t, r) => r === 0 ? e : e / 100;
+function k(e, t) {
+  const r = t || 255;
+  return e > r ? r : e < 0 ? 0 : e;
+}
+class se {
+  constructor(t) {
+    _(this, "isValid", !0), _(this, "r", 0), _(this, "g", 0), _(this, "b", 0), _(this, "a", 1), _(this, "_h", void 0), _(this, "_s", void 0), _(this, "_l", void 0), _(this, "_v", void 0), _(this, "_max", void 0), _(this, "_min", void 0), _(this, "_brightness", void 0);
+    function r(o) {
+      return o[0] in t && o[1] in t && o[2] in t;
+    }
+    if (t) if (typeof t == "string") {
+      let n = function(i) {
+        return o.startsWith(i);
+      };
+      const o = t.trim();
+      /^#?[A-F\d]{3,8}$/i.test(o) ? this.fromHexString(o) : n("rgb") ? this.fromRgbString(o) : n("hsl") ? this.fromHslString(o) : (n("hsv") || n("hsb")) && this.fromHsvString(o);
+    } else if (t instanceof se)
+      this.r = t.r, this.g = t.g, this.b = t.b, this.a = t.a, this._h = t._h, this._s = t._s, this._l = t._l, this._v = t._v;
+    else if (r("rgb"))
+      this.r = k(t.r), this.g = k(t.g), this.b = k(t.b), this.a = typeof t.a == "number" ? k(t.a, 1) : 1;
+    else if (r("hsl"))
+      this.fromHsl(t);
+    else if (r("hsv"))
+      this.fromHsv(t);
+    else
+      throw new Error("@ant-design/fast-color: unsupported input " + JSON.stringify(t));
+  }
+  // ======================= Setter =======================
+  setR(t) {
+    return this._sc("r", t);
+  }
+  setG(t) {
+    return this._sc("g", t);
+  }
+  setB(t) {
+    return this._sc("b", t);
+  }
+  setA(t) {
+    return this._sc("a", t, 1);
+  }
+  setHue(t) {
+    const r = this.toHsv();
+    return r.h = t, this._c(r);
+  }
+  // ======================= Getter =======================
+  /**
+   * Returns the perceived luminance of a color, from 0-1.
+   * @see http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef
+   */
+  getLuminance() {
+    function t(i) {
+      const s = i / 255;
+      return s <= 0.03928 ? s / 12.92 : Math.pow((s + 0.055) / 1.055, 2.4);
+    }
+    const r = t(this.r), o = t(this.g), n = t(this.b);
+    return 0.2126 * r + 0.7152 * o + 0.0722 * n;
+  }
+  getHue() {
+    if (typeof this._h > "u") {
+      const t = this.getMax() - this.getMin();
+      t === 0 ? this._h = 0 : this._h = $(60 * (this.r === this.getMax() ? (this.g - this.b) / t + (this.g < this.b ? 6 : 0) : this.g === this.getMax() ? (this.b - this.r) / t + 2 : (this.r - this.g) / t + 4));
+    }
+    return this._h;
+  }
+  getSaturation() {
+    if (typeof this._s > "u") {
+      const t = this.getMax() - this.getMin();
+      t === 0 ? this._s = 0 : this._s = t / this.getMax();
+    }
+    return this._s;
+  }
+  getLightness() {
+    return typeof this._l > "u" && (this._l = (this.getMax() + this.getMin()) / 510), this._l;
+  }
+  getValue() {
+    return typeof this._v > "u" && (this._v = this.getMax() / 255), this._v;
+  }
+  /**
+   * Returns the perceived brightness of the color, from 0-255.
+   * Note: this is not the b of HSB
+   * @see http://www.w3.org/TR/AERT#color-contrast
+   */
+  getBrightness() {
+    return typeof this._brightness > "u" && (this._brightness = (this.r * 299 + this.g * 587 + this.b * 114) / 1e3), this._brightness;
+  }
+  // ======================== Func ========================
+  darken(t = 10) {
+    const r = this.getHue(), o = this.getSaturation();
+    let n = this.getLightness() - t / 100;
+    return n < 0 && (n = 0), this._c({
+      h: r,
+      s: o,
+      l: n,
+      a: this.a
+    });
+  }
+  lighten(t = 10) {
+    const r = this.getHue(), o = this.getSaturation();
+    let n = this.getLightness() + t / 100;
+    return n > 1 && (n = 1), this._c({
+      h: r,
+      s: o,
+      l: n,
+      a: this.a
+    });
+  }
+  /**
+   * Mix the current color a given amount with another color, from 0 to 100.
+   * 0 means no mixing (return current color).
+   */
+  mix(t, r = 50) {
+    const o = this._c(t), n = r / 100, i = (a) => (o[a] - this[a]) * n + this[a], s = {
+      r: $(i("r")),
+      g: $(i("g")),
+      b: $(i("b")),
+      a: $(i("a") * 100) / 100
+    };
+    return this._c(s);
+  }
+  /**
+   * Mix the color with pure white, from 0 to 100.
+   * Providing 0 will do nothing, providing 100 will always return white.
+   */
+  tint(t = 10) {
+    return this.mix({
+      r: 255,
+      g: 255,
+      b: 255,
+      a: 1
+    }, t);
+  }
+  /**
+   * Mix the color with pure black, from 0 to 100.
+   * Providing 0 will do nothing, providing 100 will always return black.
+   */
+  shade(t = 10) {
+    return this.mix({
+      r: 0,
+      g: 0,
+      b: 0,
+      a: 1
+    }, t);
+  }
+  onBackground(t) {
+    const r = this._c(t), o = this.a + r.a * (1 - this.a), n = (i) => $((this[i] * this.a + r[i] * r.a * (1 - this.a)) / o);
+    return this._c({
+      r: n("r"),
+      g: n("g"),
+      b: n("b"),
+      a: o
+    });
+  }
+  // ======================= Status =======================
+  isDark() {
+    return this.getBrightness() < 128;
+  }
+  isLight() {
+    return this.getBrightness() >= 128;
+  }
+  // ======================== MISC ========================
+  equals(t) {
+    return this.r === t.r && this.g === t.g && this.b === t.b && this.a === t.a;
+  }
+  clone() {
+    return this._c(this);
+  }
+  // ======================= Format =======================
+  toHexString() {
+    let t = "#";
+    const r = (this.r || 0).toString(16);
+    t += r.length === 2 ? r : "0" + r;
+    const o = (this.g || 0).toString(16);
+    t += o.length === 2 ? o : "0" + o;
+    const n = (this.b || 0).toString(16);
+    if (t += n.length === 2 ? n : "0" + n, typeof this.a == "number" && this.a >= 0 && this.a < 1) {
+      const i = $(this.a * 255).toString(16);
+      t += i.length === 2 ? i : "0" + i;
+    }
+    return t;
+  }
+  /** CSS support color pattern */
+  toHsl() {
+    return {
+      h: this.getHue(),
+      s: this.getSaturation(),
+      l: this.getLightness(),
+      a: this.a
+    };
+  }
+  /** CSS support color pattern */
+  toHslString() {
+    const t = this.getHue(), r = $(this.getSaturation() * 100), o = $(this.getLightness() * 100);
+    return this.a !== 1 ? `hsla(${t},${r}%,${o}%,${this.a})` : `hsl(${t},${r}%,${o}%)`;
+  }
+  /** Same as toHsb */
+  toHsv() {
+    return {
+      h: this.getHue(),
+      s: this.getSaturation(),
+      v: this.getValue(),
+      a: this.a
+    };
+  }
+  toRgb() {
+    return {
+      r: this.r,
+      g: this.g,
+      b: this.b,
+      a: this.a
+    };
+  }
+  toRgbString() {
+    return this.a !== 1 ? `rgba(${this.r},${this.g},${this.b},${this.a})` : `rgb(${this.r},${this.g},${this.b})`;
+  }
+  toString() {
+    return this.toRgbString();
+  }
+  // ====================== Privates ======================
+  /** Return a new FastColor object with one channel changed */
+  _sc(t, r, o) {
+    const n = this.clone();
+    return n[t] = k(r, o), n;
+  }
+  _c(t) {
+    return new this.constructor(t);
+  }
+  getMax() {
+    return typeof this._max > "u" && (this._max = Math.max(this.r, this.g, this.b)), this._max;
+  }
+  getMin() {
+    return typeof this._min > "u" && (this._min = Math.min(this.r, this.g, this.b)), this._min;
+  }
+  fromHexString(t) {
+    const r = t.replace("#", "");
+    function o(n, i) {
+      return parseInt(r[n] + r[i || n], 16);
+    }
+    r.length < 6 ? (this.r = o(0), this.g = o(1), this.b = o(2), this.a = r[3] ? o(3) / 255 : 1) : (this.r = o(0, 1), this.g = o(2, 3), this.b = o(4, 5), this.a = r[6] ? o(6, 7) / 255 : 1);
+  }
+  fromHsl({
+    h: t,
+    s: r,
+    l: o,
+    a: n
+  }) {
+    if (this._h = t % 360, this._s = r, this._l = o, this.a = typeof n == "number" ? n : 1, r <= 0) {
+      const b = $(o * 255);
+      this.r = b, this.g = b, this.b = b;
+    }
+    let i = 0, s = 0, a = 0;
+    const l = t / 60, c = (1 - Math.abs(2 * o - 1)) * r, d = c * (1 - Math.abs(l % 2 - 1));
+    l >= 0 && l < 1 ? (i = c, s = d) : l >= 1 && l < 2 ? (i = d, s = c) : l >= 2 && l < 3 ? (s = c, a = d) : l >= 3 && l < 4 ? (s = d, a = c) : l >= 4 && l < 5 ? (i = d, a = c) : l >= 5 && l < 6 && (i = c, a = d);
+    const g = o - c / 2;
+    this.r = $((i + g) * 255), this.g = $((s + g) * 255), this.b = $((a + g) * 255);
+  }
+  fromHsv({
+    h: t,
+    s: r,
+    v: o,
+    a: n
+  }) {
+    this._h = t % 360, this._s = r, this._v = o, this.a = typeof n == "number" ? n : 1;
+    const i = $(o * 255);
+    if (this.r = i, this.g = i, this.b = i, r <= 0)
+      return;
+    const s = t / 60, a = Math.floor(s), l = s - a, c = $(o * (1 - r) * 255), d = $(o * (1 - r * l) * 255), g = $(o * (1 - r * (1 - l)) * 255);
+    switch (a) {
+      case 0:
+        this.g = g, this.b = c;
+        break;
+      case 1:
+        this.r = d, this.b = c;
+        break;
+      case 2:
+        this.r = c, this.b = g;
+        break;
+      case 3:
+        this.r = c, this.g = d;
+        break;
+      case 4:
+        this.r = g, this.g = c;
+        break;
+      case 5:
+      default:
+        this.g = c, this.b = d;
+        break;
+    }
+  }
+  fromHsvString(t) {
+    const r = pe(t, qe);
+    this.fromHsv({
+      h: r[0],
+      s: r[1],
+      v: r[2],
+      a: r[3]
+    });
+  }
+  fromHslString(t) {
+    const r = pe(t, qe);
+    this.fromHsl({
+      h: r[0],
+      s: r[1],
+      l: r[2],
+      a: r[3]
+    });
+  }
+  fromRgbString(t) {
+    const r = pe(t, (o, n) => (
+      // Convert percentage to number. e.g. 50% -> 128
+      n.includes("%") ? $(o / 100 * 255) : o
+    ));
+    this.r = r[0], this.g = r[1], this.b = r[2], this.a = r[3];
+  }
+}
+var qt = ["b"], Xt = ["v"], Ce = function(t) {
+  return Math.round(Number(t || 0));
+}, Yt = function(t) {
+  if (t instanceof se)
+    return t;
+  if (t && yt(t) === "object" && "h" in t && "b" in t) {
+    var r = t, o = r.b, n = Xe(r, qt);
+    return P(P({}, n), {}, {
+      v: o
+    });
+  }
+  return typeof t == "string" && /hsb/.test(t) ? t.replace(/hsb/, "hsv") : t;
+}, D = /* @__PURE__ */ function(e) {
+  Nt(r, e);
+  var t = Pt(r);
+  function r(o) {
+    return Je(this, r), t.call(this, Yt(o));
+  }
+  return Ke(r, [{
+    key: "toHsbString",
+    value: function() {
+      var n = this.toHsb(), i = Ce(n.s * 100), s = Ce(n.b * 100), a = Ce(n.h), l = n.a, c = "hsb(".concat(a, ", ").concat(i, "%, ").concat(s, "%)"), d = "hsba(".concat(a, ", ").concat(i, "%, ").concat(s, "%, ").concat(l.toFixed(l === 0 ? 0 : 2), ")");
+      return l === 1 ? c : d;
+    }
+  }, {
+    key: "toHsb",
+    value: function() {
+      var n = this.toHsv(), i = n.v, s = Xe(n, Xt);
+      return P(P({}, s), {}, {
+        b: i,
+        a: this.a
+      });
+    }
+  }]), r;
+}(se), Ut = "rc-color-picker", Y = function(t) {
+  return t instanceof D ? t : new D(t);
+}, Jt = Y("#1677ff"), et = function(t) {
+  var r = t.offset, o = t.targetRef, n = t.containerRef, i = t.color, s = t.type, a = n.current.getBoundingClientRect(), l = a.width, c = a.height, d = o.current.getBoundingClientRect(), g = d.width, b = d.height, f = g / 2, p = b / 2, B = (r.x + f) / l, E = 1 - (r.y + p) / c, S = i.toHsb(), x = B, O = (r.x + f) / l * 360;
+  if (s)
+    switch (s) {
+      case "hue":
+        return Y(P(P({}, S), {}, {
+          h: O <= 0 ? 0 : O
+        }));
+      case "alpha":
+        return Y(P(P({}, S), {}, {
+          a: x <= 0 ? 0 : x
+        }));
+    }
+  return Y({
+    h: S.h,
+    s: B <= 0 ? 0 : B,
+    b: E >= 1 ? 1 : E,
+    a: S.a
+  });
+}, tt = function(t, r) {
+  var o = t.toHsb();
+  switch (r) {
+    case "hue":
+      return {
+        x: o.h / 360 * 100,
+        y: 50
+      };
+    case "alpha":
+      return {
+        x: t.a * 100,
+        y: 50
+      };
+    default:
+      return {
+        x: o.s * 100,
+        y: (1 - o.b) * 100
+      };
+  }
+}, Kt = function(t) {
+  var r = t.color, o = t.prefixCls, n = t.className, i = t.style, s = t.onClick, a = "".concat(o, "-color-block");
+  return /* @__PURE__ */ u.createElement("div", {
+    className: L(a, n),
+    style: i,
+    onClick: s
+  }, /* @__PURE__ */ u.createElement("div", {
+    className: "".concat(a, "-inner"),
+    style: {
+      background: r
+    }
+  }));
+};
+function Qt(e) {
+  var t = "touches" in e ? e.touches[0] : e, r = document.documentElement.scrollLeft || document.body.scrollLeft || window.pageXOffset, o = document.documentElement.scrollTop || document.body.scrollTop || window.pageYOffset;
+  return {
+    pageX: t.pageX - r,
+    pageY: t.pageY - o
+  };
+}
+function rt(e) {
+  var t = e.targetRef, r = e.containerRef, o = e.direction, n = e.onDragChange, i = e.onDragChangeComplete, s = e.calculate, a = e.color, l = e.disabledDrag, c = ye({
+    x: 0,
+    y: 0
+  }), d = U(c, 2), g = d[0], b = d[1], f = j(null), p = j(null);
+  ne(function() {
+    b(s());
+  }, [a]), ne(function() {
+    return function() {
+      document.removeEventListener("mousemove", f.current), document.removeEventListener("mouseup", p.current), document.removeEventListener("touchmove", f.current), document.removeEventListener("touchend", p.current), f.current = null, p.current = null;
+    };
+  }, []);
+  var B = function(h) {
+    var y = Qt(h), K = y.pageX, T = y.pageY, w = r.current.getBoundingClientRect(), z = w.x, M = w.y, A = w.width, F = w.height, R = t.current.getBoundingClientRect(), q = R.width, I = R.height, G = q / 2, W = I / 2, m = Math.max(0, Math.min(K - z, A)) - G, C = Math.max(0, Math.min(T - M, F)) - W, v = {
+      x: m,
+      y: o === "x" ? g.y : C
+    };
+    if (q === 0 && I === 0 || q !== I)
+      return !1;
+    n == null || n(v);
+  }, E = function(h) {
+    h.preventDefault(), B(h);
+  }, S = function(h) {
+    h.preventDefault(), document.removeEventListener("mousemove", f.current), document.removeEventListener("mouseup", p.current), document.removeEventListener("touchmove", f.current), document.removeEventListener("touchend", p.current), f.current = null, p.current = null, i == null || i();
+  }, x = function(h) {
+    document.removeEventListener("mousemove", f.current), document.removeEventListener("mouseup", p.current), !l && (B(h), document.addEventListener("mousemove", E), document.addEventListener("mouseup", S), document.addEventListener("touchmove", E), document.addEventListener("touchend", S), f.current = E, p.current = S);
+  };
+  return [g, x];
+}
+var ot = function(t) {
+  var r = t.size, o = r === void 0 ? "default" : r, n = t.color, i = t.prefixCls;
+  return /* @__PURE__ */ u.createElement("div", {
+    className: L("".concat(i, "-handler"), _({}, "".concat(i, "-handler-sm"), o === "small")),
+    style: {
+      backgroundColor: n
+    }
+  });
+}, nt = function(t) {
+  var r = t.children, o = t.style, n = t.prefixCls;
+  return /* @__PURE__ */ u.createElement("div", {
+    className: "".concat(n, "-palette"),
+    style: P({
+      position: "relative"
+    }, o)
+  }, r);
+}, it = /* @__PURE__ */ ie(function(e, t) {
+  var r = e.children, o = e.x, n = e.y;
+  return /* @__PURE__ */ u.createElement("div", {
+    ref: t,
+    style: {
+      position: "absolute",
+      left: "".concat(o, "%"),
+      top: "".concat(n, "%"),
+      zIndex: 1,
+      transform: "translate(-50%, -50%)"
+    }
+  }, r);
+}), Zt = function(t) {
+  var r = t.color, o = t.onChange, n = t.prefixCls, i = t.onChangeComplete, s = t.disabled, a = j(), l = j(), c = j(r), d = Qe(function(B) {
+    var E = et({
+      offset: B,
+      targetRef: l,
+      containerRef: a,
+      color: r
+    });
+    c.current = E, o(E);
+  }), g = rt({
+    color: r,
+    containerRef: a,
+    targetRef: l,
+    calculate: function() {
+      return tt(r);
+    },
+    onDragChange: d,
+    onDragChangeComplete: function() {
+      return i == null ? void 0 : i(c.current);
+    },
+    disabledDrag: s
+  }), b = U(g, 2), f = b[0], p = b[1];
+  return /* @__PURE__ */ u.createElement("div", {
+    ref: a,
+    className: "".concat(n, "-select"),
+    onMouseDown: p,
+    onTouchStart: p
+  }, /* @__PURE__ */ u.createElement(nt, {
+    prefixCls: n
+  }, /* @__PURE__ */ u.createElement(it, {
+    x: f.x,
+    y: f.y,
+    ref: l
+  }, /* @__PURE__ */ u.createElement(ot, {
+    color: r.toRgbString(),
+    prefixCls: n
+  })), /* @__PURE__ */ u.createElement("div", {
+    className: "".concat(n, "-saturation"),
+    style: {
+      backgroundColor: "hsl(".concat(r.toHsb().h, ",100%, 50%)"),
+      backgroundImage: "linear-gradient(0deg, #000, transparent),linear-gradient(90deg, #fff, hsla(0, 0%, 100%, 0))"
+    }
+  })));
+}, kt = function(t, r) {
+  var o = xt(t, {
+    value: r
+  }), n = U(o, 2), i = n[0], s = n[1], a = te(function() {
+    return Y(i);
+  }, [i]);
+  return [a, s];
+}, er = function(t) {
+  var r = t.colors, o = t.children, n = t.direction, i = n === void 0 ? "to right" : n, s = t.type, a = t.prefixCls, l = te(function() {
+    return r.map(function(c, d) {
+      var g = Y(c);
+      return s === "alpha" && d === r.length - 1 && (g = new D(g.setA(1))), g.toRgbString();
+    }).join(",");
+  }, [r, s]);
+  return /* @__PURE__ */ u.createElement("div", {
+    className: "".concat(a, "-gradient"),
+    style: {
+      position: "absolute",
+      inset: 0,
+      background: "linear-gradient(".concat(i, ", ").concat(l, ")")
+    }
+  }, o);
+}, tr = function(t) {
+  var r = t.prefixCls, o = t.colors, n = t.disabled, i = t.onChange, s = t.onChangeComplete, a = t.color, l = t.type, c = j(), d = j(), g = j(a), b = function(y) {
+    return l === "hue" ? y.getHue() : y.a * 100;
+  }, f = Qe(function(h) {
+    var y = et({
+      offset: h,
+      targetRef: d,
+      containerRef: c,
+      color: a,
+      type: l
+    });
+    g.current = y, i(b(y));
+  }), p = rt({
+    color: a,
+    targetRef: d,
+    containerRef: c,
+    calculate: function() {
+      return tt(a, l);
+    },
+    onDragChange: f,
+    onDragChangeComplete: function() {
+      s(b(g.current));
+    },
+    direction: "x",
+    disabledDrag: n
+  }), B = U(p, 2), E = B[0], S = B[1], x = u.useMemo(function() {
+    if (l === "hue") {
+      var h = a.toHsb();
+      h.s = 1, h.b = 1, h.a = 1;
+      var y = new D(h);
+      return y;
+    }
+    return a;
+  }, [a, l]), O = u.useMemo(function() {
+    return o.map(function(h) {
+      return "".concat(h.color, " ").concat(h.percent, "%");
+    });
+  }, [o]);
+  return /* @__PURE__ */ u.createElement("div", {
+    ref: c,
+    className: L("".concat(r, "-slider"), "".concat(r, "-slider-").concat(l)),
+    onMouseDown: S,
+    onTouchStart: S
+  }, /* @__PURE__ */ u.createElement(nt, {
+    prefixCls: r
+  }, /* @__PURE__ */ u.createElement(it, {
+    x: E.x,
+    y: E.y,
+    ref: d
+  }, /* @__PURE__ */ u.createElement(ot, {
+    size: "small",
+    color: x.toHexString(),
+    prefixCls: r
+  })), /* @__PURE__ */ u.createElement(er, {
+    colors: O,
+    type: l,
+    prefixCls: r
+  })));
+};
+function rr(e) {
+  return ee.useMemo(function() {
+    var t = e || {}, r = t.slider;
+    return [r || tr];
+  }, [e]);
+}
+var or = [{
+  color: "rgb(255, 0, 0)",
+  percent: 0
+}, {
+  color: "rgb(255, 255, 0)",
+  percent: 17
+}, {
+  color: "rgb(0, 255, 0)",
+  percent: 33
+}, {
+  color: "rgb(0, 255, 255)",
+  percent: 50
+}, {
+  color: "rgb(0, 0, 255)",
+  percent: 67
+}, {
+  color: "rgb(255, 0, 255)",
+  percent: 83
+}, {
+  color: "rgb(255, 0, 0)",
+  percent: 100
+}], nr = /* @__PURE__ */ ie(function(e, t) {
+  var r = e.value, o = e.defaultValue, n = e.prefixCls, i = n === void 0 ? Ut : n, s = e.onChange, a = e.onChangeComplete, l = e.className, c = e.style, d = e.panelRender, g = e.disabledAlpha, b = g === void 0 ? !1 : g, f = e.disabled, p = f === void 0 ? !1 : f, B = e.components, E = rr(B), S = U(E, 1), x = S[0], O = kt(o || Jt, r), h = U(O, 2), y = h[0], K = h[1], T = te(function() {
+    return y.setA(1).toRgbString();
+  }, [y]), w = function(C, v) {
+    r || K(C), s == null || s(C, v);
+  }, z = function(C) {
+    return new D(y.setHue(C));
+  }, M = function(C) {
+    return new D(y.setA(C / 100));
+  }, A = function(C) {
+    w(z(C), {
+      type: "hue",
+      value: C
+    });
+  }, F = function(C) {
+    w(M(C), {
+      type: "alpha",
+      value: C
+    });
+  }, R = function(C) {
+    a && a(z(C));
+  }, q = function(C) {
+    a && a(M(C));
+  }, I = L("".concat(i, "-panel"), l, _({}, "".concat(i, "-panel-disabled"), p)), G = {
+    prefixCls: i,
+    disabled: p,
+    color: y
+  }, W = /* @__PURE__ */ u.createElement(u.Fragment, null, /* @__PURE__ */ u.createElement(Zt, fe({
+    onChange: w
+  }, G, {
+    onChangeComplete: a
+  })), /* @__PURE__ */ u.createElement("div", {
+    className: "".concat(i, "-slider-container")
+  }, /* @__PURE__ */ u.createElement("div", {
+    className: L("".concat(i, "-slider-group"), _({}, "".concat(i, "-slider-group-disabled-alpha"), b))
+  }, /* @__PURE__ */ u.createElement(x, fe({}, G, {
+    type: "hue",
+    colors: or,
+    min: 0,
+    max: 359,
+    value: y.getHue(),
+    onChange: A,
+    onChangeComplete: R
+  })), !b && /* @__PURE__ */ u.createElement(x, fe({}, G, {
+    type: "alpha",
+    colors: [{
+      percent: 0,
+      color: "rgba(255, 0, 4, 0)"
+    }, {
+      percent: 100,
+      color: T
+    }],
+    min: 0,
+    max: 100,
+    value: y.a * 100,
+    onChange: F,
+    onChangeComplete: q
+  }))), /* @__PURE__ */ u.createElement(Kt, {
+    color: y.toRgbString(),
+    prefixCls: i
+  })));
+  return /* @__PURE__ */ u.createElement("div", {
+    className: I,
+    style: c,
+    ref: t
+  }, typeof d == "function" ? d(W) : W);
+});
+process.env.NODE_ENV !== "production" && (nr.displayName = "ColorPicker");
+const ir = (e, t) => (e == null ? void 0 : e.replace(/[^\w/]/g, "").slice(0, t ? 8 : 6)) || "", ar = (e, t) => e ? ir(e, t) : "";
+let sr = /* @__PURE__ */ function() {
+  function e(t) {
+    Je(this, e);
+    var r;
+    if (this.cleared = !1, t instanceof e) {
+      this.metaColor = t.metaColor.clone(), this.colors = (r = t.colors) === null || r === void 0 ? void 0 : r.map((n) => ({
+        color: new e(n.color),
+        percent: n.percent
+      })), this.cleared = t.cleared;
+      return;
+    }
+    const o = Array.isArray(t);
+    o && t.length ? (this.colors = t.map((n) => {
+      let {
+        color: i,
+        percent: s
+      } = n;
+      return {
+        color: new e(i),
+        percent: s
+      };
+    }), this.metaColor = new D(this.colors[0].color.metaColor)) : this.metaColor = new D(o ? "" : t), (!t || o && !this.colors) && (this.metaColor = this.metaColor.setA(0), this.cleared = !0);
+  }
+  return Ke(e, [{
+    key: "toHsb",
+    value: function() {
+      return this.metaColor.toHsb();
+    }
+  }, {
+    key: "toHsbString",
+    value: function() {
+      return this.metaColor.toHsbString();
+    }
+  }, {
+    key: "toHex",
+    value: function() {
+      return ar(this.toHexString(), this.metaColor.a < 1);
+    }
+  }, {
+    key: "toHexString",
+    value: function() {
+      return this.metaColor.toHexString();
+    }
+  }, {
+    key: "toRgb",
+    value: function() {
+      return this.metaColor.toRgb();
+    }
+  }, {
+    key: "toRgbString",
+    value: function() {
+      return this.metaColor.toRgbString();
+    }
+  }, {
+    key: "isGradient",
+    value: function() {
+      return !!this.colors && !this.cleared;
+    }
+  }, {
+    key: "getColors",
+    value: function() {
+      return this.colors || [{
+        color: this,
+        percent: 0
+      }];
+    }
+  }, {
+    key: "toCssString",
+    value: function() {
+      const {
+        colors: r
+      } = this;
+      return r ? `linear-gradient(90deg, ${r.map((n) => `${n.color.toRgbString()} ${n.percent}%`).join(", ")})` : this.metaColor.toRgbString();
+    }
+  }, {
+    key: "equals",
+    value: function(r) {
+      return !r || this.isGradient() !== r.isGradient() ? !1 : this.isGradient() ? this.colors.length === r.colors.length && this.colors.every((o, n) => {
+        const i = r.colors[n];
+        return o.percent === i.percent && o.color.equals(i.color);
+      }) : this.toHexString() === r.toHexString();
+    }
+  }]);
+}();
+const lr = (e, t) => {
   const {
-    paddingInline: e,
-    onlyIconSize: t,
-    paddingBlock: n
-  } = o;
-  return L(o, {
-    buttonPaddingHorizontal: e,
-    buttonPaddingVertical: n,
-    buttonIconOnlyFontSize: t
+    r,
+    g: o,
+    b: n,
+    a: i
+  } = e.toRgb(), s = new D(e.toRgbString()).onBackground(t).toHsv();
+  return i <= 0.5 ? s.v > 0.5 : r * 0.299 + o * 0.587 + n * 0.114 > 192;
+}, at = (e) => {
+  const {
+    paddingInline: t,
+    onlyIconSize: r,
+    paddingBlock: o
+  } = e;
+  return ae(e, {
+    buttonPaddingHorizontal: t,
+    buttonPaddingVertical: o,
+    buttonIconOnlyFontSize: r
   });
-}, Eo = (o) => {
-  var e, t, n, r, i, l;
-  const c = (e = o.contentFontSize) !== null && e !== void 0 ? e : o.fontSize, m = (t = o.contentFontSizeSM) !== null && t !== void 0 ? t : o.fontSize, u = (n = o.contentFontSizeLG) !== null && n !== void 0 ? n : o.fontSizeLG, p = (r = o.contentLineHeight) !== null && r !== void 0 ? r : M(c), f = (i = o.contentLineHeightSM) !== null && i !== void 0 ? i : M(m), v = (l = o.contentLineHeightLG) !== null && l !== void 0 ? l : M(u);
+}, st = (e) => {
+  var t, r, o, n, i, s;
+  const a = (t = e.contentFontSize) !== null && t !== void 0 ? t : e.fontSize, l = (r = e.contentFontSizeSM) !== null && r !== void 0 ? r : e.fontSize, c = (o = e.contentFontSizeLG) !== null && o !== void 0 ? o : e.fontSizeLG, d = (n = e.contentLineHeight) !== null && n !== void 0 ? n : me(a), g = (i = e.contentLineHeightSM) !== null && i !== void 0 ? i : me(l), b = (s = e.contentLineHeightLG) !== null && s !== void 0 ? s : me(c), f = lr(new sr(e.colorBgSolid), "#fff") ? "#000" : "#fff";
   return {
     fontWeight: 400,
-    defaultShadow: `0 ${o.controlOutlineWidth}px 0 ${o.controlTmpOutline}`,
-    primaryShadow: `0 ${o.controlOutlineWidth}px 0 ${o.controlOutline}`,
-    dangerShadow: `0 ${o.controlOutlineWidth}px 0 ${o.colorErrorOutline}`,
-    primaryColor: o.colorTextLightSolid,
-    dangerColor: o.colorTextLightSolid,
-    borderColorDisabled: o.colorBorder,
-    defaultGhostColor: o.colorBgContainer,
+    defaultShadow: `0 ${e.controlOutlineWidth}px 0 ${e.controlTmpOutline}`,
+    primaryShadow: `0 ${e.controlOutlineWidth}px 0 ${e.controlOutline}`,
+    dangerShadow: `0 ${e.controlOutlineWidth}px 0 ${e.colorErrorOutline}`,
+    primaryColor: e.colorTextLightSolid,
+    dangerColor: e.colorTextLightSolid,
+    borderColorDisabled: e.colorBorder,
+    defaultGhostColor: e.colorBgContainer,
     ghostBg: "transparent",
-    defaultGhostBorderColor: o.colorBgContainer,
-    paddingInline: o.paddingContentHorizontal - o.lineWidth,
-    paddingInlineLG: o.paddingContentHorizontal - o.lineWidth,
-    paddingInlineSM: 8 - o.lineWidth,
-    onlyIconSize: o.fontSizeLG,
-    onlyIconSizeSM: o.fontSizeLG - 2,
-    onlyIconSizeLG: o.fontSizeLG + 2,
-    groupBorderColor: o.colorPrimaryHover,
+    defaultGhostBorderColor: e.colorBgContainer,
+    paddingInline: e.paddingContentHorizontal - e.lineWidth,
+    paddingInlineLG: e.paddingContentHorizontal - e.lineWidth,
+    paddingInlineSM: 8 - e.lineWidth,
+    onlyIconSize: e.fontSizeLG,
+    onlyIconSizeSM: e.fontSizeLG - 2,
+    onlyIconSizeLG: e.fontSizeLG + 2,
+    groupBorderColor: e.colorPrimaryHover,
     linkHoverBg: "transparent",
-    textHoverBg: o.colorBgTextHover,
-    defaultColor: o.colorText,
-    defaultBg: o.colorBgContainer,
-    defaultBorderColor: o.colorBorder,
-    defaultBorderColorDisabled: o.colorBorder,
-    defaultHoverBg: o.colorBgContainer,
-    defaultHoverColor: o.colorPrimaryHover,
-    defaultHoverBorderColor: o.colorPrimaryHover,
-    defaultActiveBg: o.colorBgContainer,
-    defaultActiveColor: o.colorPrimaryActive,
-    defaultActiveBorderColor: o.colorPrimaryActive,
-    contentFontSize: c,
-    contentFontSizeSM: m,
-    contentFontSizeLG: u,
-    contentLineHeight: p,
-    contentLineHeightSM: f,
-    contentLineHeightLG: v,
-    paddingBlock: Math.max((o.controlHeight - c * p) / 2 - o.lineWidth, 0),
-    paddingBlockSM: Math.max((o.controlHeightSM - m * f) / 2 - o.lineWidth, 0),
-    paddingBlockLG: Math.max((o.controlHeightLG - u * v) / 2 - o.lineWidth, 0)
+    textTextColor: e.colorText,
+    textTextHoverColor: e.colorText,
+    textTextActiveColor: e.colorText,
+    textHoverBg: e.colorBgTextHover,
+    defaultColor: e.colorText,
+    defaultBg: e.colorBgContainer,
+    defaultBorderColor: e.colorBorder,
+    defaultBorderColorDisabled: e.colorBorder,
+    defaultHoverBg: e.colorBgContainer,
+    defaultHoverColor: e.colorPrimaryHover,
+    defaultHoverBorderColor: e.colorPrimaryHover,
+    defaultActiveBg: e.colorBgContainer,
+    defaultActiveColor: e.colorPrimaryActive,
+    defaultActiveBorderColor: e.colorPrimaryActive,
+    solidTextColor: f,
+    contentFontSize: a,
+    contentFontSizeSM: l,
+    contentFontSizeLG: c,
+    contentLineHeight: d,
+    contentLineHeightSM: g,
+    contentLineHeightLG: b,
+    paddingBlock: Math.max((e.controlHeight - a * d) / 2 - e.lineWidth, 0),
+    paddingBlockSM: Math.max((e.controlHeightSM - l * g) / 2 - e.lineWidth, 0),
+    paddingBlockLG: Math.max((e.controlHeightLG - c * b) / 2 - e.lineWidth, 0)
   };
-}, me = (o) => {
+}, cr = (e) => {
   const {
-    componentCls: e,
-    iconCls: t,
-    fontWeight: n
-  } = o;
+    componentCls: t,
+    iconCls: r,
+    fontWeight: o
+  } = e;
   return {
-    [e]: {
+    [t]: {
       outline: "none",
       position: "relative",
-      display: "inline-block",
-      fontWeight: n,
+      display: "inline-flex",
+      gap: e.marginXS,
+      alignItems: "center",
+      justifyContent: "center",
+      fontWeight: o,
       whiteSpace: "nowrap",
       textAlign: "center",
       backgroundImage: "none",
       background: "transparent",
-      border: `${I(o.lineWidth)} ${o.lineType} transparent`,
+      border: `${re(e.lineWidth)} ${e.lineType} transparent`,
       cursor: "pointer",
-      transition: `all ${o.motionDurationMid} ${o.motionEaseInOut}`,
+      transition: `all ${e.motionDurationMid} ${e.motionEaseInOut}`,
       userSelect: "none",
       touchAction: "manipulation",
-      color: o.colorText,
+      color: e.colorText,
       "&:disabled > *": {
         pointerEvents: "none"
       },
       "> span": {
         display: "inline-block"
       },
-      [`${e}-icon`]: {
-        lineHeight: 0,
-        // iconPosition in end
-        "&-end": {
-          marginInlineStart: o.marginXS
-        }
-      },
-      // Leave a space between icon and text.
-      [`> ${t} + span, > span + ${t}`]: {
-        marginInlineStart: o.marginXS
-      },
-      [`&:not(${e}-icon-only) > ${e}-icon`]: {
-        [`&${e}-loading-icon, &:not(:last-child)`]: {
-          marginInlineEnd: o.marginXS
-        },
-        [`&${e}-loading-icon-end`]: {
-          marginInlineStart: o.marginXS
-        }
+      [`${t}-icon`]: {
+        lineHeight: 1
       },
       "> a": {
         color: "currentColor"
       },
-      "&:not(:disabled)": Object.assign({}, ne(o)),
-      [`&${e}-two-chinese-chars::first-letter`]: {
+      "&:not(:disabled)": Object.assign({}, zt(e)),
+      [`&${t}-two-chinese-chars::first-letter`]: {
         letterSpacing: "0.34em"
       },
-      [`&${e}-two-chinese-chars > *:not(${t})`]: {
+      [`&${t}-two-chinese-chars > *:not(${r})`]: {
         marginInlineEnd: "-0.34em",
         letterSpacing: "0.34em"
       },
-      // make `btn-icon-only` not too narrow
-      [`&-icon-only${e}-compact-item`]: {
-        flex: "none"
+      // iconPosition="end"
+      "&-icon-end": {
+        flexDirection: "row-reverse"
       }
     }
   };
-}, h = (o, e, t) => ({
-  [`&:not(:disabled):not(${o}-disabled)`]: {
-    "&:hover": e,
-    "&:active": t
+}, lt = (e, t, r) => ({
+  [`&:not(:disabled):not(${e}-disabled)`]: {
+    "&:hover": t,
+    "&:active": r
   }
-}), pe = (o) => ({
-  minWidth: o.controlHeight,
+}), ur = (e) => ({
+  minWidth: e.controlHeight,
   paddingInlineStart: 0,
   paddingInlineEnd: 0,
   borderRadius: "50%"
-}), be = (o) => ({
-  borderRadius: o.controlHeight,
-  paddingInlineStart: o.calc(o.controlHeight).div(2).equal(),
-  paddingInlineEnd: o.calc(o.controlHeight).div(2).equal()
-}), fe = (o) => ({
+}), dr = (e) => ({
+  borderRadius: e.controlHeight,
+  paddingInlineStart: e.calc(e.controlHeight).div(2).equal(),
+  paddingInlineEnd: e.calc(e.controlHeight).div(2).equal()
+}), gr = (e) => ({
   cursor: "not-allowed",
-  borderColor: o.borderColorDisabled,
-  color: o.colorTextDisabled,
-  background: o.colorBgContainerDisabled,
+  borderColor: e.borderColorDisabled,
+  color: e.colorTextDisabled,
+  background: e.colorBgContainerDisabled,
   boxShadow: "none"
-}), H = (o, e, t, n, r, i, l, c) => ({
-  [`&${o}-background-ghost`]: Object.assign(Object.assign({
-    color: t || void 0,
-    background: e,
-    borderColor: n || void 0,
+}), xe = (e, t, r, o, n, i, s, a) => ({
+  [`&${e}-background-ghost`]: Object.assign(Object.assign({
+    color: r || void 0,
+    background: t,
+    borderColor: o || void 0,
     boxShadow: "none"
-  }, h(o, Object.assign({
-    background: e
-  }, l), Object.assign({
-    background: e
-  }, c))), {
+  }, lt(e, Object.assign({
+    background: t
+  }, s), Object.assign({
+    background: t
+  }, a))), {
     "&:disabled": {
       cursor: "not-allowed",
-      color: r || void 0,
+      color: n || void 0,
       borderColor: i || void 0
     }
   })
-}), X = (o) => ({
-  [`&:disabled, &${o.componentCls}-disabled`]: Object.assign({}, fe(o))
-}), xo = (o) => Object.assign({}, X(o)), N = (o) => ({
-  [`&:disabled, &${o.componentCls}-disabled`]: {
+}), hr = (e) => ({
+  [`&:disabled, &${e.componentCls}-disabled`]: Object.assign({}, gr(e))
+}), fr = (e) => ({
+  [`&:disabled, &${e.componentCls}-disabled`]: {
     cursor: "not-allowed",
-    color: o.colorTextDisabled
-  }
-}), Io = (o) => Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, xo(o)), {
-  background: o.defaultBg,
-  borderColor: o.defaultBorderColor,
-  color: o.defaultColor,
-  boxShadow: o.defaultShadow
-}), h(o.componentCls, {
-  color: o.defaultHoverColor,
-  borderColor: o.defaultHoverBorderColor,
-  background: o.defaultHoverBg
+    color: e.colorTextDisabled
+  }
+}), le = (e, t, r, o) => {
+  const i = o && ["link", "text"].includes(o) ? fr : hr;
+  return Object.assign(Object.assign({}, i(e)), lt(e.componentCls, t, r));
+}, He = (e, t, r, o, n) => ({
+  [`&${e.componentCls}-variant-solid`]: Object.assign({
+    color: t,
+    background: r
+  }, le(e, o, n))
+}), $e = (e, t, r, o, n) => ({
+  [`&${e.componentCls}-variant-outlined, &${e.componentCls}-variant-dashed`]: Object.assign({
+    borderColor: t,
+    background: r
+  }, le(e, o, n))
+}), Be = (e) => ({
+  [`&${e.componentCls}-variant-dashed`]: {
+    borderStyle: "dashed"
+  }
+}), Ee = (e, t, r, o) => ({
+  [`&${e.componentCls}-variant-filled`]: Object.assign({
+    boxShadow: "none",
+    background: t
+  }, le(e, r, o))
+}), J = (e, t, r, o, n) => ({
+  [`&${e.componentCls}-variant-${r}`]: Object.assign({
+    color: t,
+    boxShadow: "none"
+  }, le(e, o, n, r))
+}), mr = (e) => Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({
+  color: e.defaultColor,
+  boxShadow: e.defaultShadow
+}, He(e, e.solidTextColor, e.colorBgSolid, {
+  background: e.colorBgSolidHover
 }, {
-  color: o.defaultActiveColor,
-  borderColor: o.defaultActiveBorderColor,
-  background: o.defaultActiveBg
-})), H(o.componentCls, o.ghostBg, o.defaultGhostColor, o.defaultGhostBorderColor, o.colorTextDisabled, o.colorBorder)), {
-  [`&${o.componentCls}-dangerous`]: Object.assign(Object.assign(Object.assign({
-    color: o.colorError,
-    borderColor: o.colorError
-  }, h(o.componentCls, {
-    color: o.colorErrorHover,
-    borderColor: o.colorErrorBorderHover
-  }, {
-    color: o.colorErrorActive,
-    borderColor: o.colorErrorActive
-  })), H(o.componentCls, o.ghostBg, o.colorError, o.colorError, o.colorTextDisabled, o.colorBorder)), X(o))
-}), he = (o) => Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, xo(o)), {
-  color: o.primaryColor,
-  background: o.colorPrimary,
-  boxShadow: o.primaryShadow
-}), h(o.componentCls, {
-  color: o.colorTextLightSolid,
-  background: o.colorPrimaryHover
+  background: e.colorBgSolidActive
+})), Be(e)), Ee(e, e.colorFillTertiary, {
+  background: e.colorFillSecondary
 }, {
-  color: o.colorTextLightSolid,
-  background: o.colorPrimaryActive
-})), H(o.componentCls, o.ghostBg, o.colorPrimary, o.colorPrimary, o.colorTextDisabled, o.colorBorder, {
-  color: o.colorPrimaryHover,
-  borderColor: o.colorPrimaryHover
+  background: e.colorFill
+})), J(e, e.textTextColor, "link", {
+  color: e.colorLinkHover,
+  background: e.linkHoverBg
 }, {
-  color: o.colorPrimaryActive,
-  borderColor: o.colorPrimaryActive
-})), {
-  [`&${o.componentCls}-dangerous`]: Object.assign(Object.assign(Object.assign({
-    background: o.colorError,
-    boxShadow: o.dangerShadow,
-    color: o.dangerColor
-  }, h(o.componentCls, {
-    background: o.colorErrorHover
-  }, {
-    background: o.colorErrorActive
-  })), H(o.componentCls, o.ghostBg, o.colorError, o.colorError, o.colorTextDisabled, o.colorBorder, {
-    color: o.colorErrorHover,
-    borderColor: o.colorErrorHover
-  }, {
-    color: o.colorErrorActive,
-    borderColor: o.colorErrorActive
-  })), X(o))
-}), Se = (o) => Object.assign(Object.assign({}, Io(o)), {
-  borderStyle: "dashed"
-}), Ce = (o) => Object.assign(Object.assign(Object.assign({
-  color: o.colorLink
-}, h(o.componentCls, {
-  color: o.colorLinkHover,
-  background: o.linkHoverBg
+  color: e.colorLinkActive
+})), xe(e.componentCls, e.ghostBg, e.defaultGhostColor, e.defaultGhostBorderColor, e.colorTextDisabled, e.colorBorder)), vr = (e) => Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({
+  color: e.colorPrimary,
+  boxShadow: e.primaryShadow
+}, $e(e, e.colorPrimary, e.colorBgContainer, {
+  color: e.colorPrimaryTextHover,
+  borderColor: e.colorPrimaryHover,
+  background: e.colorBgContainer
 }, {
-  color: o.colorLinkActive
-})), N(o)), {
-  [`&${o.componentCls}-dangerous`]: Object.assign(Object.assign({
-    color: o.colorError
-  }, h(o.componentCls, {
-    color: o.colorErrorHover
-  }, {
-    color: o.colorErrorActive
-  })), N(o))
-}), ye = (o) => Object.assign(Object.assign(Object.assign({}, h(o.componentCls, {
-  color: o.colorText,
-  background: o.textHoverBg
+  color: e.colorPrimaryTextActive,
+  borderColor: e.colorPrimaryActive,
+  background: e.colorBgContainer
+})), Be(e)), Ee(e, e.colorPrimaryBg, {
+  background: e.colorPrimaryBgHover
 }, {
-  color: o.colorText,
-  background: o.colorBgTextActive
-})), N(o)), {
-  [`&${o.componentCls}-dangerous`]: Object.assign(Object.assign({
-    color: o.colorError
-  }, N(o)), h(o.componentCls, {
-    color: o.colorErrorHover,
-    background: o.colorErrorBg
-  }, {
-    color: o.colorErrorHover,
-    background: o.colorErrorBgActive
-  }))
-}), ve = (o) => {
+  background: e.colorPrimaryBorder
+})), J(e, e.colorLink, "text", {
+  color: e.colorPrimaryTextHover,
+  background: e.colorPrimaryBg
+}, {
+  color: e.colorPrimaryTextActive,
+  background: e.colorPrimaryBorder
+})), xe(e.componentCls, e.ghostBg, e.colorPrimary, e.colorPrimary, e.colorTextDisabled, e.colorBorder, {
+  color: e.colorPrimaryHover,
+  borderColor: e.colorPrimaryHover
+}, {
+  color: e.colorPrimaryActive,
+  borderColor: e.colorPrimaryActive
+})), br = (e) => Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({
+  color: e.colorError,
+  boxShadow: e.dangerShadow
+}, He(e, e.dangerColor, e.colorError, {
+  background: e.colorErrorHover
+}, {
+  background: e.colorErrorActive
+})), $e(e, e.colorError, e.colorBgContainer, {
+  color: e.colorErrorHover,
+  borderColor: e.colorErrorBorderHover
+}, {
+  color: e.colorErrorActive,
+  borderColor: e.colorErrorActive
+})), Be(e)), Ee(e, e.colorErrorBg, {
+  background: e.colorErrorBgFilledHover
+}, {
+  background: e.colorErrorBgActive
+})), J(e, e.colorError, "text", {
+  color: e.colorErrorHover,
+  background: e.colorErrorBg
+}, {
+  color: e.colorErrorHover,
+  background: e.colorErrorBgActive
+})), J(e, e.colorError, "link", {
+  color: e.colorErrorHover
+}, {
+  color: e.colorErrorActive
+})), xe(e.componentCls, e.ghostBg, e.colorError, e.colorError, e.colorTextDisabled, e.colorBorder, {
+  color: e.colorErrorHover,
+  borderColor: e.colorErrorHover
+}, {
+  color: e.colorErrorActive,
+  borderColor: e.colorErrorActive
+})), pr = (e) => {
   const {
-    componentCls: e
-  } = o;
+    componentCls: t
+  } = e;
   return {
-    [`${e}-default`]: Io(o),
-    [`${e}-primary`]: he(o),
-    [`${e}-dashed`]: Se(o),
-    [`${e}-link`]: Ce(o),
-    [`${e}-text`]: ye(o),
-    [`${e}-ghost`]: H(o.componentCls, o.ghostBg, o.colorBgContainer, o.colorBgContainer, o.colorTextDisabled, o.colorBorder)
+    [`${t}-color-default`]: mr(e),
+    [`${t}-color-primary`]: vr(e),
+    [`${t}-color-dangerous`]: br(e)
   };
-}, U = function(o) {
-  let e = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "";
+}, Cr = (e) => Object.assign(Object.assign(Object.assign(Object.assign({}, $e(e, e.defaultBorderColor, e.defaultBg, {
+  color: e.defaultHoverColor,
+  borderColor: e.defaultHoverBorderColor,
+  background: e.defaultHoverBg
+}, {
+  color: e.defaultActiveColor,
+  borderColor: e.defaultActiveBorderColor,
+  background: e.defaultActiveBg
+})), J(e, e.textTextColor, "text", {
+  color: e.textTextHoverColor,
+  background: e.textHoverBg
+}, {
+  color: e.textTextActiveColor,
+  background: e.colorBgTextActive
+})), He(e, e.primaryColor, e.colorPrimary, {
+  background: e.colorPrimaryHover,
+  color: e.primaryColor
+}, {
+  background: e.colorPrimaryActive,
+  color: e.primaryColor
+})), J(e, e.colorLink, "link", {
+  color: e.colorLinkHover,
+  background: e.linkHoverBg
+}, {
+  color: e.colorLinkActive
+})), _e = function(e) {
+  let t = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "";
   const {
-    componentCls: t,
-    controlHeight: n,
-    fontSize: r,
+    componentCls: r,
+    controlHeight: o,
+    fontSize: n,
     lineHeight: i,
-    borderRadius: l,
-    buttonPaddingHorizontal: c,
-    iconCls: m,
-    buttonPaddingVertical: u
-  } = o, p = `${t}-icon-only`;
+    borderRadius: s,
+    buttonPaddingHorizontal: a,
+    iconCls: l,
+    buttonPaddingVertical: c
+  } = e, d = `${r}-icon-only`;
   return [
     {
-      [`${e}`]: {
-        fontSize: r,
+      [t]: {
+        fontSize: n,
         lineHeight: i,
-        height: n,
-        padding: `${I(u)} ${I(c)}`,
-        borderRadius: l,
-        [`&${p}`]: {
-          display: "inline-flex",
-          alignItems: "center",
-          justifyContent: "center",
-          width: n,
-          paddingInlineStart: 0,
-          paddingInlineEnd: 0,
-          [`&${t}-round`]: {
+        height: o,
+        padding: `${re(c)} ${re(a)}`,
+        borderRadius: s,
+        [`&${d}`]: {
+          width: o,
+          paddingInline: 0,
+          // make `btn-icon-only` not too narrow
+          [`&${r}-compact-item`]: {
+            flex: "none"
+          },
+          [`&${r}-round`]: {
             width: "auto"
           },
-          [m]: {
-            fontSize: o.buttonIconOnlyFontSize
+          [l]: {
+            fontSize: e.buttonIconOnlyFontSize
           }
         },
         // Loading
-        [`&${t}-loading`]: {
-          opacity: o.opacityLoading,
+        [`&${r}-loading`]: {
+          opacity: e.opacityLoading,
           cursor: "default"
         },
-        [`${t}-loading-icon`]: {
-          transition: `width ${o.motionDurationSlow} ${o.motionEaseInOut}, opacity ${o.motionDurationSlow} ${o.motionEaseInOut}`
+        [`${r}-loading-icon`]: {
+          transition: `width ${e.motionDurationSlow} ${e.motionEaseInOut}, opacity ${e.motionDurationSlow} ${e.motionEaseInOut}`
         }
       }
     },
     // Shape - patch prefixCls again to override solid border radius style
     {
-      [`${t}${t}-circle${e}`]: pe(o)
+      [`${r}${r}-circle${t}`]: ur(e)
     },
     {
-      [`${t}${t}-round${e}`]: be(o)
+      [`${r}${r}-round${t}`]: dr(e)
     }
   ];
-}, $e = (o) => {
-  const e = L(o, {
-    fontSize: o.contentFontSize,
-    lineHeight: o.contentLineHeight
+}, yr = (e) => {
+  const t = ae(e, {
+    fontSize: e.contentFontSize,
+    lineHeight: e.contentLineHeight
   });
-  return U(e, o.componentCls);
-}, Be = (o) => {
-  const e = L(o, {
-    controlHeight: o.controlHeightSM,
-    fontSize: o.contentFontSizeSM,
-    lineHeight: o.contentLineHeightSM,
-    padding: o.paddingXS,
-    buttonPaddingHorizontal: o.paddingInlineSM,
-    buttonPaddingVertical: o.paddingBlockSM,
-    borderRadius: o.borderRadiusSM,
-    buttonIconOnlyFontSize: o.onlyIconSizeSM
+  return _e(t, e.componentCls);
+}, Sr = (e) => {
+  const t = ae(e, {
+    controlHeight: e.controlHeightSM,
+    fontSize: e.contentFontSizeSM,
+    lineHeight: e.contentLineHeightSM,
+    padding: e.paddingXS,
+    buttonPaddingHorizontal: e.paddingInlineSM,
+    buttonPaddingVertical: e.paddingBlockSM,
+    borderRadius: e.borderRadiusSM,
+    buttonIconOnlyFontSize: e.onlyIconSizeSM
   });
-  return U(e, `${o.componentCls}-sm`);
-}, Oe = (o) => {
-  const e = L(o, {
-    controlHeight: o.controlHeightLG,
-    fontSize: o.contentFontSizeLG,
-    lineHeight: o.contentLineHeightLG,
-    buttonPaddingHorizontal: o.paddingInlineLG,
-    buttonPaddingVertical: o.paddingBlockLG,
-    borderRadius: o.borderRadiusLG,
-    buttonIconOnlyFontSize: o.onlyIconSizeLG
+  return _e(t, `${e.componentCls}-sm`);
+}, xr = (e) => {
+  const t = ae(e, {
+    controlHeight: e.controlHeightLG,
+    fontSize: e.contentFontSizeLG,
+    lineHeight: e.contentLineHeightLG,
+    buttonPaddingHorizontal: e.paddingInlineLG,
+    buttonPaddingVertical: e.paddingBlockLG,
+    borderRadius: e.borderRadiusLG,
+    buttonIconOnlyFontSize: e.onlyIconSizeLG
   });
-  return U(e, `${o.componentCls}-lg`);
-}, Ee = (o) => {
+  return _e(t, `${e.componentCls}-lg`);
+}, Hr = (e) => {
   const {
-    componentCls: e
-  } = o;
+    componentCls: t
+  } = e;
   return {
-    [e]: {
-      [`&${e}-block`]: {
+    [t]: {
+      [`&${t}-block`]: {
         width: "100%"
       }
     }
   };
-}, xe = te("Button", (o) => {
-  const e = Oo(o);
+}, $r = Dt("Button", (e) => {
+  const t = at(e);
   return [
     // Shared
-    me(e),
+    cr(t),
     // Size
-    $e(e),
-    Be(e),
-    Oe(e),
+    yr(t),
+    Sr(t),
+    xr(t),
     // Block
-    Ee(e),
-    // Group (type, ghost, danger, loading)
-    ve(e),
+    Hr(t),
+    // Color
+    pr(t),
+    // https://github.com/ant-design/ant-design/issues/50969
+    Cr(t),
     // Button Group
-    ge(e)
+    Ft(t)
   ];
-}, Eo, {
+}, st, {
   unitless: {
     fontWeight: !0,
     contentLineHeight: !0,
@@ -602,11 +1407,11 @@ const Bo = /* @__PURE__ */ Co((o, e) => {
     contentLineHeightLG: !0
   }
 });
-function Ie(o, e) {
+function Br(e, t) {
   return {
     // border collapse
-    [`&-item:not(${e}-last-item)`]: {
-      marginBottom: o.calc(o.lineWidth).mul(-1).equal()
+    [`&-item:not(${t}-last-item)`]: {
+      marginBottom: e.calc(e.lineWidth).mul(-1).equal()
     },
     "&-item": {
       "&:hover,&:focus,&:active": {
@@ -618,67 +1423,67 @@ function Ie(o, e) {
     }
   };
 }
-function He(o, e) {
+function Er(e, t) {
   return {
-    [`&-item:not(${e}-first-item):not(${e}-last-item)`]: {
+    [`&-item:not(${t}-first-item):not(${t}-last-item)`]: {
       borderRadius: 0
     },
-    [`&-item${e}-first-item:not(${e}-last-item)`]: {
-      [`&, &${o}-sm, &${o}-lg`]: {
+    [`&-item${t}-first-item:not(${t}-last-item)`]: {
+      [`&, &${e}-sm, &${e}-lg`]: {
         borderEndEndRadius: 0,
         borderEndStartRadius: 0
       }
     },
-    [`&-item${e}-last-item:not(${e}-first-item)`]: {
-      [`&, &${o}-sm, &${o}-lg`]: {
+    [`&-item${t}-last-item:not(${t}-first-item)`]: {
+      [`&, &${e}-sm, &${e}-lg`]: {
         borderStartStartRadius: 0,
         borderStartEndRadius: 0
       }
     }
   };
 }
-function ze(o) {
-  const e = `${o.componentCls}-compact-vertical`;
+function _r(e) {
+  const t = `${e.componentCls}-compact-vertical`;
   return {
-    [e]: Object.assign(Object.assign({}, Ie(o, e)), He(o.componentCls, e))
+    [t]: Object.assign(Object.assign({}, Br(e, t)), Er(e.componentCls, t))
   };
 }
-const je = (o) => {
+const Or = (e) => {
   const {
-    componentCls: e,
-    calc: t
-  } = o;
+    componentCls: t,
+    calc: r
+  } = e;
   return {
-    [e]: {
+    [t]: {
       // Special styles for Primary Button
-      [`&-compact-item${e}-primary`]: {
-        [`&:not([disabled]) + ${e}-compact-item${e}-primary:not([disabled])`]: {
+      [`&-compact-item${t}-primary`]: {
+        [`&:not([disabled]) + ${t}-compact-item${t}-primary:not([disabled])`]: {
           position: "relative",
           "&:before": {
             position: "absolute",
-            top: t(o.lineWidth).mul(-1).equal(),
-            insetInlineStart: t(o.lineWidth).mul(-1).equal(),
+            top: r(e.lineWidth).mul(-1).equal(),
+            insetInlineStart: r(e.lineWidth).mul(-1).equal(),
             display: "inline-block",
-            width: o.lineWidth,
-            height: `calc(100% + ${I(o.lineWidth)} * 2)`,
-            backgroundColor: o.colorPrimaryHover,
+            width: e.lineWidth,
+            height: `calc(100% + ${re(e.lineWidth)} * 2)`,
+            backgroundColor: e.colorPrimaryHover,
             content: '""'
           }
         }
       },
       // Special styles for Primary Button
       "&-compact-vertical-item": {
-        [`&${e}-primary`]: {
-          [`&:not([disabled]) + ${e}-compact-vertical-item${e}-primary:not([disabled])`]: {
+        [`&${t}-primary`]: {
+          [`&:not([disabled]) + ${t}-compact-vertical-item${t}-primary:not([disabled])`]: {
             position: "relative",
             "&:before": {
               position: "absolute",
-              top: t(o.lineWidth).mul(-1).equal(),
-              insetInlineStart: t(o.lineWidth).mul(-1).equal(),
+              top: r(e.lineWidth).mul(-1).equal(),
+              insetInlineStart: r(e.lineWidth).mul(-1).equal(),
               display: "inline-block",
-              width: `calc(100% + ${I(o.lineWidth)} * 2)`,
-              height: o.lineWidth,
-              backgroundColor: o.colorPrimaryHover,
+              width: `calc(100% + ${re(e.lineWidth)} * 2)`,
+              height: e.lineWidth,
+              backgroundColor: e.colorPrimaryHover,
               content: '""'
             }
           }
@@ -686,158 +1491,170 @@ const je = (o) => {
       }
     }
   };
-}, Ne = re(["Button", "compact"], (o) => {
-  const e = Oo(o);
+}, Rr = It(["Button", "compact"], (e) => {
+  const t = at(e);
   return [
     // Space Compact
-    Uo(e),
-    ze(e),
-    je(e)
+    Ht(t),
+    _r(t),
+    Or(t)
   ];
-}, Eo);
-var Le = function(o, e) {
-  var t = {};
-  for (var n in o)
-    Object.prototype.hasOwnProperty.call(o, n) && e.indexOf(n) < 0 && (t[n] = o[n]);
-  if (o != null && typeof Object.getOwnPropertySymbols == "function")
-    for (var r = 0, n = Object.getOwnPropertySymbols(o); r < n.length; r++)
-      e.indexOf(n[r]) < 0 && Object.prototype.propertyIsEnumerable.call(o, n[r]) && (t[n[r]] = o[n[r]]);
-  return t;
+}, st);
+var Lr = function(e, t) {
+  var r = {};
+  for (var o in e) Object.prototype.hasOwnProperty.call(e, o) && t.indexOf(o) < 0 && (r[o] = e[o]);
+  if (e != null && typeof Object.getOwnPropertySymbols == "function") for (var n = 0, o = Object.getOwnPropertySymbols(e); n < o.length; n++)
+    t.indexOf(o[n]) < 0 && Object.prototype.propertyIsEnumerable.call(e, o[n]) && (r[o[n]] = e[o[n]]);
+  return r;
 };
-function Pe(o) {
-  if (typeof o == "object" && o) {
-    let e = o == null ? void 0 : o.delay;
-    return e = !Number.isNaN(e) && typeof e == "number" ? e : 0, {
-      loading: e <= 0,
-      delay: e
+function wr(e) {
+  if (typeof e == "object" && e) {
+    let t = e == null ? void 0 : e.delay;
+    return t = !Number.isNaN(t) && typeof t == "number" ? t : 0, {
+      loading: t <= 0,
+      delay: t
     };
   }
   return {
-    loading: !!o,
+    loading: !!e,
     delay: 0
   };
 }
-const Te = /* @__PURE__ */ a.forwardRef((o, e) => {
-  var t, n, r;
+const Nr = {
+  default: ["default", "outlined"],
+  primary: ["primary", "solid"],
+  dashed: ["default", "dashed"],
+  link: ["primary", "link"],
+  text: ["default", "text"]
+}, Pr = /* @__PURE__ */ u.forwardRef((e, t) => {
+  var r, o, n;
   const {
     loading: i = !1,
-    prefixCls: l,
+    prefixCls: s,
+    color: a,
+    variant: l,
     type: c,
-    danger: m,
-    shape: u = "default",
-    size: p,
+    danger: d = !1,
+    shape: g = "default",
+    size: b,
     styles: f,
-    disabled: v,
-    className: Ho,
-    rootClassName: zo,
+    disabled: p,
+    className: B,
+    rootClassName: E,
     children: S,
-    icon: C,
-    iconPosition: P = "start",
-    ghost: K = !1,
-    block: jo = !1,
+    icon: x,
+    iconPosition: O = "start",
+    ghost: h = !1,
+    block: y = !1,
     // React does not recognize the `htmlType` prop on a DOM element. Here we pick it out of `rest`.
-    htmlType: No = "button",
+    htmlType: K = "button",
     classNames: T,
-    style: Lo = {},
-    autoInsertSpace: w
-  } = o, Q = Le(o, ["loading", "prefixCls", "type", "danger", "shape", "size", "styles", "disabled", "className", "rootClassName", "children", "icon", "iconPosition", "ghost", "block", "htmlType", "classNames", "style", "autoInsertSpace"]), $ = c || "default", {
-    getPrefixCls: Po,
-    direction: Y,
-    button: g
-  } = _(yo), W = (t = w ?? (g == null ? void 0 : g.autoInsertSpace)) !== null && t !== void 0 ? t : !0, s = Po("btn", l), [Z, To, wo] = xe(s), Wo = _(ie), E = v ?? Wo, Do = _($o), x = Fo(() => Pe(i), [i]), [y, k] = mo(x.loading), [D, oo] = mo(!1), B = le(e, /* @__PURE__ */ qo()), eo = Vo.count(S) === 1 && !C && !z($);
-  po(() => {
-    let d = null;
-    x.delay > 0 ? d = setTimeout(() => {
-      d = null, k(!0);
-    }, x.delay) : k(x.loading);
-    function b() {
-      d && (clearTimeout(d), d = null);
-    }
-    return b;
-  }, [x]), po(() => {
-    if (!B || !B.current || !W)
+    style: w = {},
+    autoInsertSpace: z
+  } = e, M = Lr(e, ["loading", "prefixCls", "color", "variant", "type", "danger", "shape", "size", "styles", "disabled", "className", "rootClassName", "children", "icon", "iconPosition", "ghost", "block", "htmlType", "classNames", "style", "autoInsertSpace"]), A = c || "default", [F, R] = te(() => {
+    if (a && l)
+      return [a, l];
+    const H = Nr[A] || [];
+    return d ? ["danger", H[1]] : H;
+  }, [c, a, l, d]), I = F === "danger" ? "dangerous" : F, {
+    getPrefixCls: G,
+    direction: W,
+    button: m
+  } = he(Ye), C = (r = z ?? (m == null ? void 0 : m.autoInsertSpace)) !== null && r !== void 0 ? r : !0, v = G("btn", s), [Re, ct, ut] = $r(v), dt = he(jt), Q = p ?? dt, gt = he(Ze), Z = te(() => wr(i), [i]), [V, Le] = ye(Z.loading), [ce, we] = ye(!1), X = Tt(t, /* @__PURE__ */ Ct()), Ne = pt.count(S) === 1 && !x && !oe(R);
+  ne(() => {
+    let H = null;
+    Z.delay > 0 ? H = setTimeout(() => {
+      H = null, Le(!0);
+    }, Z.delay) : Le(Z.loading);
+    function N() {
+      H && (clearTimeout(H), H = null);
+    }
+    return N;
+  }, [Z]), ne(() => {
+    if (!X || !X.current || !C)
       return;
-    const d = B.current.textContent;
-    eo && q(d) ? D || oo(!0) : D && oo(!1);
-  }, [B]);
-  const to = (d) => {
+    const H = X.current.textContent;
+    Ne && Se(H) ? ce || we(!0) : ce && we(!1);
+  }, [X]);
+  const Pe = (H) => {
     const {
-      onClick: b
-    } = o;
-    if (y || E) {
-      d.preventDefault();
+      onClick: N
+    } = e;
+    if (V || Q) {
+      H.preventDefault();
       return;
     }
-    b == null || b(d);
+    N == null || N(H);
   };
   if (process.env.NODE_ENV !== "production") {
-    const d = vo("Button");
-    process.env.NODE_ENV !== "production" && d(!(typeof C == "string" && C.length > 2), "breaking", `\`icon\` is using ReactNode instead of string naming in v4. Please check \`${C}\` at https://ant.design/components/icon`), process.env.NODE_ENV !== "production" && d(!(K && z($)), "usage", "`link` or `text` button can't be a `ghost` button.");
+    const H = Ue("Button");
+    process.env.NODE_ENV !== "production" && H(!(typeof x == "string" && x.length > 2), "breaking", `\`icon\` is using ReactNode instead of string naming in v4. Please check \`${x}\` at https://ant.design/components/icon`), process.env.NODE_ENV !== "production" && H(!(h && oe(R)), "usage", "`link` or `text` button can't be a `ghost` button.");
   }
   const {
-    compactSize: Ro,
-    compactItemClassnames: no
-  } = Jo(s, Y), Ao = {
+    compactSize: ht,
+    compactItemClassnames: De
+  } = $t(v, W), ft = {
     large: "lg",
     small: "sm",
     middle: void 0
-  }, ro = Ko((d) => {
-    var b, G;
-    return (G = (b = p ?? Ro) !== null && b !== void 0 ? b : Do) !== null && G !== void 0 ? G : d;
-  }), io = ro && Ao[ro] || "", lo = y ? "loading" : C, R = Qo(Q, ["navigate"]), ao = O(s, To, wo, {
-    [`${s}-${u}`]: u !== "default" && u,
-    [`${s}-${$}`]: $,
-    [`${s}-${io}`]: io,
-    [`${s}-icon-only`]: !S && S !== 0 && !!lo,
-    [`${s}-background-ghost`]: K && !z($),
-    [`${s}-loading`]: y,
-    [`${s}-two-chinese-chars`]: D && W && !y,
-    [`${s}-block`]: jo,
-    [`${s}-dangerous`]: !!m,
-    [`${s}-rtl`]: Y === "rtl"
-  }, no, Ho, zo, g == null ? void 0 : g.className), co = Object.assign(Object.assign({}, g == null ? void 0 : g.style), Lo), Go = P === "end" && S && S !== 0 && lo, _o = O(T == null ? void 0 : T.icon, (n = g == null ? void 0 : g.classNames) === null || n === void 0 ? void 0 : n.icon, {
-    [`${s}-icon-end`]: Go
-  }), Mo = Object.assign(Object.assign({}, (f == null ? void 0 : f.icon) || {}), ((r = g == null ? void 0 : g.styles) === null || r === void 0 ? void 0 : r.icon) || {}), so = C && !y ? /* @__PURE__ */ a.createElement(Bo, {
-    prefixCls: s,
-    className: _o,
-    style: Mo
-  }, C) : /* @__PURE__ */ a.createElement(ue, {
-    existIcon: !!C,
-    prefixCls: s,
-    loading: !!y,
-    iconPosition: P
-  }), uo = S || S === 0 ? de(S, eo && W) : null, go = (d, b) => P === "start" ? /* @__PURE__ */ a.createElement(a.Fragment, null, d, b) : /* @__PURE__ */ a.createElement(a.Fragment, null, b, d);
-  if (R.href !== void 0)
-    return Z(/* @__PURE__ */ a.createElement("a", Object.assign({}, R, {
-      className: O(ao, {
-        [`${s}-disabled`]: E
+  }, ze = Bt((H) => {
+    var N, ge;
+    return (ge = (N = b ?? ht) !== null && N !== void 0 ? N : gt) !== null && ge !== void 0 ? ge : H;
+  }), Ie = ze && ft[ze] || "", mt = V ? "loading" : x, ue = Et(M, ["navigate"]), je = L(v, ct, ut, {
+    [`${v}-${g}`]: g !== "default" && g,
+    // line(253 - 254): Compatible with versions earlier than 5.21.0
+    [`${v}-${A}`]: A,
+    [`${v}-dangerous`]: d,
+    [`${v}-color-${I}`]: I,
+    [`${v}-variant-${R}`]: R,
+    [`${v}-${Ie}`]: Ie,
+    [`${v}-icon-only`]: !S && S !== 0 && !!mt,
+    [`${v}-background-ghost`]: h && !oe(R),
+    [`${v}-loading`]: V,
+    [`${v}-two-chinese-chars`]: ce && C && !V,
+    [`${v}-block`]: y,
+    [`${v}-rtl`]: W === "rtl",
+    [`${v}-icon-end`]: O === "end"
+  }, De, B, E, m == null ? void 0 : m.className), Te = Object.assign(Object.assign({}, m == null ? void 0 : m.style), w), vt = L(T == null ? void 0 : T.icon, (o = m == null ? void 0 : m.classNames) === null || o === void 0 ? void 0 : o.icon), bt = Object.assign(Object.assign({}, (f == null ? void 0 : f.icon) || {}), ((n = m == null ? void 0 : m.styles) === null || n === void 0 ? void 0 : n.icon) || {}), Me = x && !V ? /* @__PURE__ */ u.createElement(ke, {
+    prefixCls: v,
+    className: vt,
+    style: bt
+  }, x) : /* @__PURE__ */ u.createElement(Vt, {
+    existIcon: !!x,
+    prefixCls: v,
+    loading: V
+  }), Ae = S || S === 0 ? Wt(S, Ne && C) : null;
+  if (ue.href !== void 0)
+    return Re(/* @__PURE__ */ u.createElement("a", Object.assign({}, ue, {
+      className: L(je, {
+        [`${v}-disabled`]: Q
       }),
-      href: E ? void 0 : R.href,
-      style: co,
-      onClick: to,
-      ref: B,
-      tabIndex: E ? -1 : 0
-    }), go(so, uo)));
-  let A = /* @__PURE__ */ a.createElement("button", Object.assign({}, Q, {
-    type: No,
-    className: ao,
-    style: co,
-    onClick: to,
-    disabled: E,
-    ref: B
-  }), go(so, uo), !!no && /* @__PURE__ */ a.createElement(Ne, {
+      href: Q ? void 0 : ue.href,
+      style: Te,
+      onClick: Pe,
+      ref: X,
+      tabIndex: Q ? -1 : 0
+    }), Me, Ae));
+  let de = /* @__PURE__ */ u.createElement("button", Object.assign({}, M, {
+    type: K,
+    className: je,
+    style: Te,
+    onClick: Pe,
+    disabled: Q,
+    ref: X
+  }), Me, Ae, !!De && /* @__PURE__ */ u.createElement(Rr, {
     key: "compact",
-    prefixCls: s
+    prefixCls: v
   }));
-  return z($) || (A = /* @__PURE__ */ a.createElement(Yo, {
+  return oe(R) || (de = /* @__PURE__ */ u.createElement(_t, {
     component: "Button",
-    disabled: !!y
-  }, A)), Z(A);
-}), J = Te;
-J.Group = ce;
-J.__ANT_BUTTON = !0;
-process.env.NODE_ENV !== "production" && (J.displayName = "Button");
+    disabled: V
+  }, de)), Re(de);
+}), Oe = Pr;
+Oe.Group = At;
+Oe.__ANT_BUTTON = !0;
+process.env.NODE_ENV !== "production" && (Oe.displayName = "Button");
 export {
-  J as B,
-  Ge as c
+  Oe as B,
+  Mr as c
 };