@alfadocs/ui-kit-debug 0.70.0 → 0.72.0

package/dist/_chunks/public-header.agent-C-opZaOw.js

@@ -0,0 +1,597 @@
+import { jsx as e, jsxs as t, Fragment as R } from "react/jsx-runtime";
+import { forwardRef as h, useId as U, useState as y, useCallback as P, useImperativeHandle as Z, useContext as N, useEffect as _, useRef as D, createContext as ee } from "react";
+import { c as C } from "./index-D2ZczOXr.js";
+import { useTranslation as se } from "react-i18next";
+import * as p from "@radix-ui/react-navigation-menu";
+import { I as de } from "./icon-button-LqoiKcUN.js";
+import { S as f } from "./sheet-B_X54aZo.js";
+import { C as I } from "./chevron-down-DWE7GSq9.js";
+import { X as ae } from "./x-B5YnXwCz.js";
+import { M as ne } from "./menu-Op71AWIC.js";
+const g = ee("desktop"), re = C(
+  [
+    "ds:w-full ds:z-[var(--z-sticky)]",
+    "ds:transition-[background-color,box-shadow,transform] ds:duration-[var(--animation-duration)]",
+    "ds:motion-reduce:transition-none"
+  ].join(" "),
+  {
+    variants: {
+      variant: {
+        // Transparent fades to a solid pill chrome once data-stuck="true"
+        // (set by the rAF scroll listener). The fade is handled via the
+        // same background utility so `data-stuck` swaps cleanly between
+        // states.
+        transparent: [
+          "ds:flex ds:items-center ds:gap-[var(--spacing-md)]",
+          "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:sm:ps-[var(--spacing-lg)] ds:sm:pe-[var(--spacing-lg)]",
+          "ds:h-14 ds:md:h-16",
+          "ds:bg-transparent ds:text-[var(--foreground)]",
+          "ds:data-[stuck=true]:bg-[var(--card)]",
+          "ds:data-[stuck=true]:shadow-[var(--shadow-md)]",
+          // Once stuck, pair the elevation shadow with a tokenized
+          // block-end border so the header has a clear edge against the
+          // page below it — shadow alone fades to a faint halo on dark
+          // surfaces, leaving the bar reading as unbounded.
+          "ds:data-[stuck=true]:border-block-end ds:data-[stuck=true]:border-[color:var(--border)]",
+          "ds:forced-colors:border-b ds:forced-colors:border-[CanvasText]"
+        ].join(" "),
+        // `dark` flips its own scope into the dark token set so nav
+        // links + buttons inside read off-white text on the dark
+        // surface. Without the `theme-dark` scope the children inherit
+        // the light-theme `--foreground` and fail color-contrast at
+        // ~1.3:1. `--background` already resolves to a dark step under
+        // `theme-dark`, so we compose the surface from the standard
+        // theme token rather than locking to a raw ramp step.
+        dark: [
+          "ds:flex ds:items-center ds:gap-[var(--spacing-md)]",
+          "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:sm:ps-[var(--spacing-lg)] ds:sm:pe-[var(--spacing-lg)]",
+          "ds:h-14 ds:md:h-16",
+          "theme-dark ds:bg-[var(--background)] ds:text-[var(--foreground)]"
+        ].join(" "),
+        // brand: on-primary bar for public signer/marketing surfaces —
+        // e.g. sign.alfadocs.com signing nav. Tokens only; logo should be
+        // <Logo variant="monochrome" tone="inherit" /> to read on the
+        // primary fill.
+        brand: [
+          "ds:flex ds:items-center ds:gap-[var(--spacing-md)]",
+          "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:sm:ps-[var(--spacing-lg)] ds:sm:pe-[var(--spacing-lg)]",
+          "ds:h-14 ds:md:h-16",
+          "ds:bg-[var(--primary)] ds:text-[var(--primary-foreground)]"
+        ].join(" "),
+        // `pill` matches alfadocs.com's floating rounded-pill header.
+        // The outer header is fully transparent (no border, no bg) and
+        // simply provides a top-side gutter so the inner container reads
+        // as floating. The inner `data-component="public-header-container"`
+        // div is the visible chrome — border, rounded, card background.
+        pill: [
+          "ds:bg-transparent",
+          "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:pt-[var(--spacing-md)]",
+          "ds:sm:ps-[var(--spacing-lg)] ds:sm:pe-[var(--spacing-lg)] ds:sm:pt-[var(--spacing-md)]"
+        ].join(" ")
+      },
+      sticky: {
+        none: "",
+        top: "ds:sticky ds:top-0",
+        // `scroll-up` is sticky but translates off-screen when scrolling
+        // down past `stickyOffset` (handled by data-hidden="true") and
+        // slides back in when scrolling up.
+        "scroll-up": [
+          "ds:sticky ds:top-0",
+          "ds:data-[hidden=true]:-translate-y-full"
+        ].join(" ")
+      }
+    },
+    defaultVariants: { variant: "pill", sticky: "none" }
+  }
+), oe = [
+  "ds:flex ds:items-center ds:gap-[var(--spacing-md)]",
+  "ds:w-full ds:max-w-[1400px] ds:mx-auto",
+  "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:sm:ps-[var(--spacing-lg)] ds:sm:pe-[var(--spacing-lg)]",
+  // 76px isn't a kit token; the closest is h-16 (64px) which reads tight
+  // against alfadocs.com's chrome — keep an explicit min-block-size so
+  // the pill reads as substantial without bloating beyond live reference.
+  "ds:min-h-16 ds:md:min-h-[76px]",
+  "ds:bg-[var(--card)] ds:text-[var(--foreground)]",
+  "ds:rounded-[var(--radius-lg)]",
+  // Surface-border hairline shared with `Card`. Tuned to ~14% black
+  // (light) / 16% white (dark) at the token level so the edge stays
+  // visible against tinted page backgrounds — see `--card-border` in
+  // `src/tokens/index.css`. Matches alfadocs.com's slate-200 reference
+  // pill border without introducing a pill-specific token.
+  "ds:border ds:border-[color:var(--card-border)]",
+  "ds:transition-colors ds:duration-[var(--animation-duration)]",
+  "ds:motion-reduce:transition-none"
+].join(" "), ie = C(
+  [
+    "ds:inline-flex ds:items-center",
+    "type-body-sm ds:font-medium",
+    // Muted-foreground reads as secondary text and matches alfadocs.com's
+    // nav-link colour (the reference's slate-grey). `--foreground` was too
+    // dark vs the ref.
+    "ds:text-[var(--muted-foreground)]",
+    "ds:rounded-[var(--radius-sm)]",
+    "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:py-[var(--spacing-xs)]",
+    "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+    "ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+    "ds:hover:text-[var(--primary)]",
+    "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+    "ds:data-[active=true]:text-[var(--primary)]",
+    "ds:data-[active=true]:[box-shadow:inset_0_-2px_0_var(--primary)]"
+  ].join(" ")
+), te = [
+  "ds:group ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]",
+  "type-body-sm ds:font-medium",
+  // Mirror the navLinkVariants colour + inline padding so triggers and
+  // plain links share weight, colour and target size.
+  "ds:text-[var(--muted-foreground)]",
+  "ds:rounded-[var(--radius-sm)]",
+  "ds:bg-transparent ds:border-0 ds:cursor-pointer",
+  "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:py-[var(--spacing-xs)]",
+  "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+  "ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+  "ds:hover:text-[var(--primary)]",
+  "ds:data-[state=open]:text-[var(--primary)]",
+  "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none"
+].join(" "), ce = [
+  "ds:size-3 ds:shrink-0",
+  "ds:transition-transform ds:duration-[var(--animation-duration)]",
+  "ds:group-data-[state=open]:rotate-180",
+  "ds:motion-reduce:transition-none"
+].join(" "), le = C(
+  [
+    // Radix portals Content into the Viewport; sizing + position is
+    // governed by the Viewport — keep Content's own paint to padding
+    // + inner layout so motion / position stay consistent across
+    // trigger placements.
+    "ds:data-[motion=from-start]:animate-in ds:data-[motion=from-start]:fade-in-0",
+    "ds:data-[motion=from-end]:animate-in ds:data-[motion=from-end]:fade-in-0",
+    "ds:data-[motion=to-start]:animate-out ds:data-[motion=to-start]:fade-out-0",
+    "ds:data-[motion=to-end]:animate-out ds:data-[motion=to-end]:fade-out-0",
+    "ds:motion-reduce:animate-none"
+  ].join(" "),
+  {
+    variants: {
+      wide: {
+        true: [
+          "ds:grid ds:grid-cols-2 ds:lg:grid-cols-4",
+          "ds:gap-[var(--spacing-lg)]",
+          "ds:p-[var(--spacing-lg)]",
+          "ds:w-screen ds:max-w-[1400px]"
+        ].join(" "),
+        false: ["ds:p-[var(--spacing-md)]", "ds:min-w-[280px]"].join(" ")
+      }
+    },
+    defaultVariants: { wide: !1 }
+  }
+), ue = [
+  // Position the Viewport flush below the pill / nav row. Radix sets
+  // `--radix-navigation-menu-viewport-width` and `…-height` so the
+  // panel sizes itself to whichever Content is currently active.
+  "ds:absolute ds:top-full ds:start-1/2 ds:-translate-x-1/2",
+  "ds:mt-[var(--spacing-sm)]",
+  "ds:w-[var(--radix-navigation-menu-viewport-width)]",
+  "ds:h-[var(--radix-navigation-menu-viewport-height)]",
+  "ds:overflow-hidden",
+  "ds:bg-[var(--card)] ds:text-[var(--foreground)]",
+  "ds:rounded-[var(--radius-lg)] ds:border ds:border-[color:var(--border)]",
+  "ds:shadow-[var(--shadow-lg)]",
+  "ds:data-[state=open]:animate-in ds:data-[state=closed]:animate-out",
+  "ds:data-[state=open]:fade-in-0 ds:data-[state=closed]:fade-out-0",
+  "ds:data-[state=open]:zoom-in-95 ds:data-[state=closed]:zoom-out-95",
+  "ds:origin-top ds:transition-[width,height] ds:duration-[var(--animation-duration)]",
+  "ds:motion-reduce:animate-none ds:motion-reduce:transition-none"
+].join(" "), z = [
+  "ds:flex ds:items-start ds:justify-between ds:gap-[var(--spacing-sm)]",
+  "ds:no-underline ds:text-[var(--foreground)]",
+  "ds:pb-[var(--spacing-sm)]",
+  // alfadocs.com renders the card header flush against the sub-list with
+  // no separator rule — match that by dropping the border-b that earlier
+  // versions of this component carried.
+  "ds:rounded-[var(--radius-sm)]",
+  "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+  "ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+  "ds:hover:[&_[data-card-title]]:text-[var(--primary)]",
+  "ds:hover:[&_[data-card-arrow]]:text-[var(--primary)]",
+  "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+  "ds:group/cardlink"
+].join(" "), me = [
+  "ds:pb-[var(--spacing-sm)]"
+  // Match the linked-card variant: no separator rule under the title.
+].join(" "), pe = [
+  "ds:block ds:no-underline",
+  "type-body-sm ds:font-medium ds:text-[var(--muted-foreground)]",
+  "ds:rounded-[var(--radius-sm)]",
+  "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:py-[var(--spacing-xs)]",
+  "ds:hover:bg-[var(--muted)]/30 ds:hover:text-[var(--primary)]",
+  "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+  "ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+  "ds:data-[active=true]:text-[var(--primary)]",
+  "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none"
+].join(" ");
+function ve() {
+  const [s, o] = y(() => typeof window > "u" || !window.matchMedia ? !1 : window.matchMedia("(prefers-reduced-motion: reduce)").matches);
+  return _(() => {
+    if (typeof window > "u" || !window.matchMedia) return;
+    const d = window.matchMedia("(prefers-reduced-motion: reduce)"), a = () => o(d.matches);
+    return d.addEventListener("change", a), () => d.removeEventListener("change", a);
+  }, []), s;
+}
+function fe(s, o, d) {
+  const [a, i] = y(!1), [n, r] = y(!1), l = D(0), u = D(!1);
+  return _(() => {
+    if (!s || typeof window > "u") return;
+    l.current = window.scrollY;
+    const v = () => {
+      const m = window.scrollY;
+      if (i(m > d), o === "scroll-up") {
+        const b = m - l.current;
+        b > 4 && m > d ? r(!0) : (b < -4 || m <= d) && r(!1);
+      }
+      l.current = m, u.current = !1;
+    }, c = () => {
+      u.current || (u.current = !0, window.requestAnimationFrame(v));
+    };
+    return window.addEventListener("scroll", c, { passive: !0 }), v(), () => {
+      window.removeEventListener("scroll", c);
+    };
+  }, [s, o, d]), { stuck: a, hidden: n };
+}
+function B({
+  logo: s,
+  homeHref: o,
+  resolvedHomeLabel: d,
+  resolvedNavLabel: a,
+  resolvedMenuLabel: i,
+  navSlot: n,
+  actionsSlot: r,
+  persistActions: l,
+  menuOpen: u,
+  setMenuOpen: v,
+  sheetId: c
+}) {
+  const m = !!n || !!r && !l;
+  return /* @__PURE__ */ t(R, { children: [
+    /* @__PURE__ */ e(
+      "a",
+      {
+        href: o,
+        "aria-label": d,
+        className: "ds:inline-flex ds:items-center ds:rounded-[var(--radius-sm)] ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+        children: s
+      }
+    ),
+    n ? /* @__PURE__ */ e(g.Provider, { value: "desktop", children: /* @__PURE__ */ t(
+      p.Root,
+      {
+        "aria-label": a,
+        className: "ds:hidden ds:md:flex ds:relative ds:items-center ds:ms-[var(--spacing-lg)] ds:flex-1 ds:[&>div:first-of-type]:flex ds:[&>div:first-of-type]:flex-1",
+        delayDuration: 150,
+        children: [
+          /* @__PURE__ */ e(p.List, { className: "ds:flex ds:flex-1 ds:items-center ds:justify-center ds:gap-[var(--spacing-md)] ds:list-none ds:m-0 ds:ps-0", children: n }),
+          /* @__PURE__ */ e("div", { className: "ds:absolute ds:top-full ds:start-0 ds:end-0 ds:flex ds:justify-center ds:pointer-events-none", children: /* @__PURE__ */ e("div", { className: "ds:pointer-events-auto", children: /* @__PURE__ */ e(p.Viewport, { className: ue }) }) })
+        ]
+      }
+    ) }) : null,
+    r ? /* @__PURE__ */ e(
+      "div",
+      {
+        className: [
+          // Pinned actions stay inline at every breakpoint; otherwise they
+          // are hidden < md and collapse into the mobile menu below.
+          l ? "ds:flex" : "ds:hidden ds:md:flex",
+          "ds:items-center ds:gap-[var(--spacing-sm)] ds:ms-auto"
+        ].join(" "),
+        children: r
+      }
+    ) : null,
+    m ? /* @__PURE__ */ t(f, { open: u, onOpenChange: v, children: [
+      /* @__PURE__ */ e(f.Trigger, { asChild: !0, children: /* @__PURE__ */ e(
+        de,
+        {
+          size: "md",
+          intent: "ghost",
+          className: "ds:ms-auto ds:md:hidden",
+          icon: u ? /* @__PURE__ */ e(ae, { "aria-hidden": "true" }) : /* @__PURE__ */ e(ne, { "aria-hidden": "true" }),
+          "aria-controls": c,
+          "aria-expanded": u,
+          "aria-label": i
+        }
+      ) }),
+      /* @__PURE__ */ t(f.Content, { side: "end", size: "md", id: c, children: [
+        /* @__PURE__ */ e(f.Header, { children: /* @__PURE__ */ e(f.Title, { children: a }) }),
+        /* @__PURE__ */ e(f.Body, { children: /* @__PURE__ */ t("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)]", children: [
+          n ? /* @__PURE__ */ e(g.Provider, { value: "mobile", children: /* @__PURE__ */ e(
+            "nav",
+            {
+              "aria-label": a,
+              className: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)]",
+              "data-mobile-nav": "true",
+              children: n
+            }
+          ) }) : null,
+          r && !l ? /* @__PURE__ */ e("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)] ds:mt-[var(--spacing-md)]", children: r }) : null
+        ] }) })
+      ] })
+    ] }) : null
+  ] });
+}
+const E = h(
+  ({
+    logo: s,
+    homeHref: o = "/",
+    homeLabel: d,
+    navSlot: a,
+    actionsSlot: i,
+    variant: n = "pill",
+    sticky: r = "none",
+    stickyOffset: l = 80,
+    menuLabel: u,
+    navLabel: v,
+    persistActions: c = !1,
+    id: m,
+    className: b,
+    ...Y
+  }, q) => {
+    const { t: x } = se(), j = ve(), F = U(), S = `${m ?? F}-sheet`, [w, k] = y(!1), W = n === "transparent" || r === "scroll-up", { stuck: A, hidden: X } = fe(
+      W,
+      r,
+      l
+    ), $ = j ? !1 : X, H = P(() => k(!0), []), M = P(() => k(!1), []);
+    Z(
+      q,
+      () => ({
+        openMenu: H,
+        closeMenu: M,
+        getMenuOpen: () => w
+      }),
+      [H, M, w]
+    );
+    const G = d ?? x("publicHeader.homeLabel", "AlfaDocs — home"), J = v ?? x("publicHeader.primaryNavLabel", "Primary"), Q = u ?? (w ? x("publicHeader.closeMenu", "Close menu") : x("publicHeader.openMenu", "Open menu")), L = {
+      logo: s,
+      homeHref: o,
+      resolvedHomeLabel: G,
+      resolvedNavLabel: J,
+      resolvedMenuLabel: Q,
+      navSlot: a,
+      actionsSlot: i,
+      persistActions: c,
+      menuOpen: w,
+      setMenuOpen: k,
+      sheetId: S
+    };
+    return /* @__PURE__ */ e(
+      "header",
+      {
+        ...Y,
+        "data-component": "public-header",
+        "data-component-id": m,
+        "data-variant": n,
+        "data-stuck": A ? "true" : void 0,
+        "data-hidden": $ ? "true" : void 0,
+        "data-state": j ? "reduced-motion" : void 0,
+        className: re({ variant: n, sticky: r, className: b }),
+        children: n === "pill" ? /* @__PURE__ */ e(
+          "div",
+          {
+            "data-component": "public-header-container",
+            className: oe,
+            children: /* @__PURE__ */ e(B, { ...L })
+          }
+        ) : /* @__PURE__ */ e(B, { ...L })
+      }
+    );
+  }
+);
+E.displayName = "PublicHeader";
+const T = h(({ active: s, className: o, children: d, ...a }, i) => N(g) === "mobile" ? /* @__PURE__ */ e(
+  "a",
+  {
+    ref: i,
+    ...a,
+    "data-active": s ? "true" : void 0,
+    "aria-current": s ? "page" : void 0,
+    className: [
+      "ds:block ds:no-underline",
+      "type-body-sm ds:font-medium",
+      "ds:text-[var(--foreground)]",
+      "ds:rounded-[var(--radius-sm)]",
+      "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:py-[var(--spacing-sm)]",
+      "ds:hover:bg-[var(--muted)]/30 ds:hover:text-[var(--primary)]",
+      "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+      "ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+      "ds:data-[active=true]:text-[var(--primary)]",
+      "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+      o
+    ].filter(Boolean).join(" "),
+    children: d
+  }
+) : /* @__PURE__ */ e(p.Item, { children: /* @__PURE__ */ e(p.Link, { asChild: !0, active: s, children: /* @__PURE__ */ e(
+  "a",
+  {
+    ref: i,
+    ...a,
+    "data-active": s ? "true" : void 0,
+    "aria-current": s ? "page" : void 0,
+    className: [ie(), o].filter(Boolean).join(" "),
+    children: d
+  }
+) }) }));
+T.displayName = "PublicHeader.NavLink";
+const V = h(({ label: s, wide: o = !1, children: d, id: a }, i) => N(g) === "mobile" ? /* @__PURE__ */ t(
+  "details",
+  {
+    id: a,
+    "data-component": "public-header-nav-dropdown",
+    className: "ds:group ds:border-b ds:border-[color:var(--border)]",
+    children: [
+      /* @__PURE__ */ t(
+        "summary",
+        {
+          className: [
+            "ds:flex ds:items-center ds:justify-between ds:cursor-pointer",
+            "type-body-sm ds:font-medium ds:text-[var(--foreground)]",
+            "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:py-[var(--spacing-sm)]",
+            "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+            "ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+            "ds:list-none ds:[&::-webkit-details-marker]:hidden"
+          ].join(" "),
+          children: [
+            /* @__PURE__ */ e("span", { children: s }),
+            /* @__PURE__ */ e(
+              I,
+              {
+                "aria-hidden": "true",
+                className: "ds:size-3 ds:shrink-0 ds:transition-transform ds:duration-[var(--animation-duration)] ds:group-[[open]]:rotate-180 ds:motion-reduce:transition-none"
+              }
+            )
+          ]
+        }
+      ),
+      /* @__PURE__ */ e("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)] ds:py-[var(--spacing-sm)]", children: d })
+    ]
+  }
+) : /* @__PURE__ */ t(p.Item, { "data-component": "public-header-nav-dropdown", children: [
+  /* @__PURE__ */ t(
+    p.Trigger,
+    {
+      ref: i,
+      id: a,
+      className: te,
+      children: [
+        s,
+        /* @__PURE__ */ e(I, { "aria-hidden": "true", className: ce })
+      ]
+    }
+  ),
+  /* @__PURE__ */ e(
+    p.Content,
+    {
+      className: le({ wide: o }),
+      children: d
+    }
+  )
+] }));
+V.displayName = "PublicHeader.NavDropdown";
+const O = h(({ href: s, title: o, subtitle: d, children: a }, i) => {
+  const n = N(g), r = /* @__PURE__ */ e(
+    "span",
+    {
+      "data-card-title": !0,
+      className: "type-title-card ds:text-[var(--foreground)] ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+      children: o
+    }
+  ), v = /* @__PURE__ */ t(R, { children: [
+    /* @__PURE__ */ t("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)]", children: [
+      r,
+      d ? /* @__PURE__ */ e("span", { className: "type-body-sm ds:text-[var(--muted-foreground)]", children: d }) : null
+    ] }),
+    /* @__PURE__ */ e(
+      "span",
+      {
+        "data-card-arrow": !0,
+        "aria-hidden": "true",
+        className: "ds:flex-none ds:text-[var(--muted-foreground)] ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none ds:rtl:-scale-x-100",
+        children: /* @__PURE__ */ t(
+          "svg",
+          {
+            xmlns: "http://www.w3.org/2000/svg",
+            width: "20",
+            height: "20",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            children: [
+              /* @__PURE__ */ e("path", { d: "M5 12h14" }),
+              /* @__PURE__ */ e("path", { d: "m12 5 7 7-7 7" })
+            ]
+          }
+        )
+      }
+    )
+  ] });
+  let c;
+  return s ? n === "mobile" ? c = /* @__PURE__ */ e("a", { href: s, className: z, children: v }) : c = /* @__PURE__ */ e(p.Link, { asChild: !0, children: /* @__PURE__ */ e("a", { href: s, className: z, children: v }) }) : c = /* @__PURE__ */ t("div", { className: me, children: [
+    r,
+    d ? /* @__PURE__ */ e("span", { className: "ds:block type-body-sm ds:text-[var(--muted-foreground)] ds:mt-[var(--spacing-xs)]", children: d }) : null
+  ] }), /* @__PURE__ */ t(
+    "div",
+    {
+      ref: i,
+      "data-component": "public-header-dropdown-card",
+      className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)]",
+      children: [
+        c,
+        a ? /* @__PURE__ */ e("ul", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)] ds:list-none ds:m-0 ds:ps-0", children: a }) : null
+      ]
+    }
+  );
+});
+O.displayName = "PublicHeader.DropdownCard";
+const K = h(({ active: s, className: o, children: d, ...a }, i) => {
+  const n = N(g), r = /* @__PURE__ */ e(
+    "a",
+    {
+      ref: i,
+      ...a,
+      "data-active": s ? "true" : void 0,
+      "aria-current": s ? "page" : void 0,
+      className: [pe, o].filter(Boolean).join(" "),
+      children: d
+    }
+  );
+  return /* @__PURE__ */ e("li", { "data-component": "public-header-dropdown-link", children: n === "mobile" ? r : /* @__PURE__ */ e(p.Link, { asChild: !0, active: s, children: r }) });
+});
+K.displayName = "PublicHeader.DropdownLink";
+const je = Object.assign(E, {
+  NavLink: T,
+  NavDropdown: V,
+  DropdownCard: O,
+  DropdownLink: K
+}), He = {
+  id: "public-header",
+  capabilities: ["open", "close"],
+  state: {
+    menuOpen: {
+      type: "boolean",
+      descriptionKey: "ui.agent.publicHeader.state.menuOpen",
+      description: "Whether the mobile drawer is currently open.",
+      read: (s) => s.getMenuOpen()
+    }
+  },
+  actions: {
+    open_menu: {
+      safety: "read",
+      idempotent: !0,
+      descriptionKey: "ui.agent.publicHeader.actions.openMenu",
+      description: "Open the mobile drawer.",
+      invoke: (s) => {
+        s.openMenu();
+      }
+    },
+    close_menu: {
+      safety: "read",
+      idempotent: !0,
+      descriptionKey: "ui.agent.publicHeader.actions.closeMenu",
+      description: "Close the mobile drawer.",
+      invoke: (s) => {
+        s.closeMenu();
+      }
+    }
+  },
+  domHooks: {
+    root: { attr: "data-component", value: "public-header" },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop on PublicHeader."
+    }
+  }
+};
+export {
+  je as P,
+  He as p
+};
+//# sourceMappingURL=public-header.agent-C-opZaOw.js.map