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

Carbon react components for the MSKCC DSM

/**
 * MSKCC DSM 2021, 2024
 */
import React, { type HTMLAttributes, type ReactNode, type ComponentType, type FunctionComponent } 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?(e: {
        target: HTMLInputElement;
        type: 'change';
    }): void;
    /**
     * Optional callback called when the search value is cleared.
     */
    onClear?(): void;
    /**
     * Optional callback called when the magnifier icon is clicked in ExpandableSearch.
     */
    onExpand?(): void;
    /**
     * Provide an optional placeholder text for the Search.
     * Note: if the label and placeholder differ,
     * VoiceOver on Mac will read both
     */
    placeholder?: string;
    /**
     * Rendered icon for the Search.
     * Can be a React component class
     */
    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;
    /**
     * Specify whether the tooltip should be disabled
     */
    disableTooltip?: boolean;
}
declare const Search: React.ForwardRefExoticComponent<SearchProps & React.RefAttributes<HTMLInputElement>>;
export default Search;