@gearbox-protocol/permissionless-ui 1.9.2 → 1.9.4

package/dist/cjs/components/auth/connect-required.cjs

@@ -0,0 +1,38 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+require('../buttons/back-button/back-button.cjs');
+const components_buttons_button_button = require('../buttons/button/button.cjs');
+require('../buttons/copy-button/copy-button.cjs');
+require('../buttons/external-button/external-button.cjs');
+require('../buttons/filter-button/filter-button.cjs');
+require('../buttons/navigation-button/navigation-button.cjs');
+require('react');
+require('clsx');
+require('tailwind-merge');
+require('sonner');
+require('@gearbox-protocol/sdk');
+const components_buttons_tabButton_tabButton = require('../buttons/tab-button/tab-button.cjs');
+const connectkit = require('connectkit');
+const wagmi = require('wagmi');
+
+function ConnectRequired({
+  children,
+  owner,
+  ...customProps
+}) {
+  const { setOpen } = connectkit.useModal();
+  const { isConnected, address } = wagmi.useAccount();
+  const ButtonComponent = Object.keys(customProps).length > 0 ? components_buttons_button_button.Button : components_buttons_tabButton_tabButton.TabButton;
+  if (isConnected && address) {
+    if (owner && address?.toLowerCase() !== owner.toLowerCase()) {
+      return /* @__PURE__ */ jsxRuntime.jsx(ButtonComponent, { ...customProps, disabled: true, children: "You are not the author" });
+    }
+    return children;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(ButtonComponent, { ...customProps, onClick: () => setOpen(true), children: "Connect Wallet" });
+}
+
+exports.ConnectRequired = ConnectRequired;

package/dist/cjs/components/auth/index.cjs

@@ -4,8 +4,10 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const components_auth_signinRequired = require('./signin-required.cjs');
 const components_auth_siweProvider = require('./siwe-provider.cjs');
+const components_auth_connectRequired = require('./connect-required.cjs');
 
 
 
 exports.SignInRequired = components_auth_signinRequired.SignInRequired;
 exports.SIWEClientProvider = components_auth_siweProvider.SIWEClientProvider;
+exports.ConnectRequired = components_auth_connectRequired.ConnectRequired;

package/dist/cjs/components/index.cjs

@@ -8,6 +8,7 @@ const components_assetsListCell_assetsListCell = require('./assets-list-cell/ass
 const components_assetsRatio_assetsRatio = require('./assets-ratio/assets-ratio.cjs');
 const components_auth_signinRequired = require('./auth/signin-required.cjs');
 const components_auth_siweProvider = require('./auth/siwe-provider.cjs');
+const components_auth_connectRequired = require('./auth/connect-required.cjs');
 const components_badge_badge = require('./badge/badge.cjs');
 const components_baseLink_baseLink = require('./base-link/base-link.cjs');
 const components_blockSync_blockSync = require('./block-sync/block-sync.cjs');
@@ -154,6 +155,7 @@ exports.AssetsListCell = components_assetsListCell_assetsListCell.AssetsListCell
 exports.AssetsRatio = components_assetsRatio_assetsRatio.AssetsRatio;
 exports.SignInRequired = components_auth_signinRequired.SignInRequired;
 exports.SIWEClientProvider = components_auth_siweProvider.SIWEClientProvider;
+exports.ConnectRequired = components_auth_connectRequired.ConnectRequired;
 exports.Badge = components_badge_badge.Badge;
 exports.badgeVariants = components_badge_badge.badgeVariants;
 exports.BaseLink = components_baseLink_baseLink.BaseLink;

package/dist/cjs/components/table/editable-grid-table.cjs

@@ -19,6 +19,7 @@ require('tailwind-merge');
 require('sonner');
 require('@gearbox-protocol/sdk');
 const components_buttons_tabButton_tabButton = require('../buttons/tab-button/tab-button.cjs');
+require('wagmi');
 const components_tokenIcon_tokenIcon = require('../token-icon/token-icon.cjs');
 const components_table_gridTable = require('./grid-table.cjs');
 const components_table_updatedValue = require('./updated-value.cjs');

package/dist/cjs/components/table/editable-table.cjs

@@ -18,6 +18,7 @@ require('tailwind-merge');
 require('sonner');
 require('@gearbox-protocol/sdk');
 const components_buttons_tabButton_tabButton = require('../buttons/tab-button/tab-button.cjs');
+require('wagmi');
 const components_tokenIcon_tokenIcon = require('../token-icon/token-icon.cjs');
 const components_table_table = require('./table.cjs');
 const components_table_updatedValue = require('./updated-value.cjs');

package/dist/cjs/components/tabs/tabs.cjs

@@ -35,7 +35,7 @@ const TabsList = React__namespace.forwardRef(({ className, ...props }, ref) => /
   {
     ref,
     className: utils_cn.cn(
-      "inline-flex h-fit items-center justify-start rounded-lg bg-muted p-1 text-muted-foreground bg-transparent p-0 space-x-6 overflow-x-auto overflow-y-hidden navbar-scrollbar min-w-max",
+      "inline-flex h-fit items-center justify-start bg-muted p-1 text-muted-foreground bg-transparent p-0 space-x-6 overflow-x-auto overflow-y-hidden navbar-scrollbar min-w-max",
       className
     ),
     ...props
@@ -47,7 +47,7 @@ const TabsTrigger = React__namespace.forwardRef(({ className, ...props }, ref) =
   {
     ref,
     className: utils_cn.cn(
-      "inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow rounded-none border-b-2 border-transparent px-2 py-2 text-gray-400 hover:text-foreground data-[state=active]:border-foreground data-[state=active]:bg-transparent data-[state=active]:text-foreground focus:outline-none cursor-pointer shrink-0",
+      "inline-flex items-center justify-center whitespace-nowrap px-3 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow rounded-none border-b-2 border-transparent px-2 py-2 text-gray-400 hover:text-foreground data-[state=active]:border-foreground data-[state=active]:bg-transparent data-[state=active]:text-foreground focus:outline-none cursor-pointer shrink-0",
       className
     ),
     ...props

package/dist/cjs/index.cjs

@@ -8,6 +8,7 @@ const components_assetsListCell_assetsListCell = require('./components/assets-li
 const components_assetsRatio_assetsRatio = require('./components/assets-ratio/assets-ratio.cjs');
 const components_auth_signinRequired = require('./components/auth/signin-required.cjs');
 const components_auth_siweProvider = require('./components/auth/siwe-provider.cjs');
+const components_auth_connectRequired = require('./components/auth/connect-required.cjs');
 const components_badge_badge = require('./components/badge/badge.cjs');
 const components_baseLink_baseLink = require('./components/base-link/base-link.cjs');
 const components_blockSync_blockSync = require('./components/block-sync/block-sync.cjs');
@@ -174,6 +175,7 @@ exports.AssetsListCell = components_assetsListCell_assetsListCell.AssetsListCell
 exports.AssetsRatio = components_assetsRatio_assetsRatio.AssetsRatio;
 exports.SignInRequired = components_auth_signinRequired.SignInRequired;
 exports.SIWEClientProvider = components_auth_siweProvider.SIWEClientProvider;
+exports.ConnectRequired = components_auth_connectRequired.ConnectRequired;
 exports.Badge = components_badge_badge.Badge;
 exports.badgeVariants = components_badge_badge.badgeVariants;
 exports.BaseLink = components_baseLink_baseLink.BaseLink;

package/dist/esm/components/auth/connect-required.js

@@ -0,0 +1,34 @@
+import { jsx } from 'react/jsx-runtime';
+import '../buttons/back-button/back-button.js';
+import { Button } from '../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 'react';
+import 'clsx';
+import 'tailwind-merge';
+import 'sonner';
+import '@gearbox-protocol/sdk';
+import { TabButton } from '../buttons/tab-button/tab-button.js';
+import { useModal } from 'connectkit';
+import { useAccount } from 'wagmi';
+
+function ConnectRequired({
+  children,
+  owner,
+  ...customProps
+}) {
+  const { setOpen } = useModal();
+  const { isConnected, address } = useAccount();
+  const ButtonComponent = Object.keys(customProps).length > 0 ? Button : TabButton;
+  if (isConnected && address) {
+    if (owner && address?.toLowerCase() !== owner.toLowerCase()) {
+      return /* @__PURE__ */ jsx(ButtonComponent, { ...customProps, disabled: true, children: "You are not the author" });
+    }
+    return children;
+  }
+  return /* @__PURE__ */ jsx(ButtonComponent, { ...customProps, onClick: () => setOpen(true), children: "Connect Wallet" });
+}
+
+export { ConnectRequired };

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

@@ -1,2 +1,3 @@
 export { SignInRequired } from './signin-required.js';
 export { SIWEClientProvider } from './siwe-provider.js';
+export { ConnectRequired } from './connect-required.js';

package/dist/esm/components/index.js

@@ -4,6 +4,7 @@ export { AssetsListCell } from './assets-list-cell/assets-list-cell.js';
 export { AssetsRatio } from './assets-ratio/assets-ratio.js';
 export { SignInRequired } from './auth/signin-required.js';
 export { SIWEClientProvider } from './auth/siwe-provider.js';
+export { ConnectRequired } from './auth/connect-required.js';
 export { Badge, badgeVariants } from './badge/badge.js';
 export { BaseLink } from './base-link/base-link.js';
 export { BlockSync } from './block-sync/block-sync.js';

package/dist/esm/components/table/editable-grid-table.js

@@ -15,6 +15,7 @@ import 'tailwind-merge';
 import 'sonner';
 import '@gearbox-protocol/sdk';
 import { TabButton } from '../buttons/tab-button/tab-button.js';
+import 'wagmi';
 import { TokenIcon } from '../token-icon/token-icon.js';
 import { GridTableCell, GridTable } from './grid-table.js';
 import { UpdatedValue } from './updated-value.js';

package/dist/esm/components/table/editable-table.js

@@ -14,6 +14,7 @@ import 'tailwind-merge';
 import 'sonner';
 import '@gearbox-protocol/sdk';
 import { TabButton } from '../buttons/tab-button/tab-button.js';
+import 'wagmi';
 import { TokenIcon } from '../token-icon/token-icon.js';
 import { TableCell, Table } from './table.js';
 import { UpdatedValue } from './updated-value.js';

package/dist/esm/components/tabs/tabs.js

@@ -11,7 +11,7 @@ const TabsList = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__
   {
     ref,
     className: cn(
-      "inline-flex h-fit items-center justify-start rounded-lg bg-muted p-1 text-muted-foreground bg-transparent p-0 space-x-6 overflow-x-auto overflow-y-hidden navbar-scrollbar min-w-max",
+      "inline-flex h-fit items-center justify-start bg-muted p-1 text-muted-foreground bg-transparent p-0 space-x-6 overflow-x-auto overflow-y-hidden navbar-scrollbar min-w-max",
       className
     ),
     ...props
@@ -23,7 +23,7 @@ const TabsTrigger = React.forwardRef(({ className, ...props }, ref) => /* @__PUR
   {
     ref,
     className: cn(
-      "inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow rounded-none border-b-2 border-transparent px-2 py-2 text-gray-400 hover:text-foreground data-[state=active]:border-foreground data-[state=active]:bg-transparent data-[state=active]:text-foreground focus:outline-none cursor-pointer shrink-0",
+      "inline-flex items-center justify-center whitespace-nowrap px-3 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow rounded-none border-b-2 border-transparent px-2 py-2 text-gray-400 hover:text-foreground data-[state=active]:border-foreground data-[state=active]:bg-transparent data-[state=active]:text-foreground focus:outline-none cursor-pointer shrink-0",
       className
     ),
     ...props

package/dist/esm/index.js

@@ -4,6 +4,7 @@ export { AssetsListCell } from './components/assets-list-cell/assets-list-cell.j
 export { AssetsRatio } from './components/assets-ratio/assets-ratio.js';
 export { SignInRequired } from './components/auth/signin-required.js';
 export { SIWEClientProvider } from './components/auth/siwe-provider.js';
+export { ConnectRequired } from './components/auth/connect-required.js';
 export { Badge, badgeVariants } from './components/badge/badge.js';
 export { BaseLink } from './components/base-link/base-link.js';
 export { BlockSync } from './components/block-sync/block-sync.js';

package/dist/globals.css

@@ -158,6 +158,10 @@
       "cv03" on;
   }
 
+  html {
+    scrollbar-gutter: stable;
+  }
+
   html.dark {
     color-scheme: dark;
   }

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

@@ -0,0 +1,32 @@
+import { TabButtonProps } from '../buttons';
+import { ReactNode } from '../../../node_modules/.pnpm/react@19.2.0/node_modules/react';
+import { Address } from 'viem';
+/**
+ * SignInRequired — component that requires SIWE authentication to display content.
+ *
+ * @usage
+ * Use SignInRequired to protect content that requires authentication:
+ * action buttons, editable content, owner-specific features, authenticated actions.
+ *
+ * Props:
+ * - `owner` — optional address that must match signed-in address to display content.
+ * - `children` — content displayed when authenticated (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.
+ *
+ * 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).
+ */
+export interface ConnectRequiredProps extends TabButtonProps {
+    owner?: Address;
+    children: ReactNode;
+}
+export declare function ConnectRequired({ children, owner, ...customProps }: ConnectRequiredProps): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | import('../../../node_modules/.pnpm/react@19.2.0/node_modules/react').ReactPortal | import('../../../node_modules/.pnpm/react@19.2.0/node_modules/react').ReactElement<unknown, string | import('../../../node_modules/.pnpm/react@19.2.0/node_modules/react').JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null | undefined;

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

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gearbox-protocol/permissionless-ui",
-  "version": "1.9.2",
+  "version": "1.9.4",
   "description": "Internal UI components",
   "license": "MIT",
   "main": "./dist/cjs/index.js",