import React from "react";
import { type FormFieldSize } from "../../../types/general.types.js";
import { type TextareaProps } from "./Textarea";
/**
 * Form-ready textarea component that wraps {@link Textarea} with a label, helper text,
 * and error text. This is the **recommended component for multi-line text in forms**.
 *
 * Features:
 * - Renders a native `<textarea>` — compatible with `react-hook-form` `register()` directly.
 * - Displays a label above the textarea when provided, linked to the textarea with `htmlFor`.
 * - Shows helper text or error text below the textarea with proper `aria-describedby` wiring.
 * - Automatically toggles error styling and `aria-invalid` when `errorText` is provided.
 *   A consumer-supplied `aria-invalid` is kept when there's no `errorText`.
 *
 * When to use:
 * - Use `LabeledTextarea` for notes, messages, descriptions and other free text that can
 *   span multiple lines.
 * - For single-line text, use {@link LabeledInput} instead.
 * - If you need a bare textarea without label/helper/error, use {@link Textarea} directly.
 *
 * @example
 * // With react-hook-form
 * <LabeledTextarea
 *   label="Message"
 *   helperText="The patient will see this message in the app"
 *   {...register("message")}
 * />
 *
 * @see {@link Textarea} for the low-level building block without form wiring.
 */
type Props = Omit<TextareaProps, "isError" | "isDisabled"> & {
    /**
     * The visible label, linked to the textarea with `htmlFor`. When omitted, give
     * the textarea an accessible name with `aria-label` or `aria-labelledby`.
     *
     * Besides a string, this can be a node, for example to add an icon next to
     * the text. It's rendered inside a `<label>`, so keep it phrasing content
     * (no headings or blocks) and non-interactive: interactive content would
     * become part of the field's accessible name.
     */
    label?: React.ReactNode;
    /**
     * Any additional information to show underneath the textarea.
     *
     * When given as a string, it is rendered as sanitized HTML (DOMPurify),
     * so translated copy can contain markup such as links.
     */
    helperText?: React.ReactNode;
    /**
     * An error message that should be shown when there's something wrong
     * with the user's input.
     */
    errorText?: React.ReactNode;
    /**
     * The width of the whole field: label, textarea and helper/error text.
     * Accepts the same sizes as `LabeledInput`'s `width`, including a tuple of
     * sizes per breakpoint. The textarea stretches to fill this width.
     *
     * By default the field only takes its intrinsic width.
     */
    width?: FormFieldSize | [
        FormFieldSize,
        FormFieldSize?,
        FormFieldSize?,
        FormFieldSize?,
        FormFieldSize?
    ];
    /**
     * When true, the field stretches to fill the full width of its container,
     * also when the container aligns its children to the start.
     *
     * Shorthand for `width="full"`. When both are given, `width` wins.
     */
    fullWidth?: boolean;
};
export declare const LabeledTextarea: (props: Props & {
    ref?: React.Ref<HTMLTextAreaElement>;
}) => React.JSX.Element;
export {};