@liiift-studio/sanity-visitor-insights 0.29.0 → 0.30.0

package/dist/index.d.mts

@@ -1,7 +1,7 @@
 import * as sanity from 'sanity';
 import React from 'react';
-import { R as ReportEnvelope, a as ReportName, b as RangeKey, M as MetricValue, A as AcquisitionData, c as MeasurementHealthData, D as DiagnosticReport, J as JourneyData, T as TypefaceInterestData } from './ranges-D1A9JY7h.mjs';
-export { C as CaptureBasis, d as CaptureEstimate, e as CaptureModel, f as CheckStatus, g as Coverage, h as CrossSourceDay, i as DailyPoint, j as DateRange, k as DiagnosticCheck, E as EmailCampaign, l as EventCutover, m as JourneyOutcome, n as JourneyStep, L as LandingPage, o as LicenceTierRow, P as PREEXISTING, p as REPORT_NAMES, q as ReportError, S as SiteAnalyticsConfig, r as SourceName, s as SourceRow, t as SourceStatus, u as TimelineEvent, v as TypefaceInterestRow, U as UnavailableReason, w as coverageForRange, x as estimated, y as isReportName, z as ok, B as partial, F as previousRange, G as resolveRange, H as unavailable, I as validateSiteConfig, K as valueOrNull } from './ranges-D1A9JY7h.mjs';
+import { R as ReportEnvelope, a as ReportName, b as RangeKey, M as MetricValue, A as AcquisitionData, c as MeasurementHealthData, D as DiagnosticReport, J as JourneyData, T as TypefaceInterestData } from './ranges-B3BWyG3q.mjs';
+export { C as CaptureBasis, d as CaptureEstimate, e as CaptureModel, f as CheckStatus, g as Coverage, h as CrossSourceDay, i as DailyPoint, j as DateRange, k as DiagnosticCheck, E as EmailCampaign, l as EventCutover, m as JourneyOutcome, n as JourneyStep, L as LandingPage, o as LicenceTierRow, P as PREEXISTING, p as REPORT_NAMES, q as ReportError, S as SiteAnalyticsConfig, r as SourceName, s as SourceRow, t as SourceStatus, u as TimelineEvent, v as TypefaceInterestRow, U as UnavailableReason, w as coverageForRange, x as estimated, y as isReportName, z as ok, B as partial, F as previousRange, G as resolveRange, H as unavailable, I as validateSiteConfig, K as valueOrNull } from './ranges-B3BWyG3q.mjs';
 
 /**
  * Data hook for the Studio panels.
@@ -100,6 +100,62 @@ interface VisitorInsightsToolComponentProps extends Partial<VisitorInsightsToolP
 }
 declare function VisitorInsightsTool(props: VisitorInsightsToolComponentProps): React.ReactElement;
 
+/**
+ * The tool's view, in the URL — so a finding can be sent to someone.
+ *
+ * Every piece of state here was component-local: tab, range, and the custom window. A Studio
+ * reload, a browser back, or an accidental navigation discarded the whole investigation, and
+ * "Acquisition, 24 August to 7 September" — the exact view in which someone notices the thing worth
+ * noticing — could not be handed to a colleague or returned to by the person who found it. There is
+ * a "Copy as CSV" in this tool precisely because sharing a finding is the real task; the view
+ * itself was the one thing that could not be shared.
+ *
+ * The HASH, not the path or the query. Sanity's own router owns the path, and writing to it would
+ * fight the Studio for control of navigation; the hash is unclaimed, survives a reload, is carried
+ * by a copied link, and is ignored by every server. The value is namespaced because other tools in
+ * the same Studio may want the same trick.
+ *
+ * Everything here is a pure string transformation, so it is testable without a DOM — which matters,
+ * because the alternative is a feature whose only proof is clicking around a deployed Studio.
+ */
+/** The part of the tool's state worth putting in a link. */
+interface ViewState {
+    /** Tab id, e.g. `overview`. */
+    tab?: string;
+    /** Range key, e.g. `week` or `custom`. */
+    range?: string;
+    /** Custom window start, ISO date. Only meaningful when `range` is `custom`. */
+    from?: string;
+    /** Custom window end, ISO date. */
+    to?: string;
+}
+/**
+ * Serialise a view to the hash fragment it should occupy.
+ *
+ * Returns an empty string for an empty view, so a default view leaves the URL clean rather than
+ * decorating it with state nobody set.
+ *
+ * @param view - the state to encode
+ */
+declare function encodeView(view: ViewState): string;
+/**
+ * Read a view out of a hash fragment.
+ *
+ * Every field is validated and an unrecognised one is dropped rather than defaulted, so a truncated
+ * or hand-edited link degrades to whatever it could parse instead of failing or, worse, silently
+ * requesting a window nobody chose.
+ *
+ * @param hash - `window.location.hash`, with or without its leading `#`
+ */
+declare function decodeView(hash: string): ViewState;
+/**
+ * Replace our fragment in a hash, preserving anyone else's.
+ *
+ * @param hash - the current hash
+ * @param view - the state to write
+ */
+declare function mergeIntoHash(hash: string, view: ViewState): string;
+
 /**
  * Shared renderers for metric values and comparison bars.
  *
@@ -426,6 +482,15 @@ interface Series {
      * event, on a date, of a size. Days with nothing draw nothing, which is the truth.
      */
     mark?: 'line' | 'events';
+    /**
+     * A fixed y domain, instead of scaling the row to its own peak.
+     *
+     * Small multiples normally scale each row to itself, which is right for quantities whose
+     * absolute size is not comparable between rows. It is wrong for a proportion: a coverage row
+     * auto-scaled to its own maximum would redraw 100% at whatever the best day happened to be, so
+     * a site running at a flat 20% would show a full-height line and read as healthy.
+     */
+    domain?: [number, number];
     points: SeriesPoint[];
     /**
      * What a lossier source saw of the same thing.
@@ -465,12 +530,6 @@ interface CrossSourceTimelineProps {
      */
     onBrush?: (start: string, end: string) => void;
 }
-/**
- * The cross-source timeline.
- *
- * Renders nothing rather than an empty frame when there is not enough to plot — two points cannot
- * show a shape, and an axis with one dot on it invites a reading it cannot support.
- */
 declare function CrossSourceTimeline({ series, markers, currency, onBrush }: CrossSourceTimelineProps): React.ReactElement | null;
 
 /**
@@ -579,4 +638,4 @@ interface VisitorInsightsPluginOptions {
  */
 declare const visitorInsights: sanity.Plugin<VisitorInsightsPluginOptions>;
 
-export { AcquisitionData, AcquisitionPanel, ChartData, type ChartDataProps, ComparisonBar, CrossSourceTimeline, type CrossSourceTimelineProps, DataHealthPanel, Delta, type DeltaProps, DiagnosticReport, DiagnosticsPanel, FunnelChart, JourneyData, JourneyPanel, MeasurementHealthData, DataHealthPanel as MeasurementHealthPanel, MetricFigure, MetricValue, NoticeList, OverviewPanel, type ProportionBar, ProportionChart, type ProportionChartProps, RangeKey, ReportEnvelope, ReportName, type ReportState, type Series, type SeriesPoint, type SortColumn, SortableTable, type SortableTableProps, type TimelineMarker, TrendChart, TypefaceInterestData, TypefaceInterestPanel, type UseReportOptions, type VisitorInsightsPluginOptions, VisitorInsightsTool, type VisitorInsightsToolProps, visitorInsights as default, formatCount, formatMoney, formatPercent, knownShortfall, useReport, visitorInsights };
+export { AcquisitionData, AcquisitionPanel, ChartData, type ChartDataProps, ComparisonBar, CrossSourceTimeline, type CrossSourceTimelineProps, DataHealthPanel, Delta, type DeltaProps, DiagnosticReport, DiagnosticsPanel, FunnelChart, JourneyData, JourneyPanel, MeasurementHealthData, DataHealthPanel as MeasurementHealthPanel, MetricFigure, MetricValue, NoticeList, OverviewPanel, type ProportionBar, ProportionChart, type ProportionChartProps, RangeKey, ReportEnvelope, ReportName, type ReportState, type Series, type SeriesPoint, type SortColumn, SortableTable, type SortableTableProps, type TimelineMarker, TrendChart, TypefaceInterestData, TypefaceInterestPanel, type UseReportOptions, type ViewState, type VisitorInsightsPluginOptions, VisitorInsightsTool, type VisitorInsightsToolProps, decodeView, visitorInsights as default, encodeView, formatCount, formatMoney, formatPercent, knownShortfall, mergeIntoHash, useReport, visitorInsights };

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import * as sanity from 'sanity';
 import React from 'react';
-import { R as ReportEnvelope, a as ReportName, b as RangeKey, M as MetricValue, A as AcquisitionData, c as MeasurementHealthData, D as DiagnosticReport, J as JourneyData, T as TypefaceInterestData } from './ranges-D1A9JY7h.js';
-export { C as CaptureBasis, d as CaptureEstimate, e as CaptureModel, f as CheckStatus, g as Coverage, h as CrossSourceDay, i as DailyPoint, j as DateRange, k as DiagnosticCheck, E as EmailCampaign, l as EventCutover, m as JourneyOutcome, n as JourneyStep, L as LandingPage, o as LicenceTierRow, P as PREEXISTING, p as REPORT_NAMES, q as ReportError, S as SiteAnalyticsConfig, r as SourceName, s as SourceRow, t as SourceStatus, u as TimelineEvent, v as TypefaceInterestRow, U as UnavailableReason, w as coverageForRange, x as estimated, y as isReportName, z as ok, B as partial, F as previousRange, G as resolveRange, H as unavailable, I as validateSiteConfig, K as valueOrNull } from './ranges-D1A9JY7h.js';
+import { R as ReportEnvelope, a as ReportName, b as RangeKey, M as MetricValue, A as AcquisitionData, c as MeasurementHealthData, D as DiagnosticReport, J as JourneyData, T as TypefaceInterestData } from './ranges-B3BWyG3q.js';
+export { C as CaptureBasis, d as CaptureEstimate, e as CaptureModel, f as CheckStatus, g as Coverage, h as CrossSourceDay, i as DailyPoint, j as DateRange, k as DiagnosticCheck, E as EmailCampaign, l as EventCutover, m as JourneyOutcome, n as JourneyStep, L as LandingPage, o as LicenceTierRow, P as PREEXISTING, p as REPORT_NAMES, q as ReportError, S as SiteAnalyticsConfig, r as SourceName, s as SourceRow, t as SourceStatus, u as TimelineEvent, v as TypefaceInterestRow, U as UnavailableReason, w as coverageForRange, x as estimated, y as isReportName, z as ok, B as partial, F as previousRange, G as resolveRange, H as unavailable, I as validateSiteConfig, K as valueOrNull } from './ranges-B3BWyG3q.js';
 
 /**
  * Data hook for the Studio panels.
@@ -100,6 +100,62 @@ interface VisitorInsightsToolComponentProps extends Partial<VisitorInsightsToolP
 }
 declare function VisitorInsightsTool(props: VisitorInsightsToolComponentProps): React.ReactElement;
 
+/**
+ * The tool's view, in the URL — so a finding can be sent to someone.
+ *
+ * Every piece of state here was component-local: tab, range, and the custom window. A Studio
+ * reload, a browser back, or an accidental navigation discarded the whole investigation, and
+ * "Acquisition, 24 August to 7 September" — the exact view in which someone notices the thing worth
+ * noticing — could not be handed to a colleague or returned to by the person who found it. There is
+ * a "Copy as CSV" in this tool precisely because sharing a finding is the real task; the view
+ * itself was the one thing that could not be shared.
+ *
+ * The HASH, not the path or the query. Sanity's own router owns the path, and writing to it would
+ * fight the Studio for control of navigation; the hash is unclaimed, survives a reload, is carried
+ * by a copied link, and is ignored by every server. The value is namespaced because other tools in
+ * the same Studio may want the same trick.
+ *
+ * Everything here is a pure string transformation, so it is testable without a DOM — which matters,
+ * because the alternative is a feature whose only proof is clicking around a deployed Studio.
+ */
+/** The part of the tool's state worth putting in a link. */
+interface ViewState {
+    /** Tab id, e.g. `overview`. */
+    tab?: string;
+    /** Range key, e.g. `week` or `custom`. */
+    range?: string;
+    /** Custom window start, ISO date. Only meaningful when `range` is `custom`. */
+    from?: string;
+    /** Custom window end, ISO date. */
+    to?: string;
+}
+/**
+ * Serialise a view to the hash fragment it should occupy.
+ *
+ * Returns an empty string for an empty view, so a default view leaves the URL clean rather than
+ * decorating it with state nobody set.
+ *
+ * @param view - the state to encode
+ */
+declare function encodeView(view: ViewState): string;
+/**
+ * Read a view out of a hash fragment.
+ *
+ * Every field is validated and an unrecognised one is dropped rather than defaulted, so a truncated
+ * or hand-edited link degrades to whatever it could parse instead of failing or, worse, silently
+ * requesting a window nobody chose.
+ *
+ * @param hash - `window.location.hash`, with or without its leading `#`
+ */
+declare function decodeView(hash: string): ViewState;
+/**
+ * Replace our fragment in a hash, preserving anyone else's.
+ *
+ * @param hash - the current hash
+ * @param view - the state to write
+ */
+declare function mergeIntoHash(hash: string, view: ViewState): string;
+
 /**
  * Shared renderers for metric values and comparison bars.
  *
@@ -426,6 +482,15 @@ interface Series {
      * event, on a date, of a size. Days with nothing draw nothing, which is the truth.
      */
     mark?: 'line' | 'events';
+    /**
+     * A fixed y domain, instead of scaling the row to its own peak.
+     *
+     * Small multiples normally scale each row to itself, which is right for quantities whose
+     * absolute size is not comparable between rows. It is wrong for a proportion: a coverage row
+     * auto-scaled to its own maximum would redraw 100% at whatever the best day happened to be, so
+     * a site running at a flat 20% would show a full-height line and read as healthy.
+     */
+    domain?: [number, number];
     points: SeriesPoint[];
     /**
      * What a lossier source saw of the same thing.
@@ -465,12 +530,6 @@ interface CrossSourceTimelineProps {
      */
     onBrush?: (start: string, end: string) => void;
 }
-/**
- * The cross-source timeline.
- *
- * Renders nothing rather than an empty frame when there is not enough to plot — two points cannot
- * show a shape, and an axis with one dot on it invites a reading it cannot support.
- */
 declare function CrossSourceTimeline({ series, markers, currency, onBrush }: CrossSourceTimelineProps): React.ReactElement | null;
 
 /**
@@ -579,4 +638,4 @@ interface VisitorInsightsPluginOptions {
  */
 declare const visitorInsights: sanity.Plugin<VisitorInsightsPluginOptions>;
 
-export { AcquisitionData, AcquisitionPanel, ChartData, type ChartDataProps, ComparisonBar, CrossSourceTimeline, type CrossSourceTimelineProps, DataHealthPanel, Delta, type DeltaProps, DiagnosticReport, DiagnosticsPanel, FunnelChart, JourneyData, JourneyPanel, MeasurementHealthData, DataHealthPanel as MeasurementHealthPanel, MetricFigure, MetricValue, NoticeList, OverviewPanel, type ProportionBar, ProportionChart, type ProportionChartProps, RangeKey, ReportEnvelope, ReportName, type ReportState, type Series, type SeriesPoint, type SortColumn, SortableTable, type SortableTableProps, type TimelineMarker, TrendChart, TypefaceInterestData, TypefaceInterestPanel, type UseReportOptions, type VisitorInsightsPluginOptions, VisitorInsightsTool, type VisitorInsightsToolProps, visitorInsights as default, formatCount, formatMoney, formatPercent, knownShortfall, useReport, visitorInsights };
+export { AcquisitionData, AcquisitionPanel, ChartData, type ChartDataProps, ComparisonBar, CrossSourceTimeline, type CrossSourceTimelineProps, DataHealthPanel, Delta, type DeltaProps, DiagnosticReport, DiagnosticsPanel, FunnelChart, JourneyData, JourneyPanel, MeasurementHealthData, DataHealthPanel as MeasurementHealthPanel, MetricFigure, MetricValue, NoticeList, OverviewPanel, type ProportionBar, ProportionChart, type ProportionChartProps, RangeKey, ReportEnvelope, ReportName, type ReportState, type Series, type SeriesPoint, type SortColumn, SortableTable, type SortableTableProps, type TimelineMarker, TrendChart, TypefaceInterestData, TypefaceInterestPanel, type UseReportOptions, type ViewState, type VisitorInsightsPluginOptions, VisitorInsightsTool, type VisitorInsightsToolProps, decodeView, visitorInsights as default, encodeView, formatCount, formatMoney, formatPercent, knownShortfall, mergeIntoHash, useReport, visitorInsights };

package/dist/index.js

@@ -51,13 +51,16 @@ __export(index_exports, {
   TypefaceInterestPanel: () => TypefaceInterestPanel,
   VisitorInsightsTool: () => VisitorInsightsTool,
   coverageForRange: () => coverageForRange,
+  decodeView: () => decodeView,
   default: () => index_default,
+  encodeView: () => encodeView,
   estimated: () => estimated,
   formatCount: () => formatCount,
   formatMoney: () => formatMoney,
   formatPercent: () => formatPercent,
   isReportName: () => isReportName,
   knownShortfall: () => knownShortfall,
+  mergeIntoHash: () => mergeIntoHash,
   ok: () => ok,
   partial: () => partial,
   previousRange: () => previousRange,
@@ -167,6 +170,50 @@ function useReport({ apiBaseUrl, report, range, custom, enabled = true }) {
   return { state, reload };
 }
 
+// src/studio/urlState.ts
+var KEY = "insights";
+var ISO_DATE = /^\d{4}-\d{2}-\d{2}$/;
+var IDENTIFIER = /^[a-z][a-z0-9-]{0,31}$/;
+function encodeView(view) {
+  const parts = [];
+  if (view.tab && IDENTIFIER.test(view.tab)) parts.push(`tab:${view.tab}`);
+  if (view.range && IDENTIFIER.test(view.range)) parts.push(`range:${view.range}`);
+  if (view.range === "custom") {
+    if (view.from && ISO_DATE.test(view.from)) parts.push(`from:${view.from}`);
+    if (view.to && ISO_DATE.test(view.to)) parts.push(`to:${view.to}`);
+  }
+  return parts.length > 0 ? `${KEY}=${parts.join(";")}` : "";
+}
+function decodeView(hash) {
+  const raw = hash.startsWith("#") ? hash.slice(1) : hash;
+  const mine = raw.split("&").find((part) => part.startsWith(`${KEY}=`));
+  if (!mine) return {};
+  const view = {};
+  for (const pair of mine.slice(KEY.length + 1).split(";")) {
+    const separator = pair.indexOf(":");
+    if (separator < 1) continue;
+    const name = pair.slice(0, separator);
+    const value = pair.slice(separator + 1);
+    if (name === "tab" && IDENTIFIER.test(value)) view.tab = value;
+    else if (name === "range" && IDENTIFIER.test(value)) view.range = value;
+    else if (name === "from" && ISO_DATE.test(value)) view.from = value;
+    else if (name === "to" && ISO_DATE.test(value)) view.to = value;
+  }
+  if (view.range === "custom" && !(view.from && view.to)) {
+    delete view.from;
+    delete view.to;
+    delete view.range;
+  }
+  return view;
+}
+function mergeIntoHash(hash, view) {
+  const raw = hash.startsWith("#") ? hash.slice(1) : hash;
+  const others = raw.split("&").filter((part) => part.length > 0 && !part.startsWith(`${KEY}=`));
+  const mine = encodeView(view);
+  const all = mine ? [...others, mine] : others;
+  return all.length > 0 ? `#${all.join("&")}` : "";
+}
+
 // src/core/ranges.ts
 function formatInTimeZone(date, timeZone) {
   const parts = new Intl.DateTimeFormat("en-CA", {
@@ -1092,44 +1139,57 @@ function findCoverageIncident(days, dates) {
   const measured = days.filter((d) => d !== null);
   if (measured.length < 21) return null;
   const sorted = [...measured].sort((a, b) => a - b);
-  const normal = sorted[Math.floor(sorted.length / 2)];
+  const normal = sorted[Math.min(sorted.length - 1, Math.floor(sorted.length * 0.75))];
   if (normal <= 0.1) return null;
   const threshold = normal * 0.5;
   const MIN_RUN = 3;
-  let best = null;
+  const MAX_GAP = 2;
+  const runs = [];
   let runStart = null;
+  let gap = 0;
   for (let i = 0; i <= days.length; i++) {
-    const value = days[i];
-    const low = i < days.length && value !== null && value !== void 0 && value < threshold;
-    if (low && runStart === null) runStart = i;
-    if (!low && runStart !== null) {
-      const length = i - runStart;
-      if (length >= MIN_RUN && (!best || length > best.end - best.start)) best = { start: runStart, end: i };
+    const value = i < days.length ? days[i] : void 0;
+    const low = value !== null && value !== void 0 && value < threshold;
+    const unmeasured = i < days.length && (value === null || value === void 0);
+    if (low) {
+      if (runStart === null) runStart = i;
+      gap = 0;
+    } else if (unmeasured && runStart !== null && gap < MAX_GAP) {
+      gap += 1;
+    } else if (runStart !== null) {
+      runs.push({ start: runStart, end: i - gap });
       runStart = null;
+      gap = 0;
     }
   }
-  if (!best) return null;
-  const during = days.slice(best.start, best.end).filter((d) => d !== null);
-  const before = days.slice(0, best.start).filter((d) => d !== null);
-  if (before.length < 3 || during.length === 0) return null;
+  runs.sort((a, b) => b.end - b.start - (a.end - a.start));
   const mean = (values) => values.reduce((sum, v) => sum + v, 0) / values.length;
-  const onset = dates[best.start];
-  if (!onset) return null;
-  return {
-    onset,
-    days: best.end - best.start,
-    before: mean(before),
-    during: mean(during),
-    // The run reaching the end of the series is the difference between "this happened" and "this
-    // is happening", which is the difference between a note and a job for today.
-    ongoing: best.end >= days.length
-  };
+  for (const run of runs) {
+    if (run.end - run.start < MIN_RUN) continue;
+    const during = days.slice(run.start, run.end).filter((d) => d !== null);
+    const before = days.slice(0, run.start).filter((d) => d !== null);
+    if (before.length < 3 || during.length === 0) continue;
+    const onset = dates[run.start];
+    if (!onset) continue;
+    const beforeMean = mean(before);
+    const after = days.slice(run.end).filter((d) => d !== null);
+    const recovered = after.length >= MIN_RUN && mean(after) >= beforeMean * 0.8;
+    return {
+      onset,
+      days: run.end - run.start,
+      before: beforeMean,
+      during: mean(during),
+      ongoing: !recovered
+    };
+  }
+  return null;
 }
 function CrossSourceTimeline({ series, markers = [], currency, onBrush }) {
   const [hoverIndex, setHoverIndex] = (0, import_react3.useState)(null);
   const [pinned, setPinned] = (0, import_react3.useState)(false);
   const [brushAnchor, setBrushAnchor] = (0, import_react3.useState)(null);
   const [brushed, setBrushed] = (0, import_react3.useState)(null);
+  const instanceId = import_react3.default.useId().replace(/[^a-zA-Z0-9]/g, "");
   const [steppedByKeyboard, setSteppedByKeyboard] = (0, import_react3.useState)(false);
   const [tooShort, setTooShort] = (0, import_react3.useState)(false);
   const [measured, setMeasured] = (0, import_react3.useState)(WIDTH);
@@ -1337,13 +1397,34 @@ function CrossSourceTimeline({ series, markers = [], currency, onBrush }) {
           }
         },
         children: [
+          tickIndexes.map((index) => {
+            const date = dates[index];
+            if (!date) return null;
+            const at = x(/* @__PURE__ */ new Date(`${date}T00:00:00Z`));
+            if (!Number.isFinite(at)) return null;
+            return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              "line",
+              {
+                x1: at,
+                x2: at,
+                y1: TOP_PAD,
+                y2: TOP_PAD + series.length * ROW_HEIGHT - 18,
+                stroke: "currentColor",
+                strokeWidth: 1,
+                opacity: 0.08
+              },
+              `grid-${date}`
+            );
+          }),
           series.map((row, rowIndex) => {
             const top = TOP_PAD + rowIndex * ROW_HEIGHT;
             const bottom = top + ROW_HEIGHT - 18;
             const plotTop = top + LABEL_STRIP;
             const values = row.points.map((p) => p.value).filter((v) => v !== null);
             const peak = (0, import_d3_array.max)(values) ?? 0;
-            const y = (0, import_d3_scale.scaleLinear)().domain([0, peak || 1]).nice().range([bottom, plotTop]);
+            const lowest = Math.min(0, ...values);
+            const y = row.domain ? (0, import_d3_scale.scaleLinear)().domain(row.domain).range([bottom, plotTop]) : (0, import_d3_scale.scaleLinear)().domain([lowest, peak || 1]).nice().range([bottom, plotTop]);
+            const zeroY = y(0);
             const at = (p) => x(/* @__PURE__ */ new Date(`${p.date}T00:00:00Z`));
             const defined = (p) => p.value !== null;
             const lineGen = (0, import_d3_shape.line)().defined(defined).x(at).y((p) => y(p.value)).curve(import_d3_shape.curveMonotoneX);
@@ -1357,10 +1438,10 @@ function CrossSourceTimeline({ series, markers = [], currency, onBrush }) {
             const zeroes = row.mark === "events" && pitch >= 6 ? row.points.filter((p) => p.value === 0) : [];
             const gap = row.shortfall ? gapGen(row.points) ?? "" : "";
             const shortfallLine = row.shortfall && revealed ? lineGen(shortfallPoints) ?? "" : "";
-            const clipId = `row-clip-${rowIndex}`;
+            const clipId = `${instanceId}-row-${rowIndex}`;
             return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("g", { children: [
               /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("clipPath", { id: clipId, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("rect", { x: GUTTER, y: plotTop, width: plotWidth, height: Math.max(1, bottom - plotTop) }) }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("line", { x1: GUTTER, x2: GUTTER + plotWidth, y1: bottom, y2: bottom, stroke: "currentColor", strokeWidth: 1, opacity: 0.45 }),
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("line", { x1: GUTTER, x2: GUTTER + plotWidth, y1: zeroY, y2: zeroY, stroke: "currentColor", strokeWidth: 1, opacity: 0.45 }),
               /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("text", { x: GUTTER + 4, y: top + 11, fontSize: AXIS_TYPE, fill: "currentColor", opacity: 0.85, fontWeight: 500, children: row.label }),
               /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("text", { x: GUTTER + plotWidth, y: top + 11, textAnchor: "end", fontSize: AXIS_TYPE, fill: "currentColor", opacity: 0.72, children: [
                 row.source,
@@ -1378,7 +1459,7 @@ function CrossSourceTimeline({ series, markers = [], currency, onBrush }) {
                     "rect",
                     {
                       x: Math.max(GUTTER, Math.min(GUTTER + plotWidth - stemWidth, cx - stemWidth / 2)),
-                      y: bottom - 3,
+                      y: zeroY - 3,
                       width: stemWidth,
                       height: 3,
                       fill: "currentColor",
@@ -1395,9 +1476,9 @@ function CrossSourceTimeline({ series, markers = [], currency, onBrush }) {
                     "rect",
                     {
                       x: Math.max(GUTTER, Math.min(GUTTER + plotWidth - stemWidth, cx - stemWidth / 2)),
-                      y: Math.min(headY, bottom),
+                      y: Math.min(headY, zeroY),
                       width: stemWidth,
-                      height: Math.max(1.5, Math.abs(bottom - headY)),
+                      height: Math.max(1.5, Math.abs(zeroY - headY)),
                       fill: "currentColor",
                       opacity: 0.75
                     },
@@ -1474,25 +1555,6 @@ function CrossSourceTimeline({ series, markers = [], currency, onBrush }) {
               opacity: 0.8
             }
           ),
-          tickIndexes.map((index) => {
-            const date = dates[index];
-            if (!date) return null;
-            const at = x(/* @__PURE__ */ new Date(`${date}T00:00:00Z`));
-            if (!Number.isFinite(at)) return null;
-            return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-              "line",
-              {
-                x1: at,
-                x2: at,
-                y1: TOP_PAD,
-                y2: height - AXIS_HEIGHT,
-                stroke: "currentColor",
-                strokeWidth: 1,
-                opacity: 0.08
-              },
-              `grid-${date}`
-            );
-          }),
           tickIndexes.map((index, position) => {
             const date = dates[index];
             if (!date) return null;
@@ -1673,7 +1735,7 @@ function OverviewPanel({ data, previous, onBrush }) {
           /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(MetricFigure, { metric: metricOr(data.vercelPageviews, OLDER_ROUTE), label: "Pageviews" }),
           /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Delta, { current: metricSortValue(data.vercelPageviews), previous: metricSortValue(previous?.vercelPageviews) })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_sanity_ui_compat3.Text, { size: 0, muted: true, children: "Pageviews, counted server-side." })
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_sanity_ui_compat3.Text, { size: 0, muted: true, children: "Pageviews, from Vercel\u2019s own counter." })
       ] }) }),
       /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_sanity_ui_compat3.Card, { padding: 3, radius: 2, tone: "transparent", border: true, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_sanity_ui_compat3.Stack, { space: 3, children: [
         /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_sanity_ui_compat3.Label, { size: 1, muted: true, children: "Mailing list, total" }),
@@ -1723,6 +1785,37 @@ function OverviewPanel({ data, previous, onBrush }) {
                 points: (data.crossSource ?? []).map((d) => ({ date: d.date, value: d.ga4Pageviews }))
               }
             },
+            /*
+             * Coverage as its own row, on a fixed 0–100% axis.
+             *
+             * The shaded band under the traffic line is an ABSOLUTE quantity — Vercel
+             * minus GA4 — so under a flat 20% coverage it is 0.8 times the traffic curve
+             * and tracks it exactly. Every busy day therefore shows a wider alarm than
+             * every quiet day with no change whatever in the instrument, and the one
+             * distinction this tool exists to draw — a standing shortfall against a dated
+             * collapse — is the one the encoding could not show. It had to be asserted in
+             * prose by a detector instead, which made that sentence the reader's only
+             * witness to its own subject.
+             *
+             * As a proportion it draws itself: a standing shortfall is a flat line, a
+             * collapse is a step with a date under it, a gradual decay is a ramp that
+             * plainly is not an event, and a partial recovery is a line that visibly did
+             * not return. The reader can check the sentence rather than trust it.
+             */
+            ...(data.crossSource ?? []).some((d) => d.vercelPageviews !== null && d.ga4Pageviews !== null) ? [{
+              key: "coverage",
+              label: "GA4 coverage",
+              source: "GA4",
+              complete: true,
+              unit: "percent",
+              // Fixed, not scaled to its own best day — otherwise a site at a flat 20%
+              // draws a full-height line and reads as healthy.
+              domain: [0, 1],
+              points: (data.crossSource ?? []).map((d) => ({
+                date: d.date,
+                value: d.vercelPageviews !== null && d.ga4Pageviews !== null && d.vercelPageviews > 0 ? Math.min(1, d.ga4Pageviews / d.vercelPageviews) : null
+              }))
+            }] : [],
             ...data.crossSource?.some((d) => d.revenue !== null) ? [{
               key: "revenue",
               label: "Revenue",
@@ -1887,8 +1980,9 @@ function Verdict({ data, previous }) {
       return;
     }
     const change = (a - b) / Math.abs(b);
-    if (Math.abs(change) < 0.05) parts.push(`${label} flat`);
-    else parts.push(`${label} ${change > 0 ? "up" : "down"} ${formatPercent(Math.abs(change), 0)}`);
+    if (Math.abs(change) < 0.05) {
+      parts.push(Math.abs(change) < 5e-3 ? `${label} flat` : `${label} little changed (${change > 0 ? "+" : "\u2212"}${formatPercent(Math.abs(change), 0)})`);
+    } else parts.push(`${label} ${change > 0 ? "up" : "down"} ${formatPercent(Math.abs(change), 0)}`);
   };
   say("Revenue", data.revenue, previous?.revenue, "money");
   say("Traffic", data.vercelPageviews, previous?.vercelPageviews, "count");
@@ -1922,7 +2016,7 @@ function DataHealthPanel({ data, diagnostics }) {
     /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_sanity_ui_compat3.Stack, { space: 3, children: [
       /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_sanity_ui_compat3.Heading, { size: 1, style: sectionHeading, children: "Pageviews, source against source" }),
       /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_sanity_ui_compat3.Text, { size: 1, muted: true, children: "The same unit on both sides. Vercel is cookieless and ungated; GA4 is consent-gated and blockable, so GA4 seeing fewer is expected." }),
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ComparisonBar, { label: "Vercel pageviews", metric: data.vercelPageviews, max: pageviewMax, outOf: "Complete: counted server-side." }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ComparisonBar, { label: "Vercel pageviews", metric: data.vercelPageviews, max: pageviewMax, outOf: "Blocked less than GA4, but not immune to it." }),
       /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ComparisonBar, { label: "GA4 pageviews", metric: data.ga4Pageviews, max: pageviewMax, outOf: "A subset of the bar above, not a rival measurement." })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_sanity_ui_compat3.Card, { padding: 3, radius: 2, tone: "transparent", border: true, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_sanity_ui_compat3.Stack, { space: 2, children: [
@@ -1967,7 +2061,7 @@ function DataHealthPanel({ data, diagnostics }) {
         /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_sanity_ui_compat3.Card, { padding: 3, radius: 2, tone: "transparent", border: true, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_sanity_ui_compat3.Stack, { space: 3, children: [
           /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_sanity_ui_compat3.Label, { size: 1, muted: true, children: "Vercel visitors" }),
           /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(MetricFigure, { metric: metricOr(data.vercelVisitors, OLDER_ROUTE), label: "Vercel visitors" }),
-          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_sanity_ui_compat3.Text, { size: 0, muted: true, children: "Counted server-side, so neither consent nor ad-blocking reduces it." })
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_sanity_ui_compat3.Text, { size: 0, muted: true, children: "Vercel\u2019s own counter. Blocked far less often than Google Analytics, but not never \u2014 so read it as a floor on your real traffic." })
         ] }) }),
         /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_sanity_ui_compat3.Card, { padding: 3, radius: 2, tone: "transparent", border: true, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_sanity_ui_compat3.Stack, { space: 3, children: [
           /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_sanity_ui_compat3.Label, { size: 1, muted: true, children: "GA4 sessions" }),
@@ -2866,11 +2960,26 @@ var PanelBoundary = class extends import_react4.default.Component {
 function VisitorInsightsTool(props) {
   const apiBaseUrl = props.tool?.options?.apiBaseUrl ?? props.apiBaseUrl ?? "";
   const siteLabel = props.tool?.options?.siteLabel ?? props.siteLabel ?? "";
-  const [range, setRange] = (0, import_react4.useState)("week");
-  const [rangeBeforeBrush, setRangeBeforeBrush] = (0, import_react4.useState)("week");
-  const [custom, setCustom] = (0, import_react4.useState)(() => ({ start: isoDaysAgo(30), end: isoDaysAgo(0) }));
+  const [linked] = (0, import_react4.useState)(() => typeof window === "undefined" ? {} : decodeView(window.location.hash));
+  const linkedRange = RANGES.some((r) => r.key === linked.range) ? linked.range : null;
+  const linkedTab = PANELS.some((p) => p.id === linked.tab) ? linked.tab : null;
+  const [range, setRange] = (0, import_react4.useState)(linkedRange ?? "week");
+  const [rangeBeforeBrush, setRangeBeforeBrush] = (0, import_react4.useState)(linkedRange ?? "week");
+  const [custom, setCustom] = (0, import_react4.useState)(() => linked.from && linked.to ? { start: linked.from, end: linked.to } : { start: isoDaysAgo(30), end: isoDaysAgo(0) });
   const atPresent = custom.end >= isoDaysAgo(0);
-  const [activePanel, setActivePanel] = (0, import_react4.useState)("overview");
+  const [activePanel, setActivePanel] = (0, import_react4.useState)(linkedTab ?? "overview");
+  import_react4.default.useEffect(() => {
+    if (typeof window === "undefined") return;
+    const next = mergeIntoHash(window.location.hash, {
+      tab: activePanel,
+      range,
+      from: custom.start,
+      to: custom.end
+    });
+    if (next !== window.location.hash) {
+      window.history.replaceState(null, "", `${window.location.pathname}${window.location.search}${next}`);
+    }
+  }, [activePanel, range, custom.start, custom.end]);
   const active = PANELS.find((p) => p.id === activePanel) ?? PANELS[0];
   return (
     // Named for assistive technology even though the name is not printed: a Studio user with
@@ -3176,12 +3285,15 @@ var index_default = visitorInsights;
   TypefaceInterestPanel,
   VisitorInsightsTool,
   coverageForRange,
+  decodeView,
+  encodeView,
   estimated,
   formatCount,
   formatMoney,
   formatPercent,
   isReportName,
   knownShortfall,
+  mergeIntoHash,
   ok,
   partial,
   previousRange,