import type { ReactElement, ReactNode, RefObject } from 'react';
import type { AsChildProps } from '../utils/AsChildProps';
import type { SetVisibilitiesReturn } from './Truncator.helpers';
import { setVisuallyHidden } from './Truncator.helpers';
/**
 * Sets the visibility of items in a horizontal truncator based on width overflow.
 * Hides items based on the truncateDirection when content exceeds container width.
 *
 * @param containerRef - Reference to the container element
 * @param moreIndicatorRef - Reference to the "more" indicator element
 * @param itemSelector - CSS selector for items to consider for truncation
 * @param protectedItemSelector - CSS selector for items that should never be hidden
 * @param expandable - Whether the truncator can be expanded to show all items
 * @param isExpanded - Current expanded state
 * @param truncateDirection - Direction to truncate from: 'ltr' (left-to-right) or 'rtl' (right-to-left, default)
 * @param setHiddenCount - Callback to update the count of hidden items
 * @returns Object containing hidden count, hidden elements, and any errors
 */
declare const setVisibilities: ({ containerRef, moreIndicatorRef, itemSelector, protectedItemSelector, expandable, isExpanded, truncateDirection, setHiddenCount, }: {
    containerRef: RefObject<HTMLElement> | undefined;
    itemSelector?: string;
    protectedItemSelector?: string;
    moreIndicatorRef: RefObject<HTMLElement> | undefined;
    expandable: boolean;
    isExpanded: boolean;
    setHiddenCount: (num: number) => void;
    truncateDirection?: "ltr" | "rtl";
}) => SetVisibilitiesReturn;
/**
 * Base component for horizontal truncation. Use `TruncatorBlockH` instead for automatic context setup.
 *
 * @param className - Additional CSS classes for the container
 * @param moreIndicator - React element to show when items are hidden (should include TruncatorMoreCount)
 * @param showMoreIndicatorTooltip - Whether to show a tooltip when hovering over the more indicator
 * @param expandable - Whether clicking the more indicator expands to show all items
 * @param items - Array of items to display, each with an element and label
 * @param asChild - Whether to render as child element instead of default div
 * @param children - Child element to render when asChild is true
 */
declare const TruncatorBlockHBase: import("react").ForwardRefExoticComponent<({
    /** Additional CSS classes for the container */
    className?: string;
    /** React element to show when items are hidden (should include TruncatorMoreCount) */
    moreIndicator: ReactElement;
    /** Whether to show a tooltip when hovering over the more indicator */
    showMoreIndicatorTooltip?: boolean;
    /** Whether clicking the more indicator expands to show all items */
    expandable?: boolean;
    /** Array of items to display, each with an element and label */
    items: {
        element: ReactElement;
        label: ReactNode;
    }[];
} & AsChildProps<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref">>) & import("react").RefAttributes<any>>;
/**
 * A horizontal truncator component that intelligently hides overflowing items when content
 * exceeds the container's width. Displays a "more" indicator showing the count of hidden items.
 *
 * **Key Features:**
 * - Width-based overflow detection (`clientWidth < scrollWidth`)
 * - Configurable truncation direction (RTL by default, or LTR)
 * - Optional expandable behavior to show all items
 * - Tooltip showing hidden items (non-expandable) or "Show more" (expandable)
 * - Full flex layout support for horizontal alignment
 *
 * **Container Requirements:**
 * - Must have a defined width constraint (e.g., `w-[400px]`, `max-w-lg`)
 * - Should use `flex` layout for proper horizontal alignment
 * - Consider adding `overflow-hidden` to parent container
 *
 * @example
 * Basic usage with width constraint
 * ```tsx
 * <TruncatorBlockH
 *   items={[
 *     { label: 'Item 1', element: <div>Item 1</div> },
 *     { label: 'Item 2', element: <div>Item 2</div> }
 *   ]}
 *   moreIndicator={<button>+<TruncatorMoreCount /> more</button>}
 *   expandable={true}
 *   className="w-[400px]"
 * />
 * ```
 *
 * @example
 * Horizontal tag list
 * ```tsx
 * <div className="w-[300px] flex">
 *   <TruncatorBlockH
 *     items={tags.map(tag => ({
 *       label: tag,
 *       element: <Badge key={tag}>{tag}</Badge>
 *     }))}
 *     moreIndicator={<Badge>+<TruncatorMoreCount /> more</Badge>}
 *   />
 * </div>
 * ```
 *
 * @example
 * Expandable breadcrumbs
 * ```tsx
 * <div className="max-w-lg flex">
 *   <TruncatorBlockH
 *     items={breadcrumbs.map(item => ({
 *       label: item,
 *       element: <button key={item}>{item}</button>
 *     }))}
 *     moreIndicator={<button>...<TruncatorMoreCount /> more</button>}
 *     expandable={true}
 *   />
 * </div>
 * ```
 */
declare const TruncatorBlockH: import("react").ForwardRefExoticComponent<Omit<{
    /** Additional CSS classes for the container */
    className?: string;
    /** React element to show when items are hidden (should include TruncatorMoreCount) */
    moreIndicator: ReactElement;
    /** Whether to show a tooltip when hovering over the more indicator */
    showMoreIndicatorTooltip?: boolean;
    /** Whether clicking the more indicator expands to show all items */
    expandable?: boolean;
    /** Array of items to display, each with an element and label */
    items: {
        element: ReactElement;
        label: ReactNode;
    }[];
} & {
    asChild: true;
    className?: string;
    children: ReactElement;
} & import("react").RefAttributes<any>, "ref"> & import("react").RefAttributes<any>>;
export { setVisibilities, setVisuallyHidden, TruncatorBlockH, TruncatorBlockHBase };