'use strict';
'use client';
import { c } from 'react/compiler-runtime';
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
import { useState } from 'react';
import { Icon, defaultSidebarIconName } from '../../../fd-component-toolbox/icon/Icon.js';
import { Link } from '../../../fd-component-toolbox/link/Link.js';
import { useSidebarItems } from '../sidebar/sidebar-resources-provider.js';

var __defProp = Object.defineProperty;
var __name = (target, value) => __defProp(target, "name", {
  value,
  configurable: true
});
function TopNav() {
  const $ = c(5);
  const {
    sidebarItems
  } = useSidebarItems();
  const [hoveredItem, setHoveredItem] = useState();
  let t0;
  if ($[0] !== hoveredItem || $[1] !== sidebarItems) {
    let t1;
    if ($[3] !== hoveredItem) {
      t1 = sidebarItem => jsxs("div", {
        className: "relative",
        onMouseEnter: () => setHoveredItem(sidebarItem.displayName),
        onMouseLeave: () => setHoveredItem(void 0),
        children: [jsx(Link, {
          href: sidebarItem?.link ?? "#",
          className: "text-fd-tertiary-50 hover:bg-fd-tertiary-700 flex w-auto shrink-0 cursor-pointer items-center justify-center rounded-md p-2 text-sm",
          children: jsx(Icon, {
            name: sidebarItem?.icon ?? defaultSidebarIconName,
            color: "text-fd-tertiary-50",
            className: "size-4"
          })
        }), hoveredItem === sidebarItem.displayName && jsxs(Fragment, {
          children: [jsx("div", {
            className: "absolute top-full left-1/2 z-50 w-full -translate-x-1/2 pt-2"
          }), jsx("div", {
            className: "absolute top-full left-1/2 z-50 mt-1 -translate-x-1/2 pt-2",
            children: jsxs("div", {
              className: "bg-fd-tertiary-700 min-w-48 rounded-md p-2 shadow-lg",
              children: [jsx(Link, {
                href: sidebarItem?.link ?? "#",
                className: "text-fd-tertiary-50 hover:bg-fd-tertiary-600 block rounded-md px-3 py-2 text-sm font-semibold",
                children: sidebarItem?.displayName
              }), sidebarItem.sidebarSubmenuItems && sidebarItem.sidebarSubmenuItems.length > 0 && jsx("div", {
                className: "border-fd-tertiary-600 my-2 border-t"
              }), sidebarItem.sidebarSubmenuItems && jsx("div", {
                className: "flex flex-col gap-1",
                children: sidebarItem.sidebarSubmenuItems.map(_temp)
              })]
            })
          })]
        })]
      }, sidebarItem.displayName);
      $[3] = hoveredItem;
      $[4] = t1;
    } else {
      t1 = $[4];
    }
    t0 = jsx("nav", {
      className: "bg-fd-tertiary-900 flex items-center gap-1 p-2",
      children: sidebarItems.map(t1)
    });
    $[0] = hoveredItem;
    $[1] = sidebarItems;
    $[2] = t0;
  } else {
    t0 = $[2];
  }
  return t0;
}
function _temp(submenuItem) {
  return jsxs(Link, {
    href: submenuItem.link,
    className: "text-fd-tertiary-50 hover:bg-fd-tertiary-600 flex items-center gap-2 rounded-md px-3 py-2 text-sm",
    children: [submenuItem.icon && jsx(Icon, {
      name: submenuItem.icon,
      className: "text-fd-tertiary-50 size-4"
    }), submenuItem.displayName]
  }, submenuItem.displayName);
}
__name(TopNav, "TopNav");

export { TopNav as default };
