import { jsxs as u, jsx as t } from "react/jsx-runtime";
import { useCallback as h, useMemo as g } from "react";
import { BreadcrumbLink as x, BreadcrumbPage as I } from "../../BreadcrumbPrimitives.js";
import v from "../../../icon/components/icon-extend/IconExtend.js";
import C from "../../utils/createMenuItem.js";
import k from "../../../jtl-dropdown/JTLDropdown.js";
import B from "../../../icon/Icon.js";
const q = (d) => {
  const { label: r, route: a, isLastItem: f, onClick: n, children: e, icon: o, as: s, urlField: i } = d, p = e && e.length > 0, c = h(
    (m) => {
      n && (m.preventDefault(), n());
    },
    [n]
  ), l = g(
    () => /* @__PURE__ */ u(
      x,
      {
        href: a,
        className: "flex items-center gap-[var(--spacing-1)] text-[var(--base-muted-foreground)]",
        onClick: c,
        as: s,
        urlField: i,
        children: [
          o && /* @__PURE__ */ t(v, { icon: o, size: 16 }),
          r
        ]
      }
    ),
    [a, c, o, r, s, i]
  );
  if (!r && !o && console.warn("Breadcrumb: At least one of label or icon is required of BreadcrumbItem"), f)
    return /* @__PURE__ */ t(I, { children: r });
  if (p) {
    const m = (e == null ? void 0 : e.map((b) => C(b))) || [];
    return /* @__PURE__ */ t(k, { menuItems: m, children: /* @__PURE__ */ u("div", { className: "flex items-center gap-[var(--spacing-1)]", children: [
      l,
      /* @__PURE__ */ t(B, { name: "ChevronDown", size: 16, className: "text-[var(--base-muted-foreground)]" })
    ] }) });
  }
  return l;
};
export {
  q as default
};
//# sourceMappingURL=BreadcrumbItem.js.map
