@workday/canvas-kit-labs-react/dist/es6/search-form/lib/SearchForm.d.ts

Canvas Kit Labs is an incubator for new and experimental components. Since we have a rather rigorous process for getting components in at a production level, it can be valuable to make them available earlier while we continuously iterate on the API/functi

import * as React from 'react';
import { GrowthBehavior } from '@workday/canvas-kit-react/common';
import { TertiaryButtonProps } from '@workday/canvas-kit-react/button';
import { SearchTheme, SearchThemeAttributes } from './themes';
export interface SearchFormProps extends GrowthBehavior, React.FormHTMLAttributes<HTMLFormElement> {
    /**
     * The function called when the SearchForm form is submitted. The current input value is passed to the callback function.
     */
    onSubmit: React.FormEventHandler<HTMLFormElement>;
    /**
     * If true, collapse the SearchForm text input into a toggle icon. Useful for responsive layouts.
     * @default false
     */
    isCollapsed?: boolean;
    /**
     * The function called when the SearchForm text input changes.
     */
    onInputChange?: React.ChangeEventHandler<HTMLInputElement>;
    /**
     * The autocomplete items of the SearchForm. This array of menu items is shown under the search bar.
     */
    autocompleteItems?: React.ReactElement<any>[];
    /**
     * The theme of the header the search input is being rendered in.
     */
    searchTheme?: SearchTheme | SearchThemeAttributes;
    /**
     * The placeholder text of the SearchForm text input.
     * @default Search
     */
    placeholder?: string;
    /**
     * The initial value of the SearchForm text input.
     */
    initialValue?: string;
    /**
     * If true, right-align the SearchForm. If false, the text input should grow to left-align the SearchForm.
     * @default false
     */
    rightAlign?: boolean;
    /**
     * The screenreader label text for the SearchForm text input.
     * @default Search
     */
    inputLabel?: string;
    /**
     * The screenreader label text for the SearchForm submit button.
     * @default Search
     */
    submitAriaLabel?: string;
    /**
     * The screenreader label text for the SearchForm clear button.
     * @default Reset Search Form
     */
    clearButtonAriaLabel?: string;
    /**
     * The screenreader label text for the button to open the collapsed SearchForm.
     * @default Open Search
     */
    openButtonAriaLabel?: string;
    /**
     * The screenreader label text for the button to close the open SearchForm.
     * @default Cancel
     */
    closeButtonAriaLabel?: string;
    /**
     * If true, render the SearchForm with a button to clear the text input.
     * @default true
     */
    showClearButton?: boolean;
    /**
     * Height of the Search Form in pixels
     * @default 40
     */
    height?: number;
    /**
     * If true, allow onSubmit being called when input value is empty.
     * @default false
     */
    allowEmptyStringSearch?: boolean;
    /**
     * Sets the `id` for the label
     * @default unique identifier
     */
    labelId?: string;
}
export interface SearchFormState {
    showForm: boolean;
    searchQuery: string;
    isFocused: boolean;
}
export declare class SearchForm extends React.Component<SearchFormProps, SearchFormState> {
    static Theme: typeof SearchTheme;
    private inputRef;
    private openRef;
    private defaultLabelId;
    state: Readonly<SearchFormState>;
    private getTheme;
    private getThemeColors;
    getIconButtonType: () => TertiaryButtonProps['variant'];
    handleSubmit: (event: React.FormEvent<HTMLFormElement>) => void;
    openCollapsedSearch: () => void;
    closeCollapsedSearch: () => void;
    componentDidUpdate(prevProps: SearchFormProps, prevState: SearchFormState): void;
    focusInput: () => void;
    focusOpen: () => void;
    handleFocus: () => void;
    handleBlur: () => void;
    handleSearchInputChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
    render(): React.JSX.Element;
}
//# sourceMappingURL=SearchForm.d.ts.map