import { CommonProps, type Styleable } from "@trackunit/react-components";
import { ReactNode } from "react";
export interface ModalBodyProps extends CommonProps, Styleable {
    /**
     * Content to render inside the modal body. Accepts any React nodes.
     * Typically text, lists, forms or other components.
     * When content overflows, the container becomes scrollable.
     */
    children: ReactNode | null;
    /**
     * The id of the element.
     */
    id?: string;
}
/**
 * Modal body container.
 *
 * Renders children inside a scrollable flex container. Use this component to wrap
 * the main content of a modal, which automatically handles overflow scrolling.
 *
 * @example Modal body with form content
 * ```tsx
 * import { Modal, ModalHeader, ModalBody, ModalFooter, useModal } from "@trackunit/react-modal";
 * import { TextField } from "@trackunit/react-form-components";
 *
 * const EditAssetModal = () => {
 *   const modal = useModal();
 *
 *   return (
 *     <Modal {...modal} size="medium">
 *       <ModalHeader heading="Edit Asset" onClose={modal.close} />
 *       <ModalBody>
 *         <div className="flex flex-col gap-4">
 *           <TextField label="Asset Name" name="name" />
 *           <TextField label="Serial Number" name="serial" />
 *         </div>
 *       </ModalBody>
 *       <ModalFooter
 *         cancelLabel="Cancel"
 *         onCancel={modal.close}
 *         primaryLabel="Save"
 *         primaryAction={() => console.log("Save")}
 *       />
 *     </Modal>
 *   );
 * };
 * ```
 * @param {ModalBodyProps} props Component props.
 * @param {ReactNode | null} props.children Content to render inside the modal body.
 * @param {string} [props."data-testid"] Optional test id for the container.
 * @returns {ReactElement} Modal body wrapper element.
 */
export declare const ModalBody: import("react").ForwardRefExoticComponent<ModalBodyProps & import("react").RefAttributes<HTMLDivElement>>;