1 | import type * as React from "react";
|
2 | export interface ItemModifiers {
|
3 | /** Whether this is the "active" (focused) item, meaning keyboard interactions will act upon it. */
|
4 | active: boolean;
|
5 | /** Whether this item is disabled and should ignore interactions. */
|
6 | disabled: boolean;
|
7 | /** Whether this item matches the predicate. A typical renderer could hide `false` values. */
|
8 | matchesPredicate: boolean;
|
9 | }
|
10 | /**
|
11 | * An object describing how to render a particular item.
|
12 | * An `itemRenderer` receives the item as its first argument, and this object as its second argument.
|
13 | *
|
14 | * Make sure to forward the provided `ref` to the rendered element (usually via `<MenuItem ref={ref} />`)
|
15 | * to ensure that scrolling to active items works correctly.
|
16 | *
|
17 | * @template T type of the DOM element rendered for this item to which we can attach a ref (defaults to MenuItem's HTMLLIElement)
|
18 | */
|
19 | export interface ItemRendererProps<T extends HTMLElement = HTMLLIElement> {
|
20 | /**
|
21 | * A ref attached the native HTML element rendered by this item.
|
22 | *
|
23 | * N.B. this is optional to preserve backwards-compatibilty with @blueprintjs/select version < 4.9.0
|
24 | */
|
25 | ref?: React.Ref<T>;
|
26 | /** Click event handler to select this item. */
|
27 | handleClick: React.MouseEventHandler<HTMLElement>;
|
28 | /**
|
29 | * Focus event handler to set this as the "active" item.
|
30 | *
|
31 | * N.B. this is optional to preserve backwards-compatibility with @blueprintjs/select version < 4.2.0
|
32 | */
|
33 | handleFocus?: () => void;
|
34 | /** Index of the item in the QueryList items array. */
|
35 | index: number;
|
36 | /** Modifiers that describe how to render this item, such as `active` or `disabled`. */
|
37 | modifiers: ItemModifiers;
|
38 | /** The current query string used to filter the items. */
|
39 | query: string;
|
40 | }
|
41 | /**
|
42 | * Type alias for a function that receives an item and props and renders a JSX element (or `null`).
|
43 | *
|
44 | * @template T list item data type
|
45 | */
|
46 | export type ItemRenderer<T> = (item: T, itemProps: ItemRendererProps) => React.JSX.Element | null;
|