import { BoxProps, HoistProps } from '@xh/hoist/core';
/**
 * Props for {@link Box}, {@link VBox}, and {@link HBox} layout containers.
 * Combines {@link HoistProps} with {@link BoxProps} (layout attributes resolved to CSS styles).
 */
export interface BoxComponentProps extends HoistProps, BoxProps {
}
/**
 * Base flexbox container that merges all {@link LayoutProps} - margin, padding, dimensions,
 * flex, alignment, and overflow - onto a rendered `div`. This is the terminal component where
 * layout props are resolved to CSS; higher-level components pass layout props through to a
 * Box (or {@link Frame}) at the bottom of their render tree.
 *
 * **Application code should generally prefer {@link VBox} or {@link HBox}**, which make layout
 * direction explicit. Bare `box()` applies `display: flex` with the CSS default direction (row)
 * but does not communicate that intent clearly.
 */
export declare const Box: import("react").FC<BoxComponentProps>, box: import("@xh/hoist/core").ElementFactory<BoxComponentProps>;
/**
 * A {@link Box} with vertical (column) flex layout. Does not stretch to fill its parent -
 * use {@link VFrame} instead when the container should grow to consume available space.
 */
export declare const VBox: import("react").FC<BoxComponentProps>, vbox: import("@xh/hoist/core").ElementFactory<BoxComponentProps>;
/**
 * A {@link Box} with horizontal (row) flex layout. Does not stretch to fill its parent -
 * use {@link HFrame} instead when the container should grow to consume available space.
 */
export declare const HBox: import("react").FC<BoxComponentProps>, hbox: import("@xh/hoist/core").ElementFactory<BoxComponentProps>;