import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import cx from "classnames";
import { ShortenedText } from "../../ShortenedText/ShortenedText.js";
import { isActionKey } from "../../utils/events.js";
import { useIdPrefixed } from "../../utils/useId.js";
import { bem } from "../@utils/bem.js";
import { UiTooltip } from "../UiTooltip/UiTooltip.js";
const { b, e } = bem("gd-ui-kit-control-button");
const TITLE_TOOLTIP_ALIGN_POINTS = [
    { align: "tc bc", offset: { x: 0, y: -2 } },
    { align: "cc tc", offset: { x: 0, y: 10 } },
    { align: "bl tr", offset: { x: -2, y: -8 } },
];
/**
 * Generic chip-shaped dropdown trigger primitive. One source of truth for filter-bar chip
 * visuals; consumed by both attribute filter chips and parameter chips.
 *
 * Owns: layout, visual states, keyboard activation, ARIA contract.
 *
 * Does NOT own: lifecycle states (loading/filtering), count display, error-icon swap, domain i18n.
 *
 * @internal
 */
export function UiControlButton({ title, titleClassName, subtitle, subtitleClassName, icon, titleExtension, subtitleExtension, layout = "stacked", hideChevron, isOpen, isDraggable, isDragging, isError, isWarning, warningTooltip, disabled, disabledTooltip, onClick, className, "data-testid": dataTestId, buttonRef, buttonId, dropdownId, ariaLabel, }) {
    const tooltipId = useIdPrefixed("gd-ui-kit-control-button-tooltip");
    const showDisabledTooltip = !!disabled && !!disabledTooltip;
    const showWarningTooltip = !!isWarning && !!warningTooltip && !showDisabledTooltip;
    const showTooltip = showDisabledTooltip || showWarningTooltip;
    const hasSubtitle = subtitle !== undefined || subtitleExtension !== undefined;
    // Trailing colon on the label, only when a subtitle follows it.
    const showLabelColon = layout === "row" && hasSubtitle;
    const onKeyDown = (event) => {
        if (!isActionKey(event)) {
            return;
        }
        event.preventDefault();
        event.stopPropagation();
        if (disabled) {
            return;
        }
        onClick?.();
    };
    const button = (_jsxs("div", { id: buttonId, ref: buttonRef, className: cx(b({
            layout,
            hideChevron: !!hideChevron,
            isOpen: !!isOpen,
            isDraggable: !!isDraggable,
            isDragging: !!isDragging,
            isError: !!isError,
            isWarning: !!isWarning,
            disabled: !!disabled,
        }), className), role: "button", tabIndex: 0, "aria-haspopup": "dialog", "aria-expanded": isOpen, "aria-disabled": disabled, "aria-controls": isOpen ? dropdownId : undefined, "aria-describedby": showTooltip ? tooltipId : undefined, "aria-label": ariaLabel, "data-testid": dataTestId, onClick: disabled ? undefined : onClick, onKeyDown: onKeyDown, children: [icon ? _jsx("div", { className: e("icon"), children: icon }) : null, _jsxs("div", { className: e("content"), children: [
                    _jsxs("div", { className: e("title-row"), children: [
                            _jsx("div", { className: e("title", { withColon: showLabelColon }), children: _jsx(ShortenedText, { tooltipAlignPoints: TITLE_TOOLTIP_ALIGN_POINTS, className: titleClassName, children: title }) }), titleExtension] }), hasSubtitle ? (_jsxs("div", { className: e("subtitle-row"), children: [typeof subtitle === "string" ? (_jsx("div", { className: e("subtitle"), children: _jsx(ShortenedText, { tooltipAlignPoints: TITLE_TOOLTIP_ALIGN_POINTS, className: subtitleClassName, children: subtitle }) })) : (subtitle), subtitleExtension] })) : null] })
        ] }));
    if (showTooltip) {
        return (_jsx(UiTooltip, { id: tooltipId, anchor: button, content: showWarningTooltip ? warningTooltip : disabledTooltip, triggerBy: showWarningTooltip ? ["hover", "focus"] : ["focus"], arrowPlacement: "top", showArrow: true, disabled: !!isOpen }));
    }
    return button;
}
