@trail-ui/react
Version:
65 lines (62 loc) • 2.04 kB
TypeScript
import { SlotProps, ContextValue } from 'react-aria-components';
import * as react from 'react';
import { ReactNode } from 'react';
import { SlotsToClasses, TextFieldSlots } from '@trail-ui/theme';
import { Orientation } from '@react-types/shared';
import { AriaTextFieldProps } from 'react-aria';
import { RACValidation, DOMProps } from '../_utils/utils.js';
import 'react/jsx-runtime';
interface TextFieldProps extends Omit<AriaTextFieldProps, 'label' | 'placeholder' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, DOMProps, SlotProps {
/**
* The content to display as the labe
*/
label?: ReactNode;
/**
* The description of the text field.
*/
description?: ReactNode;
/**
* The error message of the text field.
*/
placeholder?: string;
/**
* The error icon of the text field.
*/
errorIcon?: ReactNode;
/**
* The error message of the text field.
*/
errorMessage?: ReactNode;
/**
* The error id of the text field.
*/
errorId?: string;
/**
* The axis the text field items should align with.
* @default "vertical"
*/
orientation?: Orientation;
/**
* Whether the value is invalid.
*/
isInvalid?: boolean;
/**
* React aria onChange event.
*/
onValueChange?: (value: string) => void;
/**
* Callback fired when the value is cleared.
* if you pass this prop, the clear button will be shown.
*/
onClear?: () => void;
/**
* Classes object to style the text field and its children.
*/
classNames?: SlotsToClasses<TextFieldSlots>;
}
declare const TextFieldContext: react.Context<ContextValue<TextFieldProps, HTMLDivElement>>;
/**
* A text field allows a user to enter a plain text value with a keyboard.
*/
declare const _TextField: (props: TextFieldProps & react.RefAttributes<HTMLDivElement>) => React.ReactElement | null;
export { _TextField as TextField, TextFieldContext, TextFieldProps };