import Vue from 'vue';
import { PropType } from '@vue/composition-api';
import { OptionsMenuItem } from './OptionsMenuItem';
declare const _default: import("vue").ComponentOptions<Vue, import("@vue/composition-api").ShallowUnwrapRef<{
    prefixId: (suffix: string) => string;
}> & {
    activeItemIndex: number | null;
    highlightedItemIndex: number | null;
}, {
    itemClasses(item: OptionsMenuItem, index: number): Record<string, boolean>;
    onItemMousedown(item: OptionsMenuItem, index: number): void;
    onItemClick(item: OptionsMenuItem): void;
    getSelectedItemIndex(): number | null;
    moveHighlight(direction: 'backward' | 'forward'): void;
    selectHighlightedItem(): void;
    handleKeyboardEvent(event: KeyboardEvent): void;
}, {
    activeDescendantId(): string | null;
}, {
    /**
     * Items to list in the menu. Item IDs must be unique within each menu.
     */
    items: {
        type: PropType<OptionsMenuItem[]>;
        required: true;
        validator: (items: unknown) => boolean;
    };
    /**
     * The ID of the selected item, or null if no item is selected. This is the v-model value.
     */
    selectedItemId: {
        type: PropType<string | null>;
        default: null;
    };
}, {
    selectedItemId: string | null;
    items: OptionsMenuItem[];
} & {}> & import("vue").VueConstructor<Vue> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
    selectedItemId: string | null;
    items: OptionsMenuItem[];
} & {}, import("@vue/composition-api").ShallowUnwrapRef<{
    prefixId: (suffix: string) => string;
}>, {
    activeItemIndex: number | null;
    highlightedItemIndex: number | null;
}, {
    activeDescendantId(): string | null;
}, {
    itemClasses(item: OptionsMenuItem, index: number): Record<string, boolean>;
    onItemMousedown(item: OptionsMenuItem, index: number): void;
    onItemClick(item: OptionsMenuItem): void;
    getSelectedItemIndex(): number | null;
    moveHighlight(direction: 'backward' | 'forward'): void;
    selectHighlightedItem(): void;
    handleKeyboardEvent(event: KeyboardEvent): void;
}, {
    selectedItemId: string | null;
    items: OptionsMenuItem[];
} & {}, {
    selectedItemId: string | null;
}, true>);
/**
 * Menu that displays a set of options, and lets the user select one.
 *
 * This component is designed to be used inside other components. The logic for keyboard navigation
 * between items is implemented here, but this component doesn't attach keyboard event listeners.
 * The parent component is expected to listen for keyboard events and call handleKeyboardEvent().
 *
 * Set the available items through the items prop, and get/set the ID of the selected item through
 * v-model. The v-model value will be the .id property of the selected item, or null if no item
 * is selected.
 *
 * How items are displayed in the menu can be customized through the main slot. By default, the
 * item's label is used.
 *
 * @example
 *     <wvui-options-menu
 *         v-model="number"
 *         :items="[{id: 1, label: 'One'}, {id: 2, label: 'Two'}]"
 *     />
 *
 * @example
 *     <wvui-options-menu
 *         #default="{ item }"
 *         v-model="number"
 *         :items="[{id: 1, label: 'One'}, {id: 2, label: 'Two'}]"
 *     >
 *         {{ item.label }} (id: {{ item.id }})
 *     </wvui-options-menu>
 */
export default _default;
