/** * Enhanced TextInput component with focus state support for focus: modifier * * This component wraps React Native's TextInput and manages focus state internally, * allowing the style prop to be a function that receives { focused: boolean }. * * @example * ```tsx * import { TextInput } from '@mgcrea/react-native-tailwind'; * * * ``` */ import { type BlurEvent, type FocusEvent, TextInput as RNTextInput, type TextInputProps as RNTextInputProps } from "react-native"; import { type Simplify } from "../types/util"; export type TextInputProps = Simplify & { /** * Style can be a static style object/array or a function that receives focus and disabled state */ style?: RNTextInputProps["style"] | ((state: { focused: boolean; disabled: boolean; }) => RNTextInputProps["style"]); className?: string; /** * Convenience prop for disabled state (overrides editable if provided) * When true, sets editable to false */ disabled?: boolean; }>; /** * Enhanced TextInput with focus and disabled state support * * Manages focus state internally and passes it to style functions, * enabling the use of focus: and disabled: modifiers in className. * * Note: TextInput uses `editable` prop internally. You can pass either: * - `disabled={true}` - convenience prop (sets editable to false) * - `editable={false}` - React Native's native prop * If both are provided, `disabled` takes precedence. */ export declare const TextInput: import("react").ForwardRefExoticComponent<{ value?: string | undefined | undefined; textAlign?: "left" | "center" | "right" | undefined | undefined; placeholder?: string | undefined | undefined; children?: import("react").ReactNode; hitSlop?: number | import("react-native").Insets | null | undefined; id?: string | undefined | undefined; needsOffscreenAlphaCompositing?: boolean | undefined | undefined; onLayout?: ((event: import("react-native").LayoutChangeEvent) => void) | undefined | undefined; pointerEvents?: "box-none" | "none" | "box-only" | "auto" | undefined | undefined; removeClippedSubviews?: boolean | undefined | undefined; testID?: string | undefined | undefined; nativeID?: string | undefined | undefined; collapsable?: boolean | undefined | undefined; collapsableChildren?: boolean | undefined | undefined; className?: string | undefined; onBlur?: ((e: BlurEvent) => void) | undefined | undefined; onFocus?: ((e: FocusEvent) => void) | undefined | undefined; renderToHardwareTextureAndroid?: boolean | undefined | undefined; focusable?: boolean | undefined | undefined; tabIndex?: 0 | -1 | undefined | undefined; shouldRasterizeIOS?: boolean | undefined | undefined; isTVSelectable?: boolean | undefined | undefined; hasTVPreferredFocus?: boolean | undefined | undefined; tvParallaxShiftDistanceX?: number | undefined | undefined; tvParallaxShiftDistanceY?: number | undefined | undefined; tvParallaxTiltAngle?: number | undefined | undefined; tvParallaxMagnification?: number | undefined | undefined; onStartShouldSetResponder?: ((event: import("react-native").GestureResponderEvent) => boolean) | undefined | undefined; onMoveShouldSetResponder?: ((event: import("react-native").GestureResponderEvent) => boolean) | undefined | undefined; onResponderEnd?: ((event: import("react-native").GestureResponderEvent) => void) | undefined | undefined; onResponderGrant?: ((event: import("react-native").GestureResponderEvent) => void) | undefined | undefined; onResponderReject?: ((event: import("react-native").GestureResponderEvent) => void) | undefined | undefined; onResponderMove?: ((event: import("react-native").GestureResponderEvent) => void) | undefined | undefined; onResponderRelease?: ((event: import("react-native").GestureResponderEvent) => void) | undefined | undefined; onResponderStart?: ((event: import("react-native").GestureResponderEvent) => void) | undefined | undefined; onResponderTerminationRequest?: ((event: import("react-native").GestureResponderEvent) => boolean) | undefined | undefined; onResponderTerminate?: ((event: import("react-native").GestureResponderEvent) => void) | undefined | undefined; onStartShouldSetResponderCapture?: ((event: import("react-native").GestureResponderEvent) => boolean) | undefined | undefined; onMoveShouldSetResponderCapture?: ((event: import("react-native").GestureResponderEvent) => boolean) | undefined | undefined; onTouchStart?: ((event: import("react-native").GestureResponderEvent) => void) | undefined | undefined; onTouchMove?: ((event: import("react-native").GestureResponderEvent) => void) | undefined | undefined; onTouchEnd?: ((event: import("react-native").GestureResponderEvent) => void) | undefined | undefined; onTouchCancel?: ((event: import("react-native").GestureResponderEvent) => void) | undefined | undefined; onTouchEndCapture?: ((event: import("react-native").GestureResponderEvent) => void) | undefined | undefined; onPointerEnter?: ((event: import("react-native").PointerEvent) => void) | undefined | undefined; onPointerEnterCapture?: ((event: import("react-native").PointerEvent) => void) | undefined | undefined; onPointerLeave?: ((event: import("react-native").PointerEvent) => void) | undefined | undefined; onPointerLeaveCapture?: ((event: import("react-native").PointerEvent) => void) | undefined | undefined; onPointerMove?: ((event: import("react-native").PointerEvent) => void) | undefined | undefined; onPointerMoveCapture?: ((event: import("react-native").PointerEvent) => void) | undefined | undefined; onPointerCancel?: ((event: import("react-native").PointerEvent) => void) | undefined | undefined; onPointerCancelCapture?: ((event: import("react-native").PointerEvent) => void) | undefined | undefined; onPointerDown?: ((event: import("react-native").PointerEvent) => void) | undefined | undefined; onPointerDownCapture?: ((event: import("react-native").PointerEvent) => void) | undefined | undefined; onPointerUp?: ((event: import("react-native").PointerEvent) => void) | undefined | undefined; onPointerUpCapture?: ((event: import("react-native").PointerEvent) => void) | undefined | undefined; accessible?: boolean | undefined | undefined; accessibilityActions?: readonly Readonly<{ name: import("react-native").AccessibilityActionName | string; label?: string | undefined; }>[] | undefined; accessibilityLabel?: string | undefined | undefined; 'aria-label'?: string | undefined | undefined; accessibilityRole?: import("react-native").AccessibilityRole | undefined; accessibilityState?: import("react-native").AccessibilityState | undefined; 'aria-busy'?: boolean | undefined | undefined; 'aria-checked'?: boolean | "mixed" | undefined | undefined; 'aria-disabled'?: boolean | undefined | undefined; 'aria-expanded'?: boolean | undefined | undefined; 'aria-selected'?: boolean | undefined | undefined; accessibilityHint?: string | undefined | undefined; accessibilityValue?: import("react-native").AccessibilityValue | undefined; 'aria-valuemax'?: number | undefined; 'aria-valuemin'?: number | undefined; 'aria-valuenow'?: number | undefined; 'aria-valuetext'?: string | undefined; onAccessibilityAction?: ((event: import("react-native").AccessibilityActionEvent) => void) | undefined | undefined; importantForAccessibility?: ("auto" | "yes" | "no" | "no-hide-descendants") | undefined | undefined; 'aria-hidden'?: boolean | undefined | undefined; 'aria-modal'?: boolean | undefined | undefined; role?: import("react-native").Role | undefined; accessibilityLabelledBy?: string | string[] | undefined | undefined; 'aria-labelledby'?: string | undefined | undefined; accessibilityLiveRegion?: "none" | "polite" | "assertive" | undefined | undefined; 'aria-live'?: ("polite" | "assertive" | "off") | undefined | undefined; screenReaderFocusable?: boolean | undefined | undefined; accessibilityElementsHidden?: boolean | undefined | undefined; accessibilityViewIsModal?: boolean | undefined | undefined; onAccessibilityEscape?: (() => void) | undefined | undefined; onAccessibilityTap?: (() => void) | undefined | undefined; onMagicTap?: (() => void) | undefined | undefined; accessibilityIgnoresInvertColors?: boolean | undefined | undefined; accessibilityLanguage?: string | undefined | undefined; accessibilityShowsLargeContentViewer?: boolean | undefined | undefined; accessibilityLargeContentTitle?: string | undefined | undefined; accessibilityRespondsToUserInteraction?: boolean | undefined | undefined; onPress?: ((e: import("react-native").NativeSyntheticEvent) => void) | undefined | undefined; onPressIn?: ((e: import("react-native").NativeSyntheticEvent) => void) | undefined | undefined; onPressOut?: ((e: import("react-native").NativeSyntheticEvent) => void) | undefined | undefined; allowFontScaling?: boolean | undefined | undefined; autoCapitalize?: "none" | "sentences" | "words" | "characters" | undefined | undefined; autoComplete?: "additional-name" | "address-line1" | "address-line2" | "birthdate-day" | "birthdate-full" | "birthdate-month" | "birthdate-year" | "cc-csc" | "cc-exp" | "cc-exp-day" | "cc-exp-month" | "cc-exp-year" | "cc-number" | "cc-name" | "cc-given-name" | "cc-middle-name" | "cc-family-name" | "cc-type" | "country" | "current-password" | "email" | "family-name" | "gender" | "given-name" | "honorific-prefix" | "honorific-suffix" | "name" | "name-family" | "name-given" | "name-middle" | "name-middle-initial" | "name-prefix" | "name-suffix" | "new-password" | "nickname" | "one-time-code" | "organization" | "organization-title" | "password" | "password-new" | "postal-address" | "postal-address-country" | "postal-address-extended" | "postal-address-extended-postal-code" | "postal-address-locality" | "postal-address-region" | "postal-code" | "street-address" | "sms-otp" | "tel" | "tel-country-code" | "tel-national" | "tel-device" | "url" | "username" | "username-new" | "off" | undefined | undefined; autoCorrect?: boolean | undefined | undefined; autoFocus?: boolean | undefined | undefined; blurOnSubmit?: boolean | undefined | undefined; submitBehavior?: import("react-native").SubmitBehavior | undefined; caretHidden?: boolean | undefined | undefined; contextMenuHidden?: boolean | undefined | undefined; defaultValue?: string | undefined | undefined; editable?: boolean | undefined | undefined; keyboardType?: import("react-native").KeyboardTypeOptions | undefined; inputMode?: import("react-native").InputModeOptions | undefined; maxLength?: number | undefined | undefined; multiline?: boolean | undefined | undefined; onChange?: ((e: import("react-native").TextInputChangeEvent) => void) | undefined | undefined; onChangeText?: ((text: string) => void) | undefined | undefined; onContentSizeChange?: ((e: import("react-native").TextInputContentSizeChangeEvent) => void) | undefined | undefined; onEndEditing?: ((e: import("react-native").TextInputEndEditingEvent) => void) | undefined | undefined; onSelectionChange?: ((e: import("react-native").TextInputSelectionChangeEvent) => void) | undefined | undefined; onSubmitEditing?: ((e: import("react-native").TextInputSubmitEditingEvent) => void) | undefined | undefined; onScroll?: ((e: import("react-native").TextInputScrollEvent) => void) | undefined | undefined; onKeyPress?: ((e: import("react-native").TextInputKeyPressEvent) => void) | undefined | undefined; placeholderTextColor?: import("react-native").ColorValue | undefined; readOnly?: boolean | undefined | undefined; returnKeyType?: import("react-native").ReturnKeyTypeOptions | undefined; enterKeyHint?: import("react-native").EnterKeyHintTypeOptions | undefined; secureTextEntry?: boolean | undefined | undefined; selectTextOnFocus?: boolean | undefined | undefined; selection?: { start: number; end?: number | undefined; } | undefined | undefined; selectionColor?: import("react-native").ColorValue | undefined; inputAccessoryViewID?: string | undefined | undefined; inputAccessoryViewButtonLabel?: string | undefined | undefined; maxFontSizeMultiplier?: number | null | undefined | undefined; disableKeyboardShortcuts?: boolean | undefined | undefined; clearButtonMode?: "never" | "while-editing" | "unless-editing" | "always" | undefined | undefined; clearTextOnFocus?: boolean | undefined | undefined; dataDetectorTypes?: import("react-native").DataDetectorTypes | import("react-native").DataDetectorTypes[] | undefined; enablesReturnKeyAutomatically?: boolean | undefined | undefined; keyboardAppearance?: "default" | "light" | "dark" | undefined | undefined; passwordRules?: string | null | undefined | undefined; rejectResponderTermination?: boolean | null | undefined | undefined; selectionState?: import("react-native").DocumentSelectionState | undefined; spellCheck?: boolean | undefined | undefined; textContentType?: "none" | "URL" | "addressCity" | "addressCityAndState" | "addressState" | "countryName" | "creditCardNumber" | "creditCardExpiration" | "creditCardExpirationMonth" | "creditCardExpirationYear" | "creditCardSecurityCode" | "creditCardType" | "creditCardName" | "creditCardGivenName" | "creditCardMiddleName" | "creditCardFamilyName" | "emailAddress" | "familyName" | "fullStreetAddress" | "givenName" | "jobTitle" | "location" | "middleName" | "name" | "namePrefix" | "nameSuffix" | "nickname" | "organizationName" | "postalCode" | "streetAddressLine1" | "streetAddressLine2" | "sublocality" | "telephoneNumber" | "username" | "password" | "newPassword" | "oneTimeCode" | "birthdate" | "birthdateDay" | "birthdateMonth" | "birthdateYear" | "cellularEID" | "cellularIMEI" | "dateTime" | "flightNumber" | "shipmentTrackingNumber" | undefined | undefined; scrollEnabled?: boolean | undefined | undefined; lineBreakStrategyIOS?: "none" | "standard" | "hangul-word" | "push-out" | undefined | undefined; lineBreakModeIOS?: "wordWrapping" | "char" | "clip" | "head" | "middle" | "tail" | undefined | undefined; smartInsertDelete?: boolean | undefined | undefined; cursorColor?: import("react-native").ColorValue | null | undefined; selectionHandleColor?: import("react-native").ColorValue | null | undefined; importantForAutofill?: "auto" | "no" | "noExcludeDescendants" | "yes" | "yesExcludeDescendants" | undefined | undefined; disableFullscreenUI?: boolean | undefined | undefined; inlineImageLeft?: string | undefined | undefined; inlineImagePadding?: number | undefined | undefined; numberOfLines?: number | undefined | undefined; returnKeyLabel?: string | undefined | undefined; textBreakStrategy?: "simple" | "highQuality" | "balanced" | undefined | undefined; underlineColorAndroid?: import("react-native").ColorValue | undefined; textAlignVertical?: "auto" | "top" | "bottom" | "center" | undefined | undefined; showSoftInputOnFocus?: boolean | undefined | undefined; verticalAlign?: "auto" | "top" | "bottom" | "middle" | undefined | undefined; style?: import("react-native").StyleProp | ((state: { focused: boolean; disabled: boolean; }) => RNTextInputProps["style"]); disabled?: boolean | undefined; } & import("react").RefAttributes>;