welcome-ui/dist/types/components/Search/types.d.ts

Customizable design system with react, typescript, tailwindcss and ariakit.

import { DownshiftProps } from 'downshift';
import { ComponentProps } from 'react';
import { Size } from '../../types';
import { MergeProps } from '../../utils';
import { CreateEvent } from '../../utils/create-event';
export type Item = SearchOption | SearchOptionGroup | string | unknown;
export type SearchOption = {
    label: string;
    value: string;
};
export type SearchOptionGroup = {
    label: string;
    options: SearchOption[];
};
export interface SearchOptions {
    dataTestId?: string;
    groupsEnabled?: boolean;
    hasIcon?: boolean;
    icon?: React.ReactElement;
    iconPlacement?: 'left' | 'right';
    itemToString: (item: Item) => string;
    minChars?: number;
    onChange?: (item: Item, event: CreateEvent) => void;
    renderGroupHeader?: (result: SearchOptionGroup) => React.ReactElement;
    renderItem: (item: Item) => React.ReactElement | string;
    search: (query: string) => Promise<unknown>;
    size?: Size;
    throttle?: number;
    transparent?: boolean;
    value?: Item;
    variant?: 'danger' | 'success' | 'warning';
}
export type SearchProps = MergeProps<MergeProps<SearchOptions, DownshiftProps<SearchOption>>, ComponentProps<'input'>>;