import { ReactNode } from 'react';
import { LucideIcon } from 'lucide-react';
export interface SidebarProps {
    /** Collapsed (controlled) — consumers hold their own persisted store. */
    collapsed: boolean;
    /** Toggle handler for the collapse/expand buttons. */
    onToggleCollapse: () => void;
    /** Brand / wordmark shown when expanded. */
    brand: ReactNode;
    /** Brand shown when collapsed (defaults to `brand`). */
    brandCollapsed?: ReactNode;
    /** Footer content shown when expanded. */
    footer?: ReactNode;
    /** Footer content shown when collapsed (defaults to `footer`). */
    footerCollapsed?: ReactNode;
    /** aria-label for the collapse (⟨) button. */
    collapseLabel?: string;
    /** aria-label for the expand (⟩) button. */
    expandLabel?: string;
    /** Nav items and groups. */
    children: ReactNode;
    className?: string;
}
export declare const Sidebar: import('react').ForwardRefExoticComponent<SidebarProps & import('react').RefAttributes<HTMLElement>>;
export interface SidebarNavGroupProps {
    /** Group header label (uppercase rail when expanded). */
    label: ReactNode;
    /** First group skips the top divider. */
    isFirst?: boolean;
    /** Start expanded (expanded state is local/uncontrolled). @default true */
    defaultExpanded?: boolean;
    /** SidebarNavItem children. */
    children: ReactNode;
    className?: string;
}
export declare function SidebarNavGroup({ label, isFirst, defaultExpanded, children, className, }: SidebarNavGroupProps): import("react").JSX.Element;
export interface SidebarNavItemProps {
    /** Item label (hidden when collapsed; shown in the tooltip). */
    label: ReactNode;
    /** Leading icon. */
    icon?: LucideIcon;
    /** Active (current route) styling. @default false */
    active?: boolean;
    /**
     * Router-agnostic link wrapper. Receives the computed `className` and the
     * `children` (icon + label) and must return the clickable element — e.g.
     * `render={({ className, children }) => <Link to={route} className={className}>{children}</Link>}`.
     * When omitted, a plain `<a className={className}>` is rendered.
     */
    render?: (props: {
        className: string;
        children: ReactNode;
    }) => ReactNode;
    className?: string;
}
export declare function SidebarNavItem({ label, icon, active, render, className, }: SidebarNavItemProps): import("react").JSX.Element;
//# sourceMappingURL=Sidebar.d.ts.map