import { jsx, jsxs } from "react/jsx-runtime";
import { useState, useMemo } from "react";
import default_1$1 from "../../node_modules/@mui/icons-material/KeyboardArrowRight.js";
import default_1 from "../../node_modules/@mui/icons-material/MoreHoriz.js";
import { HomeIcon } from "./HomeIcon.js";
/* empty css                        */
import Link from "../../node_modules/@mui/material/Link/Link.js";
import Menu from "../../node_modules/@mui/material/Menu/Menu.js";
import MenuItem from "../../node_modules/@mui/material/MenuItem/MenuItem.js";
import Breadcrumbs$1 from "../../node_modules/@mui/material/Breadcrumbs/Breadcrumbs.js";
function Breadcrumbs({ list, className = "" }) {
  const [anchorEl, setAnchorEl] = useState(null);
  const isOpen = Boolean(anchorEl);
  const handleClick = (event) => {
    setAnchorEl(event.currentTarget);
  };
  const onClose = () => {
    setAnchorEl(null);
  };
  const breadCrumbList = useMemo(() => {
    const filtered = list.filter((_, idx) => idx < 2 || idx > list.length - 3);
    const temp = filtered.map((item, index, arr) => {
      const isLast = index === arr.length - 1;
      if (!isLast) {
        return /* @__PURE__ */ jsx(
          Link,
          {
            "aria-label": item.label === "Home" ? "Home" : void 0,
            className: `ia-styles ia-breadcrumb ${item.label === "Home" ? "ia-breadcrumb-home" : ""} ${item.disabled ? "ia-breadcrumb-disabled" : ""}`,
            href: !item.disabled && item.to ? item.to : void 0,
            underline: "none",
            onClick: !item.disabled && item.onClick ? (e) => {
              var _a;
              e.preventDefault();
              (_a = item.onClick) == null ? void 0 : _a.call(item);
            } : void 0,
            children: item.label === "Home" ? /* @__PURE__ */ jsx(HomeIcon, {}) : item.label
          },
          item.label
        );
      }
      return /* @__PURE__ */ jsx(
        "span",
        {
          className: `ia-styles ia-breadcrumb ia-breadcrumb-noLink ${item.disabled ? "ia-breadcrumb-disabled" : ""}`.trim(),
          children: item.label
        },
        item.label
      );
    });
    const extras = list.filter((_, idx) => idx >= 2 && idx <= list.length - 3);
    if (extras.length > 0 && temp.length > 1) {
      const secondItem = temp[1];
      temp[1] = /* @__PURE__ */ jsxs("div", { style: { display: "inline-flex" }, children: [
        secondItem,
        /* @__PURE__ */ jsx(
          "div",
          {
            "aria-expanded": isOpen,
            "aria-haspopup": "menu",
            "aria-label": "More breadcrumb links",
            className: "ia-styles ia-breadcrumb ia-breadcrumb-extras",
            role: "button",
            tabIndex: 0,
            onClick: handleClick,
            onKeyDown: (e) => {
              if (e.key === "Enter" || e.key === " ") {
                e.preventDefault();
                handleClick(e);
              }
            },
            children: /* @__PURE__ */ jsx(default_1, {})
          },
          "extras"
        ),
        /* @__PURE__ */ jsx(
          Menu,
          {
            anchorEl,
            anchorOrigin: { vertical: "bottom", horizontal: "left" },
            MenuListProps: { "aria-label": "More breadcrumb links" },
            open: isOpen,
            transformOrigin: { vertical: "top", horizontal: "left" },
            onClose,
            children: extras.map((e) => /* @__PURE__ */ jsx(
              MenuItem,
              {
                disabled: e.disabled,
                onClick: () => {
                  if (e.onClick) {
                    e.onClick();
                  } else if (e.to) {
                    window.open(e.to);
                  }
                  onClose();
                },
                children: e.label
              },
              e.label
            ))
          }
        )
      ] }, "extras-wrapper");
    }
    return temp;
  }, [list, isOpen]);
  return /* @__PURE__ */ jsx(
    Breadcrumbs$1,
    {
      "aria-label": "breadcrumb",
      className,
      separator: /* @__PURE__ */ jsx(default_1$1, { sx: { height: "15px", width: "12px" } }),
      sx: { lineHeight: "21px" },
      children: breadCrumbList
    }
  );
}
Breadcrumbs.displayName = "Breadcrumbs";
export {
  Breadcrumbs
};
