import { jsxs as a, jsx as e, Fragment as s } from "react/jsx-runtime";
import H, { useCallback as E } from "react";
import I from "../icon/Icon.js";
import d from "../text/Text.js";
import R from "../breadcrumb/Breadcrumb.js";
import { c as f } from "../../index-BtlgVD4m.js";
import S from "../styled-icon/StyledIcon.js";
import V from "./components/title-combobox/TitleCombobox.js";
import v from "../separator/Separator.js";
import _ from "../tag/Tag.js";
import $ from "../badge/Badge.js";
import { Popover as F, PopoverTrigger as L, PopoverContent as M } from "../popover/PopoverPrimitive.js";
import x from "../button/Button.js";
const N = (i) => typeof i == "object" && i !== null && !Array.isArray(i) && !H.isValidElement(i), y = (i) => N(i) && Array.isArray(i.items), g = (i) => N(i) && typeof i.title == "string" && !y(i), T = ({
  title: i,
  titleOptions: l,
  onTitleChange: w,
  subtitle: o,
  breadcrumb: r,
  icon: n,
  tags: t,
  badge: p,
  actions: m,
  onPuzzleToggle: c,
  showPuzzleButton: A = !0,
  className: j
}) => {
  const B = E(() => {
    c == null || c();
  }, [c]), C = l && l.length > 0;
  return /* @__PURE__ */ a("header", { "aria-label": "App Header", className: f("flex flex-col gap-[var(--spacing-1-5)]", j), children: [
    r && /* @__PURE__ */ e("div", { className: f("self-stretch", g(r) && "flex items-center gap-[var(--spacing-5)]"), children: g(r) ? /* @__PURE__ */ a(s, { children: [
      r.icon && /* @__PURE__ */ e("div", { className: "p-[var(--spacing-2)]", children: /* @__PURE__ */ e(I, { name: r.icon, size: 12 }) }),
      /* @__PURE__ */ e(d, { type: "small", color: "muted", children: r.title })
    ] }) : y(r) ? /* @__PURE__ */ e(R, { ...r }) : r }),
    /* @__PURE__ */ a("div", { className: "flex items-center justify-between gap-[var(--spacing-4)]", children: [
      /* @__PURE__ */ a("div", { className: "flex items-center gap-[var(--spacing-4)] min-w-0", children: [
        n && /* @__PURE__ */ e("div", { className: "max-md:hidden", children: /* @__PURE__ */ e(S, { icon: n.icon, variant: n.variant, size: n.size }) }),
        /* @__PURE__ */ a("div", { className: "flex flex-col gap-[var(--spacing-0-5)] min-w-0", children: [
          /* @__PURE__ */ a("div", { className: "flex flex-wrap items-center gap-[var(--spacing-4)] min-w-0", children: [
            C ? /* @__PURE__ */ e(V, { title: i, titleOptions: l, onTitleChange: w }) : /* @__PURE__ */ e(d, { type: "h3", weight: "semibold", children: i }),
            t && t.length > 0 && /* @__PURE__ */ a(s, { children: [
              /* @__PURE__ */ e("div", { className: "h-[var(--spacing-5)] max-md:hidden", children: /* @__PURE__ */ e(v, { orientation: "vertical" }) }),
              /* @__PURE__ */ e("div", { className: "flex flex-wrap items-center gap-[var(--spacing-2)] max-md:hidden", children: t.map((h, k) => /* @__PURE__ */ e(_, { ...h }, `${h.label}-${k}`)) })
            ] }),
            p && /* @__PURE__ */ a(s, { children: [
              /* @__PURE__ */ e("div", { className: "h-[var(--spacing-5)] max-md:hidden", children: /* @__PURE__ */ e(v, { orientation: "vertical" }) }),
              /* @__PURE__ */ e("div", { "aria-live": "polite", className: "max-md:hidden", children: /* @__PURE__ */ e($, { ...p }) })
            ] })
          ] }),
          o && /* @__PURE__ */ e(d, { type: "small", color: "muted", children: o })
        ] })
      ] }),
      /* @__PURE__ */ a("div", { className: "flex items-center gap-[var(--spacing-3)] shrink-0", children: [
        m && /* @__PURE__ */ a(s, { children: [
          /* @__PURE__ */ e("div", { className: "flex items-center gap-[var(--spacing-3)] max-md:hidden", children: m }),
          /* @__PURE__ */ e("div", { className: "md:hidden", children: /* @__PURE__ */ a(F, { children: [
            /* @__PURE__ */ e(L, { asChild: !0, children: /* @__PURE__ */ e(x, { variant: "outline", size: "icon", icon: "EllipsisVertical", "aria-label": "More actions" }) }),
            /* @__PURE__ */ e(M, { align: "end", className: "flex w-auto flex-col items-stretch gap-[var(--spacing-2)] p-[var(--spacing-2)]", children: m })
          ] }) })
        ] }),
        c && A && /* @__PURE__ */ e(x, { variant: "secondary", size: "icon", icon: "Puzzle", onClick: B, "aria-label": "Toggle puzzle" })
      ] })
    ] })
  ] });
};
T.displayName = "AppHeader";
export {
  T as default
};
//# sourceMappingURL=AppHeader.js.map
