@tokenoftrust/storefront-runner 2.0.4 → 2.0.6

package/apps/storefront/migrations-apps/0011_dt_tracking_tenant_databases.sql

@@ -0,0 +1,23 @@
+-- Directory of per-tenant raw-interaction D1 databases (dt-storage-per-tenant-d1).
+-- Mapping ONLY — no interaction data lands here; the rows live in each tenant's
+-- own database (see src/lib/tracking/interactionSchema.ts). Additive.
+CREATE TABLE `tracking_tenant_databases` (
+  `tenant_id` text PRIMARY KEY NOT NULL,
+  `database_name` text NOT NULL,
+  `database_uuid` text NOT NULL,
+  `schema_version` integer NOT NULL,
+  `created_at` text NOT NULL,
+  `updated_at` text NOT NULL,
+  `last_pruned_at` text,
+  `pruned_rows` integer DEFAULT 0 NOT NULL,
+  `size_bytes` integer,
+  `size_checked_at` text
+);
+--> statement-breakpoint
+-- Two tenants sharing one database would defeat structural isolation.
+CREATE UNIQUE INDEX `uq_tracking_tenant_databases_uuid`
+  ON `tracking_tenant_databases` (`database_uuid`);
+--> statement-breakpoint
+-- The scheduled prune's work queue: oldest-pruned first.
+CREATE INDEX `idx_tracking_tenant_databases_pruned`
+  ON `tracking_tenant_databases` (`last_pruned_at`);

package/apps/storefront/node_modules/.bin/vitest

@@ -25,9 +25,9 @@ case `uname -a` in
 esac
 
 if [ -z "$NODE_PATH" ]; then
-  export NODE_PATH="/home/runner/work/storefront/storefront/storefront-runner-dist/node_modules/.pnpm/vitest@2.1.8_@types+node@26.4.1_happy-dom@20.13.1_lightningcss@1.33.0/node_modules/vitest/node_modules:/home/runner/work/storefront/storefront/storefront-runner-dist/node_modules/.pnpm/vitest@2.1.8_@types+node@26.4.1_happy-dom@20.13.1_lightningcss@1.33.0/node_modules:/home/runner/work/storefront/storefront/storefront-runner-dist/node_modules/.pnpm/node_modules"
+  export NODE_PATH="/home/runner/work/storefront/storefront/storefront-runner-dist/node_modules/.pnpm/vitest@2.1.8_@types+node@26.4.1_happy-dom@20.13.2_lightningcss@1.33.0/node_modules/vitest/node_modules:/home/runner/work/storefront/storefront/storefront-runner-dist/node_modules/.pnpm/vitest@2.1.8_@types+node@26.4.1_happy-dom@20.13.2_lightningcss@1.33.0/node_modules:/home/runner/work/storefront/storefront/storefront-runner-dist/node_modules/.pnpm/node_modules"
 else
-  export NODE_PATH="/home/runner/work/storefront/storefront/storefront-runner-dist/node_modules/.pnpm/vitest@2.1.8_@types+node@26.4.1_happy-dom@20.13.1_lightningcss@1.33.0/node_modules/vitest/node_modules:/home/runner/work/storefront/storefront/storefront-runner-dist/node_modules/.pnpm/vitest@2.1.8_@types+node@26.4.1_happy-dom@20.13.1_lightningcss@1.33.0/node_modules:/home/runner/work/storefront/storefront/storefront-runner-dist/node_modules/.pnpm/node_modules:$NODE_PATH"
+  export NODE_PATH="/home/runner/work/storefront/storefront/storefront-runner-dist/node_modules/.pnpm/vitest@2.1.8_@types+node@26.4.1_happy-dom@20.13.2_lightningcss@1.33.0/node_modules/vitest/node_modules:/home/runner/work/storefront/storefront/storefront-runner-dist/node_modules/.pnpm/vitest@2.1.8_@types+node@26.4.1_happy-dom@20.13.2_lightningcss@1.33.0/node_modules:/home/runner/work/storefront/storefront/storefront-runner-dist/node_modules/.pnpm/node_modules:$NODE_PATH"
 fi
 if [ -n "$exe" ] && [ -x "$basedir/node.exe" ]; then
   exec "$basedir/node.exe"  "$basedir_win/../vitest/vitest.mjs" "$@"

package/apps/storefront/node_modules/.vite/deps/_metadata.json

@@ -1,103 +1,103 @@
 {
-  "hash": "2d41c62f",
+  "hash": "b0be5d68",
   "configHash": "6038e6d2",
-  "lockfileHash": "07672895",
-  "browserHash": "9a70acd8",
+  "lockfileHash": "db60c5b3",
+  "browserHash": "ec565bb8",
   "optimized": {
     "@astrojs/preact/client.js": {
       "src": "../../../../../node_modules/.pnpm/@astrojs+preact@6.0.5_@babel+core@7.29.7_@types+node@26.4.1_esbuild@0.28.2_jiti@2.7.0_p_9974d7dcb4fcbb2fdffe5819f7140fba/node_modules/@astrojs/preact/dist/client.js",
       "file": "@astrojs_preact_client__js.js",
-      "fileHash": "19c809b6",
+      "fileHash": "455f86c5",
       "needsInterop": false
     },
     "@astrojs/preact > @preact/signals": {
       "src": "../../../../../node_modules/.pnpm/@preact+signals@2.11.1_preact@10.29.8/node_modules/@preact/signals/dist/signals.module.js",
       "file": "@astrojs_preact_n_@preact_signals.js",
-      "fileHash": "6efc42b1",
+      "fileHash": "8c741faa",
       "needsInterop": false
     },
     "@astrojs/preact/server.js": {
       "src": "../../../../../node_modules/.pnpm/@astrojs+preact@6.0.5_@babel+core@7.29.7_@types+node@26.4.1_esbuild@0.28.2_jiti@2.7.0_p_9974d7dcb4fcbb2fdffe5819f7140fba/node_modules/@astrojs/preact/dist/server.js",
       "file": "@astrojs_preact_server__js.js",
-      "fileHash": "405f1563",
+      "fileHash": "7505b6c7",
       "needsInterop": false
     },
     "astro > aria-query": {
       "src": "../../../../../node_modules/.pnpm/aria-query@5.3.2/node_modules/aria-query/lib/index.js",
       "file": "astro_n_aria-query.js",
-      "fileHash": "ac27fcae",
+      "fileHash": "eda53a8d",
       "needsInterop": true
     },
     "astro > axobject-query": {
       "src": "../../../../../node_modules/.pnpm/axobject-query@4.1.0/node_modules/axobject-query/lib/index.js",
       "file": "astro_n_axobject-query.js",
-      "fileHash": "d6a1e1fc",
+      "fileHash": "3a839b14",
       "needsInterop": true
     },
     "astro > html-escaper": {
       "src": "../../../../../node_modules/.pnpm/html-escaper@3.0.3/node_modules/html-escaper/esm/index.js",
       "file": "astro_n_html-escaper.js",
-      "fileHash": "4eaabdf2",
+      "fileHash": "842bf3b2",
       "needsInterop": false
     },
     "astro/runtime/client/dev-toolbar/entrypoint.js": {
       "src": "../../../../../node_modules/.pnpm/astro@7.2.10_@emnapi+core@1.11.1_@emnapi+runtime@1.11.3_@types+node@26.4.1_jiti@2.7.0_tsx@4.23.13_yaml@2.9.0/node_modules/astro/dist/runtime/client/dev-toolbar/entrypoint.js",
       "file": "astro_runtime_client_dev-toolbar_entrypoint__js.js",
-      "fileHash": "24f6e7f9",
+      "fileHash": "58367797",
       "needsInterop": false
     },
     "preact": {
       "src": "../../../../../node_modules/.pnpm/preact@10.29.8_preact-render-to-string@6.7.0/node_modules/preact/dist/preact.module.js",
       "file": "preact.js",
-      "fileHash": "733cb1c0",
+      "fileHash": "f07c9fbd",
       "needsInterop": false
     },
     "preact/compat": {
       "src": "../../../../../node_modules/.pnpm/preact@10.29.8_preact-render-to-string@6.7.0/node_modules/preact/compat/dist/compat.module.js",
       "file": "preact_compat.js",
-      "fileHash": "517559c2",
+      "fileHash": "848429c1",
       "needsInterop": false
     },
     "preact/compat/jsx-runtime": {
       "src": "../../../../../node_modules/.pnpm/preact@10.29.8_preact-render-to-string@6.7.0/node_modules/preact/compat/jsx-runtime.mjs",
       "file": "preact_compat_jsx-runtime.js",
-      "fileHash": "a6e4d5ed",
+      "fileHash": "8451bcf5",
       "needsInterop": false
     },
     "preact/debug": {
       "src": "../../../../../node_modules/.pnpm/preact@10.29.8_preact-render-to-string@6.7.0/node_modules/preact/debug/dist/debug.module.js",
       "file": "preact_debug.js",
-      "fileHash": "b40701f0",
+      "fileHash": "b7df4cef",
       "needsInterop": false
     },
     "preact/devtools": {
       "src": "../../../../../node_modules/.pnpm/preact@10.29.8_preact-render-to-string@6.7.0/node_modules/preact/devtools/dist/devtools.module.js",
       "file": "preact_devtools.js",
-      "fileHash": "e080fba3",
+      "fileHash": "6ceae058",
       "needsInterop": false
     },
     "preact/hooks": {
       "src": "../../../../../node_modules/.pnpm/preact@10.29.8_preact-render-to-string@6.7.0/node_modules/preact/hooks/dist/hooks.module.js",
       "file": "preact_hooks.js",
-      "fileHash": "e0b62eb2",
+      "fileHash": "937b89df",
       "needsInterop": false
     },
     "preact/jsx-dev-runtime": {
       "src": "../../../../../node_modules/.pnpm/preact@10.29.8_preact-render-to-string@6.7.0/node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js",
       "file": "preact_jsx-dev-runtime.js",
-      "fileHash": "cf9d7f05",
+      "fileHash": "debc9d4c",
       "needsInterop": false
     },
     "preact/jsx-runtime": {
       "src": "../../../../../node_modules/.pnpm/preact@10.29.8_preact-render-to-string@6.7.0/node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js",
       "file": "preact_jsx-runtime.js",
-      "fileHash": "8f9f2b2e",
+      "fileHash": "0bafc776",
       "needsInterop": false
     },
     "preact/test-utils": {
       "src": "../../../../../node_modules/.pnpm/preact@10.29.8_preact-render-to-string@6.7.0/node_modules/preact/test-utils/dist/testUtils.module.js",
       "file": "preact_test-utils.js",
-      "fileHash": "1083c021",
+      "fileHash": "3f269260",
       "needsInterop": false
     }
   },

package/apps/storefront/node_modules/.vite/deps_ssr/_metadata.json

@@ -1,8 +1,8 @@
 {
-  "hash": "1e6e1930",
+  "hash": "d22689c5",
   "configHash": "d885ab85",
-  "lockfileHash": "07672895",
-  "browserHash": "2860703c",
+  "lockfileHash": "db60c5b3",
+  "browserHash": "89c4e2b4",
   "optimized": {},
   "chunks": {}
 }

package/apps/storefront/src/components/chrome/MegaMenu.astro

@@ -9,6 +9,7 @@
  */
 import type { ChromeNavItem } from "@/lib/chrome/model";
 import NavDropdown from "@/components/chrome/NavDropdown.astro";
+import { CHROME_PLACEMENT } from "@/lib/chrome/trackingPlacements";
 
 interface Props {
   items: ChromeNavItem[];
@@ -21,6 +22,15 @@ const { items, ariaLabel = "Primary", class: className } = Astro.props;
 
 <nav aria-label={ariaLabel} class:list={["hidden md:block", className]}>
   <ul class="flex items-center gap-6">
-    {items.map((item) => <NavDropdown item={item} />)}
+    {
+      items.map((item, i) => (
+        <NavDropdown
+          item={item}
+          placement={CHROME_PLACEMENT.primaryNav}
+          menuPlacement={CHROME_PLACEMENT.megaMenu}
+          index={i}
+        />
+      ))
+    }
   </ul>
 </nav>

package/apps/storefront/src/components/chrome/NavDropdown.astro

@@ -18,6 +18,7 @@
 import type { ChromeNavItem, ChromeLink } from "@/lib/chrome/model";
 import { withBase } from "@/lib/basePath";
 import { isCurrentNavHref } from "@/lib/chrome/navCurrent";
+import { trackingAttributes } from "@tot/public-runtime";
 
 interface Props {
   item: ChromeNavItem;
@@ -26,9 +27,19 @@ interface Props {
    * "accordion" = mobile stacked item using a native <details> disclosure.
    */
   mode?: "bar" | "accordion";
+  /**
+   * `data-tot-placement` for this item's OWN link — explicit, passed by the
+   * caller (MegaMenu for mode="bar", SiteHeader's no-JS mobile fallback for
+   * mode="accordion"). Never inferred from `mode`.
+   */
+  placement: string;
+  /** `data-tot-placement` for this item's dropdown/mega children. */
+  menuPlacement: string;
+  /** This item's zero-based position within the top-level nav list (`data-tot-i`, scope "nav-primary"). */
+  index: number;
 }
 
-const { item, mode = "bar" } = Astro.props;
+const { item, mode = "bar", placement, menuPlacement, index } = Astro.props;
 const { basePath } = Astro.locals;
 
 const itemHref = withBase(basePath, item.href);
@@ -44,12 +55,37 @@ const hasMenu =
 const isMega = !!(item.columns && item.columns.length > 0);
 // Normalize columns/children into titled groups for the accordion body so the
 // same markup renders a mega panel (multiple titled columns) or a single-column
-// dropdown (one untitled group).
-const groups = isMega
+// dropdown (one untitled group). Each link is paired with its flat position
+// within THIS item's repeat container (scope `nav-mega:<item.id>`).
+let flatChildIndex = 0;
+const rawGroups = isMega
   ? item.columns!.map((c) => ({ title: c.title, links: c.links }))
   : item.children
     ? [{ title: undefined as string | undefined, links: item.children }]
     : [];
+const groups = rawGroups.map((g) => ({
+  title: g.title,
+  links: g.links.map((link) => ({ link, index: flatChildIndex++ })),
+}));
+
+const itemStamp = trackingAttributes({
+  el: item.id,
+  action: item.action,
+  tracking: item.tracking,
+  placement,
+  scope: "nav-primary",
+  index,
+});
+const megaScope = `nav-mega:${item.id}`;
+const childStamp = (link: ChromeLink, childIndex: number) =>
+  trackingAttributes({
+    el: link.id,
+    action: link.action,
+    tracking: link.tracking,
+    placement: menuPlacement,
+    scope: megaScope,
+    index: childIndex,
+  });
 ---
 
 {
@@ -79,13 +115,14 @@ const groups = isMega
                   </p>
                 )}
                 <ul class="grid gap-0.5">
-                  {col.links.map((child) => (
+                  {col.links.map(({ link: child, index: childIndex }) => (
                     <li>
                       <a
                         href={hrefOf(child)}
                         aria-current={isChildCurrent(child) ? "page" : undefined}
                         class="flex items-center gap-1.5 rounded-sm px-2 py-1.5 text-sm text-muted transition-colors hover:bg-bg hover:text-primary"
                         {...(child.external ? { rel: "noopener noreferrer" } : { "data-astro-prefetch": true })}
+                        {...childStamp(child, childIndex)}
                       >
                         {child.label}
                         {child.badge && (
@@ -112,6 +149,7 @@ const groups = isMega
             "flex items-center gap-1.5 border-b border-border py-2.5 text-sm font-medium text-text transition-colors last:border-b-0 hover:text-accent",
             item.flag && "text-accent",
           ]}
+          {...itemStamp}
         >
           {item.label}
           {item.badge && (
@@ -133,6 +171,7 @@ const groups = isMega
           item.flag && "font-semibold text-accent",
         ]}
         aria-haspopup="true"
+        {...itemStamp}
       >
         {item.label}
         {item.badge && (
@@ -146,7 +185,7 @@ const groups = isMega
       <div class="invisible absolute left-0 top-full z-50 translate-y-1 opacity-0 transition-all duration-150 group-hover:visible group-hover:translate-y-0 group-hover:opacity-100 group-focus-within:visible group-focus-within:translate-y-0 group-focus-within:opacity-100">
         {isMega ? (
           <div class="mt-1 grid gap-6 rounded-md border border-border bg-surface p-5 shadow-md sm:grid-cols-2 lg:grid-cols-3">
-            {item.columns!.map((col) => (
+            {groups.map((col) => (
               <div class="min-w-44">
                 {col.title && (
                   <p class="mb-2 font-mono text-[0.62rem] uppercase tracking-[0.12em] text-muted">
@@ -154,13 +193,14 @@ const groups = isMega
                   </p>
                 )}
                 <ul class="grid gap-0.5">
-                  {col.links.map((child) => (
+                  {col.links.map(({ link: child, index: childIndex }) => (
                     <li>
                       <a
                         href={hrefOf(child)}
                         aria-current={isChildCurrent(child) ? "page" : undefined}
                         class="flex items-center gap-1.5 rounded-sm px-2 py-1 text-sm text-muted transition-colors hover:bg-bg hover:text-primary"
                         {...(child.external ? { rel: "noopener noreferrer" } : { "data-astro-prefetch": true })}
+                        {...childStamp(child, childIndex)}
                       >
                         {child.label}
                         {child.badge && (
@@ -177,13 +217,14 @@ const groups = isMega
           </div>
         ) : (
           <ul class="mt-1 grid min-w-56 gap-0.5 rounded-md border border-border bg-surface p-3 shadow-md">
-            {item.children!.map((child) => (
+            {groups[0]?.links.map(({ link: child, index: childIndex }) => (
               <li>
                 <a
                   href={hrefOf(child)}
                   aria-current={isChildCurrent(child) ? "page" : undefined}
                   class="block rounded-sm px-3 py-1.5 text-sm text-muted transition-colors hover:bg-bg hover:text-primary"
                   {...(child.external ? { rel: "noopener noreferrer" } : { "data-astro-prefetch": true })}
+                  {...childStamp(child, childIndex)}
                 >
                   {child.label}
                 </a>
@@ -203,6 +244,7 @@ const groups = isMega
           "inline-flex items-center gap-1 py-2 text-sm transition-colors hover:text-accent",
           item.flag && "font-semibold text-accent",
         ]}
+        {...itemStamp}
       >
         {item.label}
         {item.badge && (

package/apps/storefront/src/components/chrome/SiteFooter.astro

@@ -9,6 +9,8 @@
  */
 import type { ChromeLink, FooterColumn, FooterNewsletter, SocialLink, ChromeLogo, FooterVariant } from "@/lib/chrome/model";
 import { withBase } from "@/lib/basePath";
+import { CHROME_PLACEMENT } from "@/lib/chrome/trackingPlacements";
+import { trackingAttributes } from "@tot/public-runtime";
 
 interface Props {
   columns: FooterColumn[];
@@ -46,6 +48,24 @@ const {
 const { basePath } = Astro.locals;
 const hrefOf = (l: ChromeLink) => (l.external ? l.href : withBase(basePath, l.href));
 const showLogo = !!brand?.logo && /^(https?:|\/)/.test(brand.logo.src);
+const columnLinkStamp = (l: ChromeLink, colIndex: number, index: number) =>
+  trackingAttributes({
+    el: l.id,
+    action: l.action,
+    tracking: l.tracking,
+    placement: CHROME_PLACEMENT.footer,
+    scope: `footer-col:${colIndex}`,
+    index,
+  });
+const bottomLinkStamp = (l: ChromeLink, index: number) =>
+  trackingAttributes({
+    el: l.id,
+    action: l.action,
+    tracking: l.tracking,
+    placement: CHROME_PLACEMENT.footerBottom,
+    scope: "footer-bottom",
+    index,
+  });
 ---
 
 <footer class:list={["border-t border-border bg-surface text-text", className]} data-variant={variant}>
@@ -116,16 +136,17 @@ const showLogo = !!brand?.logo && /^(https?:|\/)/.test(brand.logo.src);
 
       <!-- Link columns -->
       {
-        columns.map((col) => (
+        columns.map((col, colIndex) => (
           <div>
             <h3 class="font-display text-sm font-semibold">{col.title}</h3>
             <ul class="mt-3 grid gap-2">
-              {col.links.map((l) => (
+              {col.links.map((l, i) => (
                 <li>
                   <a
                     href={hrefOf(l)}
                     class="text-sm text-muted transition-colors hover:text-primary"
                     {...(l.external ? { rel: "noopener noreferrer" } : {})}
+                    {...columnLinkStamp(l, colIndex, i)}
                   >
                     {l.label}
                   </a>
@@ -198,9 +219,13 @@ const showLogo = !!brand?.logo && /^(https?:|\/)/.test(brand.logo.src);
             bottomLinks.length > 0 && (
               <nav aria-label="Legal">
                 <ul class="flex flex-wrap gap-x-5 gap-y-1">
-                  {bottomLinks.map((l) => (
+                  {bottomLinks.map((l, i) => (
                     <li>
-                      <a href={hrefOf(l)} class="transition-colors hover:text-primary">
+                      <a
+                        href={hrefOf(l)}
+                        class="transition-colors hover:text-primary"
+                        {...bottomLinkStamp(l, i)}
+                      >
                         {l.label}
                       </a>
                     </li>

package/apps/storefront/src/components/chrome/SiteHeader.astro

@@ -19,6 +19,9 @@ import NavDropdown from "@/components/chrome/NavDropdown.astro";
 import SearchTypeahead from "@/components/islands/SearchTypeahead.tsx";
 import MobileNav from "@/components/islands/MobileNav.tsx";
 import { withBase } from "@/lib/basePath";
+import { ctaIdentityAttr } from "@/lib/chrome/ctaIdentity";
+import { CHROME_PLACEMENT } from "@/lib/chrome/trackingPlacements";
+import { trackingAttributes } from "@tot/public-runtime";
 
 interface Props {
   logo?: ChromeLogo;
@@ -97,11 +100,17 @@ const ctaClass = (v?: string) =>
 // source produces `columns` today; NavDropdown's accordion mode is the richer
 // zero-JS alternative if per-column grouping is ever needed on mobile.
 const mobileNav = nav.map((item) => ({
+  id: item.id,
   label: item.label,
   href: withBase(basePath, item.href),
+  action: item.action,
+  tracking: item.tracking,
   children: (item.children ?? item.columns?.flatMap((c) => c.links))?.map((child) => ({
+    id: child.id,
     label: child.label,
     href: withBase(basePath, child.href),
+    action: child.action,
+    tracking: child.tracking,
   })),
 }));
 
@@ -186,11 +195,27 @@ const currentPath = Astro.url.pathname;
         {
           !minimal && headerCtas.length > 0 && (
             <div class="hidden items-center gap-2 sm:flex">
-              {headerCtas.map((cta) => (
-                <a href={withBase(basePath, cta.href)} class={ctaClass(cta.variant)}>
-                  {cta.label}
-                </a>
-              ))}
+              {headerCtas.map((cta, i) => {
+                const idAttr = ctaIdentityAttr(cta);
+                const stamp = trackingAttributes({
+                  el: cta.id,
+                  action: cta.action,
+                  tracking: cta.tracking,
+                  placement: CHROME_PLACEMENT.header,
+                  scope: "header-ctas",
+                  index: i,
+                });
+                return (
+                  <a
+                    href={withBase(basePath, cta.href)}
+                    class={ctaClass(cta.variant)}
+                    {...{ [idAttr.name]: idAttr.value }}
+                    {...stamp}
+                  >
+                    {cta.label}
+                  </a>
+                );
+              })}
             </div>
           )
         }
@@ -269,7 +294,15 @@ const currentPath = Astro.url.pathname;
           <MegaMenu items={nav} />
           <nav aria-label="Mobile" data-mobile-nav-fallback class="md:hidden">
             <ul class="grid">
-              {nav.map((item) => <NavDropdown item={item} mode="accordion" />)}
+              {nav.map((item, i) => (
+                <NavDropdown
+                  item={item}
+                  mode="accordion"
+                  placement={CHROME_PLACEMENT.mobileMenu}
+                  menuPlacement={CHROME_PLACEMENT.mobileMenu}
+                  index={i}
+                />
+              ))}
             </ul>
           </nav>
         </div>

package/apps/storefront/src/components/chrome/UtilityNav.astro

@@ -7,6 +7,8 @@
  */
 import type { ChromeLink, SocialLink } from "@/lib/chrome/model";
 import { withBase } from "@/lib/basePath";
+import { CHROME_PLACEMENT } from "@/lib/chrome/trackingPlacements";
+import { trackingAttributes } from "@tot/public-runtime";
 
 interface Props {
   links?: ChromeLink[];
@@ -19,6 +21,15 @@ interface Props {
 const { links = [], locale, currency, social = [], class: className } = Astro.props;
 const { basePath } = Astro.locals;
 const hrefOf = (l: ChromeLink) => (l.external ? l.href : withBase(basePath, l.href));
+const linkStamp = (l: ChromeLink, index: number) =>
+  trackingAttributes({
+    el: l.id,
+    action: l.action,
+    tracking: l.tracking,
+    placement: CHROME_PLACEMENT.utilityNav,
+    scope: "utility-nav",
+    index,
+  });
 ---
 
 <div
@@ -30,12 +41,13 @@ const hrefOf = (l: ChromeLink) => (l.external ? l.href : withBase(basePath, l.hr
   <div class="container-prose flex h-9 items-center justify-between gap-4 text-[0.72rem]">
     <ul class="flex items-center gap-5">
       {
-        links.map((l) => (
+        links.map((l, i) => (
           <li>
             <a
               href={hrefOf(l)}
               class="transition-colors hover:text-primary"
               {...(l.external ? { rel: "noopener noreferrer" } : {})}
+              {...linkStamp(l, i)}
             >
               {l.label}
             </a>

package/apps/storefront/src/components/islands/MobileNav.tsx

@@ -12,14 +12,30 @@
  */
 import { useCallback, useEffect, useRef, useState } from "preact/hooks";
 import { isCurrentNavHref } from "@/lib/chrome/navCurrent";
+import { CHROME_PLACEMENT } from "@/lib/chrome/trackingPlacements";
+import { trackingAttributes } from "@tot/public-runtime";
 
+/**
+ * `action`/`tracking` are declared loosely here (not the strict
+ * `TrackingDeclaration` union `SiteHeader.astro` maps from) — a fresh object
+ * literal spreading a discriminated union's fields widens to two independent
+ * optional properties, so TS can no longer see "exactly one of the two" at
+ * the type level. `trackingAttributes()` is still the runtime oracle: it
+ * throws on an invalid combination regardless of what the type allows.
+ */
 interface NavChild {
+  id: string;
   label: string;
   href: string;
+  action?: string;
+  tracking?: "none";
 }
 interface NavItem {
+  id: string;
   label: string;
   href: string;
+  action?: string;
+  tracking?: "none";
   children?: NavChild[];
 }
 
@@ -212,7 +228,7 @@ export default function MobileNav({ nav, announcement, currentPath }: Props) {
 
             <nav aria-label="Mobile" class="flex-1 px-2 py-4">
               <ul class="space-y-1">
-                {nav.map((item) => (
+                {nav.map((item, i) => (
                   <li key={item.href}>
                     {item.children && item.children.length > 0 ? (
                       <div class="px-3 py-2">
@@ -222,11 +238,19 @@ export default function MobileNav({ nav, announcement, currentPath }: Props) {
                             currentPath && isCurrentNavHref(currentPath, item.href) ? "page" : undefined
                           }
                           class="block font-display text-base font-medium text-text hover:text-primary"
+                          {...trackingAttributes({
+                            el: item.id,
+                            action: item.action,
+                            tracking: item.tracking,
+                            placement: CHROME_PLACEMENT.mobileMenu,
+                            scope: "nav-mobile",
+                            index: i,
+                          })}
                         >
                           {item.label}
                         </a>
                         <ul class="mt-1 space-y-0.5 border-l border-border pl-3">
-                          {item.children.map((child) => (
+                          {item.children.map((child, ci) => (
                             <li key={child.href}>
                               <a
                                 href={child.href}
@@ -234,6 +258,14 @@ export default function MobileNav({ nav, announcement, currentPath }: Props) {
                                   currentPath && isCurrentNavHref(currentPath, child.href) ? "page" : undefined
                                 }
                                 class="block rounded px-2 py-1.5 font-body text-sm text-muted hover:bg-border/40 hover:text-text"
+                                {...trackingAttributes({
+                                  el: child.id,
+                                  action: child.action,
+                                  tracking: child.tracking,
+                                  placement: CHROME_PLACEMENT.mobileMenu,
+                                  scope: `nav-mobile-mega:${item.id}`,
+                                  index: ci,
+                                })}
                               >
                                 {child.label}
                               </a>
@@ -248,6 +280,14 @@ export default function MobileNav({ nav, announcement, currentPath }: Props) {
                           currentPath && isCurrentNavHref(currentPath, item.href) ? "page" : undefined
                         }
                         class="block rounded px-3 py-2.5 font-display text-base font-medium text-text hover:bg-border/40 hover:text-primary"
+                        {...trackingAttributes({
+                          el: item.id,
+                          action: item.action,
+                          tracking: item.tracking,
+                          placement: CHROME_PLACEMENT.mobileMenu,
+                          scope: "nav-mobile",
+                          index: i,
+                        })}
                       >
                         {item.label}
                       </a>