import { ReactNode } from 'react';
/**
 * @description
 * The CollapsibleTitle component renders the clickable header of a Collapsible component.
 * It displays a title with an icon that rotates based on the expanded state.
 * @example
 * ```tsx
 * <Collapsible>
 *   <CollapsibleTitle>Section Title</CollapsibleTitle>
 *   <CollapsibleContent>Content</CollapsibleContent>
 * </Collapsible>
 * ```
 * @component
 * @see {@link Collapsible} - The parent component
 * @see {@link CollapsibleContent} - The content component that is shown/hidden
 */
interface CollapsibleTitleProps {
    /**
     * The content of the collapsible title.
     */
    children: ReactNode;
    /**
     * Optional content to display after the title.
     */
    suffix?: ReactNode;
}
/**
 * The title component for a Collapsible.
 *
 * This component renders a heading with a button that toggles the expanded state of the parent Collapsible.
 * It displays an icon that rotates based on the expanded state to indicate the current state.
 * @param {CollapsibleTitleProps} props - The component props
 * @param {ReactNode} props.children - The content of the title
 * @param {ReactNode} [props.suffix] - Optional content to display after the title
 * @param {React.Ref<HTMLDivElement>} ref - A ref to the underlying HTML div element
 * @returns {JSX.Element} The rendered CollapsibleTitle component
 */
declare const CollapsibleTitle: import('react').ForwardRefExoticComponent<CollapsibleTitleProps & import('react').RefAttributes<HTMLDivElement>>;
export { CollapsibleTitle };