import * as React from 'react';
import type { BoxProps } from '../box';
import type { WithEnhancedClassName } from '../utils/common-types';
type FieldTone = 'neutral' | 'success' | 'error' | 'loading';
type FieldMessageProps = {
    id: string;
    children: React.ReactNode;
    tone: FieldTone;
};
declare function FieldMessage({ id, children, tone }: FieldMessageProps): React.JSX.Element;
type ChildrenRenderProps = {
    id: string;
    value?: React.InputHTMLAttributes<unknown>['value'];
    'aria-describedby'?: string;
    'aria-invalid'?: true;
    onChange?: React.ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement>;
    characterCountElement?: React.ReactNode | null;
};
type HtmlInputProps<T extends HTMLElement> = React.DetailedHTMLProps<React.InputHTMLAttributes<T>, T>;
type BaseFieldVariant = 'default' | 'bordered';
type BaseFieldVariantProps = {
    /**
     * Provides alternative visual layouts or modes that the field can be rendered in.
     *
     * Namely, there are two variants supported:
     *
     * - the default one
     * - a "bordered" variant, where the border of the field surrounds also the labels, instead
     *   of just surrounding the actual field element
     *
     * In both cases, the message and description texts for the field lie outside the bordered
     * area.
     */
    variant?: BaseFieldVariant;
};
export type BaseFieldProps = WithEnhancedClassName & Pick<HtmlInputProps<HTMLInputElement>, 'id' | 'hidden' | 'maxLength' | 'aria-describedby'> & {
    /**
     * The main label for this field element.
     *
     * This prop is not optional. Consumers of field components must be explicit about not
     * wanting a label by passing `label=""` or `label={null}`. In those situations, consumers
     * should make sure that fields are properly labelled semantically by other means (e.g using
     * `aria-labelledby`, or rendering a `<label />` element referencing the field by id).
     *
     * Avoid providing interactive elements in the label. Prefer `auxiliaryLabel` for that.
     *
     * @see BaseFieldProps['auxiliaryLabel']
     */
    label: React.ReactNode;
    /**
     * The initial value for this field element.
     *
     * This prop is used to calculate the character count for the initial value, and is then
     * passed to the underlying child element.
     */
    value?: React.InputHTMLAttributes<unknown>['value'];
    /**
     * An optional extra element to be placed to the right of the main label.
     *
     * This extra element is not included in the accessible name of the field element. Its only
     * purpose is either visual, or functional (if you include interactive elements in it).
     *
     * @see BaseFieldProps['label']
     *
     * @deprecated The usage of this element is discouraged given that it was removed from the
     * latest form field spec revision.
     */
    auxiliaryLabel?: React.ReactNode;
    /**
     * A message associated with the field. It is rendered below the field, and with an
     * appearance that conveys the tone of the field (e.g. coloured red for errors, green for
     * success, etc).
     *
     * The message element is associated to the field via the `aria-describedby` attribute.
     *
     * In the future, when `aria-errormessage` gets better user agent support, we should use it
     * to associate the filed with a message when tone is `"error"`.
     *
     * @see BaseFieldProps['tone']
     * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-errormessage
     * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-invalid
     */
    message?: React.ReactNode;
    /**
     * The tone with which the message, if any, is presented.
     *
     * If the tone is `"error"`, the field border turns red, and the message, if any, is also
     * red.
     *
     * When the tone is `"loading"`, it is recommended that you also disable the field. However,
     * this is not enforced by the component. It is only a recommendation.
     *
     * @see BaseFieldProps['message']
     * @see BaseFieldProps['hint']
     */
    tone?: FieldTone;
    /**
     * The maximum width that the input field can expand to.
     */
    maxWidth?: BoxProps['maxWidth'];
    /**
     * The maximum number of characters that the input field can accept.
     * When this limit is reached, the input field will not accept any more characters.
     * The counter element will turn red when the number of characters is within 10 of the maximum limit.
     */
    maxLength?: number;
    /**
     * Used internally by components composed using `BaseField`. It is not exposed as part of
     * the public props of such components.
     */
    children: (props: ChildrenRenderProps) => React.ReactNode;
    /**
     * The position of the character count element.
     * It can be shown below the field or inline with the field.
     *
     * @default 'below'
     */
    characterCountPosition?: 'below' | 'inline' | 'hidden';
} & ({
    supportsStartAndEndSlots?: false;
    endSlot?: never;
    endSlotPosition?: never;
} | {
    supportsStartAndEndSlots: true;
    endSlot?: React.ReactElement | string | number;
    /**
     * This is solely for `bordered` variants of TextField. When set to `bottom` (the default),
     * the endSlot will be placed inline with the input field. When set to `fullHeight`, the endSlot
     * will be placed to the side of both the input field and the label.
     */
    endSlotPosition?: 'bottom' | 'fullHeight';
});
type FieldComponentProps<T extends HTMLElement> = Omit<BaseFieldProps, 'children' | 'className' | 'fieldRef' | 'variant'> & Omit<HtmlInputProps<T>, 'className' | 'style'>;
/**
 * BaseField is a base component that provides a consistent structure for form fields.
 */
declare function BaseField({ variant, label, value, auxiliaryLabel, message, tone, className, children, maxWidth, maxLength, hidden, 'aria-describedby': originalAriaDescribedBy, id: originalId, characterCountPosition, endSlot, endSlotPosition, }: BaseFieldProps & BaseFieldVariantProps & WithEnhancedClassName): React.JSX.Element;
export { BaseField, FieldMessage };
export type { BaseFieldVariant, BaseFieldVariantProps, FieldComponentProps };