import { jsx as _jsx } from "react/jsx-runtime";
// (C) 2022-2026 GoodData Corporation
import { useState } from "react";
import cx from "classnames";
import { useIntl } from "react-intl";
import { withBubble } from "../../../../Bubble/withBubble.js";
import { Dropdown } from "../../../../Dropdown/Dropdown.js";
import { granularPermissionMessageLabels } from "../../../../locales.js";
import { getGranularGranteeClassNameId } from "../utils.js";
import { GranularPermissionsDropdownBody } from "./GranularPermissionsDropdownBody.js";
export function GranularPermissionsDropdown({ grantee, granteePossibilities, isDropdownDisabled, handleToggleDropdown, onChange, onDelete, className, mode, accessibilityConfig, }) {
    const intl = useIntl();
    const { ariaDescribedBy } = accessibilityConfig ?? {};
    const [selectedPermission, setSelectedPermission] = useState(granteePossibilities.assign.effective);
    const handleSetSelectedPermission = (permission) => {
        setSelectedPermission(permission);
    };
    const granularGranteeClassName = getGranularGranteeClassNameId(grantee);
    const buttonValue = intl.formatMessage(granularPermissionMessageLabels[selectedPermission]);
    return (_jsx(Dropdown, { className: className, renderButton: ({ isOpen, toggleDropdown, buttonRef, dropdownId }) => (_jsx("button", { className: cx("s-granular-permission-button", "gd-granular-permission-button", "dropdown-button", granularGranteeClassName, {
                "is-active": isOpen,
                "gd-icon-navigateup": !isDropdownDisabled && isOpen,
                "gd-icon-navigatedown": !isDropdownDisabled && !isOpen,
                disabled: isDropdownDisabled,
                "gd-icon-right": !isDropdownDisabled,
            }), onClick: () => {
                if (!isDropdownDisabled) {
                    toggleDropdown();
                    handleToggleDropdown();
                }
            }, onBlur: (e) => e.stopPropagation(), "aria-label": intl.formatMessage({
                id: "shareDialog.share.granular.grantee.permission.label",
            }), ref: buttonRef, "aria-haspopup": true, "aria-expanded": !!isOpen, "aria-controls": isOpen ? dropdownId : undefined, "aria-describedby": ariaDescribedBy, children: _jsx("div", { className: "s-granular-permission-button-title gd-granular-permission-button-title", children: buttonValue }) })), renderBody: ({ closeDropdown, ariaAttributes }) => (_jsx(GranularPermissionsDropdownBody, { alignTo: granularGranteeClassName, grantee: grantee, granteePossibilities: granteePossibilities, toggleDropdown: closeDropdown, onChange: onChange, onDelete: onDelete, selectedPermission: selectedPermission, handleSetSelectedPermission: handleSetSelectedPermission, mode: mode, id: ariaAttributes?.id })) }));
}
export const GranularPermissionsDropdownWithBubble = withBubble(GranularPermissionsDropdown);
