react-overflow-tabs/dist/index.d.ts

A lightweight React hook for responsive tab navigation with automatic overflow handling. Works with any UI framework (Tailwind, Bootstrap, MUI, custom CSS).

import { RefObject } from 'react';

type TOverflowDirection = "start" | "end";
interface IOverflowTabsOptions<T extends HTMLElement = HTMLElement> {
    /**
     * Container element:
     * - React ref (current: T | null)
     * - or direct element (via query selector)
     */
    container: RefObject<T | null> | T;
    /**
     * Attribute name for tabs.
     * Each tab must have this attribute with a unique value.
     * Default: "data-overflow-key" or "[data-overflow-key]"
     */
    tabSelector?: string;
    disabled?: boolean;
}
interface IOverflowState {
    visibleKeys: string[];
    overflowKeys: string[];
    isOverflowing: boolean;
}

declare const useOverflowTabs: <T extends HTMLElement = HTMLElement>(options: IOverflowTabsOptions<T>) => IOverflowState;

export { type IOverflowState, type IOverflowTabsOptions, type TOverflowDirection, useOverflowTabs };