/**
 * @file ChatLayout.tsx
 * @input Uses React, StyleX, theme tokens, useChatStreamScroll, useChatNewMessages
 * @output Exports ChatLayout component and ChatLayoutProps
 * @position Layout shell for full chat interfaces — messages in page flow, composer fixed to bottom
 *
 * Structural layout only — scroll behavior is delegated to hooks.
 * Provides the scroll container ref and content ref, renders the
 * scroll-to-bottom button, frosted glass dock, and message area.
 *
 * Layout contract: the root is a flex column. The message area flexes
 * (grow 1, shrink 0) to fill the space the dock doesn't need; the sticky
 * dock keeps its natural height in flow. Short content therefore fills
 * exactly 100% with no overflow, and long content grows past the root so
 * self-scroll mode scrolls (#2573). In external-scrollRef mode the dock
 * is position: fixed (out of flow) and the message area fills the root.
 *
 * Density (compact/balanced/spacious) is controlled via a prop with
 * 'balanced' as the default. No JS measurement or ResizeObserver needed.
 * The container-type on root enables container queries in child components.
 *
 * SYNC: When modified, update these files to stay in sync:
 * - /packages/core/src/Chat/index.ts (exports)
 * - /apps/storybook/stories/ChatLayout.stories.tsx
 * - /packages/cli/assets/templates/blocks/components/ChatLayout/ (block examples)
 */
import { type ReactNode } from 'react';
import type { BaseProps } from '../BaseProps';
type Density = 'compact' | 'balanced' | 'spacious';
export interface ChatLayoutProps extends BaseProps<HTMLDivElement> {
    /** Ref forwarded to the root element. */
    ref?: React.Ref<HTMLDivElement>;
    /**
     * Message content — flows naturally in the page, scrolls with the page.
     * Typically ChatMessageList with ChatMessage children.
     */
    children: ReactNode;
    /**
     * Composer element — fixed to the bottom with a frosted glass dock.
     * Typically ChatComposer.
     */
    composer: ReactNode;
    /**
     * Content shown when children is empty.
     */
    emptyState?: ReactNode;
    /**
     * Scroll-to-bottom button rendered above the composer in the dock.
     * Defaults to ChatLayoutScrollButton with useChatStreamScroll.
     * Pass a custom ReactNode to override, or `null` to hide.
     */
    scrollButton?: ReactNode | null;
    /**
     * External scroll container ref. When provided, auto-scroll and
     * scroll-to-bottom target this element instead of the layout root.
     *
     * @example
     * ```
     * const scrollRef = useRef(document.documentElement);
     * <ChatLayout scrollRef={scrollRef} composer={...}>...</ChatLayout>
     * ```
     *
     * When omitted, the layout root itself is the scroll container.
     */
    scrollRef?: React.RefObject<HTMLElement | null>;
    /**
     * Layout density. Controls spacing, max-width, and blur layer sizing.
     *
     * @default 'balanced'
     */
    density?: Density;
}
export declare function ChatLayout({ children, composer, density, emptyState, scrollButton, scrollRef: externalScrollRef, xstyle, className, style, 'data-testid': testId, ref, ...rest }: ChatLayoutProps): import("react").JSX.Element;
export declare namespace ChatLayout {
    var displayName: string;
}
export {};
//# sourceMappingURL=ChatLayout.d.ts.map