@ebay/ui-core-react/common/dropdown.d.ts

Skin components build off React

import { useFloating } from "@floating-ui/react";
export type FloatingDropdownHookReturn = {
    overlayStyles: ReturnType<typeof useFloating>["floatingStyles"];
    refs: {
        host: ReturnType<typeof useFloating>["refs"]["reference"];
        overlay: ReturnType<typeof useFloating>["refs"]["floating"];
        setHost: ReturnType<typeof useFloating>["refs"]["setReference"];
        setOverlay: ReturnType<typeof useFloating>["refs"]["setFloating"];
    };
};
export type FloatingDropdownHookArgs = {
    open?: boolean;
    options?: FloatingDropdownHookOptions;
};
export type FloatingDropdownHookOptions = {
    offset?: number;
    reverse?: boolean;
};
export declare function useFloatingDropdown({ open, options }: FloatingDropdownHookArgs): FloatingDropdownHookReturn;
type ElementId = string;
export type ExpanderHookArgs<T extends HTMLElement> = {
    ref: React.MutableRefObject<T> | null;
    expanded?: boolean;
    options: {
        contentSelector: string;
        hostSelector: string;
        expandedClass?: string;
        autoCollapse?: boolean;
        expandOnFocus?: boolean;
        expandOnClick?: boolean;
        collapseOnFocusOut?: boolean;
        collapseOnMouseOut?: boolean;
        collapseOnClickOut?: boolean;
        collapseOnHostFocus?: boolean;
        expandOnHover?: boolean;
        focusManagement?: "content" | "focusable" | "interactive" | ElementId;
        simulateSpacebarClick?: boolean;
        alwaysDoFocusManagement?: boolean;
        ariaControls?: boolean;
    };
    onExpand?: () => void;
    onCollapse?: () => void;
};
export type ExpanderHookReturn = {
    isExpanded: boolean;
    expand(): void;
    collapse(): void;
};
export declare function useExpander<T extends HTMLElement>({ ref, expanded, options, onExpand, onCollapse }: ExpanderHookArgs<T>, deps?: React.DependencyList): ExpanderHookReturn;
type AutoIndexType = "none" | "current" | "interactive" | "ariaChecked" | "ariaSelected" | "ariaSelectedOrInteractive" | number;
export type ActiveDescendantChangeHandler = (event: ActiveDescendantChangeEvent, data: {
    toIndex: number;
}) => void;
export type ActiveDescendantHookArgs = {
    ref: React.MutableRefObject<HTMLElement>;
    focusElementRef?: React.MutableRefObject<HTMLElement>;
    itemContainerRef?: React.MutableRefObject<HTMLElement>;
    disabled?: boolean;
    onChange?: ActiveDescendantChangeHandler;
    options: {
        activeDescendantClassName: string;
        autoInit?: AutoIndexType;
        autoReset?: AutoIndexType;
        autoScroll?: boolean;
        axis?: "both" | "x" | "y";
        ignoreByDelegateSelector?: string;
        wrap?: boolean;
    };
};
export type ActiveDescendantHookReturn = {
    setIndex: (index: number) => void;
    getIndex: () => number;
};
export interface ActiveDescendantChangeEvent extends Event {
    detail: {
        toIndex: number;
    };
}
export declare function useActiveDescendant({ ref, focusElementRef, itemContainerRef, onChange, disabled, options, }: ActiveDescendantHookArgs): ActiveDescendantHookReturn;
export {};
//# sourceMappingURL=dropdown.d.ts.map