import { __assign, __rest } from "tslib";
import { jsx as _jsx } from "react/jsx-runtime";
import cx from 'classnames';
import { useCallback, useEffect, useState } from 'react';
import Popover from '../popover/Popover';
import PopoverClickTrigger from '../popover/trigger/ClickTrigger';
import PopoverHoverTrigger from '../popover/trigger/HoverTrigger';
import PopoverContent from '../popover/Content';
import { useCallbackRef } from '../utils/hooks/useCallbackRef';
import { DropdownContext } from './DropdownContext';
export var Dropdown = function (_a) {
    var _b = _a.cushion, cushion = _b === void 0 ? 4 : _b, _c = _a.visible, visible = _c === void 0 ? false : _c, onVisibleChange = _a.onVisibleChange, className = _a.className, rest = __rest(_a, ["cushion", "visible", "onVisibleChange", "className"]);
    var _d = useState(visible), vis = _d[0], setVis = _d[1];
    var onVisibleChangeProp = useCallbackRef(onVisibleChange);
    var onVisChange = useCallback(function (val) {
        var _a;
        setVis(val);
        (_a = onVisibleChangeProp.current) === null || _a === void 0 ? void 0 : _a.call(onVisibleChangeProp, val);
    }, [onVisibleChangeProp]);
    useEffect(function () {
        setVis(visible);
    }, [visible]);
    return (_jsx(DropdownContext.Provider, __assign({ value: vis }, { children: _jsx(Popover, __assign({ className: cx(className, 'zent-dropdown'), cushion: cushion, visible: vis, onVisibleChange: onVisChange }, rest), void 0) }), void 0));
};
export var DropdownClickTrigger = PopoverClickTrigger;
export var DropdownHoverTrigger = PopoverHoverTrigger;
export var DropdownContent = PopoverContent;
export var DropdownPosition = Popover.Position;
