@gearbox-protocol/ui-kit 4.0.0-next.48 → 4.0.0-next.49

package/dist/esm/components/vspace/vspace.js

@@ -1,20 +1,18 @@
 import { jsx as p } from "react/jsx-runtime";
-import { SPACE_HEIGHT as d, SPACE_PX as n } from "../base/spacing.js";
-import "react";
+import { SPACE_HEIGHT as i, SPACE_PX as n } from "../base/spacing.js";
 import "@gearbox-protocol/sdk/onchain";
 import { cn as m } from "../../utils/cn.js";
-import "sonner";
 import "luxon";
 import "../../utils/z-index.js";
 const e = (r, t) => typeof r == "number" ? r : n[r][t];
-function P({
+function v({
   size: r,
   mobileSize: t,
   className: o
 }) {
   if (typeof r != "number" && t === void 0)
-    return /* @__PURE__ */ p("div", { className: m(d[r], o), "aria-hidden": !0 });
-  const i = {
+    return /* @__PURE__ */ p("div", { className: m(i[r], o), "aria-hidden": !0 });
+  const d = {
     "--vspace-h": `${e(t ?? r, "mobile")}px`,
     "--vspace-h-md": `${e(r, "desktop")}px`
   };
@@ -22,11 +20,11 @@ function P({
     "div",
     {
       className: m("h-(--vspace-h) md:h-(--vspace-h-md)", o),
-      style: i,
+      style: d,
       "aria-hidden": !0
     }
   );
 }
 export {
-  P as VSpace
+  v as VSpace
 };

package/dist/esm/components/with-copy/with-copy.js

@@ -1,11 +1,10 @@
 import { jsx as t, jsxs as l } from "react/jsx-runtime";
-import { IconCopy as v } from "@gearbox-protocol/static";
-import { useState as w, useRef as k } from "react";
-import { faCheck as N } from "@fortawesome/free-solid-svg-icons";
+import { faCheck as v } from "@fortawesome/free-solid-svg-icons";
+import { IconCopy as w } from "@gearbox-protocol/static";
+import { useState as k, useRef as N } from "react";
 import { FaIcon as j } from "../icons/fa-icon.js";
 import "@gearbox-protocol/sdk/onchain";
 import { cn as i } from "../../utils/cn.js";
-import "sonner";
 import "luxon";
 import "../../utils/z-index.js";
 import "../accordion/accordion.js";
@@ -16,8 +15,6 @@ import "../buttons/back-button/back-button.js";
 import "../buttons/button/button.js";
 import "../buttons/copy-button/copy-button.js";
 import "../buttons/external-button/external-button.js";
-import "../buttons/filter-button/filter-button.js";
-import "../buttons/navigation-button/navigation-button.js";
 import "../buttons/tab-button/tab-button.js";
 import "../token-icon/token-icon.js";
 import { SimpleTooltip as T } from "../tooltip/simple-tooltip.js";
@@ -50,6 +47,7 @@ import "@gearbox-protocol/sdk/model";
 import "../checkbox/checkbox.js";
 import "../checkbox/checkbox-labeled.js";
 import "../select/select.js";
+import "sonner";
 import "../breakpoint-provider.js";
 import "lightweight-charts";
 import "../graph/formatters.js";
@@ -80,42 +78,19 @@ import "../simple-dropdown/simple-dropdown-menu-item.js";
 import "../base/tabber/tabber.js";
 import "../link/link.js";
 import "../rounded-image/rounded-image.js";
-import "../network-icon/network-indicator.js";
 import "../base-link/base-link.js";
 import "../base-table/base-table-line.js";
 import "../navigation-context/navigation-context.js";
 import "../cards/card/card.js";
-import "../checkbox-item/checkbox-item.js";
 import "../client-adapters/styled-button/styled-button.js";
-import "../client-adapters/styled-rounded-image/styled-rounded-image.js";
 import "../composites/tx-preview/confirm/amounts/TransactionConfirmAmountField.js";
 import "../composites/tx-preview/confirm/dialog/constants.js";
 import "../spinner/spinner.js";
 import "../spinner-loader/spinner-loader.js";
-import "../detailed-apy/detailed-apy.js";
 import "../dropdown-menu/dropdown-menu.js";
-import "../dropdown-menu/dropdown-menu-checkbox-item.js";
 import "../dropdown-menu/dropdown-menu-content.js";
 import "../dropdown-menu/dropdown-menu-item.js";
 import "../dropdown-menu/dropdown-menu-label.js";
-import "../dropdown-menu/dropdown-menu-radio-item.js";
-import "../dropdown-menu/dropdown-menu-separator.js";
-import "../dropdown-menu/dropdown-menu-shortcut.js";
-import "../dropdown-menu/dropdown-menu-sub-content.js";
-import "../dropdown-menu/dropdown-menu-sub-trigger.js";
-import "../filter/filter-block.js";
-import "../filter/filter-checkbox-item.js";
-import "../filter/filter-chip.js";
-import "../filter/filter-chips.js";
-import "../filter/filter-dropdown-item.js";
-import "../filter/filter-group.js";
-import "../filter/filter-label.js";
-import "../search-line/search-line.js";
-import "../tabs/tabs.js";
-import "../filter/filter-modal-item.js";
-import "../filter/filter-radio-item.js";
-import "../filter/filter-separator.js";
-import "../filter/variants.js";
 import "../icon-button/icon-button.js";
 import "../layout/app-footer/app-footer.js";
 import "../layout/app-header/app-header.js";
@@ -129,12 +104,14 @@ import "../loading/loading.js";
 import "../loading-bar/loading-bar.js";
 import "../radio-group/radio-group.js";
 import "../status-dot/status-dot.js";
+import "../search-line/search-line.js";
 import "../segmented-control/segmented-control.js";
 import "../separate-line/separate-line.js";
 import "../split-list/split-list.js";
+import "../tabs/tabs.js";
 import "../textarea/textarea.js";
 import "../theme-provider.js";
-function or({
+function Bo({
   toCopy: u,
   children: d,
   onCopySuccess: f,
@@ -146,7 +123,7 @@ function or({
   trigger: r = "button",
   tooltip: a
 }) {
-  const [p, s] = w(!1), m = k(null), e = async () => {
+  const [p, s] = k(!1), m = N(null), e = async () => {
     try {
       await navigator.clipboard.writeText(u), m.current && clearTimeout(m.current), s(!0), m.current = setTimeout(() => {
         s(!1);
@@ -189,7 +166,7 @@ function or({
                     children: /* @__PURE__ */ t(
                       j,
                       {
-                        icon: N,
+                        icon: v,
                         style: { fontSize: o },
                         className: "block"
                       }
@@ -203,7 +180,7 @@ function or({
                       "absolute inset-0 flex items-center justify-center transition-all duration-200",
                       p ? "opacity-0 scale-50" : "opacity-100 scale-100 text-gray-400 group-hover:text-white"
                     ),
-                    children: y ?? /* @__PURE__ */ t(v, { size: o })
+                    children: y ?? /* @__PURE__ */ t(w, { size: o })
                   }
                 )
               ]
@@ -216,5 +193,5 @@ function or({
   return a ? /* @__PURE__ */ t(T, { placement: "top", triangle: !0, title: c(), children: a }) : c();
 }
 export {
-  or as WithCopy
+  Bo as WithCopy
 };

package/dist/esm/components/with-title/with-title.js

@@ -1,12 +1,10 @@
-import { jsxs as x, jsx as i } from "react/jsx-runtime";
+import { jsxs as x, jsx as e } from "react/jsx-runtime";
 import { cva as a } from "class-variance-authority";
-import "react";
 import "@gearbox-protocol/sdk/onchain";
-import { cn as e } from "../../utils/cn.js";
-import "sonner";
+import { cn as i } from "../../utils/cn.js";
 import "luxon";
 import "../../utils/z-index.js";
-const p = a("", {
+const l = a("", {
   variants: {
     size: {
       sm: "text-[14px] mb-[14px]",
@@ -19,27 +17,27 @@ const p = a("", {
     size: "default"
   }
 });
-function b({
+function u({
   title: m,
   children: t,
   size: o = "default",
   className: r
 }) {
-  return /* @__PURE__ */ x("div", { className: e("flex flex-col"), children: [
-    /* @__PURE__ */ i(
+  return /* @__PURE__ */ x("div", { className: i("flex flex-col"), children: [
+    /* @__PURE__ */ e(
       "div",
       {
-        className: e(
+        className: i(
           "text-foreground font-medium",
-          p({ size: o }),
+          l({ size: o }),
           r
         ),
         children: m
       }
     ),
-    t !== void 0 && /* @__PURE__ */ i("div", { children: t })
+    t !== void 0 && /* @__PURE__ */ e("div", { children: t })
   ] });
 }
 export {
-  b as WithTitle
+  u as WithTitle
 };

package/dist/esm/configs/index.js

@@ -1,14 +1,7 @@
-import { designTokens as a } from "./design-tokens.js";
-import { default as i } from "./tailwind.config.js";
-import { preset as n, preset as o } from "./tailwind-preset.js";
-import { interactiveVariants as d, paddingVariants as f, sizeVariants as m, stateVariants as x } from "./variants.js";
+import { default as r } from "./tailwind.config.js";
+import { preset as i, preset as o } from "./tailwind-preset.js";
 export {
-  a as designTokens,
-  d as interactiveVariants,
-  f as paddingVariants,
-  n as preset,
-  m as sizeVariants,
-  x as stateVariants,
-  i as tailwindConfig,
+  i as preset,
+  r as tailwindConfig,
   o as tailwindPreset
 };

package/dist/esm/hooks/index.js

@@ -1,34 +1,20 @@
-import { useCheckboxSelect as r } from "./use-checkbox-select.js";
-import { useControllableState as s } from "./use-controllable-state.js";
-import { useDebounce as l } from "./use-debounce.js";
-import { useDebounceCall as p } from "./use-debounce-call.js";
-import { getSortForField as S, getSortForFields as i, nextMultiSortState as a, useFilterAllSelected as f, useMultiSort as b, useRangeFilter as d, useSelectFilter as n, useSort as F } from "./use-filter.js";
-import { useIsDesktop as I, useIsExtraSmall as M, useIsMedium as g, useIsMobile as C, useIsTablet as D, useMediaQuery as h } from "./use-media-query.js";
-import { useObservedWidthKey as v } from "./use-observed-width-key.js";
-import { useOpenedState as O } from "./use-opened-state.js";
-import { usePrevious as E } from "./use-previous.js";
-import { useSmartNumberInput as N } from "./use-smart-number-input.js";
+import { useDebounce as r } from "./use-debounce.js";
+import { useDebounceCall as s } from "./use-debounce-call.js";
+import { getSortForField as i, getSortForFields as m, nextMultiSortState as p, useSort as x } from "./use-filter.js";
+import { useIsDesktop as f, useIsMedium as l, useIsMobile as S, useMediaQuery as b } from "./use-media-query.js";
+import { useObservedWidthKey as M } from "./use-observed-width-key.js";
+import { usePrevious as n } from "./use-previous.js";
 export {
-  S as getSortForField,
-  i as getSortForFields,
-  a as nextMultiSortState,
-  r as useCheckboxSelect,
-  s as useControllableState,
-  l as useDebounce,
-  p as useDebounceCall,
-  f as useFilterAllSelected,
-  I as useIsDesktop,
-  M as useIsExtraSmall,
-  g as useIsMedium,
-  C as useIsMobile,
-  D as useIsTablet,
-  h as useMediaQuery,
-  b as useMultiSort,
-  v as useObservedWidthKey,
-  O as useOpenedState,
-  E as usePrevious,
-  d as useRangeFilter,
-  n as useSelectFilter,
-  N as useSmartNumberInput,
-  F as useSort
+  i as getSortForField,
+  m as getSortForFields,
+  p as nextMultiSortState,
+  r as useDebounce,
+  s as useDebounceCall,
+  f as useIsDesktop,
+  l as useIsMedium,
+  S as useIsMobile,
+  b as useMediaQuery,
+  M as useObservedWidthKey,
+  n as usePrevious,
+  x as useSort
 };

package/dist/esm/hooks/use-debounce-call.js

@@ -1,5 +1,5 @@
-import "react";
 import { useDebounce as o } from "./use-debounce.js";
+import "react";
 import "../components/breakpoint-provider.js";
 const n = (e) => e();
 function b(e) {

package/dist/esm/hooks/use-filter.js

@@ -1,74 +1,38 @@
-import { useState as i, useCallback as c, useMemo as a } from "react";
-function F() {
-  const [e, t] = i(null), r = c(() => t(null), []);
-  return [e, t, r];
-}
-function y(e = null) {
-  const [t, r] = i(e), n = c(() => r(null), []);
-  return [t, r, n];
-}
-const S = (e) => e === "asc" ? "desc" : "asc", M = (e, t) => {
-  if (e === t?.field)
+import { useState as u, useCallback as d } from "react";
+const c = (r) => r === "asc" ? "desc" : "asc", l = (r, t) => {
+  if (r === t?.field)
     return t.sort;
 };
-function R(e = null) {
-  const [t, r] = i(
-    e
-  ), n = c(
-    (o, s = "asc") => {
-      o === t?.field ? r({ field: o, sort: S(t.sort) }) : r({ field: o, sort: s });
+function S(r = null) {
+  const [t, o] = u(
+    r
+  ), e = d(
+    (n, i = "asc") => {
+      n === t?.field ? o({ field: n, sort: c(t.sort) }) : o({ field: n, sort: i });
     },
     [t]
   );
-  return [t, n];
+  return [t, e];
 }
-const b = (e, t) => {
-  const r = t?.findIndex((n) => n.field === e) ?? -1;
-  return !t || r === -1 ? { sort: void 0, priority: void 0 } : { sort: t[r].sort, priority: r + 1 };
+const x = (r, t) => {
+  const o = t?.findIndex((e) => e.field === r) ?? -1;
+  return !t || o === -1 ? { sort: void 0, priority: void 0 } : { sort: t[o].sort, priority: o + 1 };
 };
-function g(e, t, r = "asc", n = 2) {
-  const o = e.findIndex((u) => u.field === t);
-  if (o !== -1) {
-    if (e[o].sort === r) {
-      const u = [...e];
-      return u[o] = { field: t, sort: S(e[o].sort) }, u;
+function g(r, t, o = "asc", e = 2) {
+  const n = r.findIndex((s) => s.field === t);
+  if (n !== -1) {
+    if (r[n].sort === o) {
+      const s = [...r];
+      return s[n] = { field: t, sort: c(r[n].sort) }, s;
     }
-    return e.filter((u) => u.field !== t);
+    return r.filter((s) => s.field !== t);
   }
-  const s = [{ field: t, sort: r }, ...e];
-  return s.length > n ? s.slice(0, n) : s;
-}
-function p(e = null, { maxFields: t = 2 } = {}) {
-  const [r, n] = i(
-    e ?? []
-  ), o = c(
-    (l, d = "asc") => {
-      n(
-        (f) => g(f, l, d, t)
-      );
-    },
-    [t]
-  ), s = c((l) => {
-    n((d) => d.filter((f) => f.field !== l));
-  }, []), u = c(() => n([]), []);
-  return [r, o, { removeSortField: s, resetSort: u }];
-}
-function C(e) {
-  return a(() => Object.values(e).reduce(
-    ([r, n], o) => {
-      const s = !!o.state;
-      return [r || s, n && s];
-    },
-    [!1, !0]
-  ), [e]);
+  const i = [{ field: t, sort: o }, ...r];
+  return i.length > e ? i.slice(0, e) : i;
 }
 export {
-  M as getSortForField,
-  b as getSortForFields,
+  l as getSortForField,
+  x as getSortForFields,
   g as nextMultiSortState,
-  C as useFilterAllSelected,
-  p as useMultiSort,
-  F as useRangeFilter,
-  y as useSelectFilter,
-  R as useSort
+  S as useSort
 };

package/dist/esm/hooks/use-media-query.js

@@ -1,52 +1,38 @@
-import { useState as l, useEffect as u } from "react";
-import { useBreakpointContext as o, BREAKPOINT_QUERIES as c } from "../components/breakpoint-provider.js";
-function n(t, e = !0) {
-  const [i, a] = l(!1);
-  return u(() => {
-    if (!e)
+import { useState as u, useEffect as m } from "react";
+import { useBreakpointContext as n, BREAKPOINT_QUERIES as c } from "../components/breakpoint-provider.js";
+function i(e, t = !0) {
+  const [o, r] = u(!1);
+  return m(() => {
+    if (!t)
       return;
-    const s = window.matchMedia(t);
-    s.matches !== i && a(s.matches);
-    const r = () => a(s.matches);
-    return s.addEventListener("change", r), () => s.removeEventListener("change", r);
-  }, [i, t, e]), i;
+    const s = window.matchMedia(e);
+    s.matches !== o && r(s.matches);
+    const a = () => r(s.matches);
+    return s.addEventListener("change", a), () => s.removeEventListener("change", a);
+  }, [o, e, t]), o;
 }
-const f = () => {
-  const t = o(), e = n(
-    c.isExtraSmall,
-    t === void 0
-  );
-  return t?.isExtraSmall ?? e;
-}, b = () => {
-  const t = o(), e = n(
+const l = () => {
+  const e = n(), t = i(
     c.isMobile,
-    t === void 0
-  );
-  return t?.isMobile ?? e;
-}, x = () => {
-  const t = o(), e = n(
-    c.isTablet,
-    t === void 0
+    e === void 0
   );
-  return t?.isTablet ?? e;
-}, k = () => {
-  const t = o(), e = n(
+  return e?.isMobile ?? t;
+}, M = () => {
+  const e = n(), t = i(
     c.isMedium,
-    t === void 0
+    e === void 0
   );
-  return t?.isMedium ?? e;
-}, E = () => {
-  const t = o(), e = n(
+  return e?.isMedium ?? t;
+}, h = () => {
+  const e = n(), t = i(
     c.isDesktop,
-    t === void 0
+    e === void 0
   );
-  return t?.isDesktop ?? e;
+  return e?.isDesktop ?? t;
 };
 export {
-  E as useIsDesktop,
-  f as useIsExtraSmall,
-  k as useIsMedium,
-  b as useIsMobile,
-  x as useIsTablet,
-  n as useMediaQuery
+  h as useIsDesktop,
+  M as useIsMedium,
+  l as useIsMobile,
+  i as useMediaQuery
 };