import React from 'react';
import type {
  DimensionValue,
  TextInput as RNTextInput,
  TextInputProps as RNTextInputProps,
} from 'react-native';
import type { ThemeVars } from '@coinbase/cds-common/core/theme';
import type { SharedInputProps } from '@coinbase/cds-common/types/InputBaseProps';
import type { SharedAccessibilityProps } from '@coinbase/cds-common/types/SharedAccessibilityProps';
import type { SharedProps } from '@coinbase/cds-common/types/SharedProps';
import type { TextAlignProps } from '@coinbase/cds-common/types/TextBaseProps';
import { type InputStackBaseProps } from './InputStack';
export type TextInputBaseProps = SharedProps &
  Pick<
    SharedAccessibilityProps,
    'accessibilityLabel' | 'accessibilityLabelledBy' | 'accessibilityHint'
  > &
  SharedInputProps &
  Pick<
    InputStackBaseProps,
    | 'height'
    | 'variant'
    | 'width'
    | 'disabled'
    | 'borderRadius'
    | 'enableColorSurge'
    | 'focusedBorderWidth'
    | 'labelVariant'
    | 'inputBackground'
  > & {
    /**
     * Aligns text inside input and helperText
     * @default start
     */
    align?: TextAlignProps['align'];
    /**
     * Typography font token for the field (passed through to `NativeInput` as `font`), same token family as `align`.
     * @default body
     */
    font?: ThemeVars.Font;
    /**
     * Adds suffix text to the end of input
     */
    suffix?: string;
    /** Adds content to the start of the inner input. Refer to diagram for location of startNode in InputStack component */
    start?: React.ReactNode;
    /** Adds content to the end of the inner input. Refer to diagram for location of endNode in InputStack component */
    end?: React.ReactNode;
    /**
     * Add ability to test individual parts of the input
     */
    testIDMap?: {
      start?: string;
      end?: string;
      label?: string;
      helperText?: string;
    };
    /**
     * Accessibility label for helper text error icon when variant='negative'
     * @default 'error'
     */
    helperTextErrorIconAccessibilityLabel?: string;
    /**
     * React node to render label. Takes precedence over `label`.
     * @note if both labelNode and label are provided, label will still be used as accessibility label for the input if no accessibilityLabel is provided.
     */
    labelNode?: React.ReactNode;
    /**
     * Determines if the input should have a border.
     * When set to `false`, focus border styling is disabled by default.
     * @default true
     */
    bordered?: boolean;
  };
export type TextInputProps = TextInputBaseProps &
  Omit<RNTextInputProps, 'value' | 'onChange' | 'onChangeText' | 'textAlign' | 'selectionColor'> & {
    value?: RNTextInputProps['value'];
    onChange?: RNTextInputProps['onChange'];
    onChangeText?: RNTextInputProps['onChangeText'];
    /**
     * minimum height of input
     * @default auto
     */
    minHeight?: DimensionValue;
    /**
     * Native TextInput textAlign with the extra unset option to remove the textAlign style.
     * Use this to workaround the issue where long text does not ellipsis in TextInput
     */
    textAlign?: RNTextInputProps['textAlign'] | 'unset';
  };
export declare const TextInput: React.MemoExoticComponent<
  ({
    ref,
    ..._props
  }: TextInputProps & {
    ref?: React.Ref<RNTextInput>;
  }) => import('react/jsx-runtime').JSX.Element
>;
//# sourceMappingURL=TextInput.d.ts.map