import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
// (C) 2025-2026 GoodData Corporation
import { memo, useCallback, } from "react";
import cx from "classnames";
import { ShortenedText } from "../../../../ShortenedText/ShortenedText.js";
import { typedUiMenuContextStore } from "../../context.js";
import { e } from "../../menuBem.js";
/**
 * Default component for rendering content menu items.
 * @internal
 */
export const DefaultUiMenuContentItemWrapper = memo(function DefaultUiMenuContentItemWrapper({ item }) {
    const { useContextStore, createSelector } = typedUiMenuContextStore();
    const selector = createSelector((ctx) => ({
        onSelect: ctx.onSelect,
        controlType: ctx.controlType,
        scrollToView: ctx.scrollToView,
        setFocusedId: ctx.setFocusedId,
        makeItemId: ctx.makeItemId,
        itemClassName: ctx.itemClassName,
        itemDataTestId: ctx.itemDataTestId,
        ContentItemComponent: ctx.ContentItem,
        isFocused: ctx.focusedItem?.id === item.id,
    }));
    const { scrollToView, controlType, setFocusedId, onSelect, makeItemId, itemClassName, itemDataTestId, ContentItemComponent, isFocused, } = useContextStore(selector);
    const scrollToItem = (element) => {
        if (!element || !isFocused) {
            return;
        }
        scrollToView(element);
    };
    const handleMouseFocus = useCallback(() => {
        if (controlType !== "mouse") {
            return;
        }
        setFocusedId(item.id);
    }, [controlType, item.id, setFocusedId]);
    const handleSelect = useCallback((e) => {
        if (item.isDisabled) {
            return;
        }
        onSelect(item, e);
    }, [item, onSelect]);
    const classNames = cx(e("item-wrapper", {
        isFocused,
        isDisabled: !!item.isDisabled,
    }), typeof itemClassName === "function" ? itemClassName(item) : itemClassName);
    const dataTestId = typeof itemDataTestId === "function" ? itemDataTestId(item) : itemDataTestId;
    return (_jsx("li", { ref: scrollToItem, role: "menuitem", "aria-haspopup": "dialog", className: classNames, tabIndex: -1, onClick: item.isDisabled ? undefined : handleSelect, "aria-disabled": item.isDisabled, id: makeItemId(item), onMouseMove: handleMouseFocus, "data-testid": dataTestId, children: _jsx(ContentItemComponent, { item: item, isFocused: isFocused }) }));
});
/**
 * @internal
 */
export function DefaultUiMenuContentItem({ item, isFocused, }) {
    return (_jsxs("div", { className: e("item", {
            isFocused,
            isDisabled: !!item.isDisabled,
        }), children: [item.iconLeft ? item.iconLeft : null, _jsx(ShortenedText, { className: e("item-title"), ellipsisPosition: "end", children: item.stringTitle }), !!item.Component && _jsx("i", { className: "gd-icon-navigateright" })] }));
}
