@gearbox-protocol/ui-kit 3.0.0 → 3.1.0-next.2

package/dist/types/components/auth/connect-required.d.ts

@@ -2,28 +2,27 @@ import { ReactNode } from 'react';
 import { Address } from 'viem';
 import { TabButtonProps } from '../buttons';
 /**
- * SignInRequired — component that requires SIWE authentication to display content.
+ * ConnectRequired — component that requires a connected wallet to display content.
  *
  * @usage
- * Use SignInRequired to protect content that requires authentication:
- * action buttons, editable content, owner-specific features, authenticated actions.
+ * Use ConnectRequired to protect content that requires a wallet connection:
+ * action buttons, editable content, owner-specific features.
  *
  * Props:
- * - `owner` — optional address that must match signed-in address to display content.
- * - `children` — content displayed when authenticated (required).
+ * - `owner` — optional address that must match connected address to display content.
+ * - `children` — content displayed when connected (required).
  * - All Button props are supported (variant, size, className, onClick, etc.).
  *
  * Behavior:
  * - If user is connected: renders children (or "You are not the author" if owner mismatch).
- * - If wallet connected but not signed in: shows "Sign In as {address}" button or "Try Again" if rejected.
- * - If wallet not connected: shows "Connect Wallet" button.
+ * - If wallet not connected: shows "Connect Wallet" button that calls `openConnectModal` from {@link WalletUIProvider}.
+ *
+ * When no {@link WalletUIProvider} is mounted, the gate is skipped and `children` are rendered (graceful degradation).
  *
  * Note: Uses TabButton by default, but switches to Button if custom props are provided.
- * Button text changes based on authentication state and loading status.
  *
- * Do NOT use SignInRequired:
- * - for public content that doesn't require authentication (render content directly).
- * - when you need different authentication flow (use appropriate authentication components).
+ * Do NOT use ConnectRequired:
+ * - for public content that does not require a wallet (render content directly).
  */
 export interface ConnectRequiredProps extends TabButtonProps {
     owner?: Address;

package/dist/types/components/auth/index.d.ts

@@ -1,3 +1,3 @@
 export * from './connect-required';
 export * from './signin-required';
-export * from './siwe-provider';
+export * from './wallet-ui-context';

package/dist/types/components/auth/signin-required.d.ts

@@ -16,15 +16,17 @@ import { TabButtonProps } from '../buttons';
  *
  * Behavior:
  * - If `skipSignIn={true}` or user is signed in: renders children (or "You are not the author" if owner mismatch).
- * - If wallet connected but not signed in: shows "Sign In as {address}" button or "Try Again" if rejected.
- * - If wallet not connected: shows "Connect Wallet" button.
+ * - If wallet connected but not signed in: shows "Sign In as {address}" or "Try Again".
+ * - If wallet not connected: shows "Connect Wallet".
+ *
+ * Requires {@link WalletUIProvider} with SIWE state (e.g. {@link ConnectKitWalletAdapter} from
+ * `@gearbox-protocol/ui-kit/connectkit`). Without a provider, the sign-in gate is skipped and `children`
+ * are rendered (graceful degradation).
  *
  * Note: Uses TabButton by default, but switches to Button if custom props are provided.
- * Button text changes based on authentication state and loading status.
  *
  * Do NOT use SignInRequired:
- * - for public content that doesn't require authentication (render content directly).
- * - when you need different authentication flow (use appropriate authentication components).
+ * - for public content that does not require authentication (render content directly).
  */
 export interface SignInRequiredProps extends TabButtonProps {
     owner?: Address;

package/dist/types/components/auth/wallet-ui-context.d.ts

@@ -0,0 +1,36 @@
+import { ReactNode } from 'react';
+/**
+ * SIWE-related state exposed by a wallet UI adapter (e.g. ConnectKit).
+ */
+export interface WalletUISIWEState {
+    isSignedIn: boolean;
+    isRejected: boolean;
+    isLoading: boolean;
+    data: {
+        address?: string;
+    } | null;
+}
+/**
+ * Values provided by {@link WalletUIProvider} so auth helpers work without importing ConnectKit.
+ */
+export interface WalletUIContextValue {
+    openConnectModal: () => void;
+    openSIWE?: () => void;
+    siwe?: WalletUISIWEState;
+}
+export interface WalletUIProviderProps {
+    value: WalletUIContextValue;
+    children?: ReactNode;
+}
+/**
+ * Supplies wallet modal + optional SIWE actions for {@link ConnectRequired}, {@link SignInRequired},
+ * and editable tables that use them.
+ *
+ * Use {@link ConnectKitWalletAdapter} from `@gearbox-protocol/ui-kit/connectkit` when using ConnectKit,
+ * or provide your own `value` (e.g. RainbowKit `useConnectModal`).
+ */
+export declare function WalletUIProvider({ value, children }: WalletUIProviderProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Returns the wallet UI adapter value, or `null` when no {@link WalletUIProvider} is mounted.
+ */
+export declare function useWalletUI(): WalletUIContextValue | null;

package/dist/types/components/connectkit/connect-kit-wallet-adapter.d.ts

@@ -0,0 +1,12 @@
+import { ReactNode } from 'react';
+export interface ConnectKitWalletAdapterProps {
+    children?: ReactNode;
+}
+/**
+ * Bridges ConnectKit (`useModal`, `useSIWE`) into {@link WalletUIProvider} so
+ * {@link ConnectRequired}, {@link SignInRequired}, and editable tables work without importing ConnectKit
+ * from application code.
+ *
+ * Place inside `ConnectKitProvider` (and typically inside or beside {@link SIWEClientProvider} when using SIWE).
+ */
+export declare function ConnectKitWalletAdapter({ children, }: ConnectKitWalletAdapterProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/connectkit/index.d.ts

@@ -0,0 +1,2 @@
+export { ConnectKitWalletAdapter, type ConnectKitWalletAdapterProps, } from './connect-kit-wallet-adapter';
+export { SIWEClientProvider, type SIWEClientProviderProps, } from './siwe-provider';

package/dist/types/components/connectkit/siwe-provider.d.ts

@@ -0,0 +1,30 @@
+/**
+ * SIWEClientProvider — provider component for Sign-In With Ethereum (SIWE) authentication.
+ *
+ * Requires `connectkit` and must be used under `ConnectKitProvider` + `WagmiProvider`.
+ *
+ * @usage
+ * Use SIWEClientProvider to wrap your application and enable SIWE authentication:
+ * app root, authentication context, wallet-based authentication.
+ *
+ * Props:
+ * - `apiRoutePrefix` — API route prefix for SIWE endpoints (required):
+ *   - `/nonce` — endpoint for fetching nonce (relative to prefix).
+ *   - `/signin` — endpoint for verifying signature.
+ *   - `/session` — endpoint for getting current session.
+ *   - `/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).
+ * - `onRefresh` — optional callback after sign-in or sign-out (e.g. Next.js `router.refresh()`).
+ *
+ * Note: wraps ConnectKit's `SIWEProvider` with custom HTTP API integration.
+ *
+ * Import from `@gearbox-protocol/ui-kit/connectkit` so `connectkit` stays an optional peer dependency.
+ */
+export interface SIWEClientProviderProps {
+    apiRoutePrefix: string;
+    statement?: string;
+    children?: React.ReactNode;
+    onRefresh?: () => void;
+}
+export declare function SIWEClientProvider({ apiRoutePrefix, statement, children, onRefresh, ...props }: SIWEClientProviderProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/next/connectkit/index.d.ts

@@ -0,0 +1 @@
+export { type NextSIWEClientProviderProps, SIWEClientProvider, } from './siwe-provider';

package/dist/types/components/next/connectkit/siwe-provider.d.ts

@@ -0,0 +1,8 @@
+import { SIWEClientProviderProps as BaseSIWEClientProviderProps } from '../../connectkit/siwe-provider';
+export type NextSIWEClientProviderProps = Omit<BaseSIWEClientProviderProps, "onRefresh">;
+/**
+ * Next.js variant of {@link SIWEClientProvider} that calls `router.refresh()` after sign-in and sign-out.
+ *
+ * Import from `@gearbox-protocol/ui-kit/next/connectkit`.
+ */
+export declare function SIWEClientProvider(props: NextSIWEClientProviderProps): import("react/jsx-runtime").JSX.Element;

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

@@ -8,5 +8,4 @@ export { preloadTokenIcons } from '../token-icon';
 export { BackButton } from './back-button';
 export { NextMarkdownViewer, type NextMarkdownViewerProps, } from './next-markdown-viewer';
 export { NextNavigationProvider } from './next-navigation-provider';
-export { SIWEClientProvider } from './siwe-provider';
 export { TokenIcon } from './token-icon';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gearbox-protocol/ui-kit",
-  "version": "3.0.0",
+  "version": "3.1.0-next.2",
   "description": "Internal UI components",
   "repository": "https://github.com/gearbox-protocol/ui-kit",
   "license": "MIT",
@@ -34,7 +34,22 @@
     "./globals.css": "./dist/globals.css",
     "./grid-safelist.css": "./dist/grid-safelist.css",
     "./theme.css": "./src/styles/theme.css",
-    "./base.css": "./src/styles/base.css"
+    "./base.css": "./src/styles/base.css",
+    "./sdk-legacy": {
+      "types": "./dist/types/sdk-legacy/index.d.ts",
+      "import": "./dist/esm/sdk-legacy/index.js",
+      "default": "./dist/cjs/sdk-legacy/index.cjs"
+    },
+    "./connectkit": {
+      "types": "./dist/types/components/connectkit/index.d.ts",
+      "import": "./dist/esm/components/connectkit/index.js",
+      "default": "./dist/cjs/components/connectkit/index.cjs"
+    },
+    "./next/connectkit": {
+      "types": "./dist/types/components/next/connectkit/index.d.ts",
+      "import": "./dist/esm/components/next/connectkit/index.js",
+      "default": "./dist/cjs/components/next/connectkit/index.cjs"
+    }
   },
   "files": [
     "dist",
@@ -51,8 +66,8 @@
     "check": "biome check --write",
     "check:ci": "biome check --diagnostic-level=error",
     "typecheck:ci": "tsc --noEmit",
-    "test": "vitest run",
-    "test:watch": "vitest",
+    "test": "pnpm exec vitest run",
+    "test:watch": "pnpm exec vitest",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build"
   },
@@ -93,6 +108,7 @@
     "tailwindcss-animate": "^1.0.7"
   },
   "peerDependencies": {
+    "axios": "^1.0.0",
     "@gearbox-protocol/sdk": "*",
     "@tanstack/react-query": "^5.64.1",
     "@types/react": "^18 || ^19",
@@ -126,6 +142,7 @@
     }
   },
   "devDependencies": {
+    "axios": "^1.12.2",
     "@biomejs/biome": "^2.2.4",
     "@chromatic-com/storybook": "^4.1.3",
     "@commitlint/cli": "^20.1.0",

package/dist/cjs/components/next/siwe-provider.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),o=require("next/navigation"),i=require("../auth/siwe-provider.cjs");function n(e){const r=o.useRouter();return t.jsx(i.SIWEClientProvider,{...e,onRefresh:()=>r.refresh()})}exports.SIWEClientProvider=n;

package/dist/types/components/auth/siwe-provider.d.ts

@@ -1,31 +0,0 @@
-/**
- * SIWEClientProvider — provider component for Sign-In With Ethereum (SIWE) authentication.
- *
- * @usage
- * Use SIWEClientProvider to wrap your application and enable SIWE authentication:
- * app root, authentication context, wallet-based authentication.
- *
- * Props:
- * - `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: SIWEClientProvider wraps ConnectKit's SIWEProvider with custom API integration.
- * Handles nonce generation, message creation, signature verification, session management, and sign out.
- * Automatically refreshes router on sign in/out.
- *
- * Do NOT use SIWEClientProvider:
- * - when you don't need SIWE authentication (use regular ConnectKit providers).
- */
-interface SIWEProviderProps {
-    apiRoutePrefix: string;
-    statement?: string;
-    children?: React.ReactNode;
-    onRefresh?: () => void;
-}
-export declare function SIWEClientProvider({ apiRoutePrefix, statement, children, onRefresh, ...props }: SIWEProviderProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/types/components/next/siwe-provider.d.ts

@@ -1,7 +0,0 @@
-interface SIWEProviderProps {
-    apiRoutePrefix: string;
-    statement?: string;
-    children?: React.ReactNode;
-}
-export declare function SIWEClientProvider(props: SIWEProviderProps): import("react/jsx-runtime").JSX.Element;
-export {};