import { RoomOptions } from '@ably/chat';
/**
 * Props for the Sidebar component
 */
export interface SidebarProps {
    /** Rooms to display. */
    roomNames: string[];
    /** Currently-active room (optional). */
    activeRoomName?: string;
    /** Ably options passed to each `ChatRoomProvider`. */
    defaultRoomOptions?: RoomOptions;
    /** Adds (or joins) a room. Should also set it active, if desired. */
    addRoom: (name: string) => void;
    /** Sets the active room. Pass `undefined` to clear. */
    setActiveRoom: (name?: string) => void;
    /** Leaves a room (and handles provider release if needed). */
    leaveRoom: (name: string) => void;
    /** Optional CSS class names for additional styling. */
    className?: string;
    /** Whether the sidebar is in collapsed mode (avatar-only). */
    isCollapsed?: boolean;
    /** Callback to toggle the collapsed state. */
    onToggleCollapse?: () => void;
}
/**
 * Sidebar component provides room navigation and management
 *
 * Features:
 * - Collapsible interface with avatar-only mode
 * - Room creation and management
 * - Theme toggle integration
 * - Active room highlighting
 * - Room count display
 *
 * @example
 * const [rooms, setRooms]   = useState<string[]>([]);
 * const [active, setActive] = useState<string>();
 *
 * const addRoom   = (name: string) => setRooms(r => r.includes(name) ? r : [...r, name]);
 * const leaveRoom = (name: string) => setRooms(r => r.filter(n => n !== name));
 *
 * <Sidebar
 *   roomNames={rooms}
 *   activeRoomName={active}
 *   defaultRoomOptions={{ rewind: 50 }}
 *   addRoom={addRoom}
 *   setActiveRoom={setActive}
 *   leaveRoom={leaveRoom}
 * />
 */
export declare const Sidebar: {
    ({ roomNames, activeRoomName, defaultRoomOptions, addRoom, setActiveRoom, leaveRoom, className, isCollapsed, onToggleCollapse, }: SidebarProps): import("react/jsx-runtime").JSX.Element;
    displayName: string;
};