"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ItemButton = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const Collapse_1 = require("../../../Collapse");
const useViewportType_1 = require("../../../useViewportType");
const cva_1 = require("../../../utils/cva");
const constants_1 = require("./constants");
const styles_1 = require("./styles");
const itemButton = (0, cva_1.cva)(constants_1.navMenuItemButtonClassnames.root, {
    variants: {
        hasGroup: {
            true: constants_1.navMenuItemButtonClassnames.hasGroup,
        },
    },
});
const itemButtonLabel = (0, cva_1.cva)(constants_1.navMenuItemButtonClassnames.label, {
    variants: {
        hasCounter: {
            true: constants_1.navMenuItemButtonClassnames.labelHasCounter,
        },
    },
});
exports.ItemButton = (0, react_1.forwardRef)((props, ref) => {
    const { collapsedIn, opened, text, icon, component = 'a', counter, isNested = false, isGroupTitleItem = false, selected, ...restProps } = props;
    const { isMobile } = (0, useViewportType_1.useViewportType)();
    const Counter = counter?.component;
    const { max, count } = counter || {};
    return ((0, jsx_runtime_1.jsxs)(styles_1.StyledListItemButton, { className: itemButton({ hasGroup: isGroupTitleItem }), ref: ref, component: component, withoutContainer: true, selected: selected, "aria-selected": selected, ...restProps, children: [isMobile ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isNested && (0, jsx_runtime_1.jsx)(styles_1.StyledPageDotOutlineMd, {}), (0, jsx_runtime_1.jsx)(styles_1.NavMenuItemButtonText, { children: text, rowsCount: 2 })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(styles_1.NavMenuItemButtonIcon, { children: Counter && Number(count) ? ((0, jsx_runtime_1.jsx)(Counter.Badge, { invisible: collapsedIn, children: icon })) : (icon) }), (0, jsx_runtime_1.jsx)(Collapse_1.Collapse, { orientation: "horizontal", in: collapsedIn, children: (0, jsx_runtime_1.jsx)(styles_1.NavMenuItemButtonText, { tooltipProps: { placement: 'right' }, className: itemButtonLabel({ hasCounter: Boolean(counter) }), children: text, rowsCount: 2 }) })] })), (0, jsx_runtime_1.jsxs)(styles_1.EndAdornmentWrapper, { "$collapsedIn": collapsedIn, children: [Counter && (0, jsx_runtime_1.jsx)(Counter, { max: max, count: count }), isGroupTitleItem && ((0, jsx_runtime_1.jsx)(styles_1.NavMenuItemButtonChevron, { "$collapsedIn": collapsedIn, "$opened": opened }))] })] }));
});
