import { jsx as _jsx } from "react/jsx-runtime";
import { useState } from 'react';
// Import PatternFly components
import { Tooltip, MenuToggle, Dropdown } from '@patternfly/react-core';
import EllipsisIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon';
export const ChatbotConversationHistoryDropdown = ({ menuItems, menuClassName, onSelect, label = 'Conversation options', 'aria-label': ariaLabel, id }) => {
    const [isOpen, setIsOpen] = useState(false);
    const toggle = (toggleRef) => (_jsx(Tooltip, { className: "pf-chatbot__tooltip", content: label, position: "bottom", 
        // prevents VO announcements of both aria label and tooltip
        aria: "none", children: _jsx(MenuToggle, { className: "pf-chatbot__history-actions", variant: "plain", "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : label, ref: toggleRef, isExpanded: isOpen, onClick: () => setIsOpen(!isOpen), id: id, role: "menuitem", children: _jsx(EllipsisIcon, {}) }) }));
    return (_jsx(Dropdown, { className: `pf-chatbot__selections ${menuClassName !== null && menuClassName !== void 0 ? menuClassName : ''}`, isOpen: isOpen, onSelect: (props) => {
            onSelect === null || onSelect === void 0 ? void 0 : onSelect(props);
            setIsOpen((prev) => !prev);
        }, onOpenChange: (isOpen) => setIsOpen(isOpen), popperProps: { position: 'right' }, shouldFocusToggleOnSelect: true, shouldFocusFirstItemOnOpen: true, toggle: toggle, children: menuItems }));
};
export default ChatbotConversationHistoryDropdown;
