@aranova/tracking-next 0.20.0 → 0.20.1

package/README.md

@@ -425,6 +425,67 @@ The hook returns the effective `state` (`"granted" | "denied"`), its `source` (`
 
 **Migrating from the banner flow:** delete `<ConsentBanner />`, add a footer control built on `useCookiePreferences`, and mention the tracking + opt-out in your privacy policy. Existing visitors' stored grants stay granted; stored declines stay denied for 90 days from their first visit after the upgrade.
 
+## Blog Rendering
+
+Render Aranova-published blog posts straight from the CDN — no API calls, no database. Three subpaths:
+
+- `@aranova/tracking-next/blog` — **React-free**: `createBlogClient`, theme presets + `createBlogFontTheme`, SEO builders (`buildBlogPostMetadata`, `buildBlogPostingJsonLd`, `buildBlogSitemapEntries`), TOC/reading-time helpers. Safe in metadata, sitemaps, client bundles.
+- `@aranova/tracking-next/blog-server` — the RSC renderers `<BlogPost/>` / `<BlogPostView/>` + article chrome (Server Components only).
+- `@aranova/tracking-next/blog-client` — animated islands: `TocPanel` (scroll-spy TOC), `ReadingProgress` (progress bar with a headless `onProgress` mode).
+
+```tsx
+// lib/blog.ts
+import { createBlogClient } from "@aranova/tracking-next/blog";
+export const blogClient = createBlogClient({
+  apiKey: process.env.NEXT_PUBLIC_ARANOVA_TRACKING_API_KEY!,
+  cdnBaseUrl: process.env.NEXT_PUBLIC_ARANOVA_BLOG_CDN_URL!,
+  namespace: process.env.NEXT_PUBLIC_ARANOVA_BLOG_NAMESPACE!, // Aranova provides it
+});
+
+// lib/blog-theme.ts — start from a preset, wire your next/font vars
+import { BLOG_THEME_PRESETS, createBlogFontTheme } from "@aranova/tracking-next/blog";
+export const BLOG_THEME = createBlogFontTheme(BLOG_THEME_PRESETS.modern, {
+  heading: "var(--font-display)",
+  body: "var(--font-sans)",
+});
+
+// app/blog/[slug]/page.tsx (App Router)
+import { BlogPost } from "@aranova/tracking-next/blog-server";
+
+export const revalidate = 300; // re-publishes appear within 5 minutes
+export const dynamicParams = true;
+export async function generateStaticParams() {
+  return blogClient.getStaticParams();
+}
+
+export default async function Page({ params }: { params: Promise<{ slug: string }> }) {
+  const { slug } = await params;
+  return (
+    <BlogPost
+      slug={slug}
+      client={blogClient}
+      defaultTheme={BLOG_THEME}
+      showMeta
+      showToc
+      tocSide="right" // or "left"
+      tocCollapse="vertical" // or "horizontal" (collapses to a chevron chip)
+      showProgress
+      showBreadcrumbs
+      breadcrumbs={[
+        { label: "Home", href: "/" },
+        { label: "Blog", href: "/blog" },
+      ]}
+    />
+  );
+}
+```
+
+Index pages: `blogClient.listPosts()` returns manifest entries with `title`, `description`, `published_at`, `reading_minutes`, and `hero_image` — everything an image-card grid needs without fetching content objects. `buildBlogPostMetadata` / `buildBlogPostingJsonLd` / `buildBlogSitemapEntries` cover `generateMetadata`, JSON-LD, and `sitemap.ts`.
+
+Customization, cheapest first: the **theme** (`defaultTheme`, deep-partial: palette incl. optional dark, responsive type scale, spacing, radius, `caption_align`); **chrome props** (above); **component replacement** — `components={{ Cta: MyCtaSection, ... }}` swaps the renderer for any MDX component (`Cta`/`Callout`/`BlogImage`/`FaqItem`/`KeyTakeaways`, keep `data-aranova-cta={label}` on custom CTAs so cta_click auto-capture keeps firing); **per-surface classes** — `classNames={{ article, cta, toc, meta, ... }}` merged onto the stable `.aranova-blog-*` classes. The islands are importable directly for fully custom compositions — e.g. `<ReadingProgress showBar={false} onProgress={(f, pct) => ...} />` to drive your own indicator.
+
+Reads are best-effort: network/parse failures degrade to `null`/empty — a blog page never crashes the host site.
+
 ## Exports
 
 - Root package: `createTracking`, `TrackingProvider`, `useTracking`, `AdPlatformTracking`,
@@ -439,4 +500,5 @@ The hook returns the effective `state` (`"granted" | "denied"`), its `source` (`
 - `@aranova/tracking-next/middleware`: `createTrackingMiddleware()`
 - `@aranova/tracking-next/server`: `getTrackingParamsServer()`
 - `@aranova/tracking-next/phone`: isomorphic phone utils (no React)
+- `@aranova/tracking-next/blog` / `/blog-server` / `/blog-client`: CDN blog rendering (see Blog Rendering above)
 - Codegen: [`@aranova/tracking-cli`](https://www.npmjs.com/package/@aranova/tracking-cli) — `gen` typed service unions (devDependency)

package/dist/blog-client.d.mts

@@ -0,0 +1,69 @@
+import { ReactNode } from 'react';
+import { B as BlogHeading } from './toc-C_OvH3ES.mjs';
+
+interface TocPanelProps {
+    /** The post outline — see `extractBlogHeadings`. Empty array renders nothing. */
+    headings: readonly BlogHeading[];
+    /** Panel header label. Default `"On this page"`. */
+    title?: string;
+    /** Whether the panel body starts expanded. Default `true`. */
+    defaultOpen?: boolean;
+    /** Site-supplied class merged onto the fixed `.aranova-blog-toc-panel` class. */
+    className?: string;
+    /**
+     * Collapse axis. `"vertical"` (default) folds the list up under the title;
+     * `"horizontal"` folds it sideways toward `side`. Stamped as `data-collapse`
+     * for the base CSS.
+     */
+    collapse?: "vertical" | "horizontal";
+    /**
+     * Which edge a `"horizontal"` collapse recedes toward — match this to the
+     * rail's side so it folds into the page margin. Stamped as `data-side`.
+     * Default `"right"`.
+     */
+    side?: "left" | "right";
+}
+/**
+ * Collapsible, scroll-spying table of contents. Rendered into BlogPostView's
+ * `aside` slot by the enhanced `BlogPost` wrapper in `@aranova/tracking-next`
+ * (imported there via the `@aranova/tracking-next/blog-client` self-specifier
+ * so this module's `"use client"` boundary survives bundling).
+ */
+declare function TocPanel({ headings, title, defaultOpen, className, collapse, side, }: TocPanelProps): ReactNode;
+
+interface ReadingProgressProps {
+    /** CSS selector for the element whose read-through is measured. Default `".aranova-blog-post"`. */
+    target?: string;
+    /** Bar thickness in px. Default `3`. */
+    height?: number;
+    /** Site-supplied class merged onto the fixed `.aranova-blog-progress` class. */
+    className?: string;
+    /**
+     * Called on every scroll/resize frame with the read-through fraction (0–1)
+     * and its rounded 0–100 percent. Lets a site drive its OWN progress UI (a
+     * header meter, a percent readout) off the same measurement. Fires once on
+     * mount with the initial position. Latest callback is always used — a new
+     * function identity each render does not re-subscribe the listeners.
+     */
+    onProgress?: (fraction: number, percent: number) => void;
+    /**
+     * Render the built-in bar. Default `true`. Set `false` for a headless meter:
+     * the island still measures scroll and fires `onProgress`, but paints no bar
+     * (the site owns the visuals and their accessibility).
+     */
+    showBar?: boolean;
+}
+/**
+ * Fixed top-of-viewport reading progress bar (`role="progressbar"`, valuenow
+ * 0–100). Rendered into BlogPostView's `header` slot by the enhanced
+ * `BlogPost` wrapper in `@aranova/tracking-next` when `showProgress` is set.
+ *
+ * For a site-owned indicator, render this island directly (it is already a
+ * client component) with `onProgress` — optionally `showBar={false}` to drop
+ * the default bar and paint your own UI from the callback. The `BlogPost`
+ * server wrapper cannot forward a function across the RSC boundary, so the
+ * callback lives here, not on `showProgress`.
+ */
+declare function ReadingProgress({ target, height, className, onProgress, showBar, }: ReadingProgressProps): ReactNode;
+
+export { BlogHeading, ReadingProgress, type ReadingProgressProps, TocPanel, type TocPanelProps };

package/dist/blog-client.d.ts

@@ -0,0 +1,69 @@
+import { ReactNode } from 'react';
+import { B as BlogHeading } from './toc-C_OvH3ES.js';
+
+interface TocPanelProps {
+    /** The post outline — see `extractBlogHeadings`. Empty array renders nothing. */
+    headings: readonly BlogHeading[];
+    /** Panel header label. Default `"On this page"`. */
+    title?: string;
+    /** Whether the panel body starts expanded. Default `true`. */
+    defaultOpen?: boolean;
+    /** Site-supplied class merged onto the fixed `.aranova-blog-toc-panel` class. */
+    className?: string;
+    /**
+     * Collapse axis. `"vertical"` (default) folds the list up under the title;
+     * `"horizontal"` folds it sideways toward `side`. Stamped as `data-collapse`
+     * for the base CSS.
+     */
+    collapse?: "vertical" | "horizontal";
+    /**
+     * Which edge a `"horizontal"` collapse recedes toward — match this to the
+     * rail's side so it folds into the page margin. Stamped as `data-side`.
+     * Default `"right"`.
+     */
+    side?: "left" | "right";
+}
+/**
+ * Collapsible, scroll-spying table of contents. Rendered into BlogPostView's
+ * `aside` slot by the enhanced `BlogPost` wrapper in `@aranova/tracking-next`
+ * (imported there via the `@aranova/tracking-next/blog-client` self-specifier
+ * so this module's `"use client"` boundary survives bundling).
+ */
+declare function TocPanel({ headings, title, defaultOpen, className, collapse, side, }: TocPanelProps): ReactNode;
+
+interface ReadingProgressProps {
+    /** CSS selector for the element whose read-through is measured. Default `".aranova-blog-post"`. */
+    target?: string;
+    /** Bar thickness in px. Default `3`. */
+    height?: number;
+    /** Site-supplied class merged onto the fixed `.aranova-blog-progress` class. */
+    className?: string;
+    /**
+     * Called on every scroll/resize frame with the read-through fraction (0–1)
+     * and its rounded 0–100 percent. Lets a site drive its OWN progress UI (a
+     * header meter, a percent readout) off the same measurement. Fires once on
+     * mount with the initial position. Latest callback is always used — a new
+     * function identity each render does not re-subscribe the listeners.
+     */
+    onProgress?: (fraction: number, percent: number) => void;
+    /**
+     * Render the built-in bar. Default `true`. Set `false` for a headless meter:
+     * the island still measures scroll and fires `onProgress`, but paints no bar
+     * (the site owns the visuals and their accessibility).
+     */
+    showBar?: boolean;
+}
+/**
+ * Fixed top-of-viewport reading progress bar (`role="progressbar"`, valuenow
+ * 0–100). Rendered into BlogPostView's `header` slot by the enhanced
+ * `BlogPost` wrapper in `@aranova/tracking-next` when `showProgress` is set.
+ *
+ * For a site-owned indicator, render this island directly (it is already a
+ * client component) with `onProgress` — optionally `showBar={false}` to drop
+ * the default bar and paint your own UI from the callback. The `BlogPost`
+ * server wrapper cannot forward a function across the RSC boundary, so the
+ * callback lives here, not on `showProgress`.
+ */
+declare function ReadingProgress({ target, height, className, onProgress, showBar, }: ReadingProgressProps): ReactNode;
+
+export { BlogHeading, ReadingProgress, type ReadingProgressProps, TocPanel, type TocPanelProps };

package/dist/blog-client.js

@@ -0,0 +1,193 @@
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/blog-client.ts
+var blog_client_exports = {};
+__export(blog_client_exports, {
+  ReadingProgress: () => ReadingProgress,
+  TocPanel: () => TocPanel
+});
+module.exports = __toCommonJS(blog_client_exports);
+
+// ../tracking-core/src/resources/blog/view/client/toc-panel.tsx
+var import_react = require("react");
+
+// ../tracking-core/src/resources/blog/view/class-names.ts
+function joinClassNames(base, extra) {
+  return extra ? `${base} ${extra}` : base;
+}
+
+// ../tracking-core/src/resources/blog/view/client/toc-panel.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var SPY_ROOT_MARGIN = "-80px 0px -70% 0px";
+function prefersReducedMotion() {
+  return typeof window.matchMedia === "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+}
+function TocPanel({
+  headings,
+  title = "On this page",
+  defaultOpen = true,
+  className,
+  collapse = "vertical",
+  side = "right"
+}) {
+  const [open, setOpen] = (0, import_react.useState)(defaultOpen);
+  const [activeId, setActiveId] = (0, import_react.useState)(null);
+  const bodyId = (0, import_react.useId)();
+  const clickedAt = (0, import_react.useRef)(0);
+  const userToggled = (0, import_react.useRef)(false);
+  (0, import_react.useEffect)(() => {
+    if (!defaultOpen || userToggled.current) return;
+    if (typeof window.matchMedia === "function" && window.matchMedia("(max-width: 1099px)").matches) {
+      setOpen(false);
+    }
+  }, [defaultOpen]);
+  (0, import_react.useEffect)(() => {
+    const targets = headings.map((h) => document.getElementById(h.id)).filter((el) => el !== null);
+    if (targets.length === 0) return;
+    const visible = /* @__PURE__ */ new Set();
+    const observer = new IntersectionObserver(
+      (entries) => {
+        for (const entry of entries) {
+          if (entry.isIntersecting) visible.add(entry.target.id);
+          else visible.delete(entry.target.id);
+        }
+        if (Date.now() - clickedAt.current < 700) return;
+        const next = headings.find((h) => visible.has(h.id));
+        if (next) setActiveId(next.id);
+      },
+      { rootMargin: SPY_ROOT_MARGIN }
+    );
+    for (const el of targets) observer.observe(el);
+    return () => observer.disconnect();
+  }, [headings]);
+  const onLinkClick = (0, import_react.useCallback)((event, id) => {
+    const el = document.getElementById(id);
+    if (!el) return;
+    event.preventDefault();
+    clickedAt.current = Date.now();
+    setActiveId(id);
+    el.scrollIntoView({ behavior: prefersReducedMotion() ? "auto" : "smooth" });
+    history.replaceState(null, "", `#${id}`);
+  }, []);
+  if (headings.length === 0) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "div",
+    {
+      className: joinClassNames("aranova-blog-toc-panel", className),
+      "data-open": open ? "true" : "false",
+      "data-collapse": collapse,
+      "data-side": side,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "button",
+          {
+            type: "button",
+            className: "aranova-blog-toc-panel-title",
+            "aria-expanded": open,
+            "aria-controls": bodyId,
+            onClick: () => {
+              userToggled.current = true;
+              setOpen((o) => !o);
+            },
+            children: title
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { id: bodyId, className: "aranova-blog-toc-panel-body", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "aranova-blog-toc-panel-clip", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("nav", { "aria-label": "Table of contents", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ol", { children: headings.map((heading) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("li", { "data-depth": heading.depth, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "a",
+          {
+            href: `#${heading.id}`,
+            title: heading.text,
+            className: heading.id === activeId ? "aranova-blog-toc-panel-link is-active" : "aranova-blog-toc-panel-link",
+            "data-active": heading.id === activeId ? "true" : void 0,
+            "aria-current": heading.id === activeId ? "location" : void 0,
+            onClick: (event) => onLinkClick(event, heading.id),
+            children: heading.text
+          }
+        ) }, heading.id)) }) }) }) })
+      ]
+    }
+  );
+}
+
+// ../tracking-core/src/resources/blog/view/client/reading-progress.tsx
+var import_react2 = require("react");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function ReadingProgress({
+  target = ".aranova-blog-post",
+  height = 3,
+  className,
+  onProgress,
+  showBar = true
+}) {
+  const barRef = (0, import_react2.useRef)(null);
+  const onProgressRef = (0, import_react2.useRef)(onProgress);
+  onProgressRef.current = onProgress;
+  (0, import_react2.useEffect)(() => {
+    const article = document.querySelector(target);
+    if (!(article instanceof HTMLElement)) return;
+    let frame = 0;
+    const update = () => {
+      frame = 0;
+      const rect = article.getBoundingClientRect();
+      const total = rect.height - window.innerHeight;
+      const fraction = total <= 0 ? 1 : Math.min(1, Math.max(0, -rect.top / total));
+      const percent = Math.round(fraction * 100);
+      const bar = barRef.current;
+      if (bar) {
+        bar.style.transform = `scaleX(${fraction})`;
+        bar.setAttribute("aria-valuenow", String(percent));
+      }
+      onProgressRef.current?.(fraction, percent);
+    };
+    const schedule = () => {
+      if (frame === 0) frame = requestAnimationFrame(update);
+    };
+    update();
+    window.addEventListener("scroll", schedule, { passive: true });
+    window.addEventListener("resize", schedule);
+    return () => {
+      window.removeEventListener("scroll", schedule);
+      window.removeEventListener("resize", schedule);
+      if (frame !== 0) cancelAnimationFrame(frame);
+    };
+  }, [target]);
+  if (!showBar) return null;
+  const style = { height: `${height}px` };
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    "div",
+    {
+      ref: barRef,
+      className: joinClassNames("aranova-blog-progress", className),
+      role: "progressbar",
+      "aria-label": "Reading progress",
+      "aria-valuemin": 0,
+      "aria-valuemax": 100,
+      "aria-valuenow": 0,
+      style
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ReadingProgress,
+  TocPanel
+});
+//# sourceMappingURL=blog-client.js.map

package/dist/blog-client.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/blog-client.ts","../../tracking-core/src/resources/blog/view/client/toc-panel.tsx","../../tracking-core/src/resources/blog/view/class-names.ts","../../tracking-core/src/resources/blog/view/client/reading-progress.tsx"],"sourcesContent":["\"use client\";\n\n// Blog client-island entry — `@aranova/tracking-next/blog-client`. Authored\n// once in tracking-core (see blog-client-public.ts); this file exists as the\n// per-package tsup build entry, exactly like ./phone-react's `phone.ts`.\n//\n// The 'use client' directive must stay on line 1: tsup/esbuild preserves an\n// entry file's leading directive at the top of the emitted bundle, and Next\n// relies on it to treat the whole entry as a client-module boundary. Server\n// code (the enhanced BlogPost in blog-post.tsx) imports these islands ONLY via\n// the `@aranova/tracking-next/blog-client` self-specifier (external in tsup) —\n// a relative import would inline them into dist/blog-server.* under\n// `splitting: false` and silently drop this directive.\nexport * from \"../../tracking-core/src/blog-client-public\";\n","\"use client\";\n\n// Client-island table of contents — the animated companion to the zero-JS\n// `BlogTocShell`. Same anchor-id contract (`extractBlogHeadings` ↔ rehype-slug\n// parity), same theme vars, but with a spring-free collapsible body (the\n// grid-template-rows 0fr↔1fr trick) and an IntersectionObserver scroll-spy.\n//\n// SSR-safe: no window/document access at module scope or during render — the\n// observer attaches in an effect, so the island server-renders the FULL anchor\n// list (hydration-identical markup) and degrades to a plain in-page nav until\n// JS lands. Styled by the `.aranova-blog-toc-panel` section of the base CSS;\n// the sheet's global `prefers-reduced-motion: reduce` block disables the\n// open/close transition, and smooth scrolling checks the media query directly.\n\nimport {\n  useCallback,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n  type MouseEvent,\n  type ReactNode,\n} from \"react\";\n\nimport type { BlogHeading } from \"../../toc\";\nimport { joinClassNames } from \"../class-names\";\n\nexport interface TocPanelProps {\n  /** The post outline — see `extractBlogHeadings`. Empty array renders nothing. */\n  headings: readonly BlogHeading[];\n  /** Panel header label. Default `\"On this page\"`. */\n  title?: string;\n  /** Whether the panel body starts expanded. Default `true`. */\n  defaultOpen?: boolean;\n  /** Site-supplied class merged onto the fixed `.aranova-blog-toc-panel` class. */\n  className?: string;\n  /**\n   * Collapse axis. `\"vertical\"` (default) folds the list up under the title;\n   * `\"horizontal\"` folds it sideways toward `side`. Stamped as `data-collapse`\n   * for the base CSS.\n   */\n  collapse?: \"vertical\" | \"horizontal\";\n  /**\n   * Which edge a `\"horizontal\"` collapse recedes toward — match this to the\n   * rail's side so it folds into the page margin. Stamped as `data-side`.\n   * Default `\"right\"`.\n   */\n  side?: \"left\" | \"right\";\n}\n\n/** Matches the scroll-spy's idea of \"current section\" to the sticky-header offset. */\nconst SPY_ROOT_MARGIN = \"-80px 0px -70% 0px\";\n\nfunction prefersReducedMotion(): boolean {\n  // Defensive typeof: only ever called from event handlers (so window exists),\n  // but matchMedia is missing in some embedded webviews and in jsdom.\n  return (\n    typeof window.matchMedia === \"function\" &&\n    window.matchMedia(\"(prefers-reduced-motion: reduce)\").matches\n  );\n}\n\n/**\n * Collapsible, scroll-spying table of contents. Rendered into BlogPostView's\n * `aside` slot by the enhanced `BlogPost` wrapper in `@aranova/tracking-next`\n * (imported there via the `@aranova/tracking-next/blog-client` self-specifier\n * so this module's `\"use client\"` boundary survives bundling).\n */\nexport function TocPanel({\n  headings,\n  title = \"On this page\",\n  defaultOpen = true,\n  className,\n  collapse = \"vertical\",\n  side = \"right\",\n}: TocPanelProps): ReactNode {\n  const [open, setOpen] = useState(defaultOpen);\n  const [activeId, setActiveId] = useState<string | null>(null);\n  const bodyId = useId();\n  // Clicking a link sets the active id immediately; suppress the observer for\n  // a beat so intermediate sections don't flicker through during the scroll.\n  const clickedAt = useRef(0);\n  // The user's explicit toggle always wins over the mobile auto-collapse below.\n  const userToggled = useRef(false);\n\n  // On NARROW viewports (below the desktop rail breakpoint) a long outline\n  // rendered open pushes the article a full screen down — start collapsed\n  // there. Runs in an effect (not render) so SSR/hydration markup stays\n  // identical; guarded matchMedia for jsdom/old webviews.\n  useEffect(() => {\n    if (!defaultOpen || userToggled.current) return;\n    if (\n      typeof window.matchMedia === \"function\" &&\n      window.matchMedia(\"(max-width: 1099px)\").matches\n    ) {\n      setOpen(false);\n    }\n  }, [defaultOpen]);\n\n  useEffect(() => {\n    const targets = headings\n      // oxlint-disable-next-line unicorn/prefer-query-selector -- slug ids need CSS-escaping for querySelector, and CSS.escape is missing in some webviews\n      .map((h) => document.getElementById(h.id))\n      .filter((el): el is HTMLElement => el !== null);\n    if (targets.length === 0) return;\n\n    const visible = new Set<string>();\n    const observer = new IntersectionObserver(\n      (entries) => {\n        for (const entry of entries) {\n          if (entry.isIntersecting) visible.add(entry.target.id);\n          else visible.delete(entry.target.id);\n        }\n        if (Date.now() - clickedAt.current < 700) return;\n        // Active = the FIRST outline entry currently in the spy band; when the\n        // band is empty (between sections), keep the previous active id.\n        const next = headings.find((h) => visible.has(h.id));\n        if (next) setActiveId(next.id);\n      },\n      { rootMargin: SPY_ROOT_MARGIN },\n    );\n    for (const el of targets) observer.observe(el);\n    return () => observer.disconnect();\n  }, [headings]);\n\n  const onLinkClick = useCallback((event: MouseEvent<HTMLAnchorElement>, id: string) => {\n    // oxlint-disable-next-line unicorn/prefer-query-selector -- see above: getElementById needs no CSS-escaping\n    const el = document.getElementById(id);\n    if (!el) return; // fall through to the browser's default anchor jump\n    event.preventDefault();\n    clickedAt.current = Date.now();\n    setActiveId(id);\n    el.scrollIntoView({ behavior: prefersReducedMotion() ? \"auto\" : \"smooth\" });\n    history.replaceState(null, \"\", `#${id}`);\n  }, []);\n\n  if (headings.length === 0) return null;\n\n  return (\n    <div\n      className={joinClassNames(\"aranova-blog-toc-panel\", className)}\n      data-open={open ? \"true\" : \"false\"}\n      data-collapse={collapse}\n      data-side={side}\n    >\n      <button\n        type=\"button\"\n        className=\"aranova-blog-toc-panel-title\"\n        aria-expanded={open}\n        aria-controls={bodyId}\n        onClick={() => {\n          userToggled.current = true;\n          setOpen((o) => !o);\n        }}\n      >\n        {title}\n      </button>\n      {/* 0fr↔1fr grid wrapper: the inner div clips, the row track animates. */}\n      <div id={bodyId} className=\"aranova-blog-toc-panel-body\">\n        <div className=\"aranova-blog-toc-panel-clip\">\n          <nav aria-label=\"Table of contents\">\n            <ol>\n              {headings.map((heading) => (\n                <li key={heading.id} data-depth={heading.depth}>\n                  <a\n                    href={`#${heading.id}`}\n                    title={heading.text}\n                    className={\n                      heading.id === activeId\n                        ? \"aranova-blog-toc-panel-link is-active\"\n                        : \"aranova-blog-toc-panel-link\"\n                    }\n                    data-active={heading.id === activeId ? \"true\" : undefined}\n                    aria-current={heading.id === activeId ? \"location\" : undefined}\n                    onClick={(event) => onLinkClick(event, heading.id)}\n                  >\n                    {heading.text}\n                  </a>\n                </li>\n              ))}\n            </ol>\n          </nav>\n        </div>\n      </div>\n    </div>\n  );\n}\n","// Client-side className overrides for the blog view — the escape hatch for\n// sites that want to hook a Tailwind/utility class onto a specific surface\n// without replacing the whole component (see `components` for that) or\n// writing global CSS against the fixed `.aranova-blog-*` selectors (still the\n// simplest option and requires no API — these classes are stable and public).\n//\n// `joinClassNames` is a plain append, not a Tailwind-merge: every base class\n// here is an SDK-internal selector (`aranova-blog-callout`, …), never a\n// utility class, so there is nothing for an override to conflict with —\n// dropping a `tailwind-merge` dependency into a framework-free package for a\n// non-conflict is unnecessary weight.\nexport function joinClassNames(base: string, extra?: string): string {\n  return extra ? `${base} ${extra}` : base;\n}\n\n/**\n * One optional override per styleable surface. Every key merges onto its\n * fixed base class (never replaces it), so the `.aranova-blog-*` selector\n * still applies — this is additive, not a restyle mechanism.\n */\nexport interface BlogClassNameOverrides {\n  /** The `<article>` root. */\n  article?: string;\n  /** The content/aside grid wrapper. */\n  layout?: string;\n  /** The content column. */\n  content?: string;\n  /** The aside rail (table of contents). */\n  aside?: string;\n  /** `<Callout>` MDX component. */\n  callout?: string;\n  /** `<Cta>` MDX component. */\n  cta?: string;\n  /** `<BlogImage>` MDX component's `<figure>` wrapper. */\n  figure?: string;\n  /** `<FaqItem>` MDX component's `<details>` wrapper. */\n  faqItem?: string;\n  /** `<FaqItem>`'s `<summary>`. */\n  faqQuestion?: string;\n  /** `<FaqItem>`'s answer `<div>`. */\n  faqAnswer?: string;\n  /** `<KeyTakeaways>` MDX component. */\n  keyTakeaways?: string;\n  /** The `<table>` overflow wrapper `<div>`. */\n  tableWrap?: string;\n  /** `BlogPostMeta` byline row. */\n  meta?: string;\n  /** `BlogBreadcrumbs` nav. */\n  breadcrumbs?: string;\n  /** `BlogTocShell` / the animated `TocPanel` island. */\n  toc?: string;\n  /** The `ReadingProgress` island. */\n  progress?: string;\n}\n","\"use client\";\n\n// Client-island reading-progress bar: a fixed strip along the top of the\n// viewport that fills (scaleX) with the scrolled fraction of the article.\n//\n// NOT hidden under prefers-reduced-motion — the bar communicates position, it\n// is not decorative motion — but it carries no transitions: the fill tracks\n// the scroll position directly via rAF-throttled listeners (the sheet's\n// reduced-motion block has nothing to disable here). SSR-safe: renders at 0%\n// and only touches window/document inside the effect. Styled by the\n// `.aranova-blog-progress` section of the base CSS (primary color var on a\n// transparent track).\n\nimport { useEffect, useRef, type CSSProperties, type ReactNode } from \"react\";\n\nimport { joinClassNames } from \"../class-names\";\n\nexport interface ReadingProgressProps {\n  /** CSS selector for the element whose read-through is measured. Default `\".aranova-blog-post\"`. */\n  target?: string;\n  /** Bar thickness in px. Default `3`. */\n  height?: number;\n  /** Site-supplied class merged onto the fixed `.aranova-blog-progress` class. */\n  className?: string;\n  /**\n   * Called on every scroll/resize frame with the read-through fraction (0–1)\n   * and its rounded 0–100 percent. Lets a site drive its OWN progress UI (a\n   * header meter, a percent readout) off the same measurement. Fires once on\n   * mount with the initial position. Latest callback is always used — a new\n   * function identity each render does not re-subscribe the listeners.\n   */\n  onProgress?: (fraction: number, percent: number) => void;\n  /**\n   * Render the built-in bar. Default `true`. Set `false` for a headless meter:\n   * the island still measures scroll and fires `onProgress`, but paints no bar\n   * (the site owns the visuals and their accessibility).\n   */\n  showBar?: boolean;\n}\n\n/**\n * Fixed top-of-viewport reading progress bar (`role=\"progressbar\"`, valuenow\n * 0–100). Rendered into BlogPostView's `header` slot by the enhanced\n * `BlogPost` wrapper in `@aranova/tracking-next` when `showProgress` is set.\n *\n * For a site-owned indicator, render this island directly (it is already a\n * client component) with `onProgress` — optionally `showBar={false}` to drop\n * the default bar and paint your own UI from the callback. The `BlogPost`\n * server wrapper cannot forward a function across the RSC boundary, so the\n * callback lives here, not on `showProgress`.\n */\nexport function ReadingProgress({\n  target = \".aranova-blog-post\",\n  height = 3,\n  className,\n  onProgress,\n  showBar = true,\n}: ReadingProgressProps): ReactNode {\n  const barRef = useRef<HTMLDivElement | null>(null);\n  // Hold the latest callback so a changing function identity does not tear down\n  // and re-attach the scroll listeners every render.\n  const onProgressRef = useRef(onProgress);\n  onProgressRef.current = onProgress;\n\n  useEffect(() => {\n    const article = document.querySelector(target);\n    if (!(article instanceof HTMLElement)) return;\n\n    let frame = 0;\n    const update = (): void => {\n      frame = 0;\n      const rect = article.getBoundingClientRect();\n      // Fraction of the article scrolled past the viewport: 0 while its top is\n      // on-screen, 1 once its bottom clears the viewport. Articles shorter\n      // than the viewport read as fully-read the moment they are visible.\n      const total = rect.height - window.innerHeight;\n      const fraction = total <= 0 ? 1 : Math.min(1, Math.max(0, -rect.top / total));\n      const percent = Math.round(fraction * 100);\n      const bar = barRef.current;\n      if (bar) {\n        bar.style.transform = `scaleX(${fraction})`;\n        bar.setAttribute(\"aria-valuenow\", String(percent));\n      }\n      onProgressRef.current?.(fraction, percent);\n    };\n    const schedule = (): void => {\n      if (frame === 0) frame = requestAnimationFrame(update);\n    };\n\n    update();\n    window.addEventListener(\"scroll\", schedule, { passive: true });\n    window.addEventListener(\"resize\", schedule);\n    return () => {\n      window.removeEventListener(\"scroll\", schedule);\n      window.removeEventListener(\"resize\", schedule);\n      if (frame !== 0) cancelAnimationFrame(frame);\n    };\n  }, [target]);\n\n  if (!showBar) return null;\n\n  const style: CSSProperties = { height: `${height}px` };\n  return (\n    <div\n      ref={barRef}\n      className={joinClassNames(\"aranova-blog-progress\", className)}\n      role=\"progressbar\"\n      aria-label=\"Reading progress\"\n      aria-valuemin={0}\n      aria-valuemax={100}\n      aria-valuenow={0}\n      style={style}\n    />\n  );\n}\n"],"mappings":"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","names":["import_react","import_jsx_runtime"]}

package/dist/blog-client.mjs

@@ -0,0 +1,172 @@
+"use client";
+
+// ../tracking-core/src/resources/blog/view/client/toc-panel.tsx
+import {
+  useCallback,
+  useEffect,
+  useId,
+  useRef,
+  useState
+} from "react";
+
+// ../tracking-core/src/resources/blog/view/class-names.ts
+function joinClassNames(base, extra) {
+  return extra ? `${base} ${extra}` : base;
+}
+
+// ../tracking-core/src/resources/blog/view/client/toc-panel.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var SPY_ROOT_MARGIN = "-80px 0px -70% 0px";
+function prefersReducedMotion() {
+  return typeof window.matchMedia === "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+}
+function TocPanel({
+  headings,
+  title = "On this page",
+  defaultOpen = true,
+  className,
+  collapse = "vertical",
+  side = "right"
+}) {
+  const [open, setOpen] = useState(defaultOpen);
+  const [activeId, setActiveId] = useState(null);
+  const bodyId = useId();
+  const clickedAt = useRef(0);
+  const userToggled = useRef(false);
+  useEffect(() => {
+    if (!defaultOpen || userToggled.current) return;
+    if (typeof window.matchMedia === "function" && window.matchMedia("(max-width: 1099px)").matches) {
+      setOpen(false);
+    }
+  }, [defaultOpen]);
+  useEffect(() => {
+    const targets = headings.map((h) => document.getElementById(h.id)).filter((el) => el !== null);
+    if (targets.length === 0) return;
+    const visible = /* @__PURE__ */ new Set();
+    const observer = new IntersectionObserver(
+      (entries) => {
+        for (const entry of entries) {
+          if (entry.isIntersecting) visible.add(entry.target.id);
+          else visible.delete(entry.target.id);
+        }
+        if (Date.now() - clickedAt.current < 700) return;
+        const next = headings.find((h) => visible.has(h.id));
+        if (next) setActiveId(next.id);
+      },
+      { rootMargin: SPY_ROOT_MARGIN }
+    );
+    for (const el of targets) observer.observe(el);
+    return () => observer.disconnect();
+  }, [headings]);
+  const onLinkClick = useCallback((event, id) => {
+    const el = document.getElementById(id);
+    if (!el) return;
+    event.preventDefault();
+    clickedAt.current = Date.now();
+    setActiveId(id);
+    el.scrollIntoView({ behavior: prefersReducedMotion() ? "auto" : "smooth" });
+    history.replaceState(null, "", `#${id}`);
+  }, []);
+  if (headings.length === 0) return null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: joinClassNames("aranova-blog-toc-panel", className),
+      "data-open": open ? "true" : "false",
+      "data-collapse": collapse,
+      "data-side": side,
+      children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "aranova-blog-toc-panel-title",
+            "aria-expanded": open,
+            "aria-controls": bodyId,
+            onClick: () => {
+              userToggled.current = true;
+              setOpen((o) => !o);
+            },
+            children: title
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { id: bodyId, className: "aranova-blog-toc-panel-body", children: /* @__PURE__ */ jsx("div", { className: "aranova-blog-toc-panel-clip", children: /* @__PURE__ */ jsx("nav", { "aria-label": "Table of contents", children: /* @__PURE__ */ jsx("ol", { children: headings.map((heading) => /* @__PURE__ */ jsx("li", { "data-depth": heading.depth, children: /* @__PURE__ */ jsx(
+          "a",
+          {
+            href: `#${heading.id}`,
+            title: heading.text,
+            className: heading.id === activeId ? "aranova-blog-toc-panel-link is-active" : "aranova-blog-toc-panel-link",
+            "data-active": heading.id === activeId ? "true" : void 0,
+            "aria-current": heading.id === activeId ? "location" : void 0,
+            onClick: (event) => onLinkClick(event, heading.id),
+            children: heading.text
+          }
+        ) }, heading.id)) }) }) }) })
+      ]
+    }
+  );
+}
+
+// ../tracking-core/src/resources/blog/view/client/reading-progress.tsx
+import { useEffect as useEffect2, useRef as useRef2 } from "react";
+import { jsx as jsx2 } from "react/jsx-runtime";
+function ReadingProgress({
+  target = ".aranova-blog-post",
+  height = 3,
+  className,
+  onProgress,
+  showBar = true
+}) {
+  const barRef = useRef2(null);
+  const onProgressRef = useRef2(onProgress);
+  onProgressRef.current = onProgress;
+  useEffect2(() => {
+    const article = document.querySelector(target);
+    if (!(article instanceof HTMLElement)) return;
+    let frame = 0;
+    const update = () => {
+      frame = 0;
+      const rect = article.getBoundingClientRect();
+      const total = rect.height - window.innerHeight;
+      const fraction = total <= 0 ? 1 : Math.min(1, Math.max(0, -rect.top / total));
+      const percent = Math.round(fraction * 100);
+      const bar = barRef.current;
+      if (bar) {
+        bar.style.transform = `scaleX(${fraction})`;
+        bar.setAttribute("aria-valuenow", String(percent));
+      }
+      onProgressRef.current?.(fraction, percent);
+    };
+    const schedule = () => {
+      if (frame === 0) frame = requestAnimationFrame(update);
+    };
+    update();
+    window.addEventListener("scroll", schedule, { passive: true });
+    window.addEventListener("resize", schedule);
+    return () => {
+      window.removeEventListener("scroll", schedule);
+      window.removeEventListener("resize", schedule);
+      if (frame !== 0) cancelAnimationFrame(frame);
+    };
+  }, [target]);
+  if (!showBar) return null;
+  const style = { height: `${height}px` };
+  return /* @__PURE__ */ jsx2(
+    "div",
+    {
+      ref: barRef,
+      className: joinClassNames("aranova-blog-progress", className),
+      role: "progressbar",
+      "aria-label": "Reading progress",
+      "aria-valuemin": 0,
+      "aria-valuemax": 100,
+      "aria-valuenow": 0,
+      style
+    }
+  );
+}
+export {
+  ReadingProgress,
+  TocPanel
+};
+//# sourceMappingURL=blog-client.mjs.map