npm - @gearbox-protocol/permissionless-ui - Versions diffs - 1.3.0 → 1.4.1 - Mend

@gearbox-protocol/permissionless-ui 1.3.0 → 1.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (54) hide show

package/README.md CHANGED Viewed

@@ -2,16 +2,6 @@
 UI components for internal use - framework-agnostic React component library built with Tailwind CSS 4.
-## Features
-- 🎨 **Tailwind CSS 4** - Built with the latest Tailwind CSS
-- 🌗 **Dark Mode** - Full dark mode support out of the box
-- 📦 **Framework Agnostic** - Works with any React framework
-- ⚡ **Next.js Optimized** - Special optimizations for Next.js projects
-- 🎯 **TypeScript** - Fully typed components
-- 🔧 **Customizable** - Easy to customize with Tailwind preset
-- ♿ **Accessible** - Built with Radix UI primitives
 ## Installation
 ```bash
@@ -86,10 +76,6 @@ function App() {
 }
 ```
-> ⚠️ **Important:** To prevent white flash on page load, add `<ThemeScript />` to your HTML `<head>`. See [THEME_FLASH_FIX.md](./THEME_FLASH_FIX.md) for details.
-📚 **Quick start? See [QUICK_START.md](./QUICK_START.md) | Detailed guide? See [INTEGRATION.md](./INTEGRATION.md)**
 ## Usage
 ### Framework-agnostic (works everywhere)

package/dist/cjs/components/auth/siwe-provider.js CHANGED Viewed

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;

package/dist/cjs/components/block-sync.js CHANGED Viewed

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;

package/dist/cjs/components/buttons/navigation-button.js CHANGED Viewed

@@ -32,12 +32,12 @@ __export(navigation_button_exports, {
 });
 module.exports = __toCommonJS(navigation_button_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_link = __toESM(require("next/link"));
 var import_react = __toESM(require("react"));
 var import_utils = __toESM(require('../../utils/index.js'));
+var import_base_link = require('../base-link.js');
 const NavigationButton = import_react.default.forwardRef(({ href, text, isActive, ...props }, ref) => {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_link.default,
+    import_base_link.BaseLink,
     {
       href,
       ref,

package/dist/cjs/components/graph/graph-tooltip.js CHANGED Viewed

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;

package/dist/cjs/components/graph/graph-view.js CHANGED Viewed

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;

package/dist/cjs/components/graph/graph.js CHANGED Viewed

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;

package/dist/cjs/components/help-center-container.js CHANGED Viewed

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;

package/dist/cjs/components/index.js CHANGED Viewed

@@ -51,7 +51,6 @@ __reExport(components_exports, require('./layout/index.js'), module.exports);
 __reExport(components_exports, require('./liquidation/index.js'), module.exports);
 __reExport(components_exports, require('./loader-guard.js'), module.exports);
 __reExport(components_exports, require('./loading-guard.js'), module.exports);
-__reExport(components_exports, require('./markdown-viewer.js'), module.exports);
 __reExport(components_exports, require('./navbar.js'), module.exports);
 __reExport(components_exports, require('./navbar-indicator-context.js'), module.exports);
 __reExport(components_exports, require('./navitem.js'), module.exports);
@@ -117,7 +116,6 @@ __reExport(components_exports, require('./with-filter-button.js'), module.export
   ...require('./liquidation/index.js'),
   ...require('./loader-guard.js'),
   ...require('./loading-guard.js'),
-  ...require('./markdown-viewer.js'),
   ...require('./navbar.js'),
   ...require('./navbar-indicator-context.js'),
   ...require('./navitem.js'),

package/dist/cjs/components/layout/legal-disclaimer.js CHANGED Viewed

@@ -1,9 +1,7 @@
 "use strict";
-var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -17,14 +15,6 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var legal_disclaimer_exports = {};
 __export(legal_disclaimer_exports, {
@@ -32,13 +22,13 @@ __export(legal_disclaimer_exports, {
 });
 module.exports = __toCommonJS(legal_disclaimer_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_link = __toESM(require("next/link"));
+var import_base_link = require('../base-link.js');
 function LegalDisclaimer({ hrefs }) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "text-sm text-muted-foreground max-w-md", children: [
     "Any use of and/or interaction with the Permissionless Interface is subject to the",
     " ",
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_link.default,
+      import_base_link.BaseLink,
       {
         href: hrefs.termsOfService,
         className: "underline hover:text-foreground transition-colors",
@@ -49,7 +39,7 @@ function LegalDisclaimer({ hrefs }) {
     "and",
     " ",
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_link.default,
+      import_base_link.BaseLink,
       {
         href: hrefs.privacyNotice,
         className: "underline hover:text-foreground transition-colors",
@@ -59,7 +49,7 @@ function LegalDisclaimer({ hrefs }) {
     ", and acceptance of risks described in the",
     " ",
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_link.default,
+      import_base_link.BaseLink,
       {
         href: hrefs.riskDisclosure,
         className: "underline hover:text-foreground transition-colors",

package/dist/cjs/components/navbar-indicator-context.js CHANGED Viewed

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;

package/dist/cjs/components/next/index.js CHANGED Viewed

@@ -19,19 +19,25 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var next_exports = {};
 __export(next_exports, {
   BackButton: () => import_back_button.BackButton,
+  MarkdownViewer: () => import_markdown_viewer.MarkdownViewer,
   SIWEClientProvider: () => import_siwe_provider.SIWEClientProvider,
   SignInRequired: () => import_signin_required.SignInRequired,
-  TokenIcon: () => import_token_icon.TokenIcon
+  TokenIcon: () => import_token_icon.TokenIcon,
+  Web3Providers: () => import_web3_providers.Web3Providers
 });
 module.exports = __toCommonJS(next_exports);
 var import_signin_required = require('../auth/signin-required.js');
 var import_back_button = require('./back-button.js');
+var import_markdown_viewer = require('./markdown-viewer.js');
 var import_siwe_provider = require('./siwe-provider.js');
 var import_token_icon = require('./token-icon.js');
+var import_web3_providers = require('./web3-providers.js');
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   BackButton,
+  MarkdownViewer,
   SIWEClientProvider,
   SignInRequired,
-  TokenIcon
+  TokenIcon,
+  Web3Providers
 });

package/dist/cjs/components/{markdown-viewer.js → next/markdown-viewer.js} RENAMED Viewed

@@ -37,7 +37,7 @@ var import_navigation = require("next/navigation");
 var import_react = require("react");
 var import_react_markdown = __toESM(require("react-markdown"));
 var import_remark_gfm = __toESM(require("remark-gfm"));
-var import_layout = require('./layout/index.js');
+var import_layout = require('../layout/index.js');
 function slugify(text) {
   return text.toLowerCase().trim().replace(/[^\w\s-]/g, "").replace(/\s+/g, "-").replace(/-+/g, "-");
 }

package/dist/cjs/components/next/web3-providers.js ADDED Viewed

@@ -0,0 +1,116 @@
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var web3_providers_exports = {};
+__export(web3_providers_exports, {
+  Web3Providers: () => Web3Providers
+});
+module.exports = __toCommonJS(web3_providers_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react_query = require("@tanstack/react-query");
+var import_connectkit = require("connectkit");
+var import_react = require("react");
+var import_siwe = require("viem/siwe");
+var import_wagmi = require("wagmi");
+function makeQueryClient() {
+  return new import_react_query.QueryClient({
+    defaultOptions: {
+      queries: {
+        staleTime: 60 * 1e3
+      }
+    }
+  });
+}
+let browserQueryClient;
+function getQueryClient() {
+  if (typeof window === "undefined") {
+    return makeQueryClient();
+  }
+  if (!browserQueryClient) browserQueryClient = makeQueryClient();
+  return browserQueryClient;
+}
+function Web3Providers({
+  config,
+  apiRoutePrefix,
+  statement = "Sign In With Ethereum.",
+  children
+}) {
+  const [queryClient] = (0, import_react.useState)(() => getQueryClient());
+  const getNonce = async () => {
+    const res = await fetch(`${apiRoutePrefix}/nonce`);
+    if (!res.ok) {
+      throw new Error("Failed to fetch SIWE nonce");
+    }
+    return await res.text();
+  };
+  const createMessage = ({
+    nonce,
+    address,
+    chainId
+  }) => (0, import_siwe.createSiweMessage)({
+    version: "1",
+    domain: window.location.host,
+    uri: window.location.origin,
+    address,
+    chainId,
+    nonce,
+    statement
+  });
+  const verifyMessage = async ({
+    message,
+    signature
+  }) => {
+    const res = await fetch(`${apiRoutePrefix}/signin`, {
+      method: "POST",
+      body: JSON.stringify({ message, signature })
+    });
+    if (!res.ok) {
+      throw new Error("Failed to verify SIWE message");
+    }
+    return true;
+  };
+  const getSession = async () => {
+    const res = await fetch(`${apiRoutePrefix}/session`);
+    if (!res.ok) {
+      return null;
+    }
+    return res.json();
+  };
+  const signOut = async () => {
+    await fetch(`${apiRoutePrefix}/logout`, {
+      method: "POST"
+    });
+    return true;
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_wagmi.WagmiProvider, { config, reconnectOnMount: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_query.QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_connectkit.SIWEProvider,
+    {
+      getNonce,
+      createMessage,
+      verifyMessage,
+      getSession,
+      signOut,
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_connectkit.ConnectKitProvider, { children })
+    }
+  ) }) });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Web3Providers
+});

package/dist/cjs/components/search-bar.js CHANGED Viewed

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;

package/dist/cjs/components/signatures/vertical-timeline.js CHANGED Viewed

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;

package/dist/cjs/components/tab-control.js CHANGED Viewed

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;

package/dist/cjs/components/token-icon.js CHANGED Viewed

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;

package/dist/cjs/hooks/use-controllable-state.js CHANGED Viewed

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;

package/dist/cjs/hooks/use-debounce.js CHANGED Viewed

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;

package/dist/cjs/hooks/use-filter.js CHANGED Viewed

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;

package/dist/cjs/hooks/use-liquidation/index.js CHANGED Viewed

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
@@ -15,19 +16,38 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var use_liquidation_exports = {};
 __export(use_liquidation_exports, {
+  CELL_BAD: () => import_utils2.CELL_BAD,
+  CELL_CURRENT: () => import_utils2.CELL_CURRENT,
+  CELL_GOOD: () => import_utils2.CELL_GOOD,
+  CELL_HOVERED: () => import_utils2.CELL_HOVERED,
+  CELL_LIQUIDATION: () => import_utils2.CELL_LIQUIDATION,
+  CELL_OK: () => import_utils2.CELL_OK,
+  DEFAULT_AXIS_MAX: () => import_utils2.DEFAULT_AXIS_MAX,
+  DEFAULT_AXIS_MIN: () => import_utils2.DEFAULT_AXIS_MIN,
+  formatAxisLabel: () => import_utils2.formatAxisLabel,
+  formatAxisTipLabel: () => import_utils2.formatAxisTipLabel,
+  formatAxisTipPrice: () => import_utils2.formatAxisTipPrice,
+  getCellClass: () => import_utils2.getCellClass,
+  isPointInCell: () => import_utils2.isPointInCell,
+  useAxis: () => import_utils2.useAxis,
   useEditPriceManually: () => useEditPriceManually,
+  useFixedAssets: () => import_utils2.useFixedAssets,
+  useIsAxisInRelativeUnits: () => import_utils2.useIsAxisInRelativeUnits,
+  useLiquidationGraphActivePrice: () => import_utils2.useLiquidationGraphActivePrice,
+  useLiquidationGraphCurrentActiveValue: () => import_utils2.useLiquidationGraphCurrentActiveValue,
   useLiquidationGraphParams: () => useLiquidationGraphParams,
-  useLiquidationHeatmap: () => useLiquidationHeatmap
+  useLiquidationHeatmap: () => useLiquidationHeatmap,
+  usePriceInNumber: () => import_utils2.usePriceInNumber,
+  useWithLiquidationGraphActivePrices: () => import_utils2.useWithLiquidationGraphActivePrices
 });
 module.exports = __toCommonJS(use_liquidation_exports);
 var import_sdk = require("@gearbox-protocol/sdk");
 var import_react = require("react");
 var import_utils = require('./utils.js');
-__reExport(use_liquidation_exports, require('./utils.js'), module.exports);
+var import_utils2 = require('./utils.js');
 const RESOLUTION = 35;
 function useLiquidationHeatmap({
   xMin,
@@ -158,8 +178,27 @@ function useLiquidationGraphParams({
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  CELL_BAD,
+  CELL_CURRENT,
+  CELL_GOOD,
+  CELL_HOVERED,
+  CELL_LIQUIDATION,
+  CELL_OK,
+  DEFAULT_AXIS_MAX,
+  DEFAULT_AXIS_MIN,
+  formatAxisLabel,
+  formatAxisTipLabel,
+  formatAxisTipPrice,
+  getCellClass,
+  isPointInCell,
+  useAxis,
   useEditPriceManually,
+  useFixedAssets,
+  useIsAxisInRelativeUnits,
+  useLiquidationGraphActivePrice,
+  useLiquidationGraphCurrentActiveValue,
   useLiquidationGraphParams,
   useLiquidationHeatmap,
-  ...require('./utils.js')
+  usePriceInNumber,
+  useWithLiquidationGraphActivePrices
 });

package/dist/cjs/hooks/use-media-query.js CHANGED Viewed

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;

package/dist/cjs/hooks/use-previous.js CHANGED Viewed

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;

package/dist/esm/components/auth/siwe-provider.js CHANGED Viewed

@@ -1,3 +1,4 @@
+"use client";
 import { jsx } from "react/jsx-runtime";
 import { SIWEProvider } from "connectkit";
 import { createSiweMessage } from "viem/siwe";

package/dist/esm/components/block-sync.js CHANGED Viewed

@@ -1,3 +1,4 @@
+"use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useMemo, useState } from "react";
 import { cn } from "../utils/cn.js";

package/dist/esm/components/buttons/navigation-button.js CHANGED Viewed

@@ -1,10 +1,10 @@
 import { jsx } from "react/jsx-runtime";
-import Link from "next/link";
 import React from "react";
 import cn from "../../utils/index.js";
+import { BaseLink } from "../base-link.js";
 const NavigationButton = React.forwardRef(({ href, text, isActive, ...props }, ref) => {
   return /* @__PURE__ */ jsx(
-    Link,
+    BaseLink,
     {
       href,
       ref,

package/dist/esm/components/graph/graph-tooltip.js CHANGED Viewed

@@ -1,3 +1,4 @@
+"use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useRef, useState } from "react";
 import { cn } from "../../utils/cn.js";

package/dist/esm/components/graph/graph-view.js CHANGED Viewed

@@ -1,3 +1,4 @@
+"use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 import * as React from "react";

package/dist/esm/components/graph/graph.js CHANGED Viewed

@@ -1,3 +1,4 @@
+"use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { createChart } from "lightweight-charts";
 import * as React from "react";

package/dist/esm/components/help-center-container.js CHANGED Viewed

@@ -1,3 +1,4 @@
+"use client";
 import { jsx } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
 import { cn } from "../utils/cn.js";

package/dist/esm/components/index.js CHANGED Viewed

@@ -34,7 +34,6 @@ export * from "./layout/index.js";
 export * from "./liquidation/index.js";
 export * from "./loader-guard.js";
 export * from "./loading-guard.js";
-export * from "./markdown-viewer.js";
 export * from "./navbar.js";
 export * from "./navbar-indicator-context.js";
 export * from "./navitem.js";

package/dist/esm/components/layout/legal-disclaimer.js CHANGED Viewed

@@ -1,11 +1,11 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import Link from "next/link";
+import { BaseLink } from "../base-link.js";
 function LegalDisclaimer({ hrefs }) {
   return /* @__PURE__ */ jsxs("p", { className: "text-sm text-muted-foreground max-w-md", children: [
     "Any use of and/or interaction with the Permissionless Interface is subject to the",
     " ",
     /* @__PURE__ */ jsx(
-      Link,
+      BaseLink,
       {
         href: hrefs.termsOfService,
         className: "underline hover:text-foreground transition-colors",
@@ -16,7 +16,7 @@ function LegalDisclaimer({ hrefs }) {
     "and",
     " ",
     /* @__PURE__ */ jsx(
-      Link,
+      BaseLink,
       {
         href: hrefs.privacyNotice,
         className: "underline hover:text-foreground transition-colors",
@@ -26,7 +26,7 @@ function LegalDisclaimer({ hrefs }) {
     ", and acceptance of risks described in the",
     " ",
     /* @__PURE__ */ jsx(
-      Link,
+      BaseLink,
       {
         href: hrefs.riskDisclosure,
         className: "underline hover:text-foreground transition-colors",

package/dist/esm/components/navbar-indicator-context.js CHANGED Viewed

@@ -1,3 +1,4 @@
+"use client";
 import { jsx } from "react/jsx-runtime";
 import {
   createContext,

package/dist/esm/components/next/index.js CHANGED Viewed

@@ -1,10 +1,14 @@
 import { SignInRequired } from "../auth/signin-required.js";
 import { BackButton } from "./back-button.js";
+import { MarkdownViewer } from "./markdown-viewer.js";
 import { SIWEClientProvider } from "./siwe-provider.js";
 import { TokenIcon } from "./token-icon.js";
+import { Web3Providers } from "./web3-providers.js";
 export {
   BackButton,
+  MarkdownViewer,
   SIWEClientProvider,
   SignInRequired,
-  TokenIcon
+  TokenIcon,
+  Web3Providers
 };

package/dist/esm/components/{markdown-viewer.js → next/markdown-viewer.js} RENAMED Viewed

@@ -4,7 +4,7 @@ import { useRouter } from "next/navigation";
 import { useEffect } from "react";
 import ReactMarkdown from "react-markdown";
 import remarkGfm from "remark-gfm";
-import { PageLayout } from "./layout/index.js";
+import { PageLayout } from "../layout/index.js";
 function slugify(text) {
   return text.toLowerCase().trim().replace(/[^\w\s-]/g, "").replace(/\s+/g, "-").replace(/-+/g, "-");
 }

package/dist/esm/components/next/web3-providers.js ADDED Viewed

@@ -0,0 +1,92 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { ConnectKitProvider, SIWEProvider } from "connectkit";
+import { useState } from "react";
+import { createSiweMessage } from "viem/siwe";
+import { WagmiProvider } from "wagmi";
+function makeQueryClient() {
+  return new QueryClient({
+    defaultOptions: {
+      queries: {
+        staleTime: 60 * 1e3
+      }
+    }
+  });
+}
+let browserQueryClient;
+function getQueryClient() {
+  if (typeof window === "undefined") {
+    return makeQueryClient();
+  }
+  if (!browserQueryClient) browserQueryClient = makeQueryClient();
+  return browserQueryClient;
+}
+function Web3Providers({
+  config,
+  apiRoutePrefix,
+  statement = "Sign In With Ethereum.",
+  children
+}) {
+  const [queryClient] = useState(() => getQueryClient());
+  const getNonce = async () => {
+    const res = await fetch(`${apiRoutePrefix}/nonce`);
+    if (!res.ok) {
+      throw new Error("Failed to fetch SIWE nonce");
+    }
+    return await res.text();
+  };
+  const createMessage = ({
+    nonce,
+    address,
+    chainId
+  }) => createSiweMessage({
+    version: "1",
+    domain: window.location.host,
+    uri: window.location.origin,
+    address,
+    chainId,
+    nonce,
+    statement
+  });
+  const verifyMessage = async ({
+    message,
+    signature
+  }) => {
+    const res = await fetch(`${apiRoutePrefix}/signin`, {
+      method: "POST",
+      body: JSON.stringify({ message, signature })
+    });
+    if (!res.ok) {
+      throw new Error("Failed to verify SIWE message");
+    }
+    return true;
+  };
+  const getSession = async () => {
+    const res = await fetch(`${apiRoutePrefix}/session`);
+    if (!res.ok) {
+      return null;
+    }
+    return res.json();
+  };
+  const signOut = async () => {
+    await fetch(`${apiRoutePrefix}/logout`, {
+      method: "POST"
+    });
+    return true;
+  };
+  return /* @__PURE__ */ jsx(WagmiProvider, { config, reconnectOnMount: true, children: /* @__PURE__ */ jsx(QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ jsx(
+    SIWEProvider,
+    {
+      getNonce,
+      createMessage,
+      verifyMessage,
+      getSession,
+      signOut,
+      children: /* @__PURE__ */ jsx(ConnectKitProvider, { children })
+    }
+  ) }) });
+}
+export {
+  Web3Providers
+};

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

@@ -1,3 +1,4 @@
+"use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Search } from "lucide-react";
 import { useState } from "react";

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

@@ -1,3 +1,4 @@
+"use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Check, X } from "lucide-react";
 import { useState } from "react";

package/dist/esm/components/tab-control.js CHANGED Viewed

@@ -1,3 +1,4 @@
+"use client";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { useLocation, useNavigate } from "react-router-dom";

package/dist/esm/components/token-icon.js CHANGED Viewed

@@ -1,3 +1,4 @@
+"use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { Image } from "./image.js";

package/dist/esm/hooks/use-controllable-state.js CHANGED Viewed

@@ -1,3 +1,4 @@
+"use client";
 import { useCallback, useState } from "react";
 function useControllableState({
   value: controlledValue,

package/dist/esm/hooks/use-debounce.js CHANGED Viewed

@@ -1,3 +1,4 @@
+"use client";
 import { useCallback, useEffect, useMemo } from "react";
 const debounce = (func, delay) => {
   let timer = null;

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

@@ -1,3 +1,4 @@
+"use client";
 import { useCallback, useMemo, useState } from "react";
 function useRangeFilter() {
   const [range, setRange] = useState(null);

package/dist/esm/hooks/use-liquidation/index.js CHANGED Viewed

@@ -1,3 +1,4 @@
+"use client";
 import {
   CreditAccountData_Legacy,
   PRICE_DECIMALS_POW,
@@ -10,7 +11,28 @@ import {
   useFixedAssets,
   usePriceInNumber
 } from "./utils.js";
-export * from "./utils.js";
+import {
+  CELL_BAD,
+  CELL_CURRENT,
+  CELL_GOOD,
+  CELL_HOVERED,
+  CELL_LIQUIDATION,
+  CELL_OK,
+  DEFAULT_AXIS_MAX as DEFAULT_AXIS_MAX2,
+  DEFAULT_AXIS_MIN,
+  formatAxisLabel,
+  formatAxisTipLabel,
+  formatAxisTipPrice,
+  getCellClass,
+  isPointInCell,
+  useAxis as useAxis2,
+  useFixedAssets as useFixedAssets2,
+  useIsAxisInRelativeUnits,
+  useLiquidationGraphActivePrice,
+  useLiquidationGraphCurrentActiveValue,
+  usePriceInNumber as usePriceInNumber2,
+  useWithLiquidationGraphActivePrices
+} from "./utils.js";
 const RESOLUTION = 35;
 function useLiquidationHeatmap({
   xMin,
@@ -140,7 +162,27 @@ function useLiquidationGraphParams({
   };
 }
 export {
+  CELL_BAD,
+  CELL_CURRENT,
+  CELL_GOOD,
+  CELL_HOVERED,
+  CELL_LIQUIDATION,
+  CELL_OK,
+  DEFAULT_AXIS_MAX2 as DEFAULT_AXIS_MAX,
+  DEFAULT_AXIS_MIN,
+  formatAxisLabel,
+  formatAxisTipLabel,
+  formatAxisTipPrice,
+  getCellClass,
+  isPointInCell,
+  useAxis2 as useAxis,
   useEditPriceManually,
+  useFixedAssets2 as useFixedAssets,
+  useIsAxisInRelativeUnits,
+  useLiquidationGraphActivePrice,
+  useLiquidationGraphCurrentActiveValue,
   useLiquidationGraphParams,
-  useLiquidationHeatmap
+  useLiquidationHeatmap,
+  usePriceInNumber2 as usePriceInNumber,
+  useWithLiquidationGraphActivePrices
 };

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

@@ -1,3 +1,4 @@
+"use client";
 import { useEffect, useState } from "react";
 function useMediaQuery(query) {
   const [matches, setMatches] = useState(false);

package/dist/esm/hooks/use-previous.js CHANGED Viewed

@@ -1,3 +1,4 @@
+"use client";
 import { useEffect, useRef } from "react";
 function usePrevious(value) {
   const ref = useRef(void 0);

package/dist/types/components/base-link.d.ts CHANGED Viewed

@@ -6,31 +6,51 @@ export interface BaseLinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElem
      *
      * @example
      * ```tsx
+     * // With Next.js Link
      * <BaseLink asChild>
      *   <Link href="/path">Link</Link>
      * </BaseLink>
+     *
+     * // With React Router Link
+     * <BaseLink asChild>
+     *   <Link to="/path">Link</Link>
+     * </BaseLink>
      * ```
      */
     asChild?: boolean;
     /**
      * Indicates if this is an external link
+     * Automatically adds target="_blank" and rel="noopener noreferrer"
      */
     external?: boolean;
 }
 /**
  * BaseLink component for creating links with optional external link handling
  *
+ * This component works in both Next.js and non-Next.js projects:
+ * - In Next.js: use `asChild` prop to wrap Next.js Link component
+ * - In other frameworks: use `href` prop directly or wrap routing library links with `asChild`
+ *
  * @example
  * ```tsx
- * // Basic usage
+ * // Basic usage (works in any React project)
  * <BaseLink href="/dashboard">Dashboard</BaseLink>
  *
  * // External link
  * <BaseLink href="https://example.com" external>Example</BaseLink>
  *
- * // With routing library
+ * // With Next.js Link (recommended for Next.js projects)
+ * import NextLink from "next/link";
+ *
+ * <BaseLink asChild>
+ *   <NextLink href="/dashboard">Dashboard</NextLink>
+ * </BaseLink>
+ *
+ * // With React Router Link
+ * import { Link as RouterLink } from "react-router-dom";
+ *
  * <BaseLink asChild>
- *   <Link to="/dashboard">Dashboard</Link>
+ *   <RouterLink to="/dashboard">Dashboard</RouterLink>
  * </BaseLink>
  * ```
  */

package/dist/types/components/index.d.ts CHANGED Viewed

@@ -35,7 +35,6 @@ export * from "./layout";
 export * from "./liquidation";
 export * from "./loader-guard";
 export * from "./loading-guard";
-export * from "./markdown-viewer";
 export * from "./navbar";
 export * from "./navbar-indicator-context";
 export * from "./navitem";

package/dist/types/components/next/index.d.ts CHANGED Viewed

@@ -5,5 +5,7 @@
  */
 export { SignInRequired } from "../auth/signin-required";
 export { BackButton } from "./back-button";
+export { MarkdownViewer } from "./markdown-viewer";
 export { SIWEClientProvider } from "./siwe-provider";
 export { TokenIcon } from "./token-icon";
+export { Web3Providers } from "./web3-providers";

package/dist/types/components/next/web3-providers.d.ts ADDED Viewed

@@ -0,0 +1,29 @@
+import type { ReactNode } from "react";
+import type { Config } from "wagmi";
+/**
+ * Web3Providers — all-in-one provider component for Web3 apps with Wagmi, ConnectKit, SIWE, and React Query.
+ *
+ * @usage
+ * Use Web3Providers to wrap your Next.js application and enable Web3 functionality:
+ * app root, authentication context, wallet connection.
+ *
+ * Props:
+ * - `config` — Wagmi config object (required).
+ * - `apiRoutePrefix` — API route prefix for SIWE endpoints (required):
+ *   - `/api/nonce` — endpoint for fetching nonce.
+ *   - `/api/signin` — endpoint for verifying signature.
+ *   - `/api/session` — endpoint for getting current session.
+ *   - `/api/logout` — endpoint for signing out.
+ * - `statement` — optional custom statement for SIWE message (defaults to "Sign In With Ethereum.").
+ * - `children` — application content wrapped by provider (required).
+ *
+ * Note: Web3Providers wraps WagmiProvider, QueryClientProvider, ConnectKitProvider, and SIWEProvider with correct order and configuration.
+ */
+interface Web3ProvidersProps {
+    config: Config;
+    apiRoutePrefix: string;
+    statement?: string;
+    children: ReactNode;
+}
+export declare function Web3Providers({ config, apiRoutePrefix, statement, children, }: Web3ProvidersProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/hooks/use-liquidation/index.d.ts CHANGED Viewed

@@ -3,7 +3,8 @@ import type { Cell } from "reactochart/ColorHeatmap";
 import type { Address } from "viem";
 import type { AxisParams, Point } from "./types";
 export type { AxisOrder, AxisParams, Point as LiquidationPoint } from "./types";
-export * from "./utils";
+export type { Cell } from "./utils";
+export { CELL_BAD, CELL_CURRENT, CELL_GOOD, CELL_HOVERED, CELL_LIQUIDATION, CELL_OK, DEFAULT_AXIS_MAX, DEFAULT_AXIS_MIN, formatAxisLabel, formatAxisTipLabel, formatAxisTipPrice, getCellClass, isPointInCell, useAxis, useFixedAssets, useIsAxisInRelativeUnits, useLiquidationGraphActivePrice, useLiquidationGraphCurrentActiveValue, usePriceInNumber, useWithLiquidationGraphActivePrices, } from "./utils";
 interface UseLiquidationHeatmapProps {
     xMin: number;
     xMax: number;

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@gearbox-protocol/permissionless-ui",
-  "version": "1.3.0",
+  "version": "1.4.1",
   "description": "Internal UI components",
   "license": "MIT",
   "main": "./dist/cjs/index.js",
@@ -59,7 +59,6 @@
     "@radix-ui/react-tooltip": "^1.1.6",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
-    "connectkit": "^1.8.2",
     "lightweight-charts": "^4.1.3",
     "lucide-react": "^0.471.1",
     "luxon": "^3.5.0",
@@ -70,19 +69,21 @@
     "remark-gfm": "^4.0.0",
     "sonner": "^1.7.2",
     "tailwind-merge": "^2.6.0",
-    "tailwindcss-animate": "^1.0.7",
-    "viem": "^2.36",
-    "wagmi": "^2.14.8"
+    "tailwindcss-animate": "^1.0.7"
   },
   "peerDependencies": {
     "@gearbox-protocol/sdk": "*",
+    "@tanstack/react-query": "^5.0.0",
     "@types/react": "^18 || ^19",
     "@types/react-dom": "^18 || ^19",
+    "connectkit": "^1.8.0",
     "next": ">=13",
     "react": "^18 || ^19",
     "react-dom": "^18 || ^19",
-    "react-intl": "^6.0.0",
-    "react-router-dom": "^6.0.0"
+    "react-intl": "^6.0.0 || ^7.0.0",
+    "react-router-dom": "^6.0.0 || ^7.0.0",
+    "viem": "^2.0.0",
+    "wagmi": "^2.0.0"
   },
   "peerDependenciesMeta": {
     "next": {
@@ -102,12 +103,13 @@
     "@gearbox-protocol/biome-config": "^1.0.2",
     "@gearbox-protocol/sdk": "*",
     "@tailwindcss/postcss": "^4.1.14",
+    "@tanstack/react-query": "^5.64.1",
     "@types/cross-spawn": "^6.0.6",
     "@types/luxon": "^3.4.2",
-    "@types/react": "^19.2.4",
-    "@types/react-dom": "^19.2.3",
-    "@types/react-router-dom": "^5.3.3",
+    "@types/react": "^19.1.16",
+    "@types/react-dom": "^19.1.9",
     "autoprefixer": "^10.4.21",
+    "connectkit": "^1.9.1",
     "cross-spawn": "^7.0.6",
     "esbuild-fix-imports-plugin": "^1.0.22",
     "husky": "^9.1.7",
@@ -116,11 +118,15 @@
     "next": "15.5.3",
     "postcss": "^8.5.6",
     "postcss-cli": "^11.0.0",
+    "react": "^19.1.1",
+    "react-dom": "^19.1.1",
     "react-intl": "^6.7.4",
     "react-router-dom": "^7.9.6",
     "tailwindcss": "^4.1.14",
     "tsup": "^8.5.0",
-    "typescript": "^5.9.3"
+    "typescript": "^5.9.3",
+    "viem": "^2.39.0",
+    "wagmi": "^2.19.4"
   },
   "commitlint": {
     "extends": [
@@ -132,17 +138,5 @@
       "biome check --no-errors-on-unmatched --write"
     ]
   },
-  "packageManager": "pnpm@10.4.1+sha512.c753b6c3ad7afa13af388fa6d808035a008e30ea9993f58c6663e2bc5ff21679aa834db094987129aa4d488b86df57f7b634981b2f827cdcacc698cc0cfb88af",
-  "pnpm": {
-    "overrides": {
-      "elliptic@>=4.0.0 <=6.5.6": ">=6.5.7",
-      "elliptic@>=2.0.0 <=6.5.6": ">=6.5.7",
-      "elliptic@>=5.2.1 <=6.5.6": ">=6.5.7",
-      "elliptic@<6.5.6": ">=6.5.6",
-      "elliptic@<=6.6.0": ">=6.6.1",
-      "elliptic@<6.6.0": ">=6.6.0",
-      "form-data@>=4.0.0 <4.0.4": ">=4.0.4",
-      "sha.js@<=2.4.11": ">=2.4.12"
-    }
-  }
+  "packageManager": "pnpm@10.4.1+sha512.c753b6c3ad7afa13af388fa6d808035a008e30ea9993f58c6663e2bc5ff21679aa834db094987129aa4d488b86df57f7b634981b2f827cdcacc698cc0cfb88af"
 }

/package/dist/types/components/{markdown-viewer.d.ts → next/markdown-viewer.d.ts} RENAMED Viewed

File without changes