'use strict';
'use client';
import { jsxs, jsx } from 'react/jsx-runtime';
import { Menu } from '@base-ui/react/menu';
import { getUserDropdownMenuItemId, isRedirectUrl, isText, onUserDropdownMenuItemClick } from './UserDropdownMenuItem.funcs.js';
import { cn } from '../../../../../fd-toolbox/lib/utils.js';
import { Icon } from '../../../../fd-component-toolbox/icon/Icon.js';
import { Link } from '../../../../fd-component-toolbox/link/Link.js';
import { addQueryParamsToPath } from '../../../../../fd-toolbox/routing/paths.js';

var __defProp = Object.defineProperty;
var __name = (target, value) => __defProp(target, "name", {
  value,
  configurable: true
});
function UserDropdownMenuItem({
  id,
  item,
  className,
  closeMenu
}) {
  if (item.nextSubgroupsOrMenuItems && item.nextSubgroupsOrMenuItems.length > 0) return /* @__PURE__ */jsxs(Menu.SubmenuRoot, {
    children: [/* @__PURE__ */jsx(Menu.SubmenuTrigger, {
      className: cn("p-2 outline-none", className),
      id: getUserDropdownMenuItemId(item.text),
      children: /* @__PURE__ */jsxs("div", {
        className: "inline-flex w-full items-center gap-x-2 text-sm font-medium hover:cursor-pointer",
        children: [item.icon && /* @__PURE__ */jsx(Icon, {
          name: item.icon,
          className: "size-3"
        }), item.text, /* @__PURE__ */jsx(Icon, {
          name: "caretSort",
          className: "text-foreground ml-auto opacity-50"
        })]
      })
    }), /* @__PURE__ */jsx(Menu.Portal, {
      children: /* @__PURE__ */jsx(Menu.Positioner, {
        sideOffset: 4,
        alignOffset: -4,
        children: /* @__PURE__ */jsx(Menu.Popup, {
          className: "bg-background z-50 min-w-52 rounded-md shadow",
          children: item.nextSubgroupsOrMenuItems.map(subItem => /* @__PURE__ */jsx(UserDropdownMenuItem, {
            item: subItem,
            closeMenu
          }, `${subItem.text}_${subItem.type}`))
        })
      })
    })]
  });
  return /* @__PURE__ */jsx(Menu.Item, {
    className: cn("p-2 outline-none", className),
    children: /* @__PURE__ */jsxs("div", {
      className: "text-sm font-medium",
      onClick: () => onUserDropdownMenuItemClick(closeMenu, item.callback),
      id: getUserDropdownMenuItemId(item.id),
      children: [isRedirectUrl(item) && item.path && /* @__PURE__ */jsxs(Link, {
        id,
        className: "flex items-center gap-x-2",
        href: addQueryParamsToPath(item.path, item.routerLinkQueryParam),
        children: [item.icon && /* @__PURE__ */jsx(Icon, {
          name: item.icon,
          className: "size-3"
        }), item.text]
      }), isText(item) && item.text]
    })
  });
}
__name(UserDropdownMenuItem, "UserDropdownMenuItem");

export { UserDropdownMenuItem };
