Backstage
    Preparing search index...

    Interface MenuAutocompleteListBoxProps<T>

    interface MenuAutocompleteListBoxProps<T> {
        "aria-describedby"?: string;
        "aria-details"?: string;
        "aria-label"?: string;
        "aria-labelledby"?: string;
        autoFocus?: boolean | FocusStrategy;
        children?: ReactNode | ((item: T) => ReactNode);
        className?: ClassNameOrFunction<ListBoxRenderProps>;
        defaultSelectedKeys?: "all" | Iterable<Key, any, any>;
        dependencies?: readonly any[];
        dir?: string;
        disabledKeys?: Iterable<Key, any, any>;
        disallowEmptySelection?: boolean;
        dragAndDropHooks?: DragAndDropHooks<NoInfer<T>>;
        escapeKeyBehavior?: "none" | "clearSelection";
        hidden?: boolean;
        id?: string;
        inert?: boolean;
        items?: Iterable<T, any, any>;
        lang?: string;
        layout?: "grid" | "stack";
        maxHeight?: string;
        maxWidth?: string;
        onAction?: (key: Key) => void;
        onAnimationEnd?: AnimationEventHandler<HTMLDivElement>;
        onAnimationEndCapture?: AnimationEventHandler<HTMLDivElement>;
        onAnimationIteration?: AnimationEventHandler<HTMLDivElement>;
        onAnimationIterationCapture?: AnimationEventHandler<HTMLDivElement>;
        onAnimationStart?: AnimationEventHandler<HTMLDivElement>;
        onAnimationStartCapture?: AnimationEventHandler<HTMLDivElement>;
        onAuxClick?: MouseEventHandler<HTMLDivElement>;
        onAuxClickCapture?: MouseEventHandler<HTMLDivElement>;
        onBlur?: (e: FocusEvent<Element>) => void;
        onClick?: MouseEventHandler<HTMLDivElement>;
        onClickCapture?: MouseEventHandler<HTMLDivElement>;
        onContextMenu?: MouseEventHandler<HTMLDivElement>;
        onContextMenuCapture?: MouseEventHandler<HTMLDivElement>;
        onDoubleClick?: MouseEventHandler<HTMLDivElement>;
        onDoubleClickCapture?: MouseEventHandler<HTMLDivElement>;
        onFocus?: (e: FocusEvent<Element>) => void;
        onFocusChange?: (isFocused: boolean) => void;
        onGotPointerCapture?: PointerEventHandler<HTMLDivElement>;
        onGotPointerCaptureCapture?: PointerEventHandler<HTMLDivElement>;
        onLostPointerCapture?: PointerEventHandler<HTMLDivElement>;
        onLostPointerCaptureCapture?: PointerEventHandler<HTMLDivElement>;
        onMouseDown?: MouseEventHandler<HTMLDivElement>;
        onMouseDownCapture?: MouseEventHandler<HTMLDivElement>;
        onMouseEnter?: MouseEventHandler<HTMLDivElement>;
        onMouseLeave?: MouseEventHandler<HTMLDivElement>;
        onMouseMove?: MouseEventHandler<HTMLDivElement>;
        onMouseMoveCapture?: MouseEventHandler<HTMLDivElement>;
        onMouseOut?: MouseEventHandler<HTMLDivElement>;
        onMouseOutCapture?: MouseEventHandler<HTMLDivElement>;
        onMouseOver?: MouseEventHandler<HTMLDivElement>;
        onMouseOverCapture?: MouseEventHandler<HTMLDivElement>;
        onMouseUp?: MouseEventHandler<HTMLDivElement>;
        onMouseUpCapture?: MouseEventHandler<HTMLDivElement>;
        onPointerCancel?: PointerEventHandler<HTMLDivElement>;
        onPointerCancelCapture?: PointerEventHandler<HTMLDivElement>;
        onPointerDown?: PointerEventHandler<HTMLDivElement>;
        onPointerDownCapture?: PointerEventHandler<HTMLDivElement>;
        onPointerEnter?: PointerEventHandler<HTMLDivElement>;
        onPointerLeave?: PointerEventHandler<HTMLDivElement>;
        onPointerMove?: PointerEventHandler<HTMLDivElement>;
        onPointerMoveCapture?: PointerEventHandler<HTMLDivElement>;
        onPointerOut?: PointerEventHandler<HTMLDivElement>;
        onPointerOutCapture?: PointerEventHandler<HTMLDivElement>;
        onPointerOver?: PointerEventHandler<HTMLDivElement>;
        onPointerOverCapture?: PointerEventHandler<HTMLDivElement>;
        onPointerUp?: PointerEventHandler<HTMLDivElement>;
        onPointerUpCapture?: PointerEventHandler<HTMLDivElement>;
        onScroll?: UIEventHandler<HTMLDivElement>;
        onScrollCapture?: UIEventHandler<HTMLDivElement>;
        onSelectionChange?: (keys: Selection) => void;
        onTouchCancel?: TouchEventHandler<HTMLDivElement>;
        onTouchCancelCapture?: TouchEventHandler<HTMLDivElement>;
        onTouchEnd?: TouchEventHandler<HTMLDivElement>;
        onTouchEndCapture?: TouchEventHandler<HTMLDivElement>;
        onTouchMove?: TouchEventHandler<HTMLDivElement>;
        onTouchMoveCapture?: TouchEventHandler<HTMLDivElement>;
        onTouchStart?: TouchEventHandler<HTMLDivElement>;
        onTouchStartCapture?: TouchEventHandler<HTMLDivElement>;
        onTransitionCancel?: TransitionEventHandler<HTMLDivElement>;
        onTransitionCancelCapture?: TransitionEventHandler<HTMLDivElement>;
        onTransitionEnd?: TransitionEventHandler<HTMLDivElement>;
        onTransitionEndCapture?: TransitionEventHandler<HTMLDivElement>;
        onTransitionRun?: TransitionEventHandler<HTMLDivElement>;
        onTransitionRunCapture?: TransitionEventHandler<HTMLDivElement>;
        onTransitionStart?: TransitionEventHandler<HTMLDivElement>;
        onTransitionStartCapture?: TransitionEventHandler<HTMLDivElement>;
        onWheel?: WheelEventHandler<HTMLDivElement>;
        onWheelCapture?: WheelEventHandler<HTMLDivElement>;
        orientation?: Orientation;
        placeholder?: string;
        placement?: Placement;
        renderEmptyState?: (props: ListBoxRenderProps) => ReactNode;
        selectedKeys?: "all" | Iterable<Key, any, any>;
        selectionBehavior?: SelectionBehavior;
        selectionMode?: SelectionMode;
        shouldFocusOnHover?: boolean;
        shouldFocusWrap?: boolean;
        shouldSelectOnPressUp?: boolean;
        slot?: string | null;
        style?: StyleOrFunction<ListBoxRenderProps>;
        translate?: "yes" | "no";
        virtualized?: boolean;
    }

    Type Parameters

    • T

    Hierarchy

    • ListBoxProps<T>
    • Omit<RAListBoxProps<T>, "children">
      • MenuAutocompleteListBoxProps
    Index

    Properties

    aria-describedby? aria-details? aria-label? aria-labelledby? autoFocus? children? className? defaultSelectedKeys? dependencies? dir? disabledKeys? disallowEmptySelection? dragAndDropHooks? escapeKeyBehavior? hidden? id? inert? items? lang? layout? maxHeight? maxWidth? onAction? onAnimationEnd? onAnimationEndCapture? onAnimationIteration? onAnimationIterationCapture? onAnimationStart? onAnimationStartCapture? onAuxClick? onAuxClickCapture? onBlur? onClick? onClickCapture? onContextMenu? onContextMenuCapture? onDoubleClick? onDoubleClickCapture? onFocus? onFocusChange? onGotPointerCapture? onGotPointerCaptureCapture? onLostPointerCapture? onLostPointerCaptureCapture? onMouseDown? onMouseDownCapture? onMouseEnter? onMouseLeave? onMouseMove? onMouseMoveCapture? onMouseOut? onMouseOutCapture? onMouseOver? onMouseOverCapture? onMouseUp? onMouseUpCapture? onPointerCancel? onPointerCancelCapture? onPointerDown? onPointerDownCapture? onPointerEnter? onPointerLeave? onPointerMove? onPointerMoveCapture? onPointerOut? onPointerOutCapture? onPointerOver? onPointerOverCapture? onPointerUp? onPointerUpCapture? onScroll? onScrollCapture? onSelectionChange? onTouchCancel? onTouchCancelCapture? onTouchEnd? onTouchEndCapture? onTouchMove? onTouchMoveCapture? onTouchStart? onTouchStartCapture? onTransitionCancel? onTransitionCancelCapture? onTransitionEnd? onTransitionEndCapture? onTransitionRun? onTransitionRunCapture? onTransitionStart? onTransitionStartCapture? onWheel? onWheelCapture? orientation? placeholder? placement? renderEmptyState? selectedKeys? selectionBehavior? selectionMode? shouldFocusOnHover? shouldFocusWrap? shouldSelectOnPressUp? slot? style? translate? virtualized?

    Properties

    "aria-describedby"?: string

    Identifies the element (or elements) that describes the object.

    "aria-details"?: string

    Identifies the element (or elements) that provide a detailed, extended description for the object.

    "aria-label"?: string

    Defines a string value that labels the current element.

    "aria-labelledby"?: string

    Identifies the element (or elements) that labels the current element.

    autoFocus?: boolean | FocusStrategy

    Whether to auto focus the listbox or an option.

    children?: ReactNode | ((item: T) => ReactNode)

    The contents of the collection.

    className?: ClassNameOrFunction<ListBoxRenderProps>

    The CSS className for the element. A function may be provided to compute the class based on component state.

    defaultSelectedKeys?: "all" | Iterable<Key, any, any>

    The initial selected keys in the collection (uncontrolled).

    dependencies?: readonly any[]

    Values that should invalidate the item cache when using dynamic collections.

    dir?: string
    disabledKeys?: Iterable<Key, any, any>

    The item keys that are disabled. These items cannot be selected, focused, or otherwise interacted with.

    disallowEmptySelection?: boolean

    Whether the collection allows empty selection.

    dragAndDropHooks?: DragAndDropHooks<NoInfer<T>>

    The drag and drop hooks returned by useDragAndDrop used to enable drag and drop behavior for the ListBox.

    escapeKeyBehavior?: "none" | "clearSelection"

    Whether pressing the escape key should clear selection in the listbox or not.

    Most experiences should not modify this option as it eliminates a keyboard user's ability to easily clear selection. Only use if the escape key is being handled externally or should not trigger selection clearing contextually.

    'clearSelection'
    
    hidden?: boolean
    id?: string

    The element's unique identifier. See MDN.

    inert?: boolean
    items?: Iterable<T, any, any>

    Item objects in the collection.

    lang?: string
    layout?: "grid" | "stack"

    Whether the items are arranged in a stack or grid.

    'stack'
    
    maxHeight?: string
    maxWidth?: string
    onAction?: (key: Key) => void

    Handler that is called when a user performs an action on an item. The exact user event depends on the collection's selectionBehavior prop and the interaction modality.

    onAnimationEnd?: AnimationEventHandler<HTMLDivElement>
    onAnimationEndCapture?: AnimationEventHandler<HTMLDivElement>
    onAnimationIteration?: AnimationEventHandler<HTMLDivElement>
    onAnimationIterationCapture?: AnimationEventHandler<HTMLDivElement>
    onAnimationStart?: AnimationEventHandler<HTMLDivElement>
    onAnimationStartCapture?: AnimationEventHandler<HTMLDivElement>
    onAuxClick?: MouseEventHandler<HTMLDivElement>
    onAuxClickCapture?: MouseEventHandler<HTMLDivElement>
    onBlur?: (e: FocusEvent<Element>) => void

    Handler that is called when the element loses focus.

    onClick?: MouseEventHandler<HTMLDivElement>
    onClickCapture?: MouseEventHandler<HTMLDivElement>
    onContextMenu?: MouseEventHandler<HTMLDivElement>
    onContextMenuCapture?: MouseEventHandler<HTMLDivElement>
    onDoubleClick?: MouseEventHandler<HTMLDivElement>
    onDoubleClickCapture?: MouseEventHandler<HTMLDivElement>
    onFocus?: (e: FocusEvent<Element>) => void

    Handler that is called when the element receives focus.

    onFocusChange?: (isFocused: boolean) => void

    Handler that is called when the element's focus status changes.

    onGotPointerCapture?: PointerEventHandler<HTMLDivElement>
    onGotPointerCaptureCapture?: PointerEventHandler<HTMLDivElement>
    onLostPointerCapture?: PointerEventHandler<HTMLDivElement>
    onLostPointerCaptureCapture?: PointerEventHandler<HTMLDivElement>
    onMouseDown?: MouseEventHandler<HTMLDivElement>
    onMouseDownCapture?: MouseEventHandler<HTMLDivElement>
    onMouseEnter?: MouseEventHandler<HTMLDivElement>
    onMouseLeave?: MouseEventHandler<HTMLDivElement>
    onMouseMove?: MouseEventHandler<HTMLDivElement>
    onMouseMoveCapture?: MouseEventHandler<HTMLDivElement>
    onMouseOut?: MouseEventHandler<HTMLDivElement>
    onMouseOutCapture?: MouseEventHandler<HTMLDivElement>
    onMouseOver?: MouseEventHandler<HTMLDivElement>
    onMouseOverCapture?: MouseEventHandler<HTMLDivElement>
    onMouseUp?: MouseEventHandler<HTMLDivElement>
    onMouseUpCapture?: MouseEventHandler<HTMLDivElement>
    onPointerCancel?: PointerEventHandler<HTMLDivElement>
    onPointerCancelCapture?: PointerEventHandler<HTMLDivElement>
    onPointerDown?: PointerEventHandler<HTMLDivElement>
    onPointerDownCapture?: PointerEventHandler<HTMLDivElement>
    onPointerEnter?: PointerEventHandler<HTMLDivElement>
    onPointerLeave?: PointerEventHandler<HTMLDivElement>
    onPointerMove?: PointerEventHandler<HTMLDivElement>
    onPointerMoveCapture?: PointerEventHandler<HTMLDivElement>
    onPointerOut?: PointerEventHandler<HTMLDivElement>
    onPointerOutCapture?: PointerEventHandler<HTMLDivElement>
    onPointerOver?: PointerEventHandler<HTMLDivElement>
    onPointerOverCapture?: PointerEventHandler<HTMLDivElement>
    onPointerUp?: PointerEventHandler<HTMLDivElement>
    onPointerUpCapture?: PointerEventHandler<HTMLDivElement>
    onScroll?: UIEventHandler<HTMLDivElement>
    onScrollCapture?: UIEventHandler<HTMLDivElement>
    onSelectionChange?: (keys: Selection) => void

    Handler that is called when the selection changes.

    onTouchCancel?: TouchEventHandler<HTMLDivElement>
    onTouchCancelCapture?: TouchEventHandler<HTMLDivElement>
    onTouchEnd?: TouchEventHandler<HTMLDivElement>
    onTouchEndCapture?: TouchEventHandler<HTMLDivElement>
    onTouchMove?: TouchEventHandler<HTMLDivElement>
    onTouchMoveCapture?: TouchEventHandler<HTMLDivElement>
    onTouchStart?: TouchEventHandler<HTMLDivElement>
    onTouchStartCapture?: TouchEventHandler<HTMLDivElement>
    onTransitionCancel?: TransitionEventHandler<HTMLDivElement>
    onTransitionCancelCapture?: TransitionEventHandler<HTMLDivElement>
    onTransitionEnd?: TransitionEventHandler<HTMLDivElement>
    onTransitionEndCapture?: TransitionEventHandler<HTMLDivElement>
    onTransitionRun?: TransitionEventHandler<HTMLDivElement>
    onTransitionRunCapture?: TransitionEventHandler<HTMLDivElement>
    onTransitionStart?: TransitionEventHandler<HTMLDivElement>
    onTransitionStartCapture?: TransitionEventHandler<HTMLDivElement>
    onWheel?: WheelEventHandler<HTMLDivElement>
    onWheelCapture?: WheelEventHandler<HTMLDivElement>
    orientation?: Orientation

    The primary orientation of the items. Usually this is the direction that the collection scrolls.

    'vertical'
    
    placeholder?: string
    placement?: Placement
    renderEmptyState?: (props: ListBoxRenderProps) => ReactNode

    Provides content to display when there are no items in the list.

    selectedKeys?: "all" | Iterable<Key, any, any>

    The currently selected keys in the collection (controlled).

    selectionBehavior?: SelectionBehavior

    How multiple selection should behave in the collection.

    "toggle"
    
    selectionMode?: SelectionMode

    The type of selection that is allowed in the collection.

    shouldFocusOnHover?: boolean

    Whether options should be focused when the user hovers over them.

    shouldFocusWrap?: boolean

    Whether focus should wrap around when the end/start is reached.

    shouldSelectOnPressUp?: boolean

    Whether selection should occur on press up instead of press down.

    slot?: string | null

    A slot name for the component. Slots allow the component to receive props from a parent component. An explicit null value indicates that the local props completely override all props received from a parent.

    style?: StyleOrFunction<ListBoxRenderProps>

    The inline style for the element. A function may be provided to compute the style based on component state.

    translate?: "yes" | "no"
    virtualized?: boolean