@carbon/react/es/components/Search/Search.d.ts

React components for the Carbon Design System

/**
 * Copyright IBM Corp. 2016, 2025
 *
 * This source code is licensed under the Apache-2.0 license found in the
 * LICENSE file in the root directory of this source tree.
 */
import React, { type ChangeEvent, type ComponentType, type FunctionComponent, type HTMLAttributes, type KeyboardEvent, type MouseEvent, type ReactNode } from 'react';
type InputPropsBase = Omit<HTMLAttributes<HTMLInputElement>, 'onChange'>;
export interface SearchProps extends InputPropsBase {
    /**
     * Specify an optional value for the `autocomplete` property on the underlying
     * `<input>`, defaults to "off"
     */
    autoComplete?: string;
    /**
     * Specify an optional className to be applied to the container node
     */
    className?: string;
    /**
     * Specify a label to be read by screen readers on the "close" button
     */
    closeButtonLabelText?: string;
    /**
     * Optionally provide the default value of the `<input>`
     */
    defaultValue?: string | number;
    /**
     * Specify whether the `<input>` should be disabled
     */
    disabled?: boolean;
    /**
     * Specify whether or not ExpandableSearch should render expanded or not
     */
    isExpanded?: boolean;
    /**
     * Specify a custom `id` for the input
     */
    id?: string;
    /**
     * Provide the label text for the Search icon
     */
    labelText: ReactNode;
    /**
     * Optional callback called when the search value changes.
     */
    onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
    /**
     * Optional callback called when the search value is cleared.
     */
    onClear?(): void;
    /**
     * Optional callback called when the magnifier icon is clicked in ExpandableSearch.
     */
    onExpand?(e: MouseEvent<HTMLDivElement> | KeyboardEvent<HTMLDivElement>): void;
    /**
     * Provide an optional placeholder text for the Search.
     * Note: if the label and placeholder differ,
     * VoiceOver on Mac will read both
     */
    placeholder?: string;
    /**
     * A component used to render an icon.
     */
    renderIcon?: ComponentType | FunctionComponent;
    /**
     * Specify the role for the underlying `<input>`, defaults to `searchbox`
     */
    role?: string;
    /**
     * Specify the size of the Search
     */
    size?: 'sm' | 'md' | 'lg';
    /**
     * Optional prop to specify the type of the `<input>`
     */
    type?: string;
    /**
     * Specify the value of the `<input>`
     */
    value?: string | number;
}
declare const Search: React.ForwardRefExoticComponent<SearchProps & React.RefAttributes<HTMLInputElement>>;
export default Search;