import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
// (C) 2020-2025 GoodData Corporation
import { useState } from "react";
import cx from "classnames";
import { differenceBy } from "lodash-es";
import { FormattedMessage } from "react-intl";
import { Bubble, BubbleHoverTrigger, Button, Dropdown, IconAttribute, IconDate, IconQuestionMark, InvertableSelect, InvertableSelectItem, } from "@gooddata/sdk-ui-kit";
import { DRILL_TARGET_TYPE } from "../../../drill/types.js";
const ALIGN_POINTS = [
    { align: "cr tl", offset: { x: 3, y: 0 } },
    { align: "bc tl", offset: { x: 3, y: 0 } },
    { align: "tc bl", offset: { x: 3, y: 0 } },
    { align: "tc br", offset: { x: 3, y: 0 } },
    { align: "bc tr", offset: { x: 3, y: 0 } },
];
/**
 * @internal
 */
export function DrillIntersectionIgnoredAttributesSelect({ options, initialSelection = [], onApply, drillTargetType, }) {
    const [isInverted, setIsInverted] = useState(true);
    const [selection, setSelection] = useState(initialSelection);
    const appliedSelection = isInverted ? selection : differenceBy(options, selection, "id");
    const shownSelection = isInverted ? differenceBy(options, appliedSelection, "id") : selection;
    return (_jsx(Dropdown, { onOpenStateChanged: (open) => {
            if (!open) {
                onApply(appliedSelection);
            }
        }, renderBody: () => {
            return (_jsx(InvertableSelect, { className: "gd-drill-intersection-ignored-attributes-select", onSelect: (items, isInverted) => {
                    setSelection(items);
                    setIsInverted(isInverted);
                }, items: options, getItemTitle: (item) => item.title, getItemKey: (item) => item.id, isInverted: isInverted, selectedItems: selection, totalItemsCount: options.length, renderItem: ({ title, item, onSelect, onDeselect, isSelected }) => {
                    const isDisabled = item.type === "date" &&
                        drillTargetType === DRILL_TARGET_TYPE.DRILL_TO_DASHBOARD;
                    let iconComponent = () => null;
                    if (item.type === "date") {
                        iconComponent = IconDate;
                    }
                    else if (item.type === "attribute") {
                        iconComponent = IconAttribute;
                    }
                    const IconComponent = iconComponent;
                    return (_jsx(InvertableSelectItem, { title: title, renderOnly: () => _jsx(_Fragment, {}), isDisabled: isDisabled, isSelected: !isDisabled && isSelected, icon: _jsx(IconComponent, { className: cx("gd-drill-intersection-ignored-attributes-select-item-icon", `gd-drill-intersection-ignored-attributes-select-item-icon-${item.type}`) }), onClick: () => {
                            if (isDisabled) {
                                return;
                            }
                            if (isSelected) {
                                onDeselect();
                            }
                            else {
                                onSelect();
                            }
                        } }));
                }, renderStatusBar: () => _jsx(_Fragment, {}), renderSearchBar: () => (_jsxs("div", { className: "gd-drill-intersection-ignored-attributes-select-title", children: [
                        _jsx(FormattedMessage, { id: "configurationPanel.drillConfig.drillIntersectionIgnoredAttributes.dropdown.title" }), _jsxs(BubbleHoverTrigger, { children: [
                                _jsx(IconQuestionMark, { className: "gd-drill-intersection-ignored-attributes-select-title-tooltip", width: 12, height: 12 }), _jsx(Bubble, { alignPoints: ALIGN_POINTS, children: _jsx("div", { className: "gd-drill-intersection-ignored-attributes-select-title-tooltip-content", children: _jsx(FormattedMessage, { id: "configurationPanel.drillConfig.drillIntersectionIgnoredAttributes.dropdown.tooltip" }) }) })
                            ] })
                    ] })) }));
        }, renderButton: ({ toggleDropdown, isOpen }) => {
            let title = "";
            if (isInverted && selection.length === 0) {
                title = (_jsx(FormattedMessage, { id: "configurationPanel.drillConfig.drillIntersectionIgnoredAttributes.dropdown.all" }));
            }
            else if ((!isInverted && selection.length === 0) ||
                (isInverted && selection.length === options.length)) {
                title = (_jsx(FormattedMessage, { id: "configurationPanel.drillConfig.drillIntersectionIgnoredAttributes.dropdown.none" }));
            }
            else {
                title = shownSelection.map((s) => s.title).join(", ");
            }
            return (_jsx(Button, { onClick: toggleDropdown, iconRight: isOpen ? "gd-icon-navigateup" : "gd-icon-navigatedown", size: "small", variant: "primary", className: cx("gd-drill-intersection-ignored-attributes-select-button", "button-dropdown", "dropdown-button", {
                    "gd-is-open": isOpen,
                    "is-active": isOpen,
                }), children: _jsxs(BubbleHoverTrigger, { children: [title, _jsx(Bubble, { children: title })
                    ] }) }));
        } }));
}
//# sourceMappingURL=DrillIntersectionIgnoredAttributesSelect.js.map