import { type ReactNode, type RefObject } from 'react';
export interface CommentComposerDraft {
    title: string;
    body: string;
}
export interface CommentComposerProps {
    /**
     * Show the title field. The vendor section's comments are titled reviews;
     * a design-doc comment is a Slack message, so it passes `false`.
     */
    withTitle?: boolean;
    titleLabel?: string;
    titlePlaceholder?: string;
    /** For hosts whose empty state focuses the composer ("Be the first!"). */
    titleRef?: RefObject<HTMLInputElement | null>;
    bodyLabel?: string;
    placeholder?: string;
    /** Extra controls under the box — design docs put the comment-type chips here. */
    extras?: ReactNode;
    submitLabel?: string;
    cancelLabel?: string;
    onCancel?: () => void;
    pending?: boolean;
    /** Accessible name for the body control when there is no visible label. */
    ariaLabel?: string;
    /**
     * Return `false` to KEEP the draft — a failed post must never lose what the
     * person typed. Anything else clears it.
     */
    onSubmit: (draft: CommentComposerDraft) => void | boolean | Promise<void | boolean>;
}
/**
 * THE comment composer: one bordered box with the field(s) inside and Send
 * beside it (stacked on mobile).
 *
 * One component for every comment surface — the vendor page and the design-doc
 * threads — so the two cannot drift in shape, spacing or submit behaviour. It
 * owns its own draft state, which is what lets both hosts stop hand-rolling
 * one (the vendor page kept title and body in a single newline-joined string).
 */
export declare function CommentComposer({ withTitle, titleLabel, titlePlaceholder, titleRef, bodyLabel, placeholder, extras, submitLabel, cancelLabel, onCancel, pending, ariaLabel, onSubmit, }: CommentComposerProps): import("react").JSX.Element;
//# sourceMappingURL=comment-composer.d.ts.map