vuestic-ui/dist/types/composables/useDropdownable.d.ts

Vue 3 UI Framework

import { ExtractPropTypes, Ref } from 'vue';
export declare const useDropdownableProps: {
    modelValue: {};
    /**
     * Close dropdown on value updated.
     * @default null - behavior controlled by component
     */
    closeOnChange: {
        type: BooleanConstructor;
        default: null;
    };
    isOpen: {
        type: BooleanConstructor;
        default: undefined;
    };
    onClose: {
        type: import("vue").PropType<(...args: any[]) => any>;
        required: true;
        default: ((...args: any[]) => any) | undefined;
    };
    anchor: {
        type: import("vue").PropType<NonNullable<import("./useHTMLElementSelector").MaybeHTMLElementOrSelector>>;
        required: true;
        default: import("./useHTMLElementSelector").MaybeHTMLElementOrSelector;
    };
    "onUpdate:modelValue": {
        type: import("vue").PropType<(...args: any[]) => any>;
        required: true;
        default: ((...args: any[]) => any) | undefined;
    };
    target: {
        type: import("vue").PropType<NonNullable<import("./useHTMLElementSelector").MaybeHTMLElementOrSelector>>;
        required: true;
        default: import("./useHTMLElementSelector").MaybeHTMLElementOrSelector;
    };
    disabled: {
        type: import("vue").PropType<NonNullable<boolean | undefined>>;
        required: true;
        default: boolean | undefined;
    };
    onOpen: {
        type: import("vue").PropType<(...args: any[]) => any>;
        required: true;
        default: ((...args: any[]) => any) | undefined;
    };
    "onClick-outside": {
        type: import("vue").PropType<(...args: any[]) => any>;
        required: true;
        default: ((...args: any[]) => any) | undefined;
    };
    ariaLabel: {
        type: import("vue").PropType<NonNullable<import("./useTranslation").TranslationProp | undefined>>;
        required: true;
        default: import("./useTranslation").TranslationProp | undefined;
    };
    placement: {
        type: import("vue").PropType<NonNullable<import("./usePlacementAliases").PlacementWithAlias | undefined>>;
        required: true;
        default: import("./usePlacementAliases").PlacementWithAlias | undefined;
    };
    offset: {
        type: import("vue").PropType<NonNullable<import("../components/va-dropdown/types").DropdownOffsetProp | undefined>>;
        required: true;
        default: import("../components/va-dropdown/types").DropdownOffsetProp | undefined;
    };
    role: {
        type: import("vue").PropType<NonNullable<import("../utils/types/prop-type").StringWithAutocomplete<"button" | "none"> | undefined>>;
        required: true;
        default: import("../utils/types/prop-type").StringWithAutocomplete<"button" | "none"> | undefined;
    };
    "onAnchor-click": {
        type: import("vue").PropType<(...args: any[]) => any>;
        required: true;
        default: ((...args: any[]) => any) | undefined;
    };
    "onAnchor-right-click": {
        type: import("vue").PropType<(...args: any[]) => any>;
        required: true;
        default: ((...args: any[]) => any) | undefined;
    };
    "onContent-click": {
        type: import("vue").PropType<(...args: any[]) => any>;
        required: true;
        default: ((...args: any[]) => any) | undefined;
    };
    "onFocus-outside": {
        type: import("vue").PropType<(...args: any[]) => any>;
        required: true;
        default: ((...args: any[]) => any) | undefined;
    };
    "onAnchor-dblclick": {
        type: import("vue").PropType<(...args: any[]) => any>;
        required: true;
        default: ((...args: any[]) => any) | undefined;
    };
    anchorSelector: {
        type: import("vue").PropType<string>;
        required: true;
        default: string | undefined;
    };
    trigger: {
        type: import("vue").PropType<NonNullable<import("../components/va-dropdown/hooks/useDropdownNavigation").Trigger | readonly import("../components/va-dropdown/hooks/useDropdownNavigation").Trigger[] | undefined>>;
        required: true;
        default: import("../components/va-dropdown/hooks/useDropdownNavigation").Trigger | readonly import("../components/va-dropdown/hooks/useDropdownNavigation").Trigger[] | undefined;
    };
    readonly: {
        type: import("vue").PropType<NonNullable<boolean | undefined>>;
        required: true;
        default: boolean | undefined;
    };
    closeOnClickOutside: {
        type: import("vue").PropType<NonNullable<boolean | undefined>>;
        required: true;
        default: boolean | undefined;
    };
    closeOnFocusOutside: {
        type: import("vue").PropType<NonNullable<boolean | undefined>>;
        required: true;
        default: boolean | undefined;
    };
    closeOnAnchorClick: {
        type: import("vue").PropType<NonNullable<boolean | undefined>>;
        required: true;
        default: boolean | undefined;
    };
    closeOnContentClick: {
        type: import("vue").PropType<NonNullable<boolean | undefined>>;
        required: true;
        default: boolean | undefined;
    };
    hoverOverTimeout: {
        type: import("vue").PropType<NonNullable<string | number | undefined>>;
        required: true;
        default: string | number | undefined;
    };
    hoverOutTimeout: {
        type: import("vue").PropType<NonNullable<string | number | undefined>>;
        required: true;
        default: string | number | undefined;
    };
    isContentHoverable: {
        type: import("vue").PropType<NonNullable<boolean | undefined>>;
        required: true;
        default: boolean | undefined;
    };
    keepAnchorWidth: {
        type: import("vue").PropType<NonNullable<boolean | undefined>>;
        required: true;
        default: boolean | undefined;
    };
    verticalScrollOnOverflow: {
        type: import("vue").PropType<NonNullable<boolean | undefined>>;
        required: true;
        default: boolean | undefined;
    };
    cursor: {
        type: import("vue").PropType<NonNullable<boolean | import("../components/va-dropdown/types").CursorAnchor | undefined>>;
        required: true;
        default: boolean | import("../components/va-dropdown/types").CursorAnchor | undefined;
    };
    autoPlacement: {
        type: import("vue").PropType<NonNullable<boolean | undefined>>;
        required: true;
        default: boolean | undefined;
    };
    stickToEdges: {
        type: import("vue").PropType<NonNullable<boolean | undefined>>;
        required: true;
        default: boolean | undefined;
    };
    teleport: {
        type: import("vue").PropType<NonNullable<import("./useHTMLElementSelector").MaybeHTMLElementOrSelector>>;
        required: true;
        default: import("./useHTMLElementSelector").MaybeHTMLElementOrSelector;
    };
    contentClass: {
        type: import("vue").PropType<string>;
        required: true;
        default: string | undefined;
    };
};
export declare const useDropdownableEmits: string[];
/** Used in components where dropdown is used */
export declare const useDropdownable: (props: ExtractPropTypes<typeof useDropdownableProps>, emit: (event: 'update:isOpen', ...args: any[]) => void, options?: {
    /** @default false */
    defaultCloseOnValueUpdate?: boolean | Ref<boolean>;
}) => {
    dropdownProps: import("vue").ComputedRef<ExtractPropTypes<Omit<{
        onClose: {
            type: import("vue").PropType<(...args: any[]) => any>;
            required: true;
            default: ((...args: any[]) => any) | undefined;
        };
        anchor: {
            type: import("vue").PropType<NonNullable<import("./useHTMLElementSelector").MaybeHTMLElementOrSelector>>;
            required: true;
            default: import("./useHTMLElementSelector").MaybeHTMLElementOrSelector;
        };
        "onUpdate:modelValue": {
            type: import("vue").PropType<(...args: any[]) => any>;
            required: true;
            default: ((...args: any[]) => any) | undefined;
        };
        modelValue: {
            type: import("vue").PropType<NonNullable<boolean | undefined>>;
            required: true;
            default: boolean | undefined;
        };
        stateful: {
            type: import("vue").PropType<NonNullable<boolean | undefined>>;
            required: true;
            default: boolean | undefined;
        };
        target: {
            type: import("vue").PropType<NonNullable<import("./useHTMLElementSelector").MaybeHTMLElementOrSelector>>;
            required: true;
            default: import("./useHTMLElementSelector").MaybeHTMLElementOrSelector;
        };
        disabled: {
            type: import("vue").PropType<NonNullable<boolean | undefined>>;
            required: true;
            default: boolean | undefined;
        };
        onOpen: {
            type: import("vue").PropType<(...args: any[]) => any>;
            required: true;
            default: ((...args: any[]) => any) | undefined;
        };
        "onClick-outside": {
            type: import("vue").PropType<(...args: any[]) => any>;
            required: true;
            default: ((...args: any[]) => any) | undefined;
        };
        ariaLabel: {
            type: import("vue").PropType<NonNullable<import("./useTranslation").TranslationProp | undefined>>;
            required: true;
            default: import("./useTranslation").TranslationProp | undefined;
        };
        placement: {
            type: import("vue").PropType<NonNullable<import("./usePlacementAliases").PlacementWithAlias | undefined>>;
            required: true;
            default: import("./usePlacementAliases").PlacementWithAlias | undefined;
        };
        offset: {
            type: import("vue").PropType<NonNullable<import("../components/va-dropdown/types").DropdownOffsetProp | undefined>>;
            required: true;
            default: import("../components/va-dropdown/types").DropdownOffsetProp | undefined;
        };
        role: {
            type: import("vue").PropType<NonNullable<import("../utils/types/prop-type").StringWithAutocomplete<"button" | "none"> | undefined>>;
            required: true;
            default: import("../utils/types/prop-type").StringWithAutocomplete<"button" | "none"> | undefined;
        };
        "onAnchor-click": {
            type: import("vue").PropType<(...args: any[]) => any>;
            required: true;
            default: ((...args: any[]) => any) | undefined;
        };
        "onAnchor-right-click": {
            type: import("vue").PropType<(...args: any[]) => any>;
            required: true;
            default: ((...args: any[]) => any) | undefined;
        };
        "onContent-click": {
            type: import("vue").PropType<(...args: any[]) => any>;
            required: true;
            default: ((...args: any[]) => any) | undefined;
        };
        "onFocus-outside": {
            type: import("vue").PropType<(...args: any[]) => any>;
            required: true;
            default: ((...args: any[]) => any) | undefined;
        };
        "onAnchor-dblclick": {
            type: import("vue").PropType<(...args: any[]) => any>;
            required: true;
            default: ((...args: any[]) => any) | undefined;
        };
        anchorSelector: {
            type: import("vue").PropType<string>;
            required: true;
            default: string | undefined;
        };
        innerAnchorSelector: {
            type: import("vue").PropType<string>;
            required: true;
            default: string | undefined;
        };
        trigger: {
            type: import("vue").PropType<NonNullable<import("../components/va-dropdown/hooks/useDropdownNavigation").Trigger | readonly import("../components/va-dropdown/hooks/useDropdownNavigation").Trigger[] | undefined>>;
            required: true;
            default: import("../components/va-dropdown/hooks/useDropdownNavigation").Trigger | readonly import("../components/va-dropdown/hooks/useDropdownNavigation").Trigger[] | undefined;
        };
        readonly: {
            type: import("vue").PropType<NonNullable<boolean | undefined>>;
            required: true;
            default: boolean | undefined;
        };
        closeOnClickOutside: {
            type: import("vue").PropType<NonNullable<boolean | undefined>>;
            required: true;
            default: boolean | undefined;
        };
        closeOnFocusOutside: {
            type: import("vue").PropType<NonNullable<boolean | undefined>>;
            required: true;
            default: boolean | undefined;
        };
        closeOnAnchorClick: {
            type: import("vue").PropType<NonNullable<boolean | undefined>>;
            required: true;
            default: boolean | undefined;
        };
        closeOnContentClick: {
            type: import("vue").PropType<NonNullable<boolean | undefined>>;
            required: true;
            default: boolean | undefined;
        };
        hoverOverTimeout: {
            type: import("vue").PropType<NonNullable<string | number | undefined>>;
            required: true;
            default: string | number | undefined;
        };
        hoverOutTimeout: {
            type: import("vue").PropType<NonNullable<string | number | undefined>>;
            required: true;
            default: string | number | undefined;
        };
        isContentHoverable: {
            type: import("vue").PropType<NonNullable<boolean | undefined>>;
            required: true;
            default: boolean | undefined;
        };
        keepAnchorWidth: {
            type: import("vue").PropType<NonNullable<boolean | undefined>>;
            required: true;
            default: boolean | undefined;
        };
        verticalScrollOnOverflow: {
            type: import("vue").PropType<NonNullable<boolean | undefined>>;
            required: true;
            default: boolean | undefined;
        };
        cursor: {
            type: import("vue").PropType<NonNullable<boolean | import("../components/va-dropdown/types").CursorAnchor | undefined>>;
            required: true;
            default: boolean | import("../components/va-dropdown/types").CursorAnchor | undefined;
        };
        autoPlacement: {
            type: import("vue").PropType<NonNullable<boolean | undefined>>;
            required: true;
            default: boolean | undefined;
        };
        stickToEdges: {
            type: import("vue").PropType<NonNullable<boolean | undefined>>;
            required: true;
            default: boolean | undefined;
        };
        teleport: {
            type: import("vue").PropType<NonNullable<import("./useHTMLElementSelector").MaybeHTMLElementOrSelector>>;
            required: true;
            default: import("./useHTMLElementSelector").MaybeHTMLElementOrSelector;
        };
        keyboardNavigation: {
            type: import("vue").PropType<NonNullable<boolean | undefined>>;
            required: true;
            default: boolean | undefined;
        };
        contentClass: {
            type: import("vue").PropType<string>;
            required: true;
            default: string | undefined;
        };
    }, "modelValue" | "stateful" | "innerAnchorSelector" | "keyboardNavigation">>>;
    isOpenSync: import("vue").WritableComputedRef<boolean>;
};