import { jsx as t, jsxs as M } from "@emotion/react/jsx-runtime";
import { Collapse as T } from "@mui/material";
import m from "clsx";
import { ArrowChevronSmUpOutlined as h } from "@m4l/icons";
import L from "../../../../hooks/useSideBar/index.js";
import { TEST_PROP_ID as O } from "../../../../../../test/constants_no_mock.js";
import { getNameDataTestId as x } from "../../../../tests/utils.js";
import { ArrowIcon as z } from "../ArrowIcon/index.js";
import { ContainerNodeMenuItemStyled as U, WrapperMenuItemStyled as g } from "../../../../slots/SideBarSlots.js";
import { CLASS_NAME_MENU_ACTIVE as D, CLASS_NAME_ITEM_IN_TREE_ACTIVE as I, CLASS_NAME_HAS_CHILDREN as b, CLASS_NAME_ITEM_CLOSED as k } from "../../../../constants.js";
import { useComponentSize as w } from "../../../../../../hooks/useComponentSize/index.js";
import { useModuleSkeleton as R } from "@m4l/core";
import { AdornmentIcon as P } from "../AdormentIcon/AdormentIcon.js";
import { resolveMenuItemIconUrl as V } from "../../../../helpers/resolveMenuItemIconUrl.js";
import { useCollapse as j } from "../../../../hooks/useCollapse/useCollapse.js";
import { MenuItem as y } from "../../../../../extended/mui/MenuItem/MenuItem.js";
function H(S) {
  const { item: e, size: d, defaultOpen: f = !1, className: l, isLastSibling: A = !1, isRoot: s = !1 } = S, { urlIconPrefix: v, classes: c } = L(), { isOpen: o, handlerClick: E, hasChildren: i } = j(e, f), { currentSize: r } = w(d), _ = R(), a = V({
    urlIconPrefix: v,
    iconUrl: e.iconUrl
  }), N = a ? /* @__PURE__ */ t(P, { icon: a, variant: s && e.itemInTreeActive || s && e.active ? "root" : e.active ? "itemActive" : "normal" }) : null, p = {
    active: e.active,
    itemInTreeActive: e.itemInTreeActive,
    sidebarSize: r,
    hasChildren: i,
    isLastSibling: A
  }, u = m(e.active && D, e.itemInTreeActive && I);
  return /* @__PURE__ */ M(
    U,
    {
      className: m(c.containerNodeMenuItem, u, l),
      role: "listitem",
      ownerState: p,
      ...process.env.NODE_ENV !== "production" ? { [O]: x("menuItems") } : {},
      children: [
        /* @__PURE__ */ t(g, { ownerState: p, className: c.wrapperMenuItem, children: /* @__PURE__ */ t(
          y,
          {
            className: m(
              u,
              l,
              e.children && e.children.length > 0 && b,
              e.itemInTreeActive && I,
              !o && k
            ),
            label: e.title,
            selected: e.active,
            startIcon: N,
            endIcon: i ? /* @__PURE__ */ t(z, { openState: o, active: e.active, icon: /* @__PURE__ */ t(h, {}) }) : null,
            onClick: () => E(),
            size: r
          }
        ) }),
        i ? /* @__PURE__ */ t(T, { in: o, timeout: "auto", unmountOnExit: !0, children: (e.children || []).map((n, C) => /* @__PURE__ */ t(
          H,
          {
            item: n,
            size: r,
            defaultOpen: _ ? !1 : n.active,
            isLastSibling: e.children?.length === C + 1
          },
          n.title
        )) }) : null
      ]
    }
  );
}
export {
  H as NodeMenuItem
};
