import type { HTMLAttributes, ReactNode, ElementType } from 'react';
import type { SpaceToken } from './tokens.js';
export type ClusterAlign = 'start' | 'center' | 'end' | 'baseline' | 'stretch';
export type ClusterJustify = 'start' | 'center' | 'end' | 'between' | 'around' | 'evenly';
export interface ClusterProps extends HTMLAttributes<HTMLElement> {
    /** Gap between children. Maps to Tailwind `gap-{space}`. */
    space?: SpaceToken;
    /** Render as a different element. Defaults to `div`. */
    as?: ElementType;
    /** Align items on the cross axis. */
    align?: ClusterAlign;
    /** Distribute items along the main axis. */
    justify?: ClusterJustify;
    /** Reverse the order of children. */
    reverse?: boolean;
    /** Disable wrapping (default: true, items wrap on overflow). */
    noWrap?: boolean;
    children?: ReactNode;
}
/**
 * Horizontal cluster of items with a consistent gap, wrapping by default.
 * The canonical use case is action toolbars (`<Cluster justify="end">`),
 * badge groups, breadcrumbs, etc. Never reach for `flex flex-wrap gap-2`
 * directly — use Cluster.
 */
export declare function Cluster({ space, as: Component, align, justify, reverse, noWrap, className, children, ...rest }: ClusterProps): import("react/jsx-runtime").JSX.Element;
//# sourceMappingURL=Cluster.d.ts.map