@codeworker.br/govbr-tw-react/dist/components/SearchBox/index.d.ts

Biblioteca de componentes React usando Tailwind CSS que implementa o Padrão Digital de Governo.

import React, { ComponentPropsWithoutRef, ReactNode } from "react";
import { VariantProps } from "class-variance-authority";
import type inputVariants from "../Input/variants";
type SearchBoxItem = Record<string, unknown>;
type KeySelector = string | ((item: SearchBoxItem) => string | undefined | null);
interface SearchBoxOptionState {
    index: number;
    isActive: boolean;
    label: string;
}
interface SearchBoxRenderProps {
    items: SearchBoxItem[];
    loading: boolean;
    error: string | null;
    query: string;
    select: (item: SearchBoxItem) => void;
    close: () => void;
    getLabel: (item: SearchBoxItem) => string;
}
export interface SearchBoxProps extends Omit<ComponentPropsWithoutRef<"input">, "children" | "value">, Pick<VariantProps<typeof inputVariants>, "density" | "variant"> {
    value?: string;
    defaultValue?: string;
    minChars?: number;
    debounce?: number;
    data?: SearchBoxItem[];
    fetchUrl?: string;
    fetchOptions?: RequestInit;
    queryParam?: string;
    labelKey?: KeySelector;
    valueKey?: KeySelector;
    transformResponse?: (response: unknown) => SearchBoxItem[];
    renderOption?: (item: SearchBoxItem, state: SearchBoxOptionState) => ReactNode;
    renderSuggestions?: (props: SearchBoxRenderProps) => ReactNode;
    onSearchChange?: (query: string) => void;
    onOptionSelect?: (item: SearchBoxItem) => void;
    getOptionKey?: (item: SearchBoxItem, index: number) => React.Key;
    emptyMessage?: string;
    loadingMessage?: string;
    errorMessage?: string;
}
declare const SearchBox: React.ForwardRefExoticComponent<SearchBoxProps & React.RefAttributes<HTMLInputElement>>;
export { SearchBox };