import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
// (C) 2025-2026 GoodData Corporation
import { useCallback, useState } from "react";
import cx from "classnames";
import { useIntl } from "react-intl";
import { objRefToString, widgetRef } from "@gooddata/sdk-model";
import { UiIcon, UiTooltip, isActionKey, useIdPrefixed } from "@gooddata/sdk-ui-kit";
import { simplifyText } from "@gooddata/util";
import { useDashboardSelector } from "../../../../model/react/DashboardStoreProvider.js";
import { selectDashboardDensity } from "../../../../model/store/ui/uiSelectors.js";
export const AS_TABLE_MENU_BUTTON_ID = "AS_TABLE_MENU_BUTTON_ID";
export function ShowAsTableButton({ widget, onClick, isWidgetAsTable, }) {
    const intl = useIntl();
    const [announcementText, setAnnouncementText] = useState("");
    const density = useDashboardSelector(selectDashboardDensity);
    const onMenuButtonClick = useCallback(() => {
        // Announce what state we're changing TO (opposite of current state)
        const message = isWidgetAsTable
            ? intl.formatMessage({ id: "controlButtons.announcement.switchedToOriginal" })
            : intl.formatMessage({ id: "controlButtons.announcement.switchedToTable" });
        setAnnouncementText(message);
        onClick();
    }, [onClick, isWidgetAsTable, intl]);
    const onKeyDown = useCallback((event) => {
        if (isActionKey(event)) {
            event.preventDefault();
            onMenuButtonClick();
        }
    }, [onMenuButtonClick]);
    const widgetRefAsString = objRefToString(widgetRef(widget));
    const asTableIconClasses = cx("dash-item-action-options", "dash-item-action-as-table", `s-dash-item-action-as-table-options-${simplifyText(widgetRefAsString)}`, {
        "s-dash-item-action-as-table": !isWidgetAsTable,
        "s-dash-item-action-as-original": isWidgetAsTable,
    });
    const id = useIdPrefixed(AS_TABLE_MENU_BUTTON_ID);
    const title = isWidgetAsTable
        ? intl.formatMessage({ id: "controlButtons.asOriginal" })
        : intl.formatMessage({ id: "controlButtons.asTable" });
    const iconType = isWidgetAsTable ? "visualization" : "table";
    return (_jsxs(_Fragment, { children: [
            _jsx(UiTooltip, { triggerBy: ["hover", "focus"], arrowPlacement: "top-start", content: title, anchor: _jsx("div", { id: id, className: "dash-item-action-placeholder s-dash-item-action-placeholder", onClick: onMenuButtonClick, onKeyDown: onKeyDown, role: "button", tabIndex: 0, "aria-label": title, children: _jsx("div", { className: asTableIconClasses, children: _jsx(UiIcon, { size: density === "compact" ? 12 : 18, type: iconType, color: "complementary-7" }) }) }) }), _jsx("div", { className: "sr-only", "aria-live": "polite", "aria-atomic": "true", role: "status", children: announcementText })
        ] }));
}
//# sourceMappingURL=ShowAsTableButton.js.map