import React from 'react';
import type { GestureResponderEvent, TextInput as RNTextInput } from 'react-native';
import type { IconName } from '@coinbase/cds-common/types/IconName';
import { type TextInputBaseProps, type TextInputProps } from './TextInput';
export type SearchInputBaseProps = Pick<
  TextInputBaseProps,
  | 'accessibilityHint'
  | 'accessibilityLabel'
  | 'accessibilityLabelledBy'
  | 'bordered'
  | 'borderRadius'
  | 'compact'
  | 'disabled'
  | 'enableColorSurge'
  | 'focusedBorderWidth'
  | 'helperTextErrorIconAccessibilityLabel'
  | 'font'
  | 'labelFont'
  | 'labelColor'
  | 'placeholder'
  | 'testID'
  | 'testIDMap'
  | 'width'
> & {
  /**
   * Callback is fired when a user hits enter on the keyboard. Can obtain the query
   * through str parameter
   */
  onSearch?: (str: string) => void;
  /**
   * hide the start icon
   * @default false
   */
  hideStartIcon?: boolean;
  /**
   * Set the start icon. You can only
   * set it to search | backArrow icon. If
   * you set this, the icon would not toggle
   * between search and backArrow depending on
   * the focus state
   * @default search
   */
  startIcon?: Extract<IconName, 'search' | 'backArrow'>;
  /**
   * hide the end icon
   * @default undefined
   */
  hideEndIcon?: boolean;
  /**
   * Set the end node
   * @default undefined
   */
  end?: React.ReactNode;
  /**
   * Set the a11y label for the clear icon
   */
  clearIconAccessibilityLabel?: string | undefined;
  /**
   * Set the a11y label for the start icon
   */
  startIconAccessibilityLabel?: string | undefined;
};
export type SearchInputProps = SearchInputBaseProps &
  TextInputProps & {
    /** Callback is fired when the clear icon is pressed */
    onClear?: (event: GestureResponderEvent) => void;
    /**
     * Callback is fired when backArrow is pressed.
     * If disableBackArrow is true, this will do nothing
     */
    onBack?: (event: GestureResponderEvent) => void;
    /**
     * If this is set to true, the start icon won't toggle between backArrow and Search.
     * The start icon will always be a search icon
     */
    disableBackArrow?: boolean;
  };
export declare const SearchInput: React.MemoExoticComponent<
  ({
    ref,
    ..._props
  }: SearchInputProps & {
    ref?: React.Ref<RNTextInput>;
  }) => import('react/jsx-runtime').JSX.Element
>;
//# sourceMappingURL=SearchInput.d.ts.map