infinity-ui-elements/dist/components/SearchableDropdown/SearchableDropdown.d.ts

A React TypeScript component library with Tailwind CSS design system

import * as React from "react";
import { type TextFieldProps } from "../TextField";
import { type DropdownMenuItem } from "../Dropdown/DropdownMenu";
export interface SearchableDropdownItem extends DropdownMenuItem {
    value?: string;
    [key: string]: any;
}
export interface SearchableDropdownProps extends Omit<TextFieldProps, "onChange" | "value"> {
    /**
     * Items to display in the dropdown
     */
    items?: SearchableDropdownItem[];
    /**
     * Section heading text
     */
    sectionHeading?: string;
    /**
     * Whether the dropdown is in loading state
     */
    isLoading?: boolean;
    /**
     * Empty state title
     */
    emptyTitle?: string;
    /**
     * Empty state description
     */
    emptyDescription?: string;
    /**
     * Empty state link text
     */
    emptyLinkText?: string;
    /**
     * Empty state link click handler
     */
    onEmptyLinkClick?: () => void;
    /**
     * Primary button text
     */
    primaryButtonText?: string;
    /**
     * Secondary button text
     */
    secondaryButtonText?: string;
    /**
     * Primary button click handler
     */
    onPrimaryClick?: () => void;
    /**
     * Secondary button click handler
     */
    onSecondaryClick?: () => void;
    /**
     * Dropdown menu width
     */
    dropdownWidth?: "auto" | "full";
    /**
     * Show chevron on list items
     */
    showChevron?: boolean;
    /**
     * Custom empty state icon
     */
    emptyIcon?: React.ReactNode;
    /**
     * Disable footer buttons
     */
    disableFooter?: boolean;
    /**
     * Footer layout orientation
     */
    footerLayout?: "horizontal" | "vertical";
    /**
     * Callback when search value changes
     */
    onSearchChange?: (value: string) => void;
    /**
     * Callback when item is selected
     */
    onItemSelect?: (item: SearchableDropdownItem) => void;
    /**
     * Custom filter function
     */
    filterFunction?: (item: SearchableDropdownItem, query: string) => boolean;
    /**
     * Search value (controlled)
     */
    searchValue?: string;
    /**
     * Default search value (uncontrolled)
     */
    defaultSearchValue?: string;
    /**
     * Custom class for dropdown menu
     */
    dropdownClassName?: string;
    /**
     * Minimum characters before showing dropdown
     */
    minSearchLength?: number;
    /**
     * Show dropdown on focus
     */
    showOnFocus?: boolean;
}
export declare const SearchableDropdown: React.ForwardRefExoticComponent<SearchableDropdownProps & React.RefAttributes<HTMLInputElement>>;
//# sourceMappingURL=SearchableDropdown.d.ts.map