@blofin/blofin-ui 0.7.42 → 0.7.44-beta.3

package/dist/Button.es.js

@@ -1,8 +1,8 @@
-import { j as a } from "./jsx-runtime-944c88e2.js";
-import { c as v } from "./utils-7e50508b.js";
-import { a as e, u as g, c as D } from "./index-96a8d125.js";
-import * as o from "react";
-const E = e("bu-text-light-second", {
+import { j as r } from "./jsx-runtime-944c88e2.js";
+import { c as k } from "./utils-7e50508b.js";
+import { a as e, u as x, c as g } from "./index-96a8d125.js";
+import * as d from "react";
+const N = e("bu-text-light-second", {
   variants: {
     theme: {
       light: ["bu-bg-light-primary", "hover:bu-bg-light-hover-primary"],
@@ -24,7 +24,7 @@ const E = e("bu-text-light-second", {
       ]
     }
   }
-}), N = e("", {
+}), B = e("", {
   variants: {
     theme: {
       light: [
@@ -35,7 +35,7 @@ const E = e("bu-text-light-second", {
       dark: ["bu-bg-dark-primary-14", "hover:bu-bg-dark-hover-primary-10", "bu-text-dark-primary"]
     }
   }
-}), B = e("", {
+}), V = e("", {
   variants: {
     theme: {
       light: [
@@ -65,7 +65,7 @@ const E = e("bu-text-light-second", {
       ]
     }
   }
-}), V = e("", {
+}), Z = e("", {
   variants: {
     theme: {
       light: [
@@ -80,35 +80,35 @@ const E = e("bu-text-light-second", {
       ]
     }
   }
-}), Z = e("", {
+}), H = e("", {
   variants: {
     theme: {
       light: ["bu-text-light-label", "hover:bu-text-light-primary"],
       dark: ["bu-text-dark-label", "hover:bu-text-dark-primary"]
     }
   }
-}), H = e("", {
+}), R = e("", {
   variants: {
     theme: {
       light: ["bu-text-light-label-40", "hover:bu-text-light-label-40"],
       dark: ["bu-text-dark-label-40", "hover:bu-text-dark-label-40"]
     }
   }
-}), R = e("", {
+}), F = e("", {
   variants: {
     theme: {
       light: ["bu-text-light-label-40", "hover:bu-text-light-primary"],
       dark: ["bu-text-dark-label-40", "hover:bu-text-dark-primary"]
     }
   }
-}), F = e("", {
+}), W = e("", {
   variants: {
     theme: {
       light: ["bu-text-light-label-40", "hover:bu-text-light-label-40"],
       dark: ["bu-text-dark-label-40", "hover:bu-text-dark-label-40"]
     }
   }
-}), W = e("", {
+}), P = e("", {
   variants: {
     theme: {
       light: [
@@ -129,7 +129,7 @@ const E = e("bu-text-light-second", {
       ]
     }
   }
-}), P = e("", {
+}), T = e("", {
   variants: {
     theme: {
       light: [
@@ -150,7 +150,7 @@ const E = e("bu-text-light-second", {
       ]
     }
   }
-}), T = e("", {
+}), q = e("", {
   variants: {
     theme: {
       light: [
@@ -158,7 +158,6 @@ const E = e("bu-text-light-second", {
         "hover:bu-text-light-label",
         "bu-border",
         "bu-border-solid",
-        "bu-border-light-label",
         "hover:bu-bg-light-fill-secondary"
       ],
       dark: [
@@ -166,12 +165,37 @@ const E = e("bu-text-light-second", {
         "hover:bu-text-dark-label",
         "bu-border",
         "bu-border-solid",
-        "bu-border-dark-label",
         "hover:bu-bg-dark-fill-secondary"
       ]
+    },
+    checked: {
+      true: "",
+      false: ""
     }
-  }
-}), n = e("", {
+  },
+  compoundVariants: [
+    {
+      theme: "light",
+      checked: !0,
+      class: ["bu-border-light-label"]
+    },
+    {
+      theme: "light",
+      checked: !1,
+      class: ["bu-border-light-line-secondary"]
+    },
+    {
+      theme: "dark",
+      checked: !0,
+      class: ["bu-border-dark-label"]
+    },
+    {
+      theme: "dark",
+      checked: !1,
+      class: ["bu-border-dark-line-secondary"]
+    }
+  ]
+}), m = e("", {
   variants: {
     theme: {
       light: [
@@ -187,40 +211,40 @@ const E = e("bu-text-light-second", {
         "hover:bu-text-dark-label-40",
         "bu-border",
         "bu-border-solid",
-        "bu-border-dark-fill-secondary",
+        "bu-border-dark-line-secondary",
         "hover:bu-bg-transparent"
       ]
     }
   }
-}), q = e("bu-text-white", {
+}), z = e("bu-text-white", {
   variants: {
     theme: {
       light: ["bu-bg-light-green", "hover:bu-bg-light-hover-green"],
       dark: ["bu-bg-dark-green", "hover:bu-bg-dark-hover-green"]
     }
   }
-}), z = e("bu-text-white", {
+}), A = e("bu-text-white", {
   variants: {
     theme: {
       light: ["bu-bg-light-label-20", "hover:bu-bg-light-label-20"],
       dark: ["bu-bg-dark-label-20", "hover:bu-bg-dark-label-20"]
     }
   }
-}), A = e("bu-text-white", {
+}), G = e("bu-text-white", {
   variants: {
     theme: {
       light: ["bu-bg-light-red", "hover:bu-bg-light-hover-red"],
       dark: ["bu-bg-dark-red", "hover:bu-bg-dark-hover-red"]
     }
   }
-}), G = e("bu-text-white", {
+}), J = e("bu-text-white", {
   variants: {
     theme: {
       light: ["bu-bg-light-label-20", "hover:bu-bg-light-label-20"],
       dark: ["bu-bg-dark-label-20", "hover:bu-bg-dark-label-20"]
     }
   }
-}), p = e("bu-border bu-border-solid bu-font-medium", {
+}), y = e("bu-border bu-border-solid bu-font-medium", {
   variants: {
     theme: {
       light: [
@@ -233,68 +257,68 @@ const E = e("bu-text-light-second", {
       ]
     }
   }
-}), y = {
+}), f = {
   primary: {
-    variant: E,
+    variant: N,
     disabled: $
   },
   secondary: {
-    variant: N,
-    disabled: B
+    variant: B,
+    disabled: V
   },
   tertiary: {
     variant: M,
-    disabled: V
+    disabled: Z
   },
   text: {
-    variant: Z,
-    disabled: H
+    variant: H,
+    disabled: R
   },
   ghost: {
-    variant: W,
-    disabled: n
+    variant: P,
+    disabled: m
   },
   ghost2: {
-    variant: P,
-    disabled: n
+    variant: T,
+    disabled: m
   },
   ghost3: {
-    variant: T,
-    disabled: n
+    variant: q,
+    disabled: m
   },
   info: {
-    variant: R,
-    disabled: F
+    variant: F,
+    disabled: W
   },
   buy: {
-    variant: q,
-    disabled: z
+    variant: z,
+    disabled: A
   },
   sell: {
-    variant: A,
-    disabled: G
+    variant: G,
+    disabled: J
   },
   function: {
-    variant: p,
-    disabled: p
+    variant: y,
+    disabled: y
     //this not have disabled
   }
-}, J = (t) => {
-  const { theme: l, variant: b, disabled: d, shape: i } = t, r = d ? "" : y[b].variant({ theme: l });
+}, K = (t) => {
+  const { theme: l, variant: b, disabled: u, shape: i, checked: s } = t, a = u ? "" : f[b].variant({ theme: l, checked: s });
   return e("bu-box-border bu-inline-flex bu-items-center bu-justify-center bu-font-medium", {
     variants: {
       variant: {
-        primary: r,
-        secondary: r,
-        tertiary: r,
-        text: r,
-        ghost: r,
-        ghost2: r,
-        ghost3: r,
-        info: r,
-        buy: r,
-        sell: r,
-        function: r
+        primary: a,
+        secondary: a,
+        tertiary: a,
+        text: a,
+        ghost: a,
+        ghost2: a,
+        ghost3: a,
+        info: a,
+        buy: a,
+        sell: a,
+        function: a
       },
       size: {
         small: `${i === "circle" ? "bu-h-[28px] bu-min-w-[30px]" : "bu-h-[28px] bu-min-w-[80px] bu-rounded-[var(--btn-rounded-small)]"} bu-px-[12px] bu-text-[12px] bu-leading-[18px]`,
@@ -308,11 +332,11 @@ const E = e("bu-text-light-second", {
         circle: "bu-rounded-[50%] bu-px-[0px] bu-py-[0px]"
       },
       disabled: {
-        true: y[b].disabled({ theme: l })
+        true: f[b].disabled({ theme: l })
       }
     }
   })(t);
-}, K = e("bu-animate-spin", {
+}, O = e("bu-animate-spin", {
   variants: {
     size: {
       small: "bu-h-[14px] bu-w-[14px]",
@@ -322,7 +346,7 @@ const E = e("bu-text-light-second", {
       max: "bu-h-[28px] bu-w-[28px]"
     }
   }
-}), u = {
+}), o = {
   "loader-medium": "_loader-medium_amaox_2",
   "animloader-medium": "_animloader-medium_amaox_1",
   "loader-light": "_loader-light_amaox_12",
@@ -333,80 +357,92 @@ const E = e("bu-text-light-second", {
   "animloader-small": "_animloader-small_amaox_1",
   "loader-m-small": "_loader-m-small_amaox_82",
   "animloader-m-small": "_animloader-m-small_amaox_1"
-}, O = ({ size: t, theme: l }) => {
+}, Q = ({ size: t, theme: l }) => {
   const b = {
-    small: u["loader-small"],
-    medium: u["loader-medium"],
-    large: u["loader-large"],
-    max: u["loader-large"],
-    "m-small": u["loader-m-small"]
-  }, d = {
-    light: u["loader-light"],
-    dark: u["loader-dark"]
+    small: o["loader-small"],
+    medium: o["loader-medium"],
+    large: o["loader-large"],
+    max: o["loader-large"],
+    "m-small": o["loader-m-small"]
+  }, u = {
+    light: o["loader-light"],
+    dark: o["loader-dark"]
   };
-  return /* @__PURE__ */ a.jsx("span", { className: `${b[t]} ${d[l]}` });
-}, Q = (t) => /* @__PURE__ */ o.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ o.createElement("path", { d: "M18.5374 19.5674C16.7844 21.0831 14.4993 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C15.9519 2 19.3684 4.29238 20.9922 7.61993L19.2011 8.51103C17.905 5.84083 15.1675 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20C14.1502 20 16.1022 19.1517 17.5398 17.7716L18.5374 19.5674Z", fill: "#DEDFE0" })), U = (t) => /* @__PURE__ */ o.createElement("svg", { width: 12, height: 12, viewBox: "0 0 12 12", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ o.createElement("path", { d: "M12 6C12 2.68629 9.31371 0 6 0H0V6C0 9.31371 2.68629 12 6 12H12V6Z", fill: "currentColor" }), /* @__PURE__ */ o.createElement("path", { d: "M5.1663 7.32125L8.99647 3.49109L9.58571 4.08034L5.1663 8.49975L2.51465 5.84812L3.10391 5.25887L5.1663 7.32125Z", fill: "white" })), X = (t) => /* @__PURE__ */ o.createElement("svg", { width: 12, height: 12, viewBox: "0 0 12 12", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ o.createElement("path", { d: "M12 6C12 2.68629 9.31371 0 6 0H0V6C0 9.31371 2.68629 12 6 12H12V6Z", fill: "currentColor" }), /* @__PURE__ */ o.createElement("path", { d: "M5.1663 7.32125L8.99647 3.49109L9.58571 4.08034L5.1663 8.49975L2.51465 5.84812L3.10391 5.25887L5.1663 7.32125Z", fill: "black" })), h = ({
+  return /* @__PURE__ */ r.jsx("span", { className: `${b[t]} ${u[l]}` });
+}, U = (t) => /* @__PURE__ */ d.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ d.createElement("path", { d: "M18.5374 19.5674C16.7844 21.0831 14.4993 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C15.9519 2 19.3684 4.29238 20.9922 7.61993L19.2011 8.51103C17.905 5.84083 15.1675 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20C14.1502 20 16.1022 19.1517 17.5398 17.7716L18.5374 19.5674Z", fill: "#DEDFE0" })), X = (t) => /* @__PURE__ */ d.createElement("svg", { width: 12, height: 12, viewBox: "0 0 12 12", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ d.createElement("path", { d: "M12 6C12 2.68629 9.31371 0 6 0H0V6C0 9.31371 2.68629 12 6 12H12V6Z", fill: "currentColor" }), /* @__PURE__ */ d.createElement("path", { d: "M5.1663 7.32125L8.99647 3.49109L9.58571 4.08034L5.1663 8.49975L2.51465 5.84812L3.10391 5.25887L5.1663 7.32125Z", fill: "white" })), Y = (t) => /* @__PURE__ */ d.createElement("svg", { width: 12, height: 12, viewBox: "0 0 12 12", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ d.createElement("path", { d: "M12 6C12 2.68629 9.31371 0 6 0H0V6C0 9.31371 2.68629 12 6 12H12V6Z", fill: "currentColor" }), /* @__PURE__ */ d.createElement("path", { d: "M5.1663 7.32125L8.99647 3.49109L9.58571 4.08034L5.1663 8.49975L2.51465 5.84812L3.10391 5.25887L5.1663 7.32125Z", fill: "black" })), n = ({
   size: t = "large",
   disabled: l = !1,
   variant: b = "primary",
-  children: d,
+  children: u,
   startIcon: i,
-  endIcon: r,
-  icon: k,
-  onClick: m,
-  shape: f = "normal",
-  className: w = "",
-  theme: x,
-  loading: s,
-  loadingType: _ = "default",
-  ...S
+  endIcon: s,
+  icon: a,
+  onClick: c,
+  shape: w = "normal",
+  className: _ = "",
+  theme: v,
+  loading: h,
+  loadingType: S = "default",
+  checked: C = !0,
+  ...L
 }) => {
-  const C = (j) => {
-    s || m && m(j);
-  }, { theme: c } = g(), L = {
-    variant: s ? "tertiary" : b,
+  const j = (E) => {
+    h || c && c(E);
+  }, { theme: p } = x(), D = {
+    variant: h ? "tertiary" : b,
     size: t,
-    theme: x || c,
-    shape: f,
-    disabled: s ? !0 : l
+    theme: v || p,
+    shape: w,
+    disabled: h ? !0 : l,
+    checked: C
   };
-  return /* @__PURE__ */ a.jsx(
+  return /* @__PURE__ */ r.jsx(
     "button",
     {
       type: "button",
-      onClick: C,
-      className: `${v(J(L))} ${w}`,
+      onClick: j,
+      className: `${k(K(D))} ${_}`,
       disabled: l,
-      ...S,
-      children: s ? _ === "refresh" ? /* @__PURE__ */ a.jsx(Q, { className: v(K({ size: t })) }) : /* @__PURE__ */ a.jsx(O, { size: t, theme: c }) : /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
-        i && /* @__PURE__ */ a.jsx("span", { className: "bu-mr-[9px]", children: i }),
-        d,
-        r && /* @__PURE__ */ a.jsx("span", { className: "bu-ml-[9px] bu-flex bu-items-center", children: r }),
-        k
+      ...L,
+      children: h ? S === "refresh" ? /* @__PURE__ */ r.jsx(U, { className: k(O({ size: t })) }) : /* @__PURE__ */ r.jsx(Q, { size: t, theme: p }) : /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+        i && /* @__PURE__ */ r.jsx("span", { className: "bu-mr-[9px]", children: i }),
+        u,
+        s && /* @__PURE__ */ r.jsx("span", { className: "bu-ml-[9px] bu-flex bu-items-center", children: s }),
+        a
       ] })
     }
   );
-}, Y = (t) => {
-  const { theme: l } = g(), { checked: b } = t;
-  return /* @__PURE__ */ a.jsxs("div", { className: "bu-relative", children: [
-    /* @__PURE__ */ a.jsx(h, { ...t, variant: "ghost3" }),
-    /* @__PURE__ */ a.jsx(
+}, I = (t) => {
+  const { theme: l } = x(), { checked: b } = t;
+  return /* @__PURE__ */ r.jsxs("div", { className: "bu-relative", children: [
+    /* @__PURE__ */ r.jsx(n, { ...t, variant: "ghost3" }),
+    /* @__PURE__ */ r.jsx(
       "div",
       {
-        className: D(
+        className: g(
           "bu-absolute bu-right-0 bu-top-0",
           l === "light" ? "bu-text-light-label" : "bu-text-dark-label",
           "bu-rounded-bl-[8px] bu-rounded-br-none bu-rounded-tl-none bu-rounded-tr-[8px]",
           "bu-flex bu-items-center bu-justify-center"
         ),
-        children: b ? l === "light" ? /* @__PURE__ */ a.jsx(U, {}) : /* @__PURE__ */ a.jsx(X, {}) : null
+        children: l === "light" ? /* @__PURE__ */ r.jsx(
+          X,
+          {
+            className: g(b ? "" : "bu-text-light-line-secondary")
+          }
+        ) : /* @__PURE__ */ r.jsx(
+          Y,
+          {
+            className: g(b ? "" : "bu-text-dark-line-secondary")
+          }
+        )
       }
     )
   ] });
-}, I = (t) => {
-  const { theme: l } = g();
-  return /* @__PURE__ */ a.jsx(
-    h,
+}, ee = (t) => {
+  const { theme: l } = x();
+  return /* @__PURE__ */ r.jsx(
+    n,
     {
       ...t,
       variant: "ghost",
@@ -414,8 +450,8 @@ const E = e("bu-text-light-second", {
     }
   );
 };
-h.WhiteButton = I;
-h.CheckButton = Y;
+n.WhiteButton = ee;
+n.CheckButton = I;
 export {
-  h as Button
+  n as Button
 };