@gearbox-protocol/ui-kit 3.14.0-next.8 → 4.0.0-next.1

package/dist/esm/components/radio-group/radio-group.js

@@ -1,95 +0,0 @@
-import { jsx as e, jsxs as n } from "react/jsx-runtime";
-import * as t from "@radix-ui/react-radio-group";
-import { cva as s } from "class-variance-authority";
-import * as c from "react";
-import "@gearbox-protocol/sdk";
-import { cn as d } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
-import "luxon";
-import "../../utils/z-index.js";
-const g = s("w-full flex flex-col gap-4"), f = s(
-  [
-    "group flex shrink-0 items-center justify-center",
-    "min-w-5 w-5 h-5 rounded-full border border-gray-50 bg-transparent",
-    "cursor-pointer transition-colors",
-    "hover:border-gray-80",
-    "data-[state=checked]:bg-primary data-[state=checked]:border-primary",
-    "data-[state=checked]:hover:bg-accent data-[state=checked]:hover:border-accent",
-    "data-[disabled]:bg-gray-20 data-[disabled]:border-gray-50 data-[disabled]:cursor-default",
-    "data-[disabled]:data-[state=checked]:bg-gray-30 data-[disabled]:data-[state=checked]:border-gray-50",
-    "focus:outline-none focus-visible:ring-1 focus-visible:ring-ring"
-  ].join(" ")
-), b = s(
-  [
-    "size-2 rounded-full bg-foreground",
-    "opacity-0 group-hover:opacity-100 group-data-[state=checked]:opacity-100",
-    "group-data-[disabled]:bg-muted-foreground group-data-[disabled]:group-hover:opacity-0",
-    "group-data-[disabled]:group-data-[state=checked]:opacity-60"
-  ].join(" ")
-), h = c.forwardRef(({ className: a, ...o }, r) => /* @__PURE__ */ e(
-  t.Root,
-  {
-    ref: r,
-    className: d(g(), a),
-    ...o
-  }
-));
-h.displayName = t.Root.displayName ?? "RadioGroup";
-const p = c.forwardRef(({ className: a, ...o }, r) => /* @__PURE__ */ e(
-  t.Item,
-  {
-    ref: r,
-    className: d(f(), a),
-    ...o,
-    children: /* @__PURE__ */ e(
-      t.Indicator,
-      {
-        className: d(b())
-      }
-    )
-  }
-));
-p.displayName = t.Item.displayName ?? "RadioGroupItem";
-const y = c.forwardRef(({ value: a, label: o, description: r, disabled: i, className: l, ...m }, u) => /* @__PURE__ */ n(
-  "label",
-  {
-    htmlFor: a,
-    className: d(
-      "flex grow shrink-0 basis-0 cursor-pointer items-center",
-      i && "cursor-default"
-    ),
-    children: [
-      /* @__PURE__ */ e(
-        p,
-        {
-          ref: u,
-          value: a,
-          id: a,
-          disabled: i,
-          className: l,
-          ...m
-        }
-      ),
-      /* @__PURE__ */ n("span", { className: "grid gap-1.5 pl-3 leading-none", children: [
-        /* @__PURE__ */ e(
-          "span",
-          {
-            className: d(
-              "text-sm font-medium leading-none text-foreground",
-              i && "cursor-default opacity-70"
-            ),
-            children: o
-          }
-        ),
-        r && /* @__PURE__ */ e("span", { className: "text-sm text-secondary-foreground", children: r })
-      ] })
-    ]
-  }
-));
-y.displayName = "RadioOption";
-export {
-  h as RadioGroup,
-  p as RadioGroupItem,
-  y as RadioOption
-};

package/dist/esm/components/row/index.js

@@ -1,4 +0,0 @@
-import { Row as e } from "./row.js";
-export {
-  e as Row
-};

package/dist/esm/components/row/row.js

@@ -1,58 +0,0 @@
-import { jsx as w } from "react/jsx-runtime";
-import "react";
-import "@gearbox-protocol/sdk";
-import { cn as b } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
-import "luxon";
-import "../../utils/z-index.js";
-const v = {
-  "flex-start": "items-start",
-  "flex-end": "items-end",
-  center: "items-center",
-  baseline: "items-baseline",
-  stretch: "items-stretch"
-}, g = {
-  "flex-start": "justify-start",
-  "flex-end": "justify-end",
-  center: "justify-center",
-  "space-between": "justify-between",
-  "space-around": "justify-around",
-  "space-evenly": "justify-evenly"
-};
-function R({
-  $align: n,
-  align: i,
-  $justify: r,
-  justify: o,
-  $flexDirection: a = "row",
-  flexDirection: l,
-  $wrap: f = !0,
-  wrap: c,
-  $gap: m,
-  gap: p,
-  className: u,
-  children: x,
-  ...y
-}) {
-  const e = i || n, t = o || r, d = l || a, j = c ?? f, s = p ?? m;
-  return /* @__PURE__ */ w(
-    "div",
-    {
-      className: b(
-        "flex",
-        d === "column" ? "flex-col" : "flex-row",
-        j ? "flex-wrap" : "flex-nowrap",
-        e && v[e],
-        t && g[t],
-        s !== void 0 && `gap-${s}`,
-        u
-      ),
-      ...y,
-      children: x
-    }
-  );
-}
-export {
-  R as Row
-};

package/dist/esm/components/search-bar/index.js

@@ -1,4 +0,0 @@
-import { SearchBar as e } from "./search-bar.js";
-export {
-  e as SearchBar
-};

package/dist/esm/components/search-bar/search-bar.js

@@ -1,99 +0,0 @@
-import { jsx as e, jsxs as y } from "react/jsx-runtime";
-import { cva as l } from "class-variance-authority";
-import { useState as n } from "react";
-import { faMagnifyingGlass as b } from "@fortawesome/free-solid-svg-icons";
-import { FaIcon as w } from "../icons/fa-icon.js";
-import { Input as V } from "../input/input.js";
-import "@gearbox-protocol/sdk";
-import { cn as i } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
-import "luxon";
-import "../../utils/z-index.js";
-const z = l("relative w-full transition-all duration-200", {
-  variants: {
-    size: {
-      sm: "max-w-xs",
-      default: "max-w-96",
-      lg: "max-w-lg",
-      full: "max-w-full"
-    }
-  },
-  defaultVariants: {
-    size: "default"
-  }
-}), B = l("transition-all duration-200 pl-10", {
-  variants: {
-    active: {
-      true: "",
-      false: "bg-transparent border-input"
-    },
-    theme: {
-      light: "",
-      dark: ""
-    }
-  },
-  compoundVariants: [
-    {
-      active: !0,
-      theme: "light",
-      className: "bg-card text-foreground"
-    },
-    {
-      active: !0,
-      theme: "dark",
-      className: "bg-[rgb(40,40,40)] text-foreground"
-    },
-    {
-      active: !1,
-      theme: "light",
-      className: "text-foreground placeholder:text-foreground"
-    },
-    {
-      active: !1,
-      theme: "dark",
-      className: "text-foreground placeholder:text-foreground"
-    }
-  ],
-  defaultVariants: {
-    active: !1,
-    theme: "light"
-  }
-});
-function E({
-  onChange: c,
-  placeholder: m = "Search...",
-  className: u,
-  size: f,
-  theme: d = "light",
-  value: t
-}) {
-  const [p, h] = n(""), [g, a] = n(!1), r = t !== void 0, o = r ? t : p, v = o !== "" || g, x = (N) => {
-    const s = N.target.value;
-    r || h(s), c(s);
-  };
-  return /* @__PURE__ */ e("div", { className: i(z({ size: f }), u), children: /* @__PURE__ */ y("div", { className: "relative", children: [
-    /* @__PURE__ */ e(
-      w,
-      {
-        icon: b,
-        className: "absolute left-3 top-1/2 z-10 -translate-y-1/2 text-muted-foreground pointer-events-none size-[18px]"
-      }
-    ),
-    /* @__PURE__ */ e(
-      V,
-      {
-        type: "search",
-        placeholder: m,
-        value: o,
-        onChange: x,
-        onFocus: () => a(!0),
-        onBlur: () => a(!1),
-        className: i(B({ active: v, theme: d }))
-      }
-    )
-  ] }) });
-}
-export {
-  E as SearchBar
-};

package/dist/esm/components/separator/index.js

@@ -1,4 +0,0 @@
-import { Separator as a } from "./separator.js";
-export {
-  a as Separator
-};

package/dist/esm/components/separator/separator.js

@@ -1,29 +0,0 @@
-import { jsx as i } from "react/jsx-runtime";
-import * as o from "@radix-ui/react-separator";
-import * as e from "react";
-import "@gearbox-protocol/sdk";
-import { cn as l } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
-import "luxon";
-import "../../utils/z-index.js";
-const s = e.forwardRef(
-  ({ className: t, orientation: r = "horizontal", decorative: m = !0, ...p }, a) => /* @__PURE__ */ i(
-    o.Root,
-    {
-      ref: a,
-      decorative: m,
-      orientation: r,
-      className: l(
-        "shrink-0 bg-border",
-        r === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
-        t
-      ),
-      ...p
-    }
-  )
-);
-s.displayName = o.Root.displayName;
-export {
-  s as Separator
-};

package/dist/esm/components/signatures/confirmation-item.js

@@ -1,39 +0,0 @@
-import { jsxs as e, jsx as t } from "react/jsx-runtime";
-import "../buttons/back-button/back-button.js";
-import "../buttons/button/button.js";
-import { CopyButton as m } from "../buttons/copy-button/copy-button.js";
-import { ExternalButton as p } from "../buttons/external-button/external-button.js";
-import "../buttons/filter-button/filter-button.js";
-import "../buttons/navigation-button/navigation-button.js";
-import "react";
-import "@gearbox-protocol/sdk";
-import "clsx";
-import "tailwind-merge";
-import "sonner";
-import { shortenHash as s } from "../../utils/format.js";
-import "@gearbox-protocol/sdk/common-utils";
-import "luxon";
-import "../../utils/z-index.js";
-import "../buttons/tab-button/tab-button.js";
-import { Identicon as a } from "./identicon.js";
-function z({
-  confirmation: r,
-  note: o,
-  explorerUrl: i
-}) {
-  return /* @__PURE__ */ e("div", { className: "group relative flex items-center", children: [
-    /* @__PURE__ */ t("div", { className: "absolute left-[8px] h-2 w-2 rounded-full bg-green-500" }),
-    /* @__PURE__ */ e("div", { className: "ml-10 flex items-center gap-2", children: [
-      /* @__PURE__ */ t(a, { address: r, size: 32 }),
-      /* @__PURE__ */ t("span", { className: "text-foreground whitespace-nowrap", children: s(r) }),
-      o && /* @__PURE__ */ t("span", { className: "text-gray-500 text-xs whitespace-nowrap", children: o }),
-      /* @__PURE__ */ e("div", { className: "flex opacity-0 transition-opacity group-hover:opacity-100", children: [
-        /* @__PURE__ */ t(m, { text: r }),
-        i && /* @__PURE__ */ t(p, { url: i })
-      ] })
-    ] })
-  ] });
-}
-export {
-  z as ConfirmationItem
-};

package/dist/esm/components/signatures/identicon.js

@@ -1,17 +0,0 @@
-import { jsx as r } from "react/jsx-runtime";
-function i({
-  address: t,
-  size: e = 32
-}) {
-  return /* @__PURE__ */ r(
-    "div",
-    {
-      className: "rounded-full bg-gray-700 flex items-center justify-center text-foreground text-xs",
-      style: { width: e, height: e },
-      children: t.slice(2, 4)
-    }
-  );
-}
-export {
-  i as Identicon
-};

package/dist/esm/components/signatures/index.js

@@ -1,8 +0,0 @@
-import { ConfirmationItem as r } from "./confirmation-item.js";
-import { Identicon as i } from "./identicon.js";
-import { VerticalTimeline as n } from "./vertical-timeline.js";
-export {
-  r as ConfirmationItem,
-  i as Identicon,
-  n as VerticalTimeline
-};

package/dist/esm/components/signatures/vertical-timeline.js

@@ -1,56 +0,0 @@
-import { jsx as t, jsxs as l } from "react/jsx-runtime";
-import { useState as n } from "react";
-import { faCheck as m, faXmark as d } from "@fortawesome/free-solid-svg-icons";
-import { FaIcon as c } from "../icons/fa-icon.js";
-function b({
-  steps: s,
-  minWidth: i = 300
-}) {
-  const [r, o] = n(s.map(() => !1));
-  return /* @__PURE__ */ t("div", { className: "py-1", children: /* @__PURE__ */ l("div", { className: `relative min-w-[${i}px]`, children: [
-    /* @__PURE__ */ t("div", { className: "absolute left-[11px] top-[2px] bottom-[20px] w-[2px] h-[calc(100%-20px)] bg-gray-800" }),
-    /* @__PURE__ */ t("div", { className: "space-y-4", children: s.map((e, a) => /* @__PURE__ */ l(
-      "div",
-      {
-        children: [
-          e.type === "default" && e.status !== "not-started" && /* @__PURE__ */ l("div", { className: "relative flex items-center", children: [
-            /* @__PURE__ */ l(
-              "div",
-              {
-                className: `absolute left-[2px] flex h-5 w-5 items-center justify-center rounded-full ${e.status === "success" ? "bg-green-500" : e.status === "error" ? "bg-red-500" : "border-2 border-gray-600 bg-transparent"}`,
-                children: [
-                  e.status === "success" && /* @__PURE__ */ t(c, { icon: m, className: "size-3 text-black" }),
-                  e.status === "error" && /* @__PURE__ */ t(c, { icon: d, className: "size-3 text-black" })
-                ]
-              }
-            ),
-            /* @__PURE__ */ t("span", { className: "ml-10 text-foreground", children: e.title })
-          ] }),
-          e.type === "extention" && e.status !== "not-started" && /* @__PURE__ */ l("div", { className: "space-y-2", children: [
-            /* @__PURE__ */ l("div", { className: "relative flex items-center", children: [
-              /* @__PURE__ */ t("div", { className: "absolute left-[8px] h-2 w-2 rounded-full bg-green-500" }),
-              /* @__PURE__ */ t(
-                "button",
-                {
-                  type: "button",
-                  onClick: () => o([
-                    ...r.slice(0, a),
-                    !r[a],
-                    ...r.slice(a + 1)
-                  ]),
-                  className: "ml-10 text-green-500 hover:underline cursor-pointer",
-                  children: r[a] ? "Hide all" : "Show all"
-                }
-              )
-            ] }),
-            r[a] && e.children
-          ] })
-        ]
-      },
-      `step-${a}`
-    )) })
-  ] }) });
-}
-export {
-  b as VerticalTimeline
-};

package/dist/esm/components/slider-token/index.js

@@ -1,9 +0,0 @@
-import { SliderToken as o } from "./slider-token.js";
-import { SliderTokenLabel as l } from "./slider-token-label.js";
-import { makeSliderTokenMarkerPoints as a, mergeCloseMarkers as i } from "./slider-token-utils.js";
-export {
-  o as SliderToken,
-  l as SliderTokenLabel,
-  a as makeSliderTokenMarkerPoints,
-  i as mergeCloseMarkers
-};

package/dist/esm/components/slider-token/slider-token-label.js

@@ -1,36 +0,0 @@
-import { jsx as f } from "react/jsx-runtime";
-import { getThumbInBoundsOffset as i } from "../slider/types.js";
-function b({
-  point: e,
-  min: o,
-  max: a,
-  label: p,
-  align: s,
-  onSelect: u
-}) {
-  const n = a - o;
-  if (n <= 0) return null;
-  const r = (e - o) / n * 100, l = i(r), c = s === "top" ? -28 : 15;
-  return /* @__PURE__ */ f(
-    "button",
-    {
-      type: "button",
-      tabIndex: -1,
-      className: "absolute -translate-x-1/2 text-[11px] leading-[126%] text-muted-foreground hover:text-foreground cursor-pointer border-0 p-0 appearance-none bg-transparent pointer-events-auto",
-      style: {
-        left: `calc(${r}% + ${l}px)`,
-        top: `${c}px`
-      },
-      onPointerDown: (t) => {
-        t.stopPropagation();
-      },
-      onClick: (t) => {
-        t.preventDefault(), t.stopPropagation(), u(e);
-      },
-      children: p
-    }
-  );
-}
-export {
-  b as SliderTokenLabel
-};

package/dist/esm/components/slider-token/slider-token-utils.js

@@ -1,27 +0,0 @@
-import { validateMarkerPoints as u } from "../slider/slider-utils.js";
-import { splitInterval as p } from "../../utils/math.js";
-function v(n, e, o, t = {}) {
-  const i = Object.values(t), s = p(
-    n,
-    e,
-    o,
-    i.length ? i : void 0
-  ).map((r) => ({
-    point: r,
-    type: t[r] !== void 0 ? "additional" : "base"
-  }));
-  return u(s, n, e);
-}
-function c(n, e) {
-  return n.length <= 2 ? n : n.reduce((o, t, i, a) => {
-    const s = a[i + 1];
-    if (i === 0 || !s || t.type === "additional")
-      return o.push(t), o;
-    const r = Math.abs(t.point - s.point), d = a[i - 1], l = d?.type === "additional" && Math.abs(t.point - d.point) <= e;
-    return r > e && !l && o.push(t), o;
-  }, []);
-}
-export {
-  v as makeSliderTokenMarkerPoints,
-  c as mergeCloseMarkers
-};

package/dist/esm/components/slider-token/slider-token.js

@@ -1,163 +0,0 @@
-import { jsx as r, jsxs as B } from "react/jsx-runtime";
-import { formatBN as F, toBN as H } from "@gearbox-protocol/sdk";
-import * as v from "@radix-ui/react-slider";
-import { useMemo as l, useCallback as u, useRef as J } from "react";
-import { SliderProvider as K } from "../slider/slider-context.js";
-import { SliderMark as Q } from "../slider/slider-mark.js";
-import { cn as x } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
-import { validateMinMax as w } from "../../utils/math.js";
-import "luxon";
-import "../../utils/z-index.js";
-import { SliderTokenLabel as X } from "./slider-token-label.js";
-import { makeSliderTokenMarkerPoints as Y, mergeCloseMarkers as Z } from "./slider-token-utils.js";
-const V = 7.5;
-function pe({
-  from: p,
-  to: g,
-  step: I,
-  markerStep: N,
-  token: b,
-  additionalMarkers: c,
-  additionalMarkersLabels: S,
-  value: $,
-  setValue: m,
-  epsilon_inPer: E = 1,
-  mergeMarkers_inPer: L = 3,
-  className: z
-}) {
-  const [t, n] = p > g ? [g, p] : [p, g], d = l(() => n - t, [n, t]), M = l(
-    () => d / 100 * E,
-    [E, d]
-  ), T = l(
-    () => d / 100 * L,
-    [d, L]
-  ), h = l(
-    () => d / 100 * V,
-    [d]
-  ), f = l(() => c == null ? {} : typeof c == "number" ? { [c]: c } : Object.fromEntries(
-    c.map((e) => [e, e])
-  ), [c]), y = l(
-    () => Y(
-      t,
-      n,
-      N,
-      f
-    ),
-    [t, n, N, f]
-  ), i = l(
-    () => Z(y, T),
-    [y, T]
-  ), C = u(
-    (e) => {
-      if (i.length === 0) {
-        m(w(e, t, n));
-        return;
-      }
-      const o = i.reduce(
-        (a, s) => Math.abs(s.point - e) < Math.abs(a.point - e) ? s : a
-      );
-      Math.abs(o.point - e) < M ? m(w(o.point, t, n)) : m(e);
-    },
-    [i, M, t, n, m]
-  ), P = u(
-    (e) => {
-      e.length > 0 && C(e[0]);
-    },
-    [C]
-  ), R = u(
-    (e) => {
-      m(w(e, t, n));
-    },
-    [t, n, m]
-  ), D = J(null), A = u(() => {
-    const e = D.current;
-    if (!e) return;
-    const o = () => {
-      e.dataset.dragging = "";
-    }, a = () => {
-      document.removeEventListener("pointermove", o), delete e.dataset.dragging;
-    };
-    document.addEventListener("pointermove", o, { once: !0 }), document.addEventListener("pointerup", a, { once: !0 });
-  }, []), G = l(() => i.map(({ point: e }, o, a) => {
-    const s = a[o + 1], k = a[o - 1], O = s ? Math.abs(e - s.point) <= h : !1, U = k ? Math.abs(e - k.point) <= h : !1, W = o === 0 || o === a.length - 1 || f[e] !== void 0 && !U && !O, _ = S?.[e], q = W ? F(H(String(e), b.decimals), b.decimals) : "", j = _ ?? q;
-    return { point: e, labelText: j, align: _ ? "top" : "bottom", hasLabel: !!j };
-  }), [
-    i,
-    f,
-    S,
-    b,
-    h
-  ]);
-  return /* @__PURE__ */ r("div", { className: x("relative w-full", z), children: /* @__PURE__ */ r(K, { colorIntervals: void 0, min: t, max: n, children: /* @__PURE__ */ r("div", { className: "relative w-full px-[9px] pt-3 pb-3", children: /* @__PURE__ */ B(
-    "div",
-    {
-      ref: D,
-      className: x(
-        "relative",
-        "[&:not([data-dragging])_span[style]]:transition-[left]",
-        "[&:not([data-dragging])_span[style]]:duration-100",
-        "[&:not([data-dragging])_span[style]]:[transition-timing-function:cubic-bezier(0.25,0.1,0.25,1)]"
-      ),
-      onPointerDown: A,
-      children: [
-        /* @__PURE__ */ B(
-          v.Root,
-          {
-            className: "relative flex w-full touch-none select-none items-center",
-            min: t,
-            max: n,
-            step: I,
-            value: [$],
-            onValueChange: P,
-            onValueCommit: P,
-            children: [
-              /* @__PURE__ */ r(v.Track, { className: "relative h-1 w-full grow overflow-hidden rounded-full bg-gray-40 mx-[9px] cursor-pointer" }),
-              i.length > 0 && /* @__PURE__ */ r("div", { className: "absolute inset-0 pointer-events-none flex items-center", children: /* @__PURE__ */ r("div", { className: "relative w-full", children: i.map(({ point: e }) => /* @__PURE__ */ r(
-                Q,
-                {
-                  value: e,
-                  min: t,
-                  max: n,
-                  onSelect: R
-                },
-                `mark-${e}`
-              )) }) }),
-              /* @__PURE__ */ r(
-                v.Thumb,
-                {
-                  className: x(
-                    "relative block h-[18px] w-[18px] shrink-0 rounded-full bg-foreground",
-                    "cursor-grab active:cursor-grabbing",
-                    "focus-visible:outline-none",
-                    "disabled:pointer-events-none disabled:opacity-50",
-                    "after:absolute after:h-1.5 after:w-1.5 after:rounded-full after:bg-accent",
-                    "after:top-1/2 after:left-1/2 after:-translate-x-1/2 after:-translate-y-1/2"
-                  )
-                }
-              )
-            ]
-          }
-        ),
-        /* @__PURE__ */ r("div", { className: "absolute inset-0 pointer-events-none", children: /* @__PURE__ */ r("div", { className: "relative w-full h-full", children: G.map(
-          ({ point: e, labelText: o, align: a, hasLabel: s }) => s && /* @__PURE__ */ r(
-            X,
-            {
-              point: e,
-              min: t,
-              max: n,
-              label: o,
-              align: a,
-              onSelect: R
-            },
-            `label-${e}`
-          )
-        ) }) })
-      ]
-    }
-  ) }) }) });
-}
-export {
-  pe as SliderToken
-};