@syntrologie/runtime-sdk 2.10.0 → 2.11.0

package/dist/smart-canvas.js

@@ -9,6 +9,9 @@ var SyntrologieSDK = (() => {
     throw TypeError(msg);
   };
   var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+  var __esm = (fn2, res) => function __init() {
+    return fn2 && (res = (0, fn2[__getOwnPropNames(fn2)[0]])(fn2 = 0)), res;
+  };
   var __commonJS = (cb, mod) => function __require() {
     return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
   };
@@ -12761,6 +12764,40 @@ var SyntrologieSDK = (() => {
     }
   });
 
+  // src/telemetry/replayMirror.ts
+  var replayMirror_exports = {};
+  __export(replayMirror_exports, {
+    setupReplayMirror: () => setupReplayMirror
+  });
+  function setupReplayMirror(options2) {
+    const { posthogHost, mirrorEndpoint, sessionIdHeader = "X-Syntro-Session-Id" } = options2;
+    const recordingPath = `${posthogHost}/s/`;
+    const originalFetch = globalThis.fetch.bind(globalThis);
+    globalThis.fetch = (input, init2) => {
+      const url = typeof input === "string" ? input : input instanceof URL ? input.href : input.url;
+      const result = originalFetch(input, init2);
+      if (url.startsWith(recordingPath)) {
+        originalFetch(mirrorEndpoint, {
+          method: init2?.method ?? "POST",
+          body: init2?.body,
+          headers: {
+            ...init2?.headers,
+            [sessionIdHeader]: "syntro-session"
+          }
+        }).catch(() => {
+        });
+      }
+      return result;
+    };
+    return () => {
+      globalThis.fetch = originalFetch;
+    };
+  }
+  var init_replayMirror = __esm({
+    "src/telemetry/replayMirror.ts"() {
+    }
+  });
+
   // src/index.ts
   var index_exports = {};
   __export(index_exports, {
@@ -12847,7 +12884,7 @@ var SyntrologieSDK = (() => {
     SmartCanvasController: () => SmartCanvasController,
     SmartCanvasElement: () => SmartCanvasElement,
     SmartCanvasPortal: () => SmartCanvasPortal,
-    StandardEvents: () => StandardEvents,
+    StandardEvents: () => StandardEvents2,
     StateEqualsConditionZ: () => StateEqualsConditionZ,
     StateStore: () => StateStore,
     StoredValueZ: () => StoredValueZ,
@@ -21565,7 +21602,7 @@ ${text2}</tr>
   }
 
   // src/version.ts
-  var SDK_VERSION = "2.10.0";
+  var SDK_VERSION = "2.11.0";
 
   // src/types.ts
   var SDK_SCHEMA_VERSION = "2.0";
@@ -22365,8 +22402,522 @@ ${text2}</tr>
   var import_react14 = __toESM(require_react(), 1);
   var import_react_dom = __toESM(require_react_dom(), 1);
 
-  // src/events/types.ts
+  // ../event-processor/dist/types.js
+  var EVENT_SCHEMA_VERSION = "1.0.0";
   var StandardEvents = {
+    UI_CLICK: "ui.click",
+    UI_SCROLL: "ui.scroll",
+    UI_INPUT: "ui.input",
+    UI_CHANGE: "ui.change",
+    UI_SUBMIT: "ui.submit",
+    NAV_PAGE_VIEW: "nav.page_view",
+    NAV_PAGE_LEAVE: "nav.page_leave",
+    UI_HESITATE: "ui.hesitate",
+    UI_RAGE_CLICK: "ui.rage_click",
+    UI_SCROLL_THRASH: "ui.scroll_thrash",
+    UI_FOCUS_BOUNCE: "ui.focus_bounce",
+    UI_IDLE: "ui.idle",
+    UI_HOVER: "ui.hover"
+  };
+  var RRWebSource = {
+    Mutation: 0,
+    MouseMove: 1,
+    MouseInteraction: 2,
+    Scroll: 3,
+    ViewportResize: 4,
+    Input: 5,
+    TouchMove: 6,
+    MediaInteraction: 7,
+    Drag: 12
+  };
+  var RRWebMouseInteraction = {
+    MouseUp: 0,
+    MouseDown: 1,
+    Click: 2,
+    ContextMenu: 3,
+    DblClick: 4,
+    Focus: 5,
+    Blur: 6,
+    TouchStart: 7,
+    TouchEnd: 9
+  };
+  var DEFAULT_DETECTOR_CONFIG = {
+    hesitationMs: 3e3,
+    hesitationRadiusPx: 10,
+    rageClickCount: 3,
+    rageClickWindowMs: 1e3,
+    rageClickRadiusPx: 30,
+    scrollThrashReversals: 3,
+    scrollThrashWindowMs: 2e3,
+    focusBounceMaxInputs: 0,
+    idleMs: 5e3,
+    hoverSampleMs: 100
+  };
+
+  // ../event-processor/dist/detectors/focus-bounce.js
+  var FocusBounceDetector = class {
+    constructor(config, emit) {
+      this.config = config;
+      this.emit = emit;
+      this.focused = /* @__PURE__ */ new Map();
+    }
+    ingest(raw) {
+      if (raw.type !== 3)
+        return;
+      const ts2 = raw.timestamp;
+      if (raw.data.source === RRWebSource.MouseInteraction) {
+        const id = raw.data.id ?? 0;
+        if (raw.data.type === RRWebMouseInteraction.Focus) {
+          this.focused.set(id, { id, focusTs: ts2, inputCount: 0 });
+        } else if (raw.data.type === RRWebMouseInteraction.Blur) {
+          const entry = this.focused.get(id);
+          if (entry && entry.inputCount <= this.config.focusBounceMaxInputs) {
+            this.emit({
+              ts: ts2,
+              name: StandardEvents.UI_FOCUS_BOUNCE,
+              source: "rrweb",
+              schemaVersion: EVENT_SCHEMA_VERSION,
+              props: {
+                elementId: id,
+                duration_ms: ts2 - entry.focusTs
+              }
+            });
+          }
+          this.focused.delete(id);
+        }
+      } else if (raw.data.source === RRWebSource.Input) {
+        const id = raw.data.id ?? 0;
+        const entry = this.focused.get(id);
+        if (entry) {
+          entry.inputCount++;
+        }
+      }
+    }
+  };
+
+  // ../event-processor/dist/detectors/hesitation.js
+  var HesitationDetector = class {
+    constructor(config, emit) {
+      this.config = config;
+      this.emit = emit;
+      this.anchorX = 0;
+      this.anchorY = 0;
+      this.anchorTs = 0;
+      this.emitted = false;
+      this.hasPosition = false;
+    }
+    ingest(raw) {
+      if (raw.type !== 3 || raw.data.source !== RRWebSource.MouseMove)
+        return;
+      const positions = raw.data.positions;
+      if (!positions || positions.length === 0)
+        return;
+      const last = positions[positions.length - 1];
+      const ts2 = raw.timestamp + (last.timeOffset ?? 0);
+      if (!this.hasPosition) {
+        this.anchorX = last.x;
+        this.anchorY = last.y;
+        this.anchorTs = ts2;
+        this.hasPosition = true;
+        this.emitted = false;
+        return;
+      }
+      const dx = last.x - this.anchorX;
+      const dy = last.y - this.anchorY;
+      const dist = Math.sqrt(dx * dx + dy * dy);
+      if (dist > this.config.hesitationRadiusPx) {
+        this.anchorX = last.x;
+        this.anchorY = last.y;
+        this.anchorTs = ts2;
+        this.emitted = false;
+      }
+    }
+    tick(now) {
+      if (!this.hasPosition || this.emitted)
+        return;
+      const elapsed = now - this.anchorTs;
+      if (elapsed >= this.config.hesitationMs) {
+        this.emit({
+          ts: now,
+          name: StandardEvents.UI_HESITATE,
+          source: "rrweb",
+          schemaVersion: EVENT_SCHEMA_VERSION,
+          props: {
+            x: this.anchorX,
+            y: this.anchorY,
+            duration_ms: elapsed
+          }
+        });
+        this.emitted = true;
+      }
+    }
+  };
+
+  // ../event-processor/dist/detectors/hover.js
+  var HoverTracker = class {
+    constructor(config, emit, elementResolver) {
+      this.config = config;
+      this.emit = emit;
+      this.elementResolver = elementResolver;
+      this.currentElement = null;
+      this.hoverStartTs = null;
+      this.lastX = 0;
+      this.lastY = 0;
+      this.lastSampleTs = -Infinity;
+    }
+    ingest(raw) {
+      if (raw.type !== 3 || raw.data.source !== RRWebSource.MouseMove)
+        return;
+      const positions = raw.data.positions;
+      if (!positions || positions.length === 0)
+        return;
+      const last = positions[positions.length - 1];
+      this.lastX = last.x;
+      this.lastY = last.y;
+    }
+    tick(now) {
+      if (!this.elementResolver)
+        return;
+      if (now - this.lastSampleTs < this.config.hoverSampleMs)
+        return;
+      this.lastSampleTs = now;
+      const newElement = this.elementResolver(this.lastX, this.lastY);
+      const newKey = newElement ? elementKey(newElement) : null;
+      const currentKey = this.currentElement ? elementKey(this.currentElement) : null;
+      if (newKey !== currentKey) {
+        if (this.currentElement && this.hoverStartTs !== null) {
+          this.emit({
+            ts: now,
+            name: StandardEvents.UI_HOVER,
+            source: "rrweb",
+            schemaVersion: EVENT_SCHEMA_VERSION,
+            props: {
+              x: this.lastX,
+              y: this.lastY,
+              duration_ms: now - this.hoverStartTs,
+              element: this.currentElement
+            }
+          });
+        }
+        this.currentElement = newElement;
+        this.hoverStartTs = now;
+      }
+    }
+  };
+  function elementKey(el) {
+    return `${el.tag_name ?? ""}|${el.attr__id ?? ""}|${(el.classes ?? []).join(",")}`;
+  }
+
+  // ../event-processor/dist/detectors/idle.js
+  var IdleDetector = class {
+    constructor(config, emit) {
+      this.config = config;
+      this.emit = emit;
+      this.lastActivityTs = null;
+      this.emitted = false;
+    }
+    ingest(raw) {
+      if (raw.type !== 3)
+        return;
+      const src = raw.data.source;
+      if (src === RRWebSource.MouseMove || src === RRWebSource.MouseInteraction || src === RRWebSource.Scroll) {
+        this.lastActivityTs = raw.timestamp;
+        this.emitted = false;
+      }
+    }
+    tick(now) {
+      if (this.lastActivityTs === null || this.emitted)
+        return;
+      if (now - this.lastActivityTs >= this.config.idleMs) {
+        this.emit({
+          ts: now,
+          name: StandardEvents.UI_IDLE,
+          source: "rrweb",
+          schemaVersion: EVENT_SCHEMA_VERSION,
+          props: {
+            idle_ms: now - this.lastActivityTs
+          }
+        });
+        this.emitted = true;
+      }
+    }
+  };
+
+  // ../event-processor/dist/detectors/rage-click.js
+  var RageClickDetector = class {
+    constructor(config, emit) {
+      this.config = config;
+      this.emit = emit;
+      this.clicks = [];
+    }
+    ingest(raw) {
+      if (raw.type !== 3 || raw.data.source !== RRWebSource.MouseInteraction)
+        return;
+      if (raw.data.type !== RRWebMouseInteraction.Click)
+        return;
+      const x2 = raw.data.x ?? 0;
+      const y2 = raw.data.y ?? 0;
+      const ts2 = raw.timestamp;
+      const cutoff = ts2 - this.config.rageClickWindowMs;
+      this.clicks = this.clicks.filter((c2) => c2.ts >= cutoff);
+      this.clicks.push({ ts: ts2, x: x2, y: y2 });
+      const nearby = this.clicks.filter((c2) => {
+        const dx = c2.x - x2;
+        const dy = c2.y - y2;
+        return Math.sqrt(dx * dx + dy * dy) <= this.config.rageClickRadiusPx;
+      });
+      if (nearby.length >= this.config.rageClickCount) {
+        this.emit({
+          ts: ts2,
+          name: StandardEvents.UI_RAGE_CLICK,
+          source: "rrweb",
+          schemaVersion: EVENT_SCHEMA_VERSION,
+          props: {
+            x: x2,
+            y: y2,
+            clickCount: nearby.length,
+            duration_ms: ts2 - nearby[0].ts
+          }
+        });
+        this.clicks = [];
+      }
+    }
+  };
+
+  // ../event-processor/dist/detectors/scroll-thrash.js
+  var ScrollThrashDetector = class {
+    constructor(config, emit) {
+      this.config = config;
+      this.emit = emit;
+      this.lastY = null;
+      this.lastDirection = null;
+      this.reversals = [];
+    }
+    ingest(raw) {
+      if (raw.type !== 3 || raw.data.source !== RRWebSource.Scroll)
+        return;
+      const y2 = raw.data.y ?? 0;
+      const ts2 = raw.timestamp;
+      if (this.lastY !== null) {
+        const direction = y2 > this.lastY ? "down" : y2 < this.lastY ? "up" : this.lastDirection;
+        if (direction && direction !== this.lastDirection) {
+          const cutoff = ts2 - this.config.scrollThrashWindowMs;
+          this.reversals = this.reversals.filter((t2) => t2 > cutoff);
+          this.reversals.push(ts2);
+          if (this.reversals.length >= this.config.scrollThrashReversals) {
+            this.emit({
+              ts: ts2,
+              name: StandardEvents.UI_SCROLL_THRASH,
+              source: "rrweb",
+              schemaVersion: EVENT_SCHEMA_VERSION,
+              props: {
+                reversals: this.reversals.length,
+                duration_ms: ts2 - this.reversals[0]
+              }
+            });
+            this.reversals = [];
+          }
+        }
+        this.lastDirection = direction;
+      }
+      this.lastY = y2;
+    }
+  };
+
+  // ../event-processor/dist/normalizers/posthog.js
+  var POSTHOG_EVENT_MAP = {
+    // NOTE: $autocapture is intentionally NOT in this map.
+    // It's handled below in getEventName() with $event_type refinement
+    // so that change/submit events aren't all mapped to ui.click.
+    $click: StandardEvents.UI_CLICK,
+    $scroll: StandardEvents.UI_SCROLL,
+    $input: StandardEvents.UI_INPUT,
+    $change: StandardEvents.UI_CHANGE,
+    $submit: StandardEvents.UI_SUBMIT,
+    // Navigation events
+    $pageview: StandardEvents.NAV_PAGE_VIEW,
+    $pageleave: StandardEvents.NAV_PAGE_LEAVE,
+    // Session events
+    $session_start: "session.start",
+    // Identify events
+    $identify: "user.identify"
+  };
+  function getEventName(phEvent) {
+    const eventName = phEvent.event;
+    if (typeof eventName !== "string") {
+      return "posthog.unknown";
+    }
+    if (POSTHOG_EVENT_MAP[eventName]) {
+      return POSTHOG_EVENT_MAP[eventName];
+    }
+    if (eventName === "$autocapture") {
+      const tagName = phEvent.properties?.$tag_name;
+      const eventType = phEvent.properties?.$event_type;
+      if (eventType === "submit")
+        return StandardEvents.UI_SUBMIT;
+      if (eventType === "change")
+        return StandardEvents.UI_CHANGE;
+      if (tagName === "input" || tagName === "textarea")
+        return StandardEvents.UI_INPUT;
+      return StandardEvents.UI_CLICK;
+    }
+    if (!eventName.startsWith("$")) {
+      return `posthog.${eventName}`;
+    }
+    return eventName.replace("$", "posthog.");
+  }
+  var INTERACTIVE_TAGS = /* @__PURE__ */ new Set(["a", "button", "input", "select", "textarea"]);
+  function resolveInteractiveTag(elements2, directTag) {
+    if (directTag && INTERACTIVE_TAGS.has(directTag))
+      return directTag;
+    if (!elements2)
+      return directTag;
+    for (const el of elements2) {
+      const tag3 = el.tag_name;
+      if (tag3 && INTERACTIVE_TAGS.has(tag3))
+        return tag3;
+    }
+    return directTag;
+  }
+  function extractProps(phEvent) {
+    const props = {};
+    const phProps = phEvent.properties || {};
+    const elements2 = phProps.$elements;
+    const directTag = phProps.$tag_name ?? elements2?.[0]?.tag_name;
+    const isClickEvent = phEvent.event === "$autocapture" || phEvent.event === "$click";
+    props.tagName = isClickEvent ? resolveInteractiveTag(elements2, directTag) : directTag;
+    if (phProps.$el_text)
+      props.elementText = phProps.$el_text;
+    if (elements2)
+      props.elements = elements2;
+    if (phProps.$current_url)
+      props.url = phProps.$current_url;
+    if (phProps.$pathname)
+      props.pathname = phProps.$pathname;
+    if (phProps.$host)
+      props.host = phProps.$host;
+    if (phProps.$viewport_width)
+      props.viewportWidth = phProps.$viewport_width;
+    if (phProps.$viewport_height)
+      props.viewportHeight = phProps.$viewport_height;
+    if (phProps.$session_id)
+      props.sessionId = phProps.$session_id;
+    if (phProps.$scroll_depth)
+      props.scrollDepth = phProps.$scroll_depth;
+    if (phProps.$scroll_percentage)
+      props.scrollPercentage = phProps.$scroll_percentage;
+    props.originalEvent = phEvent.event;
+    return props;
+  }
+  function normalizePostHogEvent(phEvent) {
+    let ts2;
+    if (typeof phEvent.timestamp === "number") {
+      ts2 = phEvent.timestamp;
+    } else if (typeof phEvent.timestamp === "string") {
+      ts2 = new Date(phEvent.timestamp).getTime();
+    } else {
+      ts2 = Date.now();
+    }
+    return {
+      ts: ts2,
+      name: getEventName(phEvent),
+      source: "posthog",
+      props: extractProps(phEvent),
+      schemaVersion: EVENT_SCHEMA_VERSION
+    };
+  }
+  function shouldNormalizeEvent(phEvent) {
+    const eventName = phEvent.event;
+    if (typeof eventName !== "string")
+      return false;
+    const skipEvents = [
+      "$feature_flag_called",
+      "$feature_flags",
+      "$groups",
+      "$groupidentify",
+      "$set",
+      "$set_once",
+      "$unset",
+      "$create_alias",
+      "$capture_metrics",
+      "$performance_event",
+      "$web_vitals",
+      "$exception",
+      "$dead_click",
+      "$heatmap"
+    ];
+    if (skipEvents.includes(eventName)) {
+      return false;
+    }
+    return true;
+  }
+  function createPostHogNormalizer(publishFn) {
+    return (eventName, properties) => {
+      if (typeof eventName !== "string")
+        return;
+      const phEvent = {
+        event: eventName,
+        properties,
+        timestamp: Date.now()
+      };
+      if (shouldNormalizeEvent(phEvent)) {
+        const normalizedEvent = normalizePostHogEvent(phEvent);
+        publishFn(normalizedEvent);
+      }
+    };
+  }
+
+  // ../event-processor/dist/processor.js
+  function createEventProcessor(options2) {
+    const config = { ...DEFAULT_DETECTOR_CONFIG, ...options2?.config };
+    const listeners = [];
+    function emit(event) {
+      for (const cb of listeners)
+        cb(event);
+    }
+    const hesitation = new HesitationDetector(config, emit);
+    const rageClick = new RageClickDetector(config, emit);
+    const scrollThrash = new ScrollThrashDetector(config, emit);
+    const focusBounce = new FocusBounceDetector(config, emit);
+    const idle = new IdleDetector(config, emit);
+    const hover = new HoverTracker(config, emit, options2?.elementResolver);
+    const clickAttrBuffer = [];
+    return {
+      ingest(raw) {
+        if (raw.kind === "posthog") {
+          const { kind: _2, ...phEvent } = raw;
+          if (shouldNormalizeEvent(phEvent)) {
+            emit(normalizePostHogEvent(phEvent));
+          }
+        } else if (raw.kind === "rrweb") {
+          hesitation.ingest(raw);
+          rageClick.ingest(raw);
+          scrollThrash.ingest(raw);
+          focusBounce.ingest(raw);
+          idle.ingest(raw);
+          hover.ingest(raw);
+        }
+      },
+      onEvent(callback) {
+        listeners.push(callback);
+      },
+      tick(timestamp) {
+        hesitation.tick(timestamp);
+        idle.tick(timestamp);
+        hover.tick(timestamp);
+      },
+      enrichClickAttributes(timestamp, elements2) {
+        clickAttrBuffer.push({ ts: timestamp, elements: elements2 });
+        const cutoff = timestamp - 500;
+        while (clickAttrBuffer.length > 0 && clickAttrBuffer[0].ts < cutoff) {
+          clickAttrBuffer.shift();
+        }
+      }
+    };
+  }
+
+  // src/events/types.ts
+  var StandardEvents2 = {
     // UI events (from PostHog autocapture)
     UI_CLICK: "ui.click",
     UI_SCROLL: "ui.scroll",
@@ -22406,7 +22957,6 @@ ${text2}</tr>
     SURFACE_MOUNTED: "surface.mounted",
     SURFACE_UNMOUNTED: "surface.unmounted"
   };
-  var EVENT_SCHEMA_VERSION = "1.0.0";
 
   // src/events/normalizers/canvas.ts
   function createCanvasEvent(name, props) {
@@ -22419,48 +22969,48 @@ ${text2}</tr>
     };
   }
   function canvasOpened(surface) {
-    return createCanvasEvent(StandardEvents.CANVAS_OPENED, { surface });
+    return createCanvasEvent(StandardEvents2.CANVAS_OPENED, { surface });
   }
   function canvasClosed(surface) {
-    return createCanvasEvent(StandardEvents.CANVAS_CLOSED, { surface });
+    return createCanvasEvent(StandardEvents2.CANVAS_CLOSED, { surface });
   }
   function tileViewed(tileId, surface) {
-    return createCanvasEvent(StandardEvents.TILE_VIEWED, { tileId, surface });
+    return createCanvasEvent(StandardEvents2.TILE_VIEWED, { tileId, surface });
   }
   function tileExpanded(tileId, surface) {
-    return createCanvasEvent(StandardEvents.TILE_EXPANDED, { tileId, surface });
+    return createCanvasEvent(StandardEvents2.TILE_EXPANDED, { tileId, surface });
   }
   function tileCollapsed(tileId, surface) {
-    return createCanvasEvent(StandardEvents.TILE_COLLAPSED, { tileId, surface });
+    return createCanvasEvent(StandardEvents2.TILE_COLLAPSED, { tileId, surface });
   }
   function tileAction(tileId, actionId, surface) {
-    return createCanvasEvent(StandardEvents.TILE_ACTION, {
+    return createCanvasEvent(StandardEvents2.TILE_ACTION, {
       tileId,
       actionId,
       surface
     });
   }
   function overlayStarted(recipeId, recipeName) {
-    return createCanvasEvent(StandardEvents.OVERLAY_STARTED, {
+    return createCanvasEvent(StandardEvents2.OVERLAY_STARTED, {
       recipeId,
       recipeName
     });
   }
   function overlayCompleted(recipeId, recipeName) {
-    return createCanvasEvent(StandardEvents.OVERLAY_COMPLETED, {
+    return createCanvasEvent(StandardEvents2.OVERLAY_COMPLETED, {
       recipeId,
       recipeName
     });
   }
   function overlayDismissed(recipeId, recipeName, stepIndex) {
-    return createCanvasEvent(StandardEvents.OVERLAY_DISMISSED, {
+    return createCanvasEvent(StandardEvents2.OVERLAY_DISMISSED, {
       recipeId,
       recipeName,
       stepIndex
     });
   }
   function overlayStepViewed(recipeId, stepIndex, stepTitle) {
-    return createCanvasEvent(StandardEvents.OVERLAY_STEP_VIEWED, {
+    return createCanvasEvent(StandardEvents2.OVERLAY_STEP_VIEWED, {
       recipeId,
       stepIndex,
       stepTitle
@@ -23109,7 +23659,7 @@ ${text2}</tr>
     const timerIds = (0, import_react9.useRef)(/* @__PURE__ */ new Map());
     const publishDismissed = (0, import_react9.useCallback)(
       (notif) => {
-        eventBus?.publish(StandardEvents.NOTIFICATION_DISMISSED, {
+        eventBus?.publish(StandardEvents2.NOTIFICATION_DISMISSED, {
           notificationId: notif.id,
           tileId: notif.tileId,
           itemId: notif.itemId
@@ -23173,7 +23723,7 @@ ${text2}</tr>
           }
           return next;
         });
-        eventBus.publish(StandardEvents.NOTIFICATION_SHOWN, {
+        eventBus.publish(StandardEvents2.NOTIFICATION_SHOWN, {
           notificationId: matched.id,
           tileId: matched.tileId,
           itemId: matched.itemId,
@@ -23980,7 +24530,7 @@ ${cssRules}
     const handleNotificationClick = (0, import_react14.useCallback)(
       (notif) => {
         if (runtime7) {
-          runtime7.events.publish(StandardEvents.NOTIFICATION_CLICKED, {
+          runtime7.events.publish(StandardEvents2.NOTIFICATION_CLICKED, {
             notificationId: notif.id,
             tileId: notif.tileId,
             itemId: notif.itemId
@@ -23990,7 +24540,7 @@ ${cssRules}
           onToggle();
         }
         if (runtime7 && notif.tileId) {
-          runtime7.events.publish(StandardEvents.NOTIFICATION_DEEP_LINK, {
+          runtime7.events.publish(StandardEvents2.NOTIFICATION_DEEP_LINK, {
             tileId: notif.tileId,
             itemId: notif.itemId
           });
@@ -36959,10 +37509,12 @@ ${cssRules}
       __publicField(this, "client");
       __publicField(this, "featureFlagsCallback");
       __publicField(this, "captureCallback");
+      __publicField(this, "rrwebCallback");
       __publicField(this, "consentUnsub");
       this.client = options2.client;
       this.featureFlagsCallback = options2.onFeatureFlagsLoaded;
       this.captureCallback = options2.onCapture;
+      this.rrwebCallback = options2.onRRWebEvent;
       if (!this.client && options2.consent && options2.requireExplicitConsent && typeof window !== "undefined" && options2.apiKey) {
         const consent = options2.consent;
         const currentStatus = consent.getStatus();
@@ -37047,6 +37599,59 @@ ${cssRules}
         },
         instanceName
       );
+      if (this.rrwebCallback && this.client) {
+        this.setupRRWebIntercept();
+      }
+      if (options2.replayMirrorEndpoint && this.client) {
+        Promise.resolve().then(() => (init_replayMirror(), replayMirror_exports)).then(({ setupReplayMirror: setupReplayMirror2 }) => {
+          setupReplayMirror2({
+            posthogHost: options2.apiHost ?? "https://telemetry.syntrologie.com",
+            mirrorEndpoint: options2.replayMirrorEndpoint
+          });
+        });
+      }
+    }
+    /**
+     * Set up rrweb event interception on PostHog's session recording.
+     *
+     * PostHog lazy-loads the rrweb recorder. The SessionRecording wrapper has
+     * an `onRRwebEmit` method, but rrweb delivers events directly to the
+     * lazy-loaded recorder instance's `onRRwebEmit`, bypassing the wrapper.
+     * We must find and patch the recorder instance, not the wrapper.
+     *
+     * The recorder instance is stored on a minified property of SessionRecording.
+     * We detect it by looking for an object with both `onRRwebEmit` and `start` methods.
+     */
+    setupRRWebIntercept(retries = 30) {
+      const sr2 = this.client?.sessionRecording;
+      if (!sr2) {
+        if (retries > 0) {
+          setTimeout(() => this.setupRRWebIntercept(retries - 1), 500);
+        }
+        return;
+      }
+      let recorder = null;
+      for (const key of Object.getOwnPropertyNames(sr2)) {
+        const val = sr2[key];
+        if (val && typeof val === "object" && typeof val.onRRwebEmit === "function" && typeof val.start === "function" && val !== sr2) {
+          recorder = val;
+          break;
+        }
+      }
+      if (!recorder) {
+        if (retries > 0) {
+          setTimeout(() => this.setupRRWebIntercept(retries - 1), 500);
+        }
+        return;
+      }
+      const originalEmit = recorder.onRRwebEmit.bind(recorder);
+      recorder.onRRwebEmit = (rawEvent) => {
+        this.rrwebCallback?.({ kind: "rrweb", ...rawEvent });
+        originalEmit(rawEvent);
+      };
+      if (typeof window !== "undefined") {
+        window.__RRWEB_INTERCEPT_READY__ = true;
+      }
     }
     /**
      * Get all feature flags from PostHog.
@@ -39742,131 +40347,6 @@ ${cssRules}
     return new EventBus(options2);
   }
 
-  // src/events/normalizers/posthog.ts
-  var POSTHOG_EVENT_MAP = {
-    // NOTE: $autocapture is intentionally NOT in this map.
-    // It's handled below in getEventName() with $event_type refinement
-    // so that change/submit events aren't all mapped to ui.click.
-    $click: StandardEvents.UI_CLICK,
-    $scroll: StandardEvents.UI_SCROLL,
-    $input: StandardEvents.UI_INPUT,
-    $change: StandardEvents.UI_CHANGE,
-    $submit: StandardEvents.UI_SUBMIT,
-    // Navigation events
-    $pageview: StandardEvents.NAV_PAGE_VIEW,
-    $pageleave: StandardEvents.NAV_PAGE_LEAVE,
-    // Session events
-    $session_start: "session.start",
-    // Identify events
-    $identify: "user.identify"
-  };
-  function getEventName(phEvent) {
-    const eventName = phEvent.event;
-    if (typeof eventName !== "string") {
-      return "posthog.unknown";
-    }
-    if (POSTHOG_EVENT_MAP[eventName]) {
-      return POSTHOG_EVENT_MAP[eventName];
-    }
-    if (eventName === "$autocapture") {
-      const tagName = phEvent.properties?.$tag_name;
-      const eventType = phEvent.properties?.$event_type;
-      if (eventType === "submit") return StandardEvents.UI_SUBMIT;
-      if (eventType === "change") return StandardEvents.UI_CHANGE;
-      if (tagName === "input" || tagName === "textarea") return StandardEvents.UI_INPUT;
-      return StandardEvents.UI_CLICK;
-    }
-    if (!eventName.startsWith("$")) {
-      return `posthog.${eventName}`;
-    }
-    return eventName.replace("$", "posthog.");
-  }
-  var INTERACTIVE_TAGS = /* @__PURE__ */ new Set(["a", "button", "input", "select", "textarea"]);
-  function resolveInteractiveTag(elements2, directTag) {
-    if (directTag && INTERACTIVE_TAGS.has(directTag)) return directTag;
-    if (!elements2) return directTag;
-    for (const el of elements2) {
-      const tag3 = el.tag_name;
-      if (tag3 && INTERACTIVE_TAGS.has(tag3)) return tag3;
-    }
-    return directTag;
-  }
-  function extractProps(phEvent) {
-    const props = {};
-    const phProps = phEvent.properties || {};
-    const elements2 = phProps.$elements;
-    const directTag = phProps.$tag_name ?? elements2?.[0]?.tag_name;
-    const isClickEvent = phEvent.event === "$autocapture" || phEvent.event === "$click";
-    props.tagName = isClickEvent ? resolveInteractiveTag(elements2, directTag) : directTag;
-    if (phProps.$el_text) props.elementText = phProps.$el_text;
-    if (elements2) props.elements = elements2;
-    if (phProps.$current_url) props.url = phProps.$current_url;
-    if (phProps.$pathname) props.pathname = phProps.$pathname;
-    if (phProps.$host) props.host = phProps.$host;
-    if (phProps.$viewport_width) props.viewportWidth = phProps.$viewport_width;
-    if (phProps.$viewport_height) props.viewportHeight = phProps.$viewport_height;
-    if (phProps.$session_id) props.sessionId = phProps.$session_id;
-    if (phProps.$scroll_depth) props.scrollDepth = phProps.$scroll_depth;
-    if (phProps.$scroll_percentage) props.scrollPercentage = phProps.$scroll_percentage;
-    props.originalEvent = phEvent.event;
-    return props;
-  }
-  function normalizePostHogEvent(phEvent) {
-    let ts2;
-    if (typeof phEvent.timestamp === "number") {
-      ts2 = phEvent.timestamp;
-    } else if (typeof phEvent.timestamp === "string") {
-      ts2 = new Date(phEvent.timestamp).getTime();
-    } else {
-      ts2 = Date.now();
-    }
-    return {
-      ts: ts2,
-      name: getEventName(phEvent),
-      source: "posthog",
-      props: extractProps(phEvent),
-      schemaVersion: EVENT_SCHEMA_VERSION
-    };
-  }
-  function shouldNormalizeEvent(phEvent) {
-    const eventName = phEvent.event;
-    if (typeof eventName !== "string") return false;
-    const skipEvents = [
-      "$feature_flag_called",
-      "$feature_flags",
-      "$groups",
-      "$groupidentify",
-      "$set",
-      "$set_once",
-      "$unset",
-      "$create_alias",
-      "$capture_metrics",
-      "$performance_event",
-      "$web_vitals",
-      "$exception",
-      "$dead_click",
-      "$heatmap"
-    ];
-    if (skipEvents.includes(eventName)) {
-      return false;
-    }
-    return true;
-  }
-  function createPostHogNormalizer(publishFn) {
-    return (eventName, properties) => {
-      if (typeof eventName !== "string") return;
-      const phEvent = {
-        event: eventName,
-        properties,
-        timestamp: Date.now()
-      };
-      if (shouldNormalizeEvent(phEvent)) {
-        const normalizedEvent = normalizePostHogEvent(phEvent);
-        publishFn(normalizedEvent);
-      }
-    };
-  }
-
   // src/events/schema.ts
   var EventSourceZ = external_exports.enum(["posthog", "canvas", "derived"]);
   var NormalizedEventZ = external_exports.object({
@@ -41574,9 +42054,44 @@ ${cssRules}
     let experiments;
     const events = createEventBus();
     console.log("[Syntro Bootstrap] EventBus created");
-    const postHogNormalizer = createPostHogNormalizer((event) => {
-      events.publishEvent(event);
+    const processor = createEventProcessor({
+      elementResolver: typeof window !== "undefined" ? (x2, y2) => {
+        const el = document.elementFromPoint(x2, y2);
+        if (!el) return null;
+        const info = { tag_name: el.tagName.toLowerCase() };
+        if (el.id) info.attr__id = el.id;
+        if (el.className && typeof el.className === "string") {
+          info.classes = el.className.split(" ").filter(Boolean);
+        }
+        for (const attr of el.attributes) {
+          if (attr.name.startsWith("data-")) info[`attr__${attr.name}`] = attr.value;
+        }
+        return info;
+      } : void 0
     });
+    processor.onEvent((event) => events.publishEvent(event));
+    if (typeof window !== "undefined") {
+      setInterval(() => processor.tick(Date.now()), 1e3);
+      document.addEventListener(
+        "click",
+        (e2) => {
+          const chain = [];
+          let el = e2.target;
+          while (el && el !== document.body) {
+            const info = { tag_name: el.tagName.toLowerCase() };
+            for (const attr of el.attributes) {
+              if (attr.name.startsWith("data-") || attr.name === "id" || attr.name === "class" || attr.name === "aria-label") {
+                info[`attr__${attr.name}`] = attr.value;
+              }
+            }
+            chain.push(info);
+            el = el.parentElement;
+          }
+          processor.enrichClickAttributes(Date.now(), chain);
+        },
+        true
+      );
+    }
     const onFeatureFlagsLoaded = (allFlags) => {
       debug("Syntro Bootstrap", "Phase 2: PostHog feature flags loaded");
       const segmentFlags = extractSegmentFlags(allFlags);
@@ -41600,8 +42115,14 @@ ${cssRules}
         enableFeatureFlags: true,
         // Wire up callback for when flags are loaded (Phase 2)
         onFeatureFlagsLoaded,
-        // Wire up event capture to feed into EventBus
-        onCapture: postHogNormalizer
+        // Wire up event capture to feed into event processor
+        onCapture: (eventName, properties) => {
+          processor.ingest({ kind: "posthog", event: eventName, properties, timestamp: Date.now() });
+        },
+        // Wire rrweb events for behavioral signal detection
+        onRRWebEvent: (event) => {
+          processor.ingest(event);
+        }
       });
       console.log(`[Syntro Bootstrap] Telemetry client created (${provider}) with EventBus wiring`);
     }
@@ -41792,7 +42313,7 @@ ${cssRules}
   }
 
   // src/index.ts
-  var RUNTIME_SDK_BUILD = true ? `${"2026-03-14T02:31:26.217Z"} (${"7fefac724c"})` : "dev";
+  var RUNTIME_SDK_BUILD = true ? `${"2026-03-14T03:04:52.784Z"} (${"5e67d79633"})` : "dev";
   if (typeof window !== "undefined") {
     console.log(`[Syntro Runtime] Build: ${RUNTIME_SDK_BUILD}`);
     const existing = window.SynOS;