import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import cx from "classnames";
import { useIntl } from "react-intl";
import { UiIcon } from "@gooddata/sdk-ui-kit";
import { NOTIFICATIONS_PANEL_ID } from "./DefaultNotificationsPanel.js";
import { bem } from "../bem.js";
const { b, e } = bem("gd-ui-ext-notifications-panel-button");
/**
 * @internal
 */
export function DefaultNotificationsPanelButton({ buttonRef, isNotificationPanelOpen, toggleNotificationPanel, hasUnreadNotifications, }) {
    const intl = useIntl();
    const ariaControls = isNotificationPanelOpen ? { "aria-controls": NOTIFICATIONS_PANEL_ID } : {};
    return (_jsx("button", { ref: buttonRef, className: cx(`gd-button gd-header-button ${b({ isOpen: isNotificationPanelOpen })}`), onClick: toggleNotificationPanel, "aria-label": intl.formatMessage({ id: "notifications.panel.button.label" }), "aria-expanded": isNotificationPanelOpen, "aria-haspopup": "true", ...ariaControls, children: _jsxs("span", { className: e("icon"), children: [hasUnreadNotifications ? _jsx("span", { className: e("unread-status") }) : null, _jsx(UiIcon, { type: "alert", size: 14 })] }) }));
}
//# sourceMappingURL=DefaultNotificationsPanelButton.js.map