import "./form_field.css";
import type * as React from "react";
import { Field } from "@base-ui/react/field";
import { type StyleProps } from "./style_props";
/**
 * `stacked` keeps a row of fields level; `beside` sets the label in a column left of its control, as a
 * record's section reads down a wide column; `control-first` leads with a boolean, centred on the label
 * until a description adds a line.
 */
export type FormFieldLayout = "stacked" | "beside" | "control-first";
/**
 * How wide the control stands, by what its value holds: `fill` takes its column — words, prose, a web
 * address, a linked row; `short` a value held in a few characters or one choice — a number, money, a
 * percent, a day, a select — beside its label at the short control width, never stretched across a
 * reading column. Stacked, every control takes its column (a phone's, or a pair's).
 */
export type FormFieldMeasure = "fill" | "short";
/**
 * How a surface sets its fields — a record's section, beside on a wide column — taken by every field inside
 * it that states no `layout`, so an act's asks at the section's foot read as its fields do. `reads`: every
 * field it sets is a read, none a control, so a read rests at its words' pitch rather than a control's, and
 * on a phone a stacked one reads its label and value on one line where both fit.
 */
export declare const FormFieldLayoutContext: React.Context<{
    layout: FormFieldLayout;
    reads?: boolean | undefined;
} | undefined>;
export interface FormFieldProps extends StyleProps {
    label: string;
    /**
     * Marked: a form marks its optional fields and leaves the required ones unmarked, so the mark means one
     * thing on every form. Refusing empty is validation's job.
     */
    optional?: boolean;
    /** Marked where a surface states what is still owed (an empty required fact), never on a form's fields. */
    required?: boolean;
    description?: string;
    /** Amber, between the muted `description` and the danger `error`. As on `DetailRow`. */
    warning?: string;
    error?: string;
    /** Default the surface's (`FormFieldLayoutContext`), else `stacked`. */
    layout?: FormFieldLayout;
    /** Spans its form grid's row; the grid cannot know what a child holds. Inert outside one. */
    span?: boolean;
    /** The body is a value read, not a control, flush left. `row` is a linked row read over its line: seated as a
     *  control seats its content, so its title stands where the picker's chosen row stands. */
    readOnly?: boolean | "row";
    /** Default `fill` (`FormFieldMeasure`). */
    measure?: FormFieldMeasure;
    /** The mark's word, drawn only where `optional` or `required`. */
    markLabel?: string;
    testID?: string;
    ref?: React.Ref<HTMLDivElement>;
    render?: React.ComponentProps<typeof Field.Root>["render"];
}
/**
 * Ties label, description, warning and error to the wrapped input. A Base UI control needs only
 * `inputId`.
 */
export interface FormFieldBinding {
    inputId: string;
    labelId: string;
    descriptionId: string | undefined;
    warningId: string | undefined;
    errorId: string | undefined;
    invalid: boolean;
}
/** `null` outside a field, where the caller owes an `accessibilityLabel`. */
export declare function useFormField(): FormFieldBinding | null;
/**
 * Throws on a nameless interactive control, which renders and operates while announcing nothing.
 * Call after the caller's hooks.
 */
export declare function assertNamedControl(component: string, binding: FormFieldBinding | null, accessibilityLabel: string | undefined): void;
/**
 * Label, optional marker and three annotation tones around any control, over Base UI's `Field`,
 * which wires Base UI controls itself.
 */
export declare function FormField(props: FormFieldProps & {
    children: React.ReactNode;
}): React.JSX.Element;
/**
 * A FIELD'S VALUE STATES ITS OWN ACTS — a list's add — and its field places them: at the end of the label's line
 * where the label stands over the value (a phone, a narrow drawer); on the value's own first line, at its end,
 * where the label stands beside it — level with that label — or where there is no field. Drawn inside the value.
 */
export declare function FormFieldActs({ children }: {
    children: React.ReactNode;
}): React.JSX.Element | null;