@blofin/blofin-ui 0.7.57 → 0.7.58

package/dist/Switch.es.js

@@ -0,0 +1,64 @@
+"use client";
+import { jsx as e } from "react/jsx-runtime";
+import { s } from "./index.module-b4239ff5.js";
+import { c as t } from "./index-c57db938.js";
+import { u as l } from "./useTheme-0688f238.js";
+import "./clsx.m-e965ef18.js";
+import "react";
+const n = t(
+  "bu-flex bu-cursor-pointer bu-items-center bu-p-[2px]",
+  {
+    variants: {
+      size: {
+        tiny: "bu-h-[16px] bu-w-[28px]",
+        small: "bu-h-[18px] bu-w-[32px]",
+        medium: "bu-h-[24px] bu-w-[40px]"
+      }
+    }
+  }
+), p = t("bu-rounded-full bu-bg-light-background", {
+  variants: {
+    size: {
+      tiny: "bu-h-[12px] bu-w-[12px]",
+      small: "bu-h-[14px] bu-w-[14px]",
+      medium: "bu-h-[20px] bu-w-[20px]"
+    }
+  }
+}), o = t("", {
+  variants: {
+    size: {
+      tiny: "bu-translate-x-[12px]",
+      small: "bu-translate-x-[14px]",
+      medium: "bu-translate-x-[16px]"
+    }
+  }
+}), x = t("", {
+  variants: {
+    theme: {
+      light: "bu-bg-light-fill-secondary",
+      dark: "bu-bg-dark-fill-tertiary"
+    }
+  }
+}), v = ({ check: u, onChange: r, size: i = "medium", className: a = "" }) => {
+  const { theme: b } = l(), m = () => {
+    r();
+  };
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      className: `${s.switch} ${x({ theme: b })} ${n({ size: i })} ${u ? "bu-bg-light-primary" : ""} ${a}`,
+      onClick: m,
+      children: /* @__PURE__ */ e(
+        "div",
+        {
+          className: `${s.thumb} ${u ? o({ size: i }) : ""} ${p({
+            size: i
+          })}`
+        }
+      )
+    }
+  );
+};
+export {
+  v as Switch
+};

package/dist/Tab.d.ts

@@ -0,0 +1 @@
+export * from './components/Tab/index'

package/dist/Tab.es.js

@@ -0,0 +1,101 @@
+"use client";
+import { jsxs as d, jsx as u } from "react/jsx-runtime";
+import * as l from "react";
+import { u as $ } from "./useTheme-0688f238.js";
+import { c as N } from "./utils-071abd68.js";
+import { c as r } from "./index-c57db938.js";
+import "./clsx.m-e965ef18.js";
+const w = "_tab_z7uci_1", j = {
+  tab: w
+}, z = r("bu-min-w-[32px] bu-cursor-pointer", {
+  variants: {
+    size: {
+      small: "bu-text-[14px] bu-mr-[16px]",
+      medium: "bu-text-[14px] bu-mr-[16px]",
+      large: "bu-text-[16px] bu-mr-[16px]",
+      max: "bu-text-[20px] bu-mr-[24px]"
+    }
+  }
+}), T = r("after:bu-mt-[8px] after:bu-block after:bu-h-[2px] after:bu-w-[32px]"), _ = r("", {
+  variants: {
+    theme: {
+      light: "bu-text-light-primary",
+      dark: "bu-text-dark-primary"
+    }
+  }
+}), C = r("", {
+  variants: {
+    theme: {
+      light: "bu-text-light-label after:bu-bg-light-primary",
+      dark: "bu-text-dark-label  after:bu-bg-dark-primary"
+    }
+  }
+}), I = r("", {
+  variants: {
+    theme: {
+      light: "bu-text-light-label-40",
+      dark: "bu-text-dark-label-40"
+    }
+  }
+}), M = r("", {
+  variants: {
+    theme: {
+      light: "bu-text-light-label-40",
+      dark: "bu-text-dark-label-40"
+    }
+  }
+}), R = r("bu-border-b-[1px] bu-px-[16px]", {
+  variants: {
+    theme: {
+      light: "bu-border-light-line-primary",
+      dark: "bu-border-dark-line-primary"
+    }
+  }
+}), q = l.forwardRef((x, p) => {
+  var o;
+  const {
+    defaultIndex: h,
+    items: s,
+    size: a,
+    change: b,
+    className: f,
+    children: y,
+    tabWrapperClass: k,
+    hideBorder: g = !1,
+    hideUnderline: n = !1
+  } = x;
+  l.useImperativeHandle(p, () => ({
+    setTab: (e) => {
+      var i;
+      m((i = s[e]) == null ? void 0 : i.key);
+    }
+  }));
+  const [c, m] = l.useState(((o = s[h || 0]) == null ? void 0 : o.key) || s[0].key), { theme: t } = $(), v = (e) => {
+    m(e), b == null || b(e);
+  }, S = l.useMemo(() => a === "small" ? _({ theme: t }) : `${n ? "" : T()} ${C({ theme: t })}`, [a, t, n]), A = l.useMemo(() => a === "small" ? M({ theme: t }) : I({ theme: t }), [a, t]);
+  return /* @__PURE__ */ d("div", { className: "bu-flex bu-flex-col", children: [
+    /* @__PURE__ */ d(
+      "div",
+      {
+        className: `bu-flex bu-justify-between ${a !== "small" && !g ? R({ theme: t }) : ""} ${k || ""}`,
+        children: [
+          /* @__PURE__ */ u("ul", { className: `${j.tab}`, children: s.map((e) => /* @__PURE__ */ u(
+            "li",
+            {
+              id: e.key,
+              className: `${z({ size: a })} ${c === e.key ? S : A}`,
+              onClick: () => v(e.key),
+              children: e.label
+            },
+            e.key
+          )) }),
+          y
+        ]
+      }
+    ),
+    /* @__PURE__ */ u("div", { className: N("bu-h-full bu-w-full", f), children: s.map((e, i) => /* @__PURE__ */ u(l.Fragment, { children: c === e.key ? e.children : null }, i)) })
+  ] });
+});
+export {
+  q as Tab
+};

package/dist/Table.d.ts

@@ -0,0 +1 @@
+export * from './components/Table/index'

package/dist/Table.es.js

@@ -0,0 +1,359 @@
+"use client";
+import { jsxs as k, jsx as n } from "react/jsx-runtime";
+import * as i from "react";
+import { useContext as V } from "react";
+import { Empty as X } from "./Empty.es.js";
+import { Button as L } from "./Button.es.js";
+import { c as Z } from "./index-c57db938.js";
+import { u as N } from "./useTheme-0688f238.js";
+import { SortGroup as j, SortButton as W } from "./Sort.es.js";
+import { S as ee } from "./sortable.esm-8d31c120.js";
+import "./utils-071abd68.js";
+import "./clsx.m-e965ef18.js";
+import "./arrow-down-011b02c7.js";
+import "./helper-221987f8.js";
+const B = {
+  isScroll: !1
+}, H = i.createContext({
+  state: B,
+  dispatch: () => {
+  }
+}), te = (e, a) => {
+  switch (a.type) {
+    case "checkScroll":
+      return { ...e, isScroll: a.payload };
+    default:
+      return e;
+  }
+}, se = "_container_q0tsf_1", ne = "_shadow_q0tsf_8", re = "_table_q0tsf_12", ae = "_th_q0tsf_54", le = "_thead_q0tsf_69", oe = "_td_q0tsf_74", ce = "_hover_q0tsf_95", ie = "_pagination_q0tsf_99", de = "_prev_q0tsf_108", fe = "_next_q0tsf_111", he = "_arrow_q0tsf_114", ue = "_previcon_q0tsf_119", ge = "_nexticon_q0tsf_122", _e = "_icon_q0tsf_126", ye = "_pageBtn_q0tsf_131", xe = "_priamry_q0tsf_138", Ce = "_disabled_q0tsf_142", be = "_ghostClass_q0tsf_154", me = "_scroll_q0tsf_158", r = {
+  container: se,
+  shadow: ne,
+  table: re,
+  "table-col-fixed-left": "_table-col-fixed-left_q0tsf_16",
+  "table-col-fixed-right": "_table-col-fixed-right_q0tsf_21",
+  "table-col-fixed-left-last": "_table-col-fixed-left-last_q0tsf_26",
+  "table-col-fixed-right-last": "_table-col-fixed-right-last_q0tsf_40",
+  th: ae,
+  thead: le,
+  td: oe,
+  hover: ce,
+  "pagination-container": "_pagination-container_q0tsf_99",
+  pagination: ie,
+  prev: de,
+  next: fe,
+  arrow: he,
+  previcon: ue,
+  nexticon: ge,
+  icon: _e,
+  pageBtn: ye,
+  priamry: xe,
+  disabled: Ce,
+  "empty-wrapper": "_empty-wrapper_q0tsf_146",
+  ghostClass: be,
+  scroll: me
+}, we = (e) => {
+  const a = (s) => {
+    e.onChange(s);
+  };
+  return /* @__PURE__ */ k("div", { className: r.pagination, children: [
+    /* @__PURE__ */ n(
+      L,
+      {
+        variant: "ghost",
+        size: "small",
+        disabled: e.isFirstPage,
+        className: r.prev,
+        onClick: () => a("prev"),
+        children: "previous"
+      }
+    ),
+    /* @__PURE__ */ n(
+      L,
+      {
+        variant: "primary",
+        size: "small",
+        disabled: e.isLastPage,
+        className: r.next,
+        onClick: () => a("next"),
+        children: "next"
+      }
+    )
+  ] });
+}, ke = (e) => e.fixed && e.fixed === "left" ? `table-col-fixed-${e.fixed}` : e.fixed && e.fixed === "right" ? `table-col-fixed-${e.fixed}` : "", Se = {
+  center: "center",
+  "flex-start": "left",
+  "flex-end": "right"
+}, $e = (e) => ({
+  width: e.width || "auto",
+  textAlign: e.align ? Se[e.align] : "center"
+}), P = (e, a) => {
+  const s = {
+    ...$e(e)
+  };
+  return e.fixed && (s[e.fixed] = a + "px"), s;
+}, p = Z("", {
+  variants: {
+    theme: {
+      dark: "bu-bg-dark-background",
+      light: "bu-bg-light-background"
+    }
+  }
+}), F = (e) => {
+  const { state: a } = V(H);
+  return (s, f) => {
+    const o = [r[ke(s)]];
+    return s.fixed && s.fixed === "left" && !e[f + 1].fixed && a.isScroll && o.push(r["table-col-fixed-left-last"]), s.fixed && s.fixed === "right" && !e[f - 1].fixed && a.isScroll && o.push(r["table-col-fixed-right-last"]), o;
+  };
+}, T = (e) => {
+  let a = 0, s = 0;
+  return e.map((o, d) => o.fixed === "left" ? (a = d === 0 ? 0 : parseFloat(e[d - 1].width || v) + parseFloat(a + ""), {
+    ...o,
+    offset: a
+  }) : o.fixed === "right" ? (s = d === e.length - 1 ? 0 : parseFloat(e[d + 1].width || v) + parseFloat(s + ""), {
+    ...o,
+    offset: s
+  }) : {
+    ...o,
+    offset: 0
+  });
+}, qe = i.forwardRef((e, a) => {
+  const { data: s, columns: f, customeTheme: o, tbodyClass: d } = e, { theme: b } = N(), g = F(f), h = T(f), m = (u) => {
+    e.rowClick && e.rowClick(u);
+  };
+  return /* @__PURE__ */ n("tbody", { className: `${r.tbody} ${d}`, children: s.map((u, x) => {
+    let C = 0, y = 0;
+    return /* @__PURE__ */ n(
+      "tr",
+      {
+        id: e.rowIdPrefix ? `${e.rowIdPrefix}-${x}` : "",
+        ref: a,
+        className: `${r.hover} ${e.tdClass}`,
+        style: e.rowClick ? { cursor: "pointer" } : {},
+        onClick: () => m(u),
+        children: f.map((c, l) => (c.onCell && (C = c.onCell(u, x), y = l), l <= y || l > C ? /* @__PURE__ */ n(
+          "td",
+          {
+            colSpan: c.onCell && (c == null ? void 0 : c.onCell(u, x)),
+            className: `${g(c, l).join(" ")} ${r.td} ${p({
+              theme: o || b
+            })}`,
+            style: P(c, h[l].offset),
+            children: c.render ? c.render(u, x) : u[c.key]
+          },
+          c.key
+        ) : null))
+      },
+      u[e.rowKey]
+    );
+  }) });
+}), Re = i.forwardRef((e, a) => {
+  const { columns: s, customeTheme: f, data: o, moveEnd: d, drag: b, onChange: g, type: h, methodRef: m } = e, { theme: u } = N(), x = i.useRef(null);
+  i.useImperativeHandle(a, () => x.current);
+  const C = F(s), y = T(s), c = (l) => {
+    g && g(l);
+  };
+  return /* @__PURE__ */ n(j, { ref: m, type: h, children: /* @__PURE__ */ n(
+    "thead",
+    {
+      className: `${r.thead} ${e.theadClass}`,
+      style: e.scroll ? { position: "sticky", zIndex: "999", top: "-1px" } : {},
+      children: /* @__PURE__ */ n("tr", { ref: x, children: s.map((l, w) => /* @__PURE__ */ n(
+        "th",
+        {
+          className: `${C(l, w).join(" ")} ${r.th} ${p({
+            theme: f || u
+          })} ${l.fixed ? "no-drag" : "th-drag-item"}`,
+          style: P(l, y[w].offset),
+          children: /* @__PURE__ */ n(
+            W,
+            {
+              onSortChange: c,
+              sortKey: l.key || "",
+              hideSort: !l.filter,
+              textAlign: l.align,
+              width: "100%",
+              iconStyle: { width: "10px", height: "5px" },
+              children: l.renderHeader ? l.renderHeader(o) : /* @__PURE__ */ n("span", { className: r.sort, children: l.title })
+            },
+            l.key
+          )
+        },
+        l.key
+      )) })
+    }
+  ) });
+}), v = "150", We = i.forwardRef((e, a) => {
+  const [s, f] = i.useReducer(te, B), o = i.useRef(null), d = i.useRef(null), b = i.useRef(null), {
+    columns: g,
+    data: h,
+    hidePagination: m = !1,
+    renderEmpty: u,
+    paginationPosition: x = "flex-end",
+    moveEnd: C,
+    drag: y = !1,
+    tableLayout: c,
+    dragClass: l,
+    type: w = "single",
+    methodRef: z
+  } = e, { theme: A } = N(), D = F(g), [O, E] = i.useState(!1), Y = T(g), S = i.useRef(null), G = g.reduce((t, _) => parseFloat(t.toString()) + parseFloat(_.width || v), "0") + "px", M = g.find((t) => t.fixed), J = (t) => {
+    t.currentTarget.scrollLeft === 0 ? f({
+      type: "checkScroll",
+      payload: !1
+    }) : f({
+      type: "checkScroll",
+      payload: !0
+    });
+  }, Q = (t) => {
+    e.changePagination && e.changePagination(t);
+  }, $ = i.useRef(null), q = i.useRef(null), U = (t) => {
+    e.onChange && e.onChange(t);
+  };
+  return i.useEffect(() => {
+    setTimeout(() => {
+      if (b.current && y && h.length > 0) {
+        const t = Array.from(b.current.children).map(
+          (_) => _.offsetWidth
+        );
+        d.current && Array.from(d.current.children).forEach((_, R) => {
+          _.style.width = t[R] + "px";
+        });
+      }
+      if (o.current) {
+        const t = o.current.offsetWidth;
+        d.current && (d.current.style.width = t + "px");
+      }
+    }, 0);
+  }, [y, h, O]), i.useEffect(() => {
+    h.length === 0 && (S.current = null), d.current && y && h.length > 0 && !S.current && (S.current = new ee(d.current, {
+      sort: !0,
+      animation: 150,
+      handle: ".th-drag-item",
+      filter: ".no-drag",
+      ghostClass: r.ghostClass,
+      dragClass: l,
+      forceFallback: !0,
+      onMove: function(t) {
+        return E(!1), $.current = t.dragged, q.current = t.related, t.related.className.indexOf("no-drag") === -1;
+      },
+      onEnd: function(t) {
+        var I, K;
+        const _ = (I = $.current) == null ? void 0 : I.getAttribute("drag-id"), R = (K = q.current) == null ? void 0 : K.getAttribute("drag-id");
+        C && C(_, R), $.current = null, q.current = null, E(!0);
+      }
+    }));
+  }, [y, h]), /* @__PURE__ */ k(H.Provider, { value: { state: s, dispatch: f }, children: [
+    /* @__PURE__ */ n(
+      "div",
+      {
+        className: `${r.container} ${e.scroll || e.hideShadow ? "" : r.shadow}`,
+        style: {
+          overflowY: e.scroll ? "visible" : "scroll",
+          height: e.scroll ? " 100%" : "auto"
+        },
+        onScroll: J,
+        children: /* @__PURE__ */ k(
+          "div",
+          {
+            ref: a,
+            className: `${r.scroll} ${A === "dark" ? r["scroll-dark"] : r["scroll-light"]}`,
+            style: e.scroll ? { height: "100%", overflowY: "scroll" } : {},
+            children: [
+              y && h.length > 0 && /* @__PURE__ */ n(j, { type: w, children: /* @__PURE__ */ n(
+                "div",
+                {
+                  ref: d,
+                  className: `bu-flex ${e.theadClass ? e.theadClass : ""}`,
+                  style: e.scroll ? { position: "sticky", zIndex: "1000", top: "-1px" } : {},
+                  children: g.map((t, _) => /* @__PURE__ */ n(
+                    "div",
+                    {
+                      className: `${D(t, _).join(" ")} bu-flex bu-items-center ${r.th} ${p({
+                        theme: A
+                      })} ${t.fixed ? "no-drag" : "th-drag-item"}`,
+                      style: P(t, Y[_].offset),
+                      "drag-id": t.key,
+                      children: /* @__PURE__ */ n(
+                        W,
+                        {
+                          onSortChange: U,
+                          sortKey: t.key || "",
+                          hideSort: !t.filter,
+                          textAlign: t.align,
+                          width: "100%",
+                          iconStyle: { width: "10px", height: "5px" },
+                          children: t.renderHeader ? t.renderHeader(h[_]) : /* @__PURE__ */ n("span", { className: r.sort, children: t.title })
+                        },
+                        t.key
+                      )
+                    },
+                    t.key
+                  ))
+                }
+              ) }),
+              /* @__PURE__ */ k(
+                "table",
+                {
+                  ref: o,
+                  className: r.table,
+                  style: {
+                    width: M ? G : "100%",
+                    minWidth: "100%",
+                    tableLayout: c || "fixed"
+                  },
+                  children: [
+                    /* @__PURE__ */ n(
+                      Re,
+                      {
+                        data: h,
+                        columns: g,
+                        theadClass: e.theadClass ? e.theadClass : "",
+                        onChange: e.onChange,
+                        scroll: e.scroll,
+                        customeTheme: e.theme,
+                        type: w,
+                        methodRef: z
+                      }
+                    ),
+                    /* @__PURE__ */ n(
+                      qe,
+                      {
+                        ref: b,
+                        data: h,
+                        columns: g,
+                        tdClass: e.tdClass ? e.tdClass : "",
+                        rowKey: e.rowKey || "key",
+                        rowClick: e.rowClick,
+                        customeTheme: e.theme,
+                        tbodyClass: e.tbodyClass ? e.tbodyClass : "",
+                        rowIdPrefix: e.rowIdPrefix || ""
+                      }
+                    )
+                  ]
+                }
+              ),
+              h.length === 0 ? u || /* @__PURE__ */ n(X, {}) : ""
+            ]
+          }
+        )
+      }
+    ),
+    m ? null : /* @__PURE__ */ n(
+      "div",
+      {
+        className: r["pagination-container"],
+        style: { justifyContent: x },
+        children: e.customPagination && /* @__PURE__ */ n(
+          we,
+          {
+            isLastPage: e.isLastPage ?? !1,
+            isFirstPage: e.isFirstPage ?? !0,
+            onChange: Q
+          }
+        )
+      }
+    )
+  ] });
+});
+export {
+  We as Table
+};

package/dist/TextField.d.ts

@@ -0,0 +1 @@
+export * from './components/TextField/index'

package/dist/TextField.es.js

@@ -0,0 +1,64 @@
+"use client";
+import { jsx as a, jsxs as N } from "react/jsx-runtime";
+import * as S from "react";
+import { u as x } from "./useTheme-0688f238.js";
+import { c as l } from "./utils-071abd68.js";
+import { I as z, A as m, a as I, b as g, c as u, d as A } from "./styles-85a9fe64.js";
+import "./clsx.m-e965ef18.js";
+import "./index-c57db938.js";
+const P = S.forwardRef((p, c) => {
+  const {
+    variant: d,
+    theme: e,
+    startAdornment: s,
+    endAdornment: n,
+    type: f,
+    error: h,
+    disabled: i,
+    className: o,
+    inputClassName: b,
+    inputSize: t = "md",
+    ...y
+  } = p, { theme: r } = x();
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      className: l(
+        z({
+          variant: d,
+          theme: e || r,
+          error: h,
+          disabled: i,
+          noClassName: !o,
+          size: t
+        }),
+        o
+      ),
+      children: /* @__PURE__ */ N("div", { className: "bu-flex bu-h-full bu-w-full bu-items-center bu-justify-center", children: [
+        s && (typeof s == "string" ? /* @__PURE__ */ a("span", { className: m({ size: t, position: "start" }), children: s }) : s),
+        /* @__PURE__ */ a(
+          "input",
+          {
+            disabled: i,
+            type: f,
+            ...y,
+            ref: c,
+            className: `${l(
+              "bu-h-full bu-w-full bu-flex-1 bu-bg-transparent bu-outline-none",
+              A({ inputSize: t }),
+              b,
+              !s && u({ inputSize: t }),
+              !n && u({ inputSize: t }),
+              g({ theme: e || r }),
+              I({ theme: e || r })
+            )}`
+          }
+        ),
+        n && (typeof n == "string" ? /* @__PURE__ */ a("span", { className: m({ size: t, position: "end" }), children: n }) : n)
+      ] })
+    }
+  );
+});
+export {
+  P as TextField
+};

package/dist/TextSelect.d.ts

@@ -0,0 +1 @@
+export * from './components/TextSelect/index'

package/dist/TextSelect.es.js

@@ -0,0 +1,17 @@
+"use client";
+import { T as n } from "./index-9349bf2d.js";
+import "react/jsx-runtime";
+import "react";
+import "react-dom";
+import "./TextField.es.js";
+import "./useTheme-0688f238.js";
+import "./utils-071abd68.js";
+import "./clsx.m-e965ef18.js";
+import "./styles-85a9fe64.js";
+import "./index-c57db938.js";
+import "./useAlign-916ed3be.js";
+import "./arrow-down-011b02c7.js";
+import "./search-b79a3be5.js";
+export {
+  n as TextSelect
+};

package/dist/Textarea.d.ts

@@ -0,0 +1 @@
+export * from './components/Textarea/index'