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

package/dist/types/components/layout/app-logo/app-logo.d.ts

@@ -1,26 +0,0 @@
-/**
- * AppLogo — application logo component with Gearbox Protocol logo and app name.
- *
- * @usage
- * Use AppLogo to display application branding:
- * header logo, footer logo, page branding.
- *
- * Props:
- * - `appName` — application name displayed next to logo (required).
- * - `size` — logo size: "default" or "small" (defaults to "default").
- *
- * Note: Uses Gearbox Protocol logo from static CDN. Logo size and text size adjust based on size prop.
- * Works with any React framework (not tied to Next.js).
- *
- * Do NOT use AppLogo:
- * - for custom logos or branding (use Image component with custom logo).
- * - when you need different logo styling (use Image component with appropriate styling).
- */
-export declare function AppLogo({ appName, size, }: {
-    appName?: string;
-    size?: "default" | "small";
-}): import("react/jsx-runtime").JSX.Element;
-export declare function AppLogoLink({ appName, className, }: {
-    appName?: string;
-    className?: string;
-}): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/layout/app-logo/index.d.ts

@@ -1 +0,0 @@
-export * from './app-logo';

package/dist/types/components/layout/block/block.d.ts

@@ -1,23 +0,0 @@
-import type * as React from "react";
-export type BlockMargins = "none" | "sm" | "md" | "lg";
-export type JustifyContent = "flex-start" | "center" | "flex-end" | "between";
-export type AlignItems = "flex-start" | "center" | "flex-end" | "stretch";
-export interface BlockProps extends React.HTMLAttributes<HTMLDivElement> {
-    /** Bottom margin */
-    margin?: BlockMargins;
-    /** Horizontal alignment (justify-content) */
-    justify?: JustifyContent;
-    /** Vertical alignment (align-items) */
-    align?: AlignItems;
-}
-/**
- * Block — a flexbox container with configurable margin, justify, and align
- *
- * @example
- * ```tsx
- * <Block margin="md" justify="center" align="center">
- *   <div>Content</div>
- * </Block>
- * ```
- */
-export declare function Block({ children, margin, justify, align, className, ...props }: BlockProps): React.ReactElement;

package/dist/types/components/layout/block/index.d.ts

@@ -1 +0,0 @@
-export * from './block';

package/dist/types/components/layout/footer/footer.d.ts

@@ -1,53 +0,0 @@
-import { BlockSyncProps } from '../../../types/footer';
-import { LegalReferences } from '../legal-disclaimer';
-import * as React from "react";
-export interface FooterProps extends React.HTMLAttributes<HTMLElement> {
-    logo?: React.ReactNode;
-    copyright?: React.ReactNode;
-    social?: React.ReactNode;
-    version?: string;
-    secondaryInfo?: React.ReactNode;
-    legalLinks?: React.ReactNode;
-    containerClassName?: string;
-    mobileExtraContent?: React.ReactNode;
-}
-/**
- * Footer component
- * Two-column layout with logo/copyright on left, social/info on right
- * Responsive design with mobile adaptations
- */
-export declare const Footer: React.ForwardRefExoticComponent<FooterProps & React.RefAttributes<HTMLElement>>;
-/**
- * FooterLink — link component for footer navigation.
- */
-interface FooterLinkProps {
-    href: string;
-    text: string;
-    external?: boolean;
-}
-export declare function FooterLink({ href, text, external }: FooterLinkProps): import("react/jsx-runtime").JSX.Element;
-/**
- * FooterLinkSection — section component for grouping footer links.
- */
-export declare function FooterLinkSection({ title, links, }: {
-    title: string;
-    links: FooterLinkProps[];
-}): import("react/jsx-runtime").JSX.Element;
-export interface GearboxFooterProps {
-    appName?: string;
-    legalAppName?: string;
-    legalReferences?: LegalReferences;
-    legalContent?: React.ReactNode;
-    className?: string;
-    version?: string;
-    discordAddr?: string;
-    landingAddr?: string;
-    twitterAddr?: string;
-    telegramAddr?: string;
-    blockSyncProps?: BlockSyncProps;
-    onPress?: () => void;
-    showLegalLinks?: boolean;
-    showDeveloperLinks?: boolean;
-}
-export declare function GearboxFooter({ appName, legalAppName, legalReferences, legalContent, className, version, discordAddr, landingAddr, twitterAddr, telegramAddr, blockSyncProps, onPress, showLegalLinks, showDeveloperLinks, }: GearboxFooterProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/types/components/layout/footer/index.d.ts

@@ -1 +0,0 @@
-export * from './footer';

package/dist/types/components/layout/header/header.d.ts

@@ -1,123 +0,0 @@
-import * as React from "react";
-interface MobileMenuContextValue {
-    closeMobileMenu: () => void;
-}
-/**
- * Hook to access mobile menu control functions
- * Use this hook inside mobileMenuContent to close the menu on navigation
- *
- * @example
- * ```tsx
- * function MobileNav() {
- *   const { closeMobileMenu } = useMobileMenu();
- *
- *   return (
- *     <nav>
- *       <a href="/" onClick={closeMobileMenu}>Home</a>
- *     </nav>
- *   );
- * }
- * ```
- */
-export declare function useMobileMenu(): MobileMenuContextValue;
-export interface HeaderProps extends React.HTMLAttributes<HTMLElement> {
-    /**
-     * Navigation content (shown on desktop, hidden on mobile unless specified)
-     */
-    navigation?: React.ReactNode;
-    /**
-     * Logo or brand content
-     */
-    logo?: React.ReactNode;
-    /**
-     * Action buttons or elements (e.g., Sign In, Sign Up)
-     */
-    actions?: React.ReactNode;
-    /**
-     * Whether the header should be fixed to the top of the viewport
-     */
-    fixed?: boolean;
-    /**
-     * Whether the header should stick to the top when scrolling
-     */
-    sticky?: boolean;
-    /**
-     * Additional className for the inner container
-     */
-    containerClassName?: string;
-    /**
-     * Custom content for mobile menu (optional)
-     * If not provided, the desktop navigation will be used
-     */
-    mobileMenuContent?: React.ReactNode;
-    /**
-     * Controlled open state of the mobile menu.
-     * When provided together with onMobileMenuOpenChange, the menu is controlled from outside.
-     */
-    mobileMenuOpen?: boolean;
-    /**
-     * Called when the mobile menu open state should change.
-     * Use with mobileMenuOpen for controlled mode (e.g. to close from a parent or sync with route).
-     */
-    onMobileMenuOpenChange?: (open: boolean) => void;
-}
-/**
- * Header component with support for navigation, logo, and actions
- * Follows responsive design practices with automatic mobile menu support
- *
- * @usage
- * Use Header as the main application header:
- * top navigation bar, app logo, navigation menu, wallet connection button.
- *
- * Note: Header is sticky at the top with z-50. Navigation is hidden on mobile (md:flex).
- * Uses NavigationButton components for navigation items.
- *
- * Do NOT use Header:
- * - for page-specific headers.
- * - for section headers within content (use CardHeader or h2/h3 elements).
- *
- * @example
- * ```tsx
- * <Header
- *   logo={<div>MyApp</div>}
- *   navigation={
- *     <nav className="flex gap-4">
- *       <NavItem href="/" active>Home</NavItem>
- *       <NavItem href="/about">About</NavItem>
- *     </nav>
- *   }
- *   actions={
- *     <>
- *       <Button variant="ghost">Sign In</Button>
- *       <Button>Sign Up</Button>
- *     </>
- *   }
- * />
- * ```
- *
- * @example With custom mobile menu
- * ```tsx
- * <Header
- *   logo={<div>MyApp</div>}
- *   navigation={<DesktopNav />}
- *   mobileMenuContent={
- *     <nav className="flex flex-col gap-2">
- *       <a href="/" className="px-4 py-3">Home</a>
- *       <a href="/about" className="px-4 py-3">About</a>
- *     </nav>
- *   }
- * />
- * ```
- *
- * @example Controlled mobile menu (open/close from outside)
- * ```tsx
- * const [mobileOpen, setMobileOpen] = useState(false);
- * <Header
- *   mobileMenuContent={<MobileNav />}
- *   mobileMenuOpen={mobileOpen}
- *   onMobileMenuOpenChange={setMobileOpen}
- * />
- * ```
- */
-export declare const Header: React.ForwardRefExoticComponent<HeaderProps & React.RefAttributes<HTMLElement>>;
-export {};

package/dist/types/components/layout/header/index.d.ts

@@ -1 +0,0 @@
-export * from './header';

package/dist/types/components/layout/legal-disclaimer/index.d.ts

@@ -1 +0,0 @@
-export * from './legal-disclaimer';

package/dist/types/components/layout/legal-disclaimer/legal-disclaimer.d.ts

@@ -1,32 +0,0 @@
-/**
- * LegalReferences — interface for legal document URLs.
- */
-export interface LegalReferences {
-    termsOfService: string;
-    privacyNotice: string;
-    riskDisclosure: string;
-}
-/**
- * LegalDisclaimer — component for displaying legal disclaimer text with links.
- *
- * @usage
- * Use LegalDisclaimer to display legal information and required disclaimers:
- * footer legal text, terms acceptance notices, risk disclosure statements.
- *
- * Props:
- * - `hrefs` — object containing legal document URLs (required):
- *   - `termsOfService` — Terms of Service URL.
- *   - `privacyNotice` — Privacy Notice URL.
- *   - `riskDisclosure` — Risk Disclosure URL.
- *
- * Note: Displays formatted text with links to Terms of Service, Privacy Notice, and Risk Disclosure Statement.
- * Text uses muted color and small size for footer placement.
- *
- * Do NOT use LegalDisclaimer:
- * - for custom legal text (use appropriate text components with links).
- * - when different disclaimer format is needed (use custom component).
- */
-export declare function LegalDisclaimer({ hrefs, appName, }: {
-    appName?: string;
-    hrefs: LegalReferences;
-}): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/layout/page-layout/index.d.ts

@@ -1 +0,0 @@
-export * from './page-layout';

package/dist/types/components/layout/page-layout/page-layout.d.ts

@@ -1,41 +0,0 @@
-interface PageLayoutProps {
-    children: React.ReactNode;
-    title: string;
-    description?: JSX.Element;
-    icon?: JSX.Element;
-    backButton?: {
-        href: string;
-        text?: string;
-        onClick?: () => void;
-    };
-    actionButton?: JSX.Element;
-    maxContainerWidth?: "sm" | "md" | "lg" | "xl" | "2xl" | "full";
-    containerClassName?: string;
-}
-/**
- * PageLayout — main layout component for application pages.
- *
- * @usage
- * Use PageLayout as the root layout wrapper for application pages:
- * page containers, content pages, detail pages, settings pages.
- *
- * Props:
- * - `children` — page content (required).
- * - `title` — page title displayed in header (required).
- * - `description` — optional description element displayed below title.
- * - `icon` — optional icon element displayed next to title.
- * - `backButton` — optional back button configuration object:
- *   - `href` — destination URL for back navigation (required).
- *   - `text` — custom text label (defaults to "Back" if not provided).
- *   - `onClick` — optional callback function executed on click.
- * - `actionButton` — optional action button element displayed next to title.
- *
- * Note: PageLayout provides full-screen layout with black background, padding, and overflow handling.
- * BackButton is rendered when backButton prop is provided.
- *
- * Do NOT use PageLayout:
- * - for modal dialogs or overlays (use Dialog component instead).
- * - for nested page sections (use Card or other container components).
- */
-export declare function PageLayout({ children, title, description, icon, backButton, actionButton, maxContainerWidth, containerClassName, }: PageLayoutProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/types/components/layout/social-icons/index.d.ts

@@ -1 +0,0 @@
-export * from './social-icons';

package/dist/types/components/layout/social-icons/social-icons.d.ts

@@ -1,7 +0,0 @@
-export interface SocialIconsProps {
-    twitterAddr?: string;
-    discordAddr?: string;
-    telegramAddr?: string;
-    className?: string;
-}
-export declare function SocialIcons({ twitterAddr, discordAddr, telegramAddr, className, }: SocialIconsProps): import("react/jsx-runtime").JSX.Element;

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

@@ -1,3 +0,0 @@
-export * from './navbar';
-export * from './navbar-indicator-context';
-export * from './navbar-with-overflow';

package/dist/types/components/navbar/navbar-indicator-context.d.ts

@@ -1,13 +0,0 @@
-import { default as React } from 'react';
-interface NavbarIndicatorContextType {
-    registerItem: (id: string, element: HTMLElement) => void;
-    unregisterItem: (id: string) => void;
-    setActiveItem: (id: string) => void;
-    containerRef: React.RefObject<HTMLDivElement | null>;
-    indicatorRef: React.RefObject<HTMLDivElement | null>;
-}
-export declare const NavbarIndicatorProvider: React.FC<{
-    children: React.ReactNode;
-}>;
-export declare const useNavbarIndicator: () => NavbarIndicatorContextType | null;
-export {};

package/dist/types/components/navbar/navbar-with-overflow.d.ts

@@ -1,20 +0,0 @@
-import type * as React from "react";
-export interface NavbarOverflowItem {
-    id: string;
-    label: React.ReactNode;
-    active?: boolean;
-    onClick?: () => void;
-}
-export interface NavbarWithOverflowProps {
-    items: NavbarOverflowItem[];
-    moreLabel?: React.ReactNode;
-    className?: string;
-}
-/**
- * NavbarWithOverflow — renders nav items inline, moving items that don't fit
- * into a "More" dropdown. Self-contained: measures its own wrapper width
- * via ResizeObserver. When all items fit, they are centered (via parent flex).
- *
- * Use inside <Navbar> or any flex container.
- */
-export declare function NavbarWithOverflow({ items, moreLabel, className, }: NavbarWithOverflowProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/navbar/navbar.d.ts

@@ -1,25 +0,0 @@
-import { VariantProps } from 'class-variance-authority';
-import * as React from "react";
-declare const navbarVariants: (props?: ({
-    variant?: "default" | "left" | "right" | "centered" | null | undefined;
-    size?: "default" | "sm" | "lg" | null | undefined;
-    sticky?: boolean | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string;
-/**
- * Navbar component props
- */
-export interface NavbarProps extends React.HTMLAttributes<HTMLElement>, VariantProps<typeof navbarVariants> {
-    /**
-     * Container class name for inner wrapper
-     */
-    containerClassName?: string;
-}
-/**
- * Navbar component for application navigation
- */
-declare const Navbar: React.ForwardRefExoticComponent<NavbarProps & React.RefAttributes<HTMLElement>>;
-/**
- * Navbar navigation wrapper component
- */
-declare const NavbarNav: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-export { Navbar, NavbarNav, navbarVariants };

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

@@ -1 +0,0 @@
-export * from './navitem';

package/dist/types/components/navitem/navitem.d.ts

@@ -1,67 +0,0 @@
-import { VariantProps } from 'class-variance-authority';
-import * as React from "react";
-declare const navitemVariants: (props?: ({
-    variant?: "link" | "default" | "tab" | "ghost" | "active" | "pill" | null | undefined;
-    size?: "default" | "icon" | "sm" | "lg" | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string;
-/**
- * NavItem component props
- */
-export interface NavItemProps extends React.AnchorHTMLAttributes<HTMLAnchorElement>, VariantProps<typeof navitemVariants> {
-    /**
-     * Renders the navitem as a child element using Radix Slot
-     * Useful for creating custom navigation elements or working with routing libraries
-     *
-     * @example
-     * ```tsx
-     * <NavItem asChild>
-     *   <Link href="/path">Link</Link>
-     * </NavItem>
-     * ```
-     */
-    asChild?: boolean;
-    /**
-     * Whether the navigation item is currently active
-     */
-    active?: boolean;
-    /**
-     * Optional icon to display before the label
-     */
-    icon?: React.ReactNode;
-    /**
-     * Optional badge or indicator to display after the label
-     */
-    badge?: React.ReactNode;
-    /**
-     * Indicates if this is an external link
-     */
-    external?: boolean;
-}
-/**
- * NavItem component for navigation items
- *
- * @example
- * ```tsx
- * // Basic usage
- * <NavItem href="/dashboard">Dashboard</NavItem>
- *
- * // Active state
- * <NavItem href="/settings" active>Settings</NavItem>
- *
- * // With icon
- * <NavItem href="/profile" icon={<UserIcon />}>Profile</NavItem>
- *
- * // With badge
- * <NavItem href="/notifications" badge={<Badge>3</Badge>}>Notifications</NavItem>
- *
- * // As a router link
- * <NavItem asChild>
- *   <Link to="/dashboard">Dashboard</Link>
- * </NavItem>
- *
- * // Tab variant
- * <NavItem variant="tab" active>Overview</NavItem>
- * ```
- */
-declare const NavItem: React.ForwardRefExoticComponent<NavItemProps & React.RefAttributes<HTMLAnchorElement>>;
-export { NavItem, navitemVariants };

package/dist/types/components/page-title/index.d.ts

@@ -1 +0,0 @@
-export * from './page-title';

package/dist/types/components/page-title/page-title.d.ts

@@ -1,77 +0,0 @@
-import { VariantProps } from 'class-variance-authority';
-import * as React from "react";
-declare const pageTitleVariants: (props?: ({
-    size?: "default" | "sm" | "lg" | "xl" | null | undefined;
-    variant?: "default" | "muted" | "primary" | "gradient" | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string;
-declare const pageTitleRootVariants: (props?: ({
-    spacing?: "default" | "sm" | "lg" | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string;
-export interface PageTitleProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof pageTitleVariants> {
-    /**
-     * Optional back button element to display before the title
-     */
-    backButton?: React.ReactNode;
-    /**
-     * Optional icon to display before the title
-     */
-    icon?: React.ReactNode;
-    /**
-     * Position of the actions (mobile-first base)
-     */
-    actionsPosition?: "left" | "right";
-    /**
-     * Position of the actions from md breakpoint (≥768px). Overrides actionsPosition.
-     */
-    actionsPositionMd?: "left" | "right";
-    /**
-     * Optional action buttons to display after the title
-     */
-    actions?: React.ReactNode;
-    /**
-     * Spacing between elements
-     */
-    spacing?: "sm" | "default" | "lg";
-    /**
-     * Optional subtitle or description
-     */
-    subtitle?: React.ReactNode;
-    /**
-     * Whether to render as h1 or div
-     */
-    as?: "h1" | "h2" | "h3" | "div";
-}
-/**
- * PageTitle component for displaying page headers with optional back button, icon, and actions
- *
- * @example
- * ```tsx
- * // Basic usage
- * <PageTitle>Dashboard</PageTitle>
- *
- * // With back button
- * <PageTitle backButton={<BackButton href="/home" />}>
- *   Settings
- * </PageTitle>
- *
- * // With icon and actions
- * <PageTitle
- *   icon={<UserIcon />}
- *   actions={<Button>Edit</Button>}
- * >
- *   Profile
- * </PageTitle>
- *
- * // With subtitle
- * <PageTitle subtitle="Manage your account settings">
- *   Settings
- * </PageTitle>
- *
- * // Different sizes and variants
- * <PageTitle size="lg" variant="gradient">
- *   Welcome
- * </PageTitle>
- * ```
- */
-export declare const PageTitle: React.ForwardRefExoticComponent<PageTitleProps & React.RefAttributes<HTMLDivElement>>;
-export { pageTitleVariants, pageTitleRootVariants };

package/dist/types/components/pool-apy-tooltip/apy-tooltip.d.ts

@@ -1,20 +0,0 @@
-import { ApyBreakdown } from '@gearbox-protocol/sdk/model';
-import type * as React from "react";
-export interface ApyTooltipProps {
-    /**
-     * SDK `ApyBreakdown`. Display-only — organic base, token rewards, total,
-     * and points programs. No `tokensList`, 7D history, or external APY.
-     */
-    apy: ApyBreakdown;
-    children?: React.ReactNode;
-    className?: string;
-}
-/**
- * Tooltip for an SDK `ApyBreakdown` — organic base, token rewards, total,
- * and points programs.
- *
- * Does not cover 1D/7D history, external APY, or rich point tip metadata
- * (`duration`, `condition`, `tokenTitle`, preformatted `amount`). For those
- * stay on the deprecated {@link PoolAPYTooltip}.
- */
-export declare function ApyTooltip({ apy, children, className }: ApyTooltipProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/pool-apy-tooltip/index.d.ts

@@ -1 +0,0 @@
-export * from './apy-tooltip';

package/dist/types/components/table/edit-button.d.ts

@@ -1,51 +0,0 @@
-import { ButtonProps } from '../buttons';
-import type * as React from "react";
-interface EditButtonProps extends Omit<ButtonProps, "variant" | "width"> {
-    /**
-     * @deprecated Use children instead
-     */
-    customButton?: React.ReactNode;
-    /**
-     * Width variant of the button
-     * - "default" — compact icon button
-     * - "wide" — full width button
-     */
-    width?: "default" | "wide";
-    /**
-     * @deprecated Use width="wide" instead
-     */
-    $width?: "default" | "wide";
-}
-/**
- * EditButton — button component for triggering edit actions.
- *
- * @usage
- * Use EditButton to provide edit functionality in editable components:
- * table cells, form fields, editable values.
- *
- * Props:
- * - `onClick` — callback function executed when button is clicked.
- * - `children` — custom content to replace default edit icon.
- * - `width` — button width: "default" or "wide".
- * - `disabled` — if true, button is disabled.
- *
- * Note: Uses ghost variant Button with Edit icon by default.
- *
- * @example
- * ```tsx
- * // Default icon button
- * <EditButton onClick={handleEdit} />
- *
- * // With custom content
- * <EditButton onClick={handleEdit}>
- *   Edit Item
- * </EditButton>
- *
- * // Wide button
- * <EditButton width="wide" onClick={handleEdit}>
- *   <span>Edit</span>
- * </EditButton>
- * ```
- */
-export declare function EditButton({ onClick, customButton, children, disabled, width, $width, className, style, ...props }: EditButtonProps): import("react/jsx-runtime").JSX.Element;
-export {};