@payfit/unity-components
Version:
37 lines (36 loc) • 1.61 kB
TypeScript
import { VariantProps } from '@payfit/unity-themes';
import { ListBoxItemProps } from 'react-aria-components/ListBox';
export declare const autocompleteItem: import('tailwind-variants').TVReturnType<{
isDisabled: {
false: "uy:data-[hovered=\"true\"]:bg-surface-neutral-hover";
true: "uy:cursor-not-allowed";
};
}, undefined, string[], {
isDisabled: {
false: "uy:data-[hovered=\"true\"]:bg-surface-neutral-hover";
true: "uy:cursor-not-allowed";
};
}, undefined, import('tailwind-variants').TVReturnTypeLike<{
isDisabled: {
false: "uy:data-[hovered=\"true\"]:bg-surface-neutral-hover";
true: "uy:cursor-not-allowed";
};
}, undefined>>;
export interface AutocompleteItemProps extends VariantProps<typeof autocompleteItem>, Omit<ListBoxItemProps, 'className' | 'style' | 'routerOptions' | 'referrerPolicy' | 'ping' | 'target' | 'hrefLang' | 'download' | 'ref' | 'rel' | 'aria-label'> {
}
/**
* The `AutocompleteItem` component is used within the Autocomplete component to render individual items in the autocomplete results list.
* It provides styling and accessibility features for autocomplete result items.
* @example
* ```tsx
* <Autocomplete name="fruits" items={fruits}>
* {item => (
* <AutocompleteItem id={item.id} textValue={item.name} isDisabled={item.disabled}>
* {item.name}
* </AutocompleteItem>
* )}
* </Autocomplete>
* ```
*/
declare const AutocompleteItem: import('react').ForwardRefExoticComponent<AutocompleteItemProps & import('react').RefAttributes<HTMLDivElement>>;
export { AutocompleteItem };