import { CSSProperties, RefObject } from 'react';
type Params = {
    disabled?: boolean;
    titleControlsLeft?: boolean;
    rootRef: RefObject<HTMLElement>;
    versionRef: RefObject<HTMLElement>;
    padModeRef: RefObject<HTMLElement>;
    additionalControlsRef: RefObject<HTMLElement>;
    titleControlsRef: RefObject<HTMLElement>;
    chipsRef: RefObject<HTMLElement>;
    logoRef: RefObject<HTMLElement>;
    actionsRef: RefObject<HTMLElement>;
};
type ResponsivityDataItem = {
    style?: CSSProperties & Record<`--${string}`, number | string>;
    lastInLine?: boolean;
};
type ResponsivityData = {
    root?: ResponsivityDataItem;
    padMode?: ResponsivityDataItem;
    additionalControls?: ResponsivityDataItem;
    titleControls?: ResponsivityDataItem;
    chips?: ResponsivityDataItem;
    actions?: ResponsivityDataItem;
    title?: ResponsivityDataItem;
    linebreaks?: CSSProperties[];
};
/**
 * Detects when child elements stop fitting in a single header line and returns CSS orders, linebreaks, & other info for header elements
 *
 * There are several possible layouts:
 *
 * 1. Everything fits in one line
 * 2. 2 lines:
 *    [logo] [title] [version] [asset chips] [actions]
 *    [title controls] [pad mode] [additional controls]
 *    and other variants that fit into 2 lines
 * 3. 3 lines:
 *    [logo] [title] [version]
 *    [title controls] [additional controls] [actions]
 *    [pad mode] [chips]
 */
export declare const useResponsivity: ({ disabled, actionsRef, chipsRef, logoRef, rootRef, titleControlsRef, additionalControlsRef, versionRef, padModeRef, titleControlsLeft, }: Params) => ResponsivityData;
export {};
//# sourceMappingURL=useResponsivity.d.ts.map