import type { ComponentPropsWithoutRef, ReactNode, Ref } from 'react';
import { type DetailsControlBarProps } from './DetailsControlBar.js';
import type { LayoutMode } from './DetailsLayoutContext.js';
import type { ResizablePanelProps, ContentProps as SplitLayoutContentProps } from '../../split-layout/slots.js';
import type { PanelWidth } from '../../split-layout/width-utils.js';
import type { CollapsiblePanel } from '../shared/collapsible.js';
export type { DetailsControlBarProps };
/** @public */
export interface DetailsProps extends Omit<ResizablePanelProps, 'width'>, CollapsiblePanel {
    /**
     * The minimum width of the details panel, applied in both split and overlay
     * layouts. Accepts a pixel value or a percentage string.
     * @defaultValue 320
     */
    minWidth?: PanelWidth;
    /**
     * The maximum width of the details panel, applied in both split and overlay
     * layouts. Accepts a pixel value or a percentage string. The container edge is
     * always the hard ceiling. Unset by default: in split the panel is bounded by
     * the content keeping ~half the width, and in overlay only by the container.
     * In split mode, the effective maximum is also constrained by
     * `PageLayout.Content`'s `minWidth` (default `'50%'`); to allow a wider
     * details panel in split mode, lower `PageLayout.Content`'s `minWidth`
     * accordingly.
     */
    maxWidth?: PanelWidth;
    /**
     * The initial width of the details panel. Accepts a pixel value or a percentage string.
     * @defaultValue '25%'
     */
    defaultWidth?: PanelWidth;
    /**
     * Controlled width of the details panel. Accepts a pixel value or a
     * percentage string and is clamped to fit the current layout mode
     * (`minWidth`/`maxWidth`, always bounded by the available container width).
     * Pair with `onResize` to follow drag-resizing; when omitted the panel
     * manages its own width starting from `defaultWidth`.
     */
    width?: PanelWidth;
    /** The current layout mode of the details panel (controlled). */
    layout?: LayoutMode;
    /**
     * Default layout mode of the details panel (uncontrolled).
     * @defaultValue 'split'
     */
    defaultLayout?: LayoutMode;
    /** Fired when the layout mode changes or should change. */
    onLayoutChange?: (value: LayoutMode) => void;
    /**
     * Container width in pixels below which the details panel renders as an overlay instead of a split layout.
     * @defaultValue 600
     */
    breakpoint?: number;
}
/** @internal */
export type ContentProps = SplitLayoutContentProps;
/** @internal */
export interface ExtractedDetailsSlot {
    children?: ReactNode;
    config: {
        minWidth: PanelWidth;
        maxWidth?: PanelWidth;
        defaultWidth: PanelWidth;
        resizable: boolean;
        collapsed?: boolean;
        defaultCollapsed: boolean;
        onCollapsedChange?: (value: boolean) => void;
        onBreakpointTransition?: (value: boolean) => void;
        layout?: LayoutMode;
        defaultLayout: LayoutMode;
        onLayoutChange?: (value: LayoutMode) => void;
        breakpoint: number;
        onResize?: (value: number) => void;
        width?: PanelWidth;
    };
    domProps: ComponentPropsWithoutRef<'div'>;
    ref?: Ref<HTMLElement>;
}
/** @internal */
export interface ExtractedContentSlot {
    children?: ReactNode;
    config: {
        minWidth: PanelWidth;
    };
    domProps: ComponentPropsWithoutRef<'div'>;
    ref?: Ref<HTMLElement>;
}
//# sourceMappingURL=slots.d.ts.map