@memberjunction/ng-whiteboard 0.0.1 → 5.42.0

package/dist/lib/whiteboard-widget-bridge.js

@@ -0,0 +1,254 @@
+/**
+ * LIVE WHITEBOARD — the HTML-widget INPUT BRIDGE (`MJWhiteboard.submit`) and the AMBIENT
+ * INTERACTION RECORDER.
+ *
+ * HTML widgets are tutoring-style "illustrate a concept and GET USER INPUT" chunks —
+ * micro-forms, HTML+SVG explainers, concept animations, one-question quizzes. They render
+ * inside a strictly sandboxed iframe (`sandbox="allow-scripts"` only, opaque origin), so
+ * the ONLY way data can flow out is `postMessage`. This module is the Angular-free half of
+ * that bridge:
+ *
+ *  - {@link InjectWhiteboardSubmitHelper} prepends ONE helper script to every widget's
+ *    `srcdoc` (exactly once) that defines BOTH halves of the bridge:
+ *      1. `window.MJWhiteboard.submit(data)` — the EXPLICIT input path; the widget calls
+ *         it from a button / form handler and the helper posts the payload to the parent.
+ *      2. The AMBIENT interaction recorder — passive document-level listeners (click /
+ *         change / debounced input / focusin / focusout) that observe form activity the
+ *         widget author wrote NO script for, batch it, and post it to the parent as a
+ *         `__mjWhiteboardInteraction` message. Password / hidden inputs are skipped
+ *         entirely; every value is truncated client-side. The recorder is defensive:
+ *         every handler is wrapped in try/catch so it can never break widget code.
+ *    The helper targets `'*'` deliberately: the frame runs in an OPAQUE origin, so there is
+ *    no concrete origin to name; the HOST side validates the message instead.
+ *  - {@link EvaluateWidgetSubmitMessage} / {@link EvaluateWidgetInteractionMessage} are
+ *    that host-side validation: the marker property must be present, the `event.source`
+ *    must resolve to a TRACKED widget iframe (anything else is dropped), the payload is
+ *    size-capped (oversize → warn + drop), and interaction batches are shape-checked.
+ *  - {@link SummarizeWidgetInteractions} compresses one validated interaction batch into a
+ *    compact human line (`clicked "Playful pink"; changed "vibe" to "pink"; typing in
+ *    "email"`) — what the channel plugin forwards to the live agent.
+ *
+ * The board component owns the single `window` 'message' listener and emits accepted
+ * submissions as {@link WhiteboardWidgetSubmitEvent} and accepted ambient batches as
+ * {@link WhiteboardWidgetInteractionEvent}; the channel plugin forwards them to the live
+ * agent context as `[whiteboard]` notes (interaction notes throttled per widget).
+ */
+/** Marker property carried on every explicit-submit bridge postMessage payload. */
+export const WHITEBOARD_SUBMIT_MARKER = '__mjWhiteboardSubmit';
+/** Marker property carried on every ambient-interaction bridge postMessage payload. */
+export const WHITEBOARD_INTERACTION_MARKER = '__mjWhiteboardInteraction';
+/** Max chars an in-widget recorded VALUE keeps (recorder-side truncation, defensive re-clip host-side). */
+export const WHITEBOARD_INTERACTION_VALUE_MAX_CHARS = 120;
+/** Max chars a recorded element LABEL keeps. */
+export const WHITEBOARD_INTERACTION_LABEL_MAX_CHARS = 40;
+/** Recorder batch flush interval (ms). */
+export const WHITEBOARD_INTERACTION_FLUSH_MS = 1500;
+/** Recorder batch flushes immediately at this queue depth. */
+export const WHITEBOARD_INTERACTION_FLUSH_AT = 12;
+/** Per-field typing debounce inside the recorder (ms). */
+export const WHITEBOARD_INTERACTION_TYPE_DEBOUNCE_MS = 800;
+/**
+ * The ONE helper script prepended to every widget `srcdoc` — defines `MJWhiteboard.submit`
+ * (explicit input path) AND installs the passive ambient-interaction recorder.
+ * `'*'` as the target origin is acceptable here: the sandboxed frame has an opaque origin
+ * (there is nothing else to address), and the HOST validates marker + `event.source`.
+ *
+ * The recorder, in widget-side terms:
+ *  - `click` — buttons / links / labels / role=button / aria-labeled elements only
+ *    (body/div noise without a label is ignored); records the tag + best label
+ *    (aria-label || name || id || trimmed textContent, ≤40 chars).
+ *  - `change` — select / radio / checkbox / text fields: field label + new value
+ *    (checkbox → 'checked'/'unchecked').
+ *  - `input` — debounced per-field (800 ms): field label + current value.
+ *  - `focusin` / `focusout` — field label only.
+ *  - PRIVACY: `type="password"` / `type="hidden"` fields are skipped entirely; every
+ *    recorded value is truncated to 120 chars BEFORE leaving the frame.
+ *  - BATCHING: events queue and flush via postMessage every 1500 ms or at 12 queued.
+ *  - RESILIENCE: every handler body is try/catch-wrapped — recorder errors never leak
+ *    into widget code.
+ *
+ * AUTO-SUBMIT FALLBACK: agent-generated widgets don't always wire
+ * `MJWhiteboard.submit` — a plain `<form>` submit would NAVIGATE the sandboxed frame
+ * (blanking the widget) and an inert Submit button goes nowhere. The helper therefore:
+ *  - intercepts every `submit` event (preventDefault — the frame never navigates) and
+ *    forwards the form's serialized fields as `{ __auto: true, fields }`;
+ *  - watches clicks on submit-ish buttons (type=submit, or labeled submit/send/done/…)
+ *    and, shortly after, forwards the nearest form's (or document's) fields the same way;
+ *  - DEDUPES: an explicit `MJWhiteboard.submit` (or a prior auto-forward) within 600 ms
+ *    suppresses the fallback, so well-built widgets never double-submit.
+ *  - Serialization respects the recorder's privacy rules (password/hidden skipped,
+ *    values clipped) and only checked radios/checkboxes contribute.
+ */
+export const WHITEBOARD_SUBMIT_HELPER = `<script>window.MJWhiteboard={__lastSubmitAt:0,submit:function(data){window.MJWhiteboard.__lastSubmitAt=Date.now();parent.postMessage({__mjWhiteboardSubmit:true,data:data},'*');}};
+(function(){
+var VALUE_MAX=120,LABEL_MAX=40,FLUSH_MS=1500,FLUSH_AT=12,TYPE_MS=800;
+var queue=[],flushTimer=null,typeTimers={};
+function flush(){flushTimer=null;if(!queue.length){return;}var batch=queue;queue=[];try{parent.postMessage({__mjWhiteboardInteraction:true,events:batch},'*');}catch(e){}}
+function push(ev){queue.push(ev);if(queue.length>=FLUSH_AT){if(flushTimer){clearTimeout(flushTimer);flushTimer=null;}flush();return;}if(!flushTimer){flushTimer=setTimeout(flush,FLUSH_MS);}}
+function clip(v,max){v=String(v==null?'':v);return v.length>max?v.slice(0,max):v;}
+function isPrivate(el){var t=(el&&el.type?String(el.type):'').toLowerCase();return t==='password'||t==='hidden';}
+function labelOf(el){if(!el||!el.getAttribute){return '';}var v=el.getAttribute('aria-label')||el.getAttribute('name')||el.id;if(v){return clip(v,LABEL_MAX);}var t=(el.textContent||'').replace(/\\s+/g,' ').trim();return t?clip(t,LABEL_MAX):'';}
+function fieldLabel(el){var own=labelOf(el);if(own){return own;}try{if(el.labels&&el.labels.length){var lt=(el.labels[0].textContent||'').replace(/\\s+/g,' ').trim();if(lt){return clip(lt,LABEL_MAX);}}var wrap=el.closest?el.closest('label'):null;if(wrap){var wt=(wrap.textContent||'').replace(/\\s+/g,' ').trim();if(wt){return clip(wt,LABEL_MAX);}}}catch(e){}return el.tagName?el.tagName.toLowerCase():'field';}
+function isField(el){var t=el&&el.tagName?el.tagName.toUpperCase():'';return t==='INPUT'||t==='TEXTAREA'||t==='SELECT';}
+function fieldValue(el){if(el.type==='checkbox'){return el.checked?'checked':'unchecked';}return clip(el.value,VALUE_MAX);}
+document.addEventListener('click',function(e){try{var el=e.target&&e.target.closest?e.target.closest('button,a,label,input[type="button"],input[type="submit"],[role="button"],[aria-label]'):null;if(!el){return;}var lbl=labelOf(el);if(!lbl){return;}push({kind:'click',target:lbl,tag:el.tagName.toLowerCase()});}catch(err){}},true);
+document.addEventListener('change',function(e){try{var el=e.target;if(!isField(el)||isPrivate(el)){return;}var name=fieldLabel(el);if(typeTimers[name]){clearTimeout(typeTimers[name]);delete typeTimers[name];}push({kind:'change',target:name,value:fieldValue(el)});}catch(err){}},true);
+document.addEventListener('input',function(e){try{var el=e.target;if(!isField(el)||isPrivate(el)){return;}var t=(el.type||'').toLowerCase();if(t==='checkbox'||t==='radio'){return;}var name=fieldLabel(el);if(typeTimers[name]){clearTimeout(typeTimers[name]);}typeTimers[name]=setTimeout(function(){delete typeTimers[name];try{push({kind:'input',target:name,value:clip(el.value,VALUE_MAX)});}catch(e2){}},TYPE_MS);}catch(err){}},true);
+document.addEventListener('focusin',function(e){try{var el=e.target;if(!isField(el)||isPrivate(el)){return;}push({kind:'focus',target:fieldLabel(el)});}catch(err){}});
+document.addEventListener('focusout',function(e){try{var el=e.target;if(!isField(el)||isPrivate(el)){return;}push({kind:'blur',target:fieldLabel(el)});}catch(err){}});
+var AUTO_DEDUPE_MS=600;
+function collectFields(scope){var out={},els=(scope&&scope.querySelectorAll?scope:document).querySelectorAll('input,select,textarea');for(var i=0;i<els.length;i++){var el=els[i];if(isPrivate(el)){continue;}var t=(el.type||'').toLowerCase();if((t==='radio'||t==='checkbox')&&!el.checked){continue;}var name=fieldLabel(el);if(t==='checkbox'){out[name]='checked';}else{out[name]=clip(el.value,VALUE_MAX);}}return out;}
+function autoSubmit(scope,trigger){try{var last=window.MJWhiteboard.__lastSubmitAt||0;if(Date.now()-last<AUTO_DEDUPE_MS){return;}var fields=collectFields(scope);var payload={__auto:true,trigger:clip(trigger||'submit',LABEL_MAX),fields:fields};window.MJWhiteboard.submit(payload);}catch(err){}}
+document.addEventListener('submit',function(e){try{e.preventDefault();autoSubmit(e.target,'form');}catch(err){}},true);
+document.addEventListener('click',function(e){try{var b=e.target&&e.target.closest?e.target.closest('button,input[type="submit"],input[type="button"]'):null;if(!b){return;}var label=(labelOf(b)||'')+' '+(b.type||'');if(!/submit|send|done|go\\b|answer|check/i.test(label)){return;}setTimeout(function(){autoSubmit(b.form||document,labelOf(b)||'button');},150);}catch(err){}},true);
+})();</script>`;
+/** Max serialized payload size (chars) accepted from one `MJWhiteboard.submit` call. */
+export const WHITEBOARD_WIDGET_SUBMIT_MAX_CHARS = 8000;
+/**
+ * Prepend the `MJWhiteboard.submit` helper to a widget's HTML source — EXACTLY once.
+ * Idempotent: when the helper is already present (re-render of an injected source) the
+ * input is returned unchanged, so memoized srcdocs never accumulate duplicate helpers.
+ */
+export function InjectWhiteboardSubmitHelper(html) {
+    if (html.includes(WHITEBOARD_SUBMIT_HELPER)) {
+        return html;
+    }
+    return WHITEBOARD_SUBMIT_HELPER + html;
+}
+/**
+ * Host-side validation of one window 'message' event:
+ *
+ *  1. the payload must carry the {@link WHITEBOARD_SUBMIT_MARKER} (anything else is
+ *     unrelated postMessage traffic — dropped silently as `'not-submit'`);
+ *  2. `sourceWidget` is the caller's resolution of `event.source` against its tracked
+ *     widget iframes (window → item map) — `null` means the sender is NOT one of the
+ *     board's widgets and the message is dropped (`'unknown-source'`);
+ *  3. the submitted data is JSON-serialized and capped at
+ *     {@link WHITEBOARD_WIDGET_SUBMIT_MAX_CHARS} (`'oversize'` beyond it).
+ */
+export function EvaluateWidgetSubmitMessage(messageData, sourceWidget) {
+    if (messageData === null || typeof messageData !== 'object'
+        || messageData[WHITEBOARD_SUBMIT_MARKER] !== true) {
+        return { Kind: 'dropped', Reason: 'not-submit' };
+    }
+    if (!sourceWidget) {
+        return { Kind: 'dropped', Reason: 'unknown-source' };
+    }
+    let dataJson;
+    try {
+        dataJson = JSON.stringify(messageData['data']);
+    }
+    catch {
+        dataJson = undefined; // circular payloads can't cross postMessage, but stay defensive
+    }
+    if (dataJson === undefined) {
+        return { Kind: 'dropped', Reason: 'unserializable' };
+    }
+    if (dataJson.length > WHITEBOARD_WIDGET_SUBMIT_MAX_CHARS) {
+        return { Kind: 'dropped', Reason: 'oversize' };
+    }
+    return {
+        Kind: 'submit',
+        Event: { ItemID: sourceWidget.ItemID, Title: sourceWidget.Title ?? '', DataJson: dataJson }
+    };
+}
+// ───────────────────────────────────────────────────────────── ambient interactions
+/** Max serialized size (chars) accepted for one ambient interaction BATCH. */
+export const WHITEBOARD_WIDGET_INTERACTION_MAX_CHARS = 6000;
+/** Max length of one summarized interaction line (see {@link SummarizeWidgetInteractions}). */
+export const WHITEBOARD_INTERACTION_SUMMARY_MAX_CHARS = 300;
+const INTERACTION_KINDS = new Set(['click', 'change', 'input', 'focus', 'blur']);
+/** Shape-check one entry of an interaction batch against {@link WhiteboardWidgetInteractionRecord}. */
+function isInteractionRecord(value) {
+    if (value === null || typeof value !== 'object') {
+        return false;
+    }
+    const record = value;
+    return typeof record['kind'] === 'string' && INTERACTION_KINDS.has(record['kind'])
+        && typeof record['target'] === 'string'
+        && (record['value'] === undefined || typeof record['value'] === 'string')
+        && (record['tag'] === undefined || typeof record['tag'] === 'string');
+}
+/**
+ * Host-side validation of one ambient-interaction 'message' event — mirrors the submit
+ * path: marker required (`'not-interaction'` otherwise), `sourceWidget` must resolve to a
+ * tracked widget iframe (`'unknown-source'`), the `events` array must be a non-empty list
+ * of well-shaped {@link WhiteboardWidgetInteractionRecord}s (`'bad-shape'`), and the
+ * serialized batch is capped at {@link WHITEBOARD_WIDGET_INTERACTION_MAX_CHARS}
+ * (`'oversize'`). Accepted batches come back pre-summarized (via
+ * {@link SummarizeWidgetInteractions}) as a {@link WhiteboardWidgetInteractionEvent}.
+ */
+export function EvaluateWidgetInteractionMessage(messageData, sourceWidget) {
+    if (messageData === null || typeof messageData !== 'object'
+        || messageData[WHITEBOARD_INTERACTION_MARKER] !== true) {
+        return { Kind: 'dropped', Reason: 'not-interaction' };
+    }
+    if (!sourceWidget) {
+        return { Kind: 'dropped', Reason: 'unknown-source' };
+    }
+    const events = messageData['events'];
+    if (!Array.isArray(events) || events.length === 0 || !events.every(isInteractionRecord)) {
+        return { Kind: 'dropped', Reason: 'bad-shape' };
+    }
+    if (JSON.stringify(events).length > WHITEBOARD_WIDGET_INTERACTION_MAX_CHARS) {
+        return { Kind: 'dropped', Reason: 'oversize' };
+    }
+    return {
+        Kind: 'interaction',
+        Event: {
+            ItemID: sourceWidget.ItemID,
+            Title: sourceWidget.Title ?? '',
+            Summary: SummarizeWidgetInteractions(events)
+        }
+    };
+}
+/** Defensive host-side re-clip (the recorder already truncates, but trust nothing). */
+function clipValue(value) {
+    return value.length > WHITEBOARD_INTERACTION_VALUE_MAX_CHARS
+        ? value.slice(0, WHITEBOARD_INTERACTION_VALUE_MAX_CHARS)
+        : value;
+}
+/** Render one interaction record as a human fragment. */
+function interactionPhrase(record) {
+    switch (record.kind) {
+        case 'click':
+            return record.target ? `clicked "${record.target}"` : `clicked ${record.tag ?? 'element'}`;
+        case 'change':
+            return record.value !== undefined
+                ? `changed "${record.target}" to "${clipValue(record.value)}"`
+                : `changed "${record.target}"`;
+        case 'input':
+            return `typing in "${record.target}"`;
+        case 'focus':
+            return `focused "${record.target}"`;
+        case 'blur':
+            return `left "${record.target}"`;
+    }
+}
+/**
+ * Compress one validated interaction batch into a compact human line, e.g.
+ * `clicked "Playful pink"; changed "vibe" to "pink"; typing in "email"`.
+ *
+ * Pure: consecutive same-field `input` (typing) records are deduped (the LAST wins —
+ * matching the recorder's latest-value semantics), values are defensively re-truncated to
+ * {@link WHITEBOARD_INTERACTION_VALUE_MAX_CHARS}, and the whole line is capped at
+ * {@link WHITEBOARD_INTERACTION_SUMMARY_MAX_CHARS} chars (ellipsized).
+ */
+export function SummarizeWidgetInteractions(events) {
+    const deduped = [];
+    for (const event of events) {
+        const previous = deduped[deduped.length - 1];
+        if (previous && event.kind === 'input' && previous.kind === 'input' && previous.target === event.target) {
+            deduped[deduped.length - 1] = event; // consecutive same-field typing — latest wins
+        }
+        else {
+            deduped.push(event);
+        }
+    }
+    const line = deduped.map(interactionPhrase).join('; ');
+    if (line.length > WHITEBOARD_INTERACTION_SUMMARY_MAX_CHARS) {
+        return line.slice(0, WHITEBOARD_INTERACTION_SUMMARY_MAX_CHARS - 1) + '…';
+    }
+    return line;
+}
+//# sourceMappingURL=whiteboard-widget-bridge.js.map

package/dist/lib/whiteboard-widget-bridge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"whiteboard-widget-bridge.js","sourceRoot":"","sources":["../../src/lib/whiteboard-widget-bridge.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * LIVE WHITEBOARD — the HTML-widget INPUT BRIDGE (`MJWhiteboard.submit`) and the AMBIENT\n * INTERACTION RECORDER.\n *\n * HTML widgets are tutoring-style \"illustrate a concept and GET USER INPUT\" chunks —\n * micro-forms, HTML+SVG explainers, concept animations, one-question quizzes. They render\n * inside a strictly sandboxed iframe (`sandbox=\"allow-scripts\"` only, opaque origin), so\n * the ONLY way data can flow out is `postMessage`. This module is the Angular-free half of\n * that bridge:\n *\n *  - {@link InjectWhiteboardSubmitHelper} prepends ONE helper script to every widget's\n *    `srcdoc` (exactly once) that defines BOTH halves of the bridge:\n *      1. `window.MJWhiteboard.submit(data)` — the EXPLICIT input path; the widget calls\n *         it from a button / form handler and the helper posts the payload to the parent.\n *      2. The AMBIENT interaction recorder — passive document-level listeners (click /\n *         change / debounced input / focusin / focusout) that observe form activity the\n *         widget author wrote NO script for, batch it, and post it to the parent as a\n *         `__mjWhiteboardInteraction` message. Password / hidden inputs are skipped\n *         entirely; every value is truncated client-side. The recorder is defensive:\n *         every handler is wrapped in try/catch so it can never break widget code.\n *    The helper targets `'*'` deliberately: the frame runs in an OPAQUE origin, so there is\n *    no concrete origin to name; the HOST side validates the message instead.\n *  - {@link EvaluateWidgetSubmitMessage} / {@link EvaluateWidgetInteractionMessage} are\n *    that host-side validation: the marker property must be present, the `event.source`\n *    must resolve to a TRACKED widget iframe (anything else is dropped), the payload is\n *    size-capped (oversize → warn + drop), and interaction batches are shape-checked.\n *  - {@link SummarizeWidgetInteractions} compresses one validated interaction batch into a\n *    compact human line (`clicked \"Playful pink\"; changed \"vibe\" to \"pink\"; typing in\n *    \"email\"`) — what the channel plugin forwards to the live agent.\n *\n * The board component owns the single `window` 'message' listener and emits accepted\n * submissions as {@link WhiteboardWidgetSubmitEvent} and accepted ambient batches as\n * {@link WhiteboardWidgetInteractionEvent}; the channel plugin forwards them to the live\n * agent context as `[whiteboard]` notes (interaction notes throttled per widget).\n */\n\n/** Marker property carried on every explicit-submit bridge postMessage payload. */\nexport const WHITEBOARD_SUBMIT_MARKER = '__mjWhiteboardSubmit';\n\n/** Marker property carried on every ambient-interaction bridge postMessage payload. */\nexport const WHITEBOARD_INTERACTION_MARKER = '__mjWhiteboardInteraction';\n\n/** Max chars an in-widget recorded VALUE keeps (recorder-side truncation, defensive re-clip host-side). */\nexport const WHITEBOARD_INTERACTION_VALUE_MAX_CHARS = 120;\n\n/** Max chars a recorded element LABEL keeps. */\nexport const WHITEBOARD_INTERACTION_LABEL_MAX_CHARS = 40;\n\n/** Recorder batch flush interval (ms). */\nexport const WHITEBOARD_INTERACTION_FLUSH_MS = 1500;\n\n/** Recorder batch flushes immediately at this queue depth. */\nexport const WHITEBOARD_INTERACTION_FLUSH_AT = 12;\n\n/** Per-field typing debounce inside the recorder (ms). */\nexport const WHITEBOARD_INTERACTION_TYPE_DEBOUNCE_MS = 800;\n\n/**\n * The ONE helper script prepended to every widget `srcdoc` — defines `MJWhiteboard.submit`\n * (explicit input path) AND installs the passive ambient-interaction recorder.\n * `'*'` as the target origin is acceptable here: the sandboxed frame has an opaque origin\n * (there is nothing else to address), and the HOST validates marker + `event.source`.\n *\n * The recorder, in widget-side terms:\n *  - `click` — buttons / links / labels / role=button / aria-labeled elements only\n *    (body/div noise without a label is ignored); records the tag + best label\n *    (aria-label || name || id || trimmed textContent, ≤40 chars).\n *  - `change` — select / radio / checkbox / text fields: field label + new value\n *    (checkbox → 'checked'/'unchecked').\n *  - `input` — debounced per-field (800 ms): field label + current value.\n *  - `focusin` / `focusout` — field label only.\n *  - PRIVACY: `type=\"password\"` / `type=\"hidden\"` fields are skipped entirely; every\n *    recorded value is truncated to 120 chars BEFORE leaving the frame.\n *  - BATCHING: events queue and flush via postMessage every 1500 ms or at 12 queued.\n *  - RESILIENCE: every handler body is try/catch-wrapped — recorder errors never leak\n *    into widget code.\n *\n * AUTO-SUBMIT FALLBACK: agent-generated widgets don't always wire\n * `MJWhiteboard.submit` — a plain `<form>` submit would NAVIGATE the sandboxed frame\n * (blanking the widget) and an inert Submit button goes nowhere. The helper therefore:\n *  - intercepts every `submit` event (preventDefault — the frame never navigates) and\n *    forwards the form's serialized fields as `{ __auto: true, fields }`;\n *  - watches clicks on submit-ish buttons (type=submit, or labeled submit/send/done/…)\n *    and, shortly after, forwards the nearest form's (or document's) fields the same way;\n *  - DEDUPES: an explicit `MJWhiteboard.submit` (or a prior auto-forward) within 600 ms\n *    suppresses the fallback, so well-built widgets never double-submit.\n *  - Serialization respects the recorder's privacy rules (password/hidden skipped,\n *    values clipped) and only checked radios/checkboxes contribute.\n */\nexport const WHITEBOARD_SUBMIT_HELPER =\n  `<script>window.MJWhiteboard={__lastSubmitAt:0,submit:function(data){window.MJWhiteboard.__lastSubmitAt=Date.now();parent.postMessage({__mjWhiteboardSubmit:true,data:data},'*');}};\n(function(){\nvar VALUE_MAX=120,LABEL_MAX=40,FLUSH_MS=1500,FLUSH_AT=12,TYPE_MS=800;\nvar queue=[],flushTimer=null,typeTimers={};\nfunction flush(){flushTimer=null;if(!queue.length){return;}var batch=queue;queue=[];try{parent.postMessage({__mjWhiteboardInteraction:true,events:batch},'*');}catch(e){}}\nfunction push(ev){queue.push(ev);if(queue.length>=FLUSH_AT){if(flushTimer){clearTimeout(flushTimer);flushTimer=null;}flush();return;}if(!flushTimer){flushTimer=setTimeout(flush,FLUSH_MS);}}\nfunction clip(v,max){v=String(v==null?'':v);return v.length>max?v.slice(0,max):v;}\nfunction isPrivate(el){var t=(el&&el.type?String(el.type):'').toLowerCase();return t==='password'||t==='hidden';}\nfunction labelOf(el){if(!el||!el.getAttribute){return '';}var v=el.getAttribute('aria-label')||el.getAttribute('name')||el.id;if(v){return clip(v,LABEL_MAX);}var t=(el.textContent||'').replace(/\\\\s+/g,' ').trim();return t?clip(t,LABEL_MAX):'';}\nfunction fieldLabel(el){var own=labelOf(el);if(own){return own;}try{if(el.labels&&el.labels.length){var lt=(el.labels[0].textContent||'').replace(/\\\\s+/g,' ').trim();if(lt){return clip(lt,LABEL_MAX);}}var wrap=el.closest?el.closest('label'):null;if(wrap){var wt=(wrap.textContent||'').replace(/\\\\s+/g,' ').trim();if(wt){return clip(wt,LABEL_MAX);}}}catch(e){}return el.tagName?el.tagName.toLowerCase():'field';}\nfunction isField(el){var t=el&&el.tagName?el.tagName.toUpperCase():'';return t==='INPUT'||t==='TEXTAREA'||t==='SELECT';}\nfunction fieldValue(el){if(el.type==='checkbox'){return el.checked?'checked':'unchecked';}return clip(el.value,VALUE_MAX);}\ndocument.addEventListener('click',function(e){try{var el=e.target&&e.target.closest?e.target.closest('button,a,label,input[type=\"button\"],input[type=\"submit\"],[role=\"button\"],[aria-label]'):null;if(!el){return;}var lbl=labelOf(el);if(!lbl){return;}push({kind:'click',target:lbl,tag:el.tagName.toLowerCase()});}catch(err){}},true);\ndocument.addEventListener('change',function(e){try{var el=e.target;if(!isField(el)||isPrivate(el)){return;}var name=fieldLabel(el);if(typeTimers[name]){clearTimeout(typeTimers[name]);delete typeTimers[name];}push({kind:'change',target:name,value:fieldValue(el)});}catch(err){}},true);\ndocument.addEventListener('input',function(e){try{var el=e.target;if(!isField(el)||isPrivate(el)){return;}var t=(el.type||'').toLowerCase();if(t==='checkbox'||t==='radio'){return;}var name=fieldLabel(el);if(typeTimers[name]){clearTimeout(typeTimers[name]);}typeTimers[name]=setTimeout(function(){delete typeTimers[name];try{push({kind:'input',target:name,value:clip(el.value,VALUE_MAX)});}catch(e2){}},TYPE_MS);}catch(err){}},true);\ndocument.addEventListener('focusin',function(e){try{var el=e.target;if(!isField(el)||isPrivate(el)){return;}push({kind:'focus',target:fieldLabel(el)});}catch(err){}});\ndocument.addEventListener('focusout',function(e){try{var el=e.target;if(!isField(el)||isPrivate(el)){return;}push({kind:'blur',target:fieldLabel(el)});}catch(err){}});\nvar AUTO_DEDUPE_MS=600;\nfunction collectFields(scope){var out={},els=(scope&&scope.querySelectorAll?scope:document).querySelectorAll('input,select,textarea');for(var i=0;i<els.length;i++){var el=els[i];if(isPrivate(el)){continue;}var t=(el.type||'').toLowerCase();if((t==='radio'||t==='checkbox')&&!el.checked){continue;}var name=fieldLabel(el);if(t==='checkbox'){out[name]='checked';}else{out[name]=clip(el.value,VALUE_MAX);}}return out;}\nfunction autoSubmit(scope,trigger){try{var last=window.MJWhiteboard.__lastSubmitAt||0;if(Date.now()-last<AUTO_DEDUPE_MS){return;}var fields=collectFields(scope);var payload={__auto:true,trigger:clip(trigger||'submit',LABEL_MAX),fields:fields};window.MJWhiteboard.submit(payload);}catch(err){}}\ndocument.addEventListener('submit',function(e){try{e.preventDefault();autoSubmit(e.target,'form');}catch(err){}},true);\ndocument.addEventListener('click',function(e){try{var b=e.target&&e.target.closest?e.target.closest('button,input[type=\"submit\"],input[type=\"button\"]'):null;if(!b){return;}var label=(labelOf(b)||'')+' '+(b.type||'');if(!/submit|send|done|go\\\\b|answer|check/i.test(label)){return;}setTimeout(function(){autoSubmit(b.form||document,labelOf(b)||'button');},150);}catch(err){}},true);\n})();</script>`;\n\n/** Max serialized payload size (chars) accepted from one `MJWhiteboard.submit` call. */\nexport const WHITEBOARD_WIDGET_SUBMIT_MAX_CHARS = 8000;\n\n/** One accepted widget submission, surfaced by the board/host `WidgetSubmitted` output. */\nexport interface WhiteboardWidgetSubmitEvent {\n  /** The submitting widget's board item ID (e.g. `html-2`). */\n  ItemID: string;\n  /** The widget's header title ('' when untitled — consumers fall back to {@link ItemID}). */\n  Title: string;\n  /** The submitted payload, JSON-serialized (capped at {@link WHITEBOARD_WIDGET_SUBMIT_MAX_CHARS}). */\n  DataJson: string;\n}\n\n/**\n * BEFORE-event args for the board/host `WidgetSubmitting` output — raised after a\n * widget's `MJWhiteboard.submit` payload passed validation (marker + tracked source +\n * size cap) but BEFORE it is surfaced through `WidgetSubmitted`. Handlers run\n * synchronously; set {@link Cancel} to `true` to drop the submission (no `WidgetSubmitted`\n * fires and nothing reaches the agent/consumer).\n */\nexport interface WhiteboardWidgetSubmittingEventArgs {\n  /** The validated submission about to be surfaced. */\n  Event: WhiteboardWidgetSubmitEvent;\n  /** Set to `true` (in a synchronous handler) to drop the submission. */\n  Cancel: boolean;\n}\n\n/** Why an incoming 'message' event was NOT surfaced as a widget submission. */\nexport type WhiteboardWidgetSubmitDropReason =\n  /** Not a bridge message at all (no marker) — other postMessage traffic, ignore silently. */\n  | 'not-submit'\n  /** Marker present but `event.source` is not a tracked widget iframe — spoof/stale, drop. */\n  | 'unknown-source'\n  /** Payload serialized beyond the cap — warn + drop. */\n  | 'oversize'\n  /** Payload could not be JSON-serialized (e.g. `undefined` / function) — drop. */\n  | 'unserializable';\n\n/** Outcome of evaluating one window 'message' event against the bridge contract. */\nexport type WhiteboardWidgetSubmitOutcome =\n  | { Kind: 'submit'; Event: WhiteboardWidgetSubmitEvent }\n  | { Kind: 'dropped'; Reason: WhiteboardWidgetSubmitDropReason };\n\n/**\n * Prepend the `MJWhiteboard.submit` helper to a widget's HTML source — EXACTLY once.\n * Idempotent: when the helper is already present (re-render of an injected source) the\n * input is returned unchanged, so memoized srcdocs never accumulate duplicate helpers.\n */\nexport function InjectWhiteboardSubmitHelper(html: string): string {\n  if (html.includes(WHITEBOARD_SUBMIT_HELPER)) {\n    return html;\n  }\n  return WHITEBOARD_SUBMIT_HELPER + html;\n}\n\n/**\n * Host-side validation of one window 'message' event:\n *\n *  1. the payload must carry the {@link WHITEBOARD_SUBMIT_MARKER} (anything else is\n *     unrelated postMessage traffic — dropped silently as `'not-submit'`);\n *  2. `sourceWidget` is the caller's resolution of `event.source` against its tracked\n *     widget iframes (window → item map) — `null` means the sender is NOT one of the\n *     board's widgets and the message is dropped (`'unknown-source'`);\n *  3. the submitted data is JSON-serialized and capped at\n *     {@link WHITEBOARD_WIDGET_SUBMIT_MAX_CHARS} (`'oversize'` beyond it).\n */\nexport function EvaluateWidgetSubmitMessage(\n  messageData: unknown,\n  sourceWidget: { ItemID: string; Title?: string } | null\n): WhiteboardWidgetSubmitOutcome {\n  if (messageData === null || typeof messageData !== 'object'\n    || (messageData as Record<string, unknown>)[WHITEBOARD_SUBMIT_MARKER] !== true) {\n    return { Kind: 'dropped', Reason: 'not-submit' };\n  }\n  if (!sourceWidget) {\n    return { Kind: 'dropped', Reason: 'unknown-source' };\n  }\n  let dataJson: string | undefined;\n  try {\n    dataJson = JSON.stringify((messageData as Record<string, unknown>)['data']);\n  }\n  catch {\n    dataJson = undefined; // circular payloads can't cross postMessage, but stay defensive\n  }\n  if (dataJson === undefined) {\n    return { Kind: 'dropped', Reason: 'unserializable' };\n  }\n  if (dataJson.length > WHITEBOARD_WIDGET_SUBMIT_MAX_CHARS) {\n    return { Kind: 'dropped', Reason: 'oversize' };\n  }\n  return {\n    Kind: 'submit',\n    Event: { ItemID: sourceWidget.ItemID, Title: sourceWidget.Title ?? '', DataJson: dataJson }\n  };\n}\n\n// ───────────────────────────────────────────────────────────── ambient interactions\n\n/** Max serialized size (chars) accepted for one ambient interaction BATCH. */\nexport const WHITEBOARD_WIDGET_INTERACTION_MAX_CHARS = 6000;\n\n/** Max length of one summarized interaction line (see {@link SummarizeWidgetInteractions}). */\nexport const WHITEBOARD_INTERACTION_SUMMARY_MAX_CHARS = 300;\n\n/** The event kinds the in-widget recorder emits. */\nexport type WhiteboardWidgetInteractionKind = 'click' | 'change' | 'input' | 'focus' | 'blur';\n\n/** One recorded in-widget interaction, as posted by the injected recorder. */\nexport interface WhiteboardWidgetInteractionRecord {\n  /** What happened. */\n  kind: WhiteboardWidgetInteractionKind;\n  /** Best label of the interacted element (aria-label || name || id || text, ≤40 chars). */\n  target: string;\n  /** The field's value after the event (change/input only; checkbox → 'checked'/'unchecked'). */\n  value?: string;\n  /** The clicked element's tag name (click only). */\n  tag?: string;\n}\n\n/**\n * One accepted ambient-interaction batch, surfaced by the board/host `WidgetInteraction`\n * output. `Summary` is the compact human line built by {@link SummarizeWidgetInteractions}\n * — what integration layers forward to their agent runtime.\n */\nexport interface WhiteboardWidgetInteractionEvent {\n  /** The widget's board item ID (e.g. `html-2`). */\n  ItemID: string;\n  /** The widget's header title ('' when untitled — consumers fall back to {@link ItemID}). */\n  Title: string;\n  /** Compact human summary of the batch (≤{@link WHITEBOARD_INTERACTION_SUMMARY_MAX_CHARS} chars). */\n  Summary: string;\n}\n\n/** Why an incoming 'message' event was NOT surfaced as an ambient interaction batch. */\nexport type WhiteboardWidgetInteractionDropReason =\n  /** Not an interaction message at all (no marker) — other postMessage traffic, ignore silently. */\n  | 'not-interaction'\n  /** Marker present but `event.source` is not a tracked widget iframe — spoof/stale, drop. */\n  | 'unknown-source'\n  /** Serialized batch beyond {@link WHITEBOARD_WIDGET_INTERACTION_MAX_CHARS} — warn + drop. */\n  | 'oversize'\n  /** `events` missing / empty / not the documented record shape — warn + drop. */\n  | 'bad-shape';\n\n/** Outcome of evaluating one window 'message' event against the interaction contract. */\nexport type WhiteboardWidgetInteractionOutcome =\n  | { Kind: 'interaction'; Event: WhiteboardWidgetInteractionEvent }\n  | { Kind: 'dropped'; Reason: WhiteboardWidgetInteractionDropReason };\n\nconst INTERACTION_KINDS: ReadonlySet<string> = new Set(['click', 'change', 'input', 'focus', 'blur']);\n\n/** Shape-check one entry of an interaction batch against {@link WhiteboardWidgetInteractionRecord}. */\nfunction isInteractionRecord(value: unknown): value is WhiteboardWidgetInteractionRecord {\n  if (value === null || typeof value !== 'object') {\n    return false;\n  }\n  const record = value as Record<string, unknown>;\n  return typeof record['kind'] === 'string' && INTERACTION_KINDS.has(record['kind'])\n    && typeof record['target'] === 'string'\n    && (record['value'] === undefined || typeof record['value'] === 'string')\n    && (record['tag'] === undefined || typeof record['tag'] === 'string');\n}\n\n/**\n * Host-side validation of one ambient-interaction 'message' event — mirrors the submit\n * path: marker required (`'not-interaction'` otherwise), `sourceWidget` must resolve to a\n * tracked widget iframe (`'unknown-source'`), the `events` array must be a non-empty list\n * of well-shaped {@link WhiteboardWidgetInteractionRecord}s (`'bad-shape'`), and the\n * serialized batch is capped at {@link WHITEBOARD_WIDGET_INTERACTION_MAX_CHARS}\n * (`'oversize'`). Accepted batches come back pre-summarized (via\n * {@link SummarizeWidgetInteractions}) as a {@link WhiteboardWidgetInteractionEvent}.\n */\nexport function EvaluateWidgetInteractionMessage(\n  messageData: unknown,\n  sourceWidget: { ItemID: string; Title?: string } | null\n): WhiteboardWidgetInteractionOutcome {\n  if (messageData === null || typeof messageData !== 'object'\n    || (messageData as Record<string, unknown>)[WHITEBOARD_INTERACTION_MARKER] !== true) {\n    return { Kind: 'dropped', Reason: 'not-interaction' };\n  }\n  if (!sourceWidget) {\n    return { Kind: 'dropped', Reason: 'unknown-source' };\n  }\n  const events = (messageData as Record<string, unknown>)['events'];\n  if (!Array.isArray(events) || events.length === 0 || !events.every(isInteractionRecord)) {\n    return { Kind: 'dropped', Reason: 'bad-shape' };\n  }\n  if (JSON.stringify(events).length > WHITEBOARD_WIDGET_INTERACTION_MAX_CHARS) {\n    return { Kind: 'dropped', Reason: 'oversize' };\n  }\n  return {\n    Kind: 'interaction',\n    Event: {\n      ItemID: sourceWidget.ItemID,\n      Title: sourceWidget.Title ?? '',\n      Summary: SummarizeWidgetInteractions(events)\n    }\n  };\n}\n\n/** Defensive host-side re-clip (the recorder already truncates, but trust nothing). */\nfunction clipValue(value: string): string {\n  return value.length > WHITEBOARD_INTERACTION_VALUE_MAX_CHARS\n    ? value.slice(0, WHITEBOARD_INTERACTION_VALUE_MAX_CHARS)\n    : value;\n}\n\n/** Render one interaction record as a human fragment. */\nfunction interactionPhrase(record: WhiteboardWidgetInteractionRecord): string {\n  switch (record.kind) {\n    case 'click':\n      return record.target ? `clicked \"${record.target}\"` : `clicked ${record.tag ?? 'element'}`;\n    case 'change':\n      return record.value !== undefined\n        ? `changed \"${record.target}\" to \"${clipValue(record.value)}\"`\n        : `changed \"${record.target}\"`;\n    case 'input':\n      return `typing in \"${record.target}\"`;\n    case 'focus':\n      return `focused \"${record.target}\"`;\n    case 'blur':\n      return `left \"${record.target}\"`;\n  }\n}\n\n/**\n * Compress one validated interaction batch into a compact human line, e.g.\n * `clicked \"Playful pink\"; changed \"vibe\" to \"pink\"; typing in \"email\"`.\n *\n * Pure: consecutive same-field `input` (typing) records are deduped (the LAST wins —\n * matching the recorder's latest-value semantics), values are defensively re-truncated to\n * {@link WHITEBOARD_INTERACTION_VALUE_MAX_CHARS}, and the whole line is capped at\n * {@link WHITEBOARD_INTERACTION_SUMMARY_MAX_CHARS} chars (ellipsized).\n */\nexport function SummarizeWidgetInteractions(events: WhiteboardWidgetInteractionRecord[]): string {\n  const deduped: WhiteboardWidgetInteractionRecord[] = [];\n  for (const event of events) {\n    const previous = deduped[deduped.length - 1];\n    if (previous && event.kind === 'input' && previous.kind === 'input' && previous.target === event.target) {\n      deduped[deduped.length - 1] = event; // consecutive same-field typing — latest wins\n    }\n    else {\n      deduped.push(event);\n    }\n  }\n  const line = deduped.map(interactionPhrase).join('; ');\n  if (line.length > WHITEBOARD_INTERACTION_SUMMARY_MAX_CHARS) {\n    return line.slice(0, WHITEBOARD_INTERACTION_SUMMARY_MAX_CHARS - 1) + '…';\n  }\n  return line;\n}\n"]}

package/dist/lib/whiteboard-zoom.component.d.ts

@@ -0,0 +1,55 @@
+import { EventEmitter, OnDestroy } from '@angular/core';
+import * as i0 from "@angular/core";
+/** Which way a zoom button points. */
+type ZoomDirection = 1 | -1;
+/**
+ * The bottom-right zoom cluster of the live whiteboard: zoom out / percentage / zoom in,
+ * fit-to-content, and the minimap toggle. Pure presentational; the board owns the
+ * viewport math and the minimap rendering.
+ *
+ * HOLD-TO-ZOOM: a plain click on +/− still emits the existing single preset step
+ * ({@link ZoomIn} / {@link ZoomOut}); holding the button down (pointerdown held past a
+ * short delay) emits {@link ZoomBy} factors (~3.5%) every 50 ms for smooth continuous
+ * zooming, stopping on pointerup / pointerleave / pointercancel / destroy — the timers
+ * never leak. The board clamps to its usual 25%–200% limits.
+ */
+export declare class RealtimeWhiteboardZoomComponent implements OnDestroy {
+    /** How long a press must be held before continuous zooming kicks in. */
+    private static readonly HoldDelayMs;
+    /** Continuous-zoom tick cadence while held. */
+    private static readonly HoldIntervalMs;
+    /** Multiplicative zoom factor per held tick (~3.5%). */
+    private static readonly HoldFactor;
+    /** Current zoom as a percentage (e.g. 90). */
+    ZoomPercent: number;
+    /** Whether the minimap is currently shown (highlights the map button). */
+    MinimapOpen: boolean;
+    /** Single preset step out (a plain click on −). */
+    ZoomOut: EventEmitter<void>;
+    /** Single preset step in (a plain click on +). */
+    ZoomIn: EventEmitter<void>;
+    /**
+     * Continuous (held-button) zoom tick: a multiplicative factor (>1 zooms in, <1 zooms
+     * out) emitted every 50 ms while + or − is held. Wire to the board's `ZoomByFactor`.
+     */
+    ZoomBy: EventEmitter<number>;
+    Fit: EventEmitter<void>;
+    ToggleMinimap: EventEmitter<void>;
+    private holdDelayTimer;
+    private holdIntervalTimer;
+    /** Set once continuous ticks started, so the trailing click doesn't ALSO step. */
+    private suppressNextClick;
+    ngOnDestroy(): void;
+    /** Pointer down on +/−: arm the hold — after the delay, tick {@link ZoomBy} repeatedly. */
+    OnZoomPressStart(event: PointerEvent, direction: ZoomDirection): void;
+    /** Pointer up / leave / cancel: stop any pending or running continuous zoom. */
+    OnZoomPressEnd(): void;
+    /** The click that follows the press: a single preset step unless a hold already zoomed. */
+    OnZoomClick(direction: ZoomDirection): void;
+    /** Clear both hold timers (idempotent — safe from any stop path). */
+    private stopHold;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RealtimeWhiteboardZoomComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<RealtimeWhiteboardZoomComponent, "mj-realtime-whiteboard-zoom", never, { "ZoomPercent": { "alias": "ZoomPercent"; "required": false; }; "MinimapOpen": { "alias": "MinimapOpen"; "required": false; }; }, { "ZoomOut": "ZoomOut"; "ZoomIn": "ZoomIn"; "ZoomBy": "ZoomBy"; "Fit": "Fit"; "ToggleMinimap": "ToggleMinimap"; }, never, never, true, never>;
+}
+export {};
+//# sourceMappingURL=whiteboard-zoom.component.d.ts.map

package/dist/lib/whiteboard-zoom.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"whiteboard-zoom.component.d.ts","sourceRoot":"","sources":["../../src/lib/whiteboard-zoom.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,YAAY,EAAS,SAAS,EAAU,MAAM,eAAe,CAAC;;AAGlF,sCAAsC;AACtC,KAAK,aAAa,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;AAE5B;;;;;;;;;;GAUG;AACH,qBAOa,+BAAgC,YAAW,SAAS;IAC/D,wEAAwE;IACxE,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,WAAW,CAAO;IAC1C,+CAA+C;IAC/C,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAM;IAC5C,wDAAwD;IACxD,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,UAAU,CAAS;IAE3C,8CAA8C;IACrC,WAAW,SAAO;IAC3B,0EAA0E;IACjE,WAAW,UAAS;IAE7B,mDAAmD;IACzC,OAAO,qBAA4B;IAC7C,kDAAkD;IACxC,MAAM,qBAA4B;IAC5C;;;OAGG;IACO,MAAM,uBAA8B;IACpC,GAAG,qBAA4B;IAC/B,aAAa,qBAA4B;IAEnD,OAAO,CAAC,cAAc,CAA8C;IACpE,OAAO,CAAC,iBAAiB,CAA+C;IACxE,kFAAkF;IAClF,OAAO,CAAC,iBAAiB,CAAS;IAElC,WAAW,IAAI,IAAI;IAInB,2FAA2F;IACpF,gBAAgB,CAAC,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,aAAa,GAAG,IAAI;IAiB5E,gFAAgF;IACzE,cAAc,IAAI,IAAI;IAI7B,2FAA2F;IACpF,WAAW,CAAC,SAAS,EAAE,aAAa,GAAG,IAAI;IAalD,qEAAqE;IACrE,OAAO,CAAC,QAAQ;yCAxEL,+BAA+B;2CAA/B,+BAA+B;CAkF3C"}

package/dist/lib/whiteboard-zoom.component.js

@@ -0,0 +1,139 @@
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import * as i0 from "@angular/core";
+/**
+ * The bottom-right zoom cluster of the live whiteboard: zoom out / percentage / zoom in,
+ * fit-to-content, and the minimap toggle. Pure presentational; the board owns the
+ * viewport math and the minimap rendering.
+ *
+ * HOLD-TO-ZOOM: a plain click on +/− still emits the existing single preset step
+ * ({@link ZoomIn} / {@link ZoomOut}); holding the button down (pointerdown held past a
+ * short delay) emits {@link ZoomBy} factors (~3.5%) every 50 ms for smooth continuous
+ * zooming, stopping on pointerup / pointerleave / pointercancel / destroy — the timers
+ * never leak. The board clamps to its usual 25%–200% limits.
+ */
+export class RealtimeWhiteboardZoomComponent {
+    constructor() {
+        /** Current zoom as a percentage (e.g. 90). */
+        this.ZoomPercent = 100;
+        /** Whether the minimap is currently shown (highlights the map button). */
+        this.MinimapOpen = false;
+        /** Single preset step out (a plain click on −). */
+        this.ZoomOut = new EventEmitter();
+        /** Single preset step in (a plain click on +). */
+        this.ZoomIn = new EventEmitter();
+        /**
+         * Continuous (held-button) zoom tick: a multiplicative factor (>1 zooms in, <1 zooms
+         * out) emitted every 50 ms while + or − is held. Wire to the board's `ZoomByFactor`.
+         */
+        this.ZoomBy = new EventEmitter();
+        this.Fit = new EventEmitter();
+        this.ToggleMinimap = new EventEmitter();
+        this.holdDelayTimer = null;
+        this.holdIntervalTimer = null;
+        /** Set once continuous ticks started, so the trailing click doesn't ALSO step. */
+        this.suppressNextClick = false;
+    }
+    /** How long a press must be held before continuous zooming kicks in. */
+    static { this.HoldDelayMs = 350; }
+    /** Continuous-zoom tick cadence while held. */
+    static { this.HoldIntervalMs = 50; }
+    /** Multiplicative zoom factor per held tick (~3.5%). */
+    static { this.HoldFactor = 1.035; }
+    ngOnDestroy() {
+        this.stopHold();
+    }
+    /** Pointer down on +/−: arm the hold — after the delay, tick {@link ZoomBy} repeatedly. */
+    OnZoomPressStart(event, direction) {
+        if (event.button !== 0) {
+            return;
+        }
+        this.stopHold();
+        this.suppressNextClick = false;
+        this.holdDelayTimer = setTimeout(() => {
+            this.holdDelayTimer = null;
+            this.suppressNextClick = true;
+            const factor = direction === 1
+                ? RealtimeWhiteboardZoomComponent.HoldFactor
+                : 1 / RealtimeWhiteboardZoomComponent.HoldFactor;
+            this.ZoomBy.emit(factor); // first tick fires immediately when the hold engages
+            this.holdIntervalTimer = setInterval(() => this.ZoomBy.emit(factor), RealtimeWhiteboardZoomComponent.HoldIntervalMs);
+        }, RealtimeWhiteboardZoomComponent.HoldDelayMs);
+    }
+    /** Pointer up / leave / cancel: stop any pending or running continuous zoom. */
+    OnZoomPressEnd() {
+        this.stopHold();
+    }
+    /** The click that follows the press: a single preset step unless a hold already zoomed. */
+    OnZoomClick(direction) {
+        if (this.suppressNextClick) {
+            this.suppressNextClick = false;
+            return;
+        }
+        if (direction === 1) {
+            this.ZoomIn.emit();
+        }
+        else {
+            this.ZoomOut.emit();
+        }
+    }
+    /** Clear both hold timers (idempotent — safe from any stop path). */
+    stopHold() {
+        if (this.holdDelayTimer !== null) {
+            clearTimeout(this.holdDelayTimer);
+            this.holdDelayTimer = null;
+        }
+        if (this.holdIntervalTimer !== null) {
+            clearInterval(this.holdIntervalTimer);
+            this.holdIntervalTimer = null;
+        }
+    }
+    static { this.ɵfac = function RealtimeWhiteboardZoomComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || RealtimeWhiteboardZoomComponent)(); }; }
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: RealtimeWhiteboardZoomComponent, selectors: [["mj-realtime-whiteboard-zoom"]], inputs: { ZoomPercent: "ZoomPercent", MinimapOpen: "MinimapOpen" }, outputs: { ZoomOut: "ZoomOut", ZoomIn: "ZoomIn", ZoomBy: "ZoomBy", Fit: "Fit", ToggleMinimap: "ToggleMinimap" }, decls: 12, vars: 3, consts: [[1, "zoom-cluster"], ["type", "button", "title", "Zoom out (hold for continuous)", 3, "pointerdown", "pointerup", "pointerleave", "pointercancel", "click"], [1, "fa-solid", "fa-minus"], [1, "zoom-pct"], ["type", "button", "title", "Zoom in (hold for continuous)", 3, "pointerdown", "pointerup", "pointerleave", "pointercancel", "click"], [1, "fa-solid", "fa-plus"], [1, "zoom-sep"], ["type", "button", "title", "Fit to content", 3, "click"], [1, "fa-solid", "fa-compress"], ["type", "button", "title", "Mini-map", 3, "click"], [1, "fa-regular", "fa-map"]], template: function RealtimeWhiteboardZoomComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵdomElementStart(0, "div", 0)(1, "button", 1);
+            i0.ɵɵdomListener("pointerdown", function RealtimeWhiteboardZoomComponent_Template_button_pointerdown_1_listener($event) { return ctx.OnZoomPressStart($event, -1); })("pointerup", function RealtimeWhiteboardZoomComponent_Template_button_pointerup_1_listener() { return ctx.OnZoomPressEnd(); })("pointerleave", function RealtimeWhiteboardZoomComponent_Template_button_pointerleave_1_listener() { return ctx.OnZoomPressEnd(); })("pointercancel", function RealtimeWhiteboardZoomComponent_Template_button_pointercancel_1_listener() { return ctx.OnZoomPressEnd(); })("click", function RealtimeWhiteboardZoomComponent_Template_button_click_1_listener() { return ctx.OnZoomClick(-1); });
+            i0.ɵɵdomElement(2, "i", 2);
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(3, "span", 3);
+            i0.ɵɵtext(4);
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(5, "button", 4);
+            i0.ɵɵdomListener("pointerdown", function RealtimeWhiteboardZoomComponent_Template_button_pointerdown_5_listener($event) { return ctx.OnZoomPressStart($event, 1); })("pointerup", function RealtimeWhiteboardZoomComponent_Template_button_pointerup_5_listener() { return ctx.OnZoomPressEnd(); })("pointerleave", function RealtimeWhiteboardZoomComponent_Template_button_pointerleave_5_listener() { return ctx.OnZoomPressEnd(); })("pointercancel", function RealtimeWhiteboardZoomComponent_Template_button_pointercancel_5_listener() { return ctx.OnZoomPressEnd(); })("click", function RealtimeWhiteboardZoomComponent_Template_button_click_5_listener() { return ctx.OnZoomClick(1); });
+            i0.ɵɵdomElement(6, "i", 5);
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElement(7, "span", 6);
+            i0.ɵɵdomElementStart(8, "button", 7);
+            i0.ɵɵdomListener("click", function RealtimeWhiteboardZoomComponent_Template_button_click_8_listener() { return ctx.Fit.emit(); });
+            i0.ɵɵdomElement(9, "i", 8);
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(10, "button", 9);
+            i0.ɵɵdomListener("click", function RealtimeWhiteboardZoomComponent_Template_button_click_10_listener() { return ctx.ToggleMinimap.emit(); });
+            i0.ɵɵdomElement(11, "i", 10);
+            i0.ɵɵdomElementEnd()();
+        } if (rf & 2) {
+            i0.ɵɵadvance(4);
+            i0.ɵɵtextInterpolate1("", ctx.ZoomPercent, "%");
+            i0.ɵɵadvance(6);
+            i0.ɵɵclassProp("on", ctx.MinimapOpen);
+        } }, dependencies: [CommonModule], styles: ["\n\n\n\n[_nghost-%COMP%] {\n  display: block;\n  position: absolute;\n  right: 14px;\n  bottom: 14px;\n  z-index: 10;\n}\n\n.zoom-cluster[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 2px;\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-full, 9999px);\n  box-shadow: var(--mj-shadow-xl, 0 20px 25px -5px rgba(0, 0, 0, 0.3));\n  padding: 4px;\n}\n\n.zoom-cluster[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n  width: 30px;\n  height: 30px;\n  border-radius: 50%;\n  border: 0;\n  background: transparent;\n  color: var(--mj-text-secondary);\n  cursor: pointer;\n  font-size: 12px;\n  display: grid;\n  place-items: center;\n  font-family: inherit;\n}\n.zoom-cluster[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-hover);\n  color: var(--mj-text-primary);\n}\n.zoom-cluster[_ngcontent-%COMP%]   button.on[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 14%, transparent);\n  color: var(--mj-brand-accent, var(--mj-brand-primary));\n}\n\n.zoom-pct[_ngcontent-%COMP%] {\n  font-size: 11.5px;\n  font-weight: 700;\n  color: var(--mj-text-secondary);\n  padding: 0 7px;\n  font-family: var(--mj-font-mono, ui-monospace, monospace);\n}\n\n.zoom-sep[_ngcontent-%COMP%] {\n  width: 1px;\n  height: 18px;\n  background: var(--mj-border-default);\n  margin: 0 3px;\n}"] }); }
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(RealtimeWhiteboardZoomComponent, [{
+        type: Component,
+        args: [{ standalone: true, selector: 'mj-realtime-whiteboard-zoom', imports: [CommonModule], template: "<div class=\"zoom-cluster\">\n  <button type=\"button\" title=\"Zoom out (hold for continuous)\"\n          (pointerdown)=\"OnZoomPressStart($event, -1)\"\n          (pointerup)=\"OnZoomPressEnd()\"\n          (pointerleave)=\"OnZoomPressEnd()\"\n          (pointercancel)=\"OnZoomPressEnd()\"\n          (click)=\"OnZoomClick(-1)\"><i class=\"fa-solid fa-minus\"></i></button>\n  <span class=\"zoom-pct\">{{ ZoomPercent }}%</span>\n  <button type=\"button\" title=\"Zoom in (hold for continuous)\"\n          (pointerdown)=\"OnZoomPressStart($event, 1)\"\n          (pointerup)=\"OnZoomPressEnd()\"\n          (pointerleave)=\"OnZoomPressEnd()\"\n          (pointercancel)=\"OnZoomPressEnd()\"\n          (click)=\"OnZoomClick(1)\"><i class=\"fa-solid fa-plus\"></i></button>\n  <span class=\"zoom-sep\"></span>\n  <button type=\"button\" title=\"Fit to content\" (click)=\"Fit.emit()\"><i class=\"fa-solid fa-compress\"></i></button>\n  <button type=\"button\" title=\"Mini-map\" [class.on]=\"MinimapOpen\" (click)=\"ToggleMinimap.emit()\"><i class=\"fa-regular fa-map\"></i></button>\n</div>\n", styles: ["/* Bottom-right zoom cluster \u2014 ported pixel-faithfully from\n   plans/realtime/mockups/whiteboard.html (.zoom-cluster). */\n\n:host {\n  display: block;\n  position: absolute;\n  right: 14px;\n  bottom: 14px;\n  z-index: 10;\n}\n\n.zoom-cluster {\n  display: flex;\n  align-items: center;\n  gap: 2px;\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-full, 9999px);\n  box-shadow: var(--mj-shadow-xl, 0 20px 25px -5px rgba(0, 0, 0, 0.3));\n  padding: 4px;\n}\n\n.zoom-cluster button {\n  width: 30px;\n  height: 30px;\n  border-radius: 50%;\n  border: 0;\n  background: transparent;\n  color: var(--mj-text-secondary);\n  cursor: pointer;\n  font-size: 12px;\n  display: grid;\n  place-items: center;\n  font-family: inherit;\n}\n.zoom-cluster button:hover {\n  background: var(--mj-bg-surface-hover);\n  color: var(--mj-text-primary);\n}\n.zoom-cluster button.on {\n  background: color-mix(in srgb, var(--mj-brand-primary) 14%, transparent);\n  color: var(--mj-brand-accent, var(--mj-brand-primary));\n}\n\n.zoom-pct {\n  font-size: 11.5px;\n  font-weight: 700;\n  color: var(--mj-text-secondary);\n  padding: 0 7px;\n  font-family: var(--mj-font-mono, ui-monospace, monospace);\n}\n\n.zoom-sep {\n  width: 1px;\n  height: 18px;\n  background: var(--mj-border-default);\n  margin: 0 3px;\n}\n"] }]
+    }], null, { ZoomPercent: [{
+            type: Input
+        }], MinimapOpen: [{
+            type: Input
+        }], ZoomOut: [{
+            type: Output
+        }], ZoomIn: [{
+            type: Output
+        }], ZoomBy: [{
+            type: Output
+        }], Fit: [{
+            type: Output
+        }], ToggleMinimap: [{
+            type: Output
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(RealtimeWhiteboardZoomComponent, { className: "RealtimeWhiteboardZoomComponent", filePath: "src/lib/whiteboard-zoom.component.ts", lineNumber: 25 }); })();
+//# sourceMappingURL=whiteboard-zoom.component.js.map

package/dist/lib/whiteboard-zoom.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"whiteboard-zoom.component.js","sourceRoot":"","sources":["../../src/lib/whiteboard-zoom.component.ts","../../src/lib/whiteboard-zoom.component.html"],"names":[],"mappings":"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","sourcesContent":["import { Component, EventEmitter, Input, OnDestroy, Output } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\n/** Which way a zoom button points. */\ntype ZoomDirection = 1 | -1;\n\n/**\n * The bottom-right zoom cluster of the live whiteboard: zoom out / percentage / zoom in,\n * fit-to-content, and the minimap toggle. Pure presentational; the board owns the\n * viewport math and the minimap rendering.\n *\n * HOLD-TO-ZOOM: a plain click on +/− still emits the existing single preset step\n * ({@link ZoomIn} / {@link ZoomOut}); holding the button down (pointerdown held past a\n * short delay) emits {@link ZoomBy} factors (~3.5%) every 50 ms for smooth continuous\n * zooming, stopping on pointerup / pointerleave / pointercancel / destroy — the timers\n * never leak. The board clamps to its usual 25%–200% limits.\n */\n@Component({\n  standalone: true,\n  selector: 'mj-realtime-whiteboard-zoom',\n  imports: [CommonModule],\n  templateUrl: './whiteboard-zoom.component.html',\n  styleUrl: './whiteboard-zoom.component.css'\n})\nexport class RealtimeWhiteboardZoomComponent implements OnDestroy {\n  /** How long a press must be held before continuous zooming kicks in. */\n  private static readonly HoldDelayMs = 350;\n  /** Continuous-zoom tick cadence while held. */\n  private static readonly HoldIntervalMs = 50;\n  /** Multiplicative zoom factor per held tick (~3.5%). */\n  private static readonly HoldFactor = 1.035;\n\n  /** Current zoom as a percentage (e.g. 90). */\n  @Input() ZoomPercent = 100;\n  /** Whether the minimap is currently shown (highlights the map button). */\n  @Input() MinimapOpen = false;\n\n  /** Single preset step out (a plain click on −). */\n  @Output() ZoomOut = new EventEmitter<void>();\n  /** Single preset step in (a plain click on +). */\n  @Output() ZoomIn = new EventEmitter<void>();\n  /**\n   * Continuous (held-button) zoom tick: a multiplicative factor (>1 zooms in, <1 zooms\n   * out) emitted every 50 ms while + or − is held. Wire to the board's `ZoomByFactor`.\n   */\n  @Output() ZoomBy = new EventEmitter<number>();\n  @Output() Fit = new EventEmitter<void>();\n  @Output() ToggleMinimap = new EventEmitter<void>();\n\n  private holdDelayTimer: ReturnType<typeof setTimeout> | null = null;\n  private holdIntervalTimer: ReturnType<typeof setInterval> | null = null;\n  /** Set once continuous ticks started, so the trailing click doesn't ALSO step. */\n  private suppressNextClick = false;\n\n  ngOnDestroy(): void {\n    this.stopHold();\n  }\n\n  /** Pointer down on +/−: arm the hold — after the delay, tick {@link ZoomBy} repeatedly. */\n  public OnZoomPressStart(event: PointerEvent, direction: ZoomDirection): void {\n    if (event.button !== 0) {\n      return;\n    }\n    this.stopHold();\n    this.suppressNextClick = false;\n    this.holdDelayTimer = setTimeout(() => {\n      this.holdDelayTimer = null;\n      this.suppressNextClick = true;\n      const factor = direction === 1\n        ? RealtimeWhiteboardZoomComponent.HoldFactor\n        : 1 / RealtimeWhiteboardZoomComponent.HoldFactor;\n      this.ZoomBy.emit(factor); // first tick fires immediately when the hold engages\n      this.holdIntervalTimer = setInterval(() => this.ZoomBy.emit(factor), RealtimeWhiteboardZoomComponent.HoldIntervalMs);\n    }, RealtimeWhiteboardZoomComponent.HoldDelayMs);\n  }\n\n  /** Pointer up / leave / cancel: stop any pending or running continuous zoom. */\n  public OnZoomPressEnd(): void {\n    this.stopHold();\n  }\n\n  /** The click that follows the press: a single preset step unless a hold already zoomed. */\n  public OnZoomClick(direction: ZoomDirection): void {\n    if (this.suppressNextClick) {\n      this.suppressNextClick = false;\n      return;\n    }\n    if (direction === 1) {\n      this.ZoomIn.emit();\n    }\n    else {\n      this.ZoomOut.emit();\n    }\n  }\n\n  /** Clear both hold timers (idempotent — safe from any stop path). */\n  private stopHold(): void {\n    if (this.holdDelayTimer !== null) {\n      clearTimeout(this.holdDelayTimer);\n      this.holdDelayTimer = null;\n    }\n    if (this.holdIntervalTimer !== null) {\n      clearInterval(this.holdIntervalTimer);\n      this.holdIntervalTimer = null;\n    }\n  }\n}\n","<div class=\"zoom-cluster\">\n  <button type=\"button\" title=\"Zoom out (hold for continuous)\"\n          (pointerdown)=\"OnZoomPressStart($event, -1)\"\n          (pointerup)=\"OnZoomPressEnd()\"\n          (pointerleave)=\"OnZoomPressEnd()\"\n          (pointercancel)=\"OnZoomPressEnd()\"\n          (click)=\"OnZoomClick(-1)\"><i class=\"fa-solid fa-minus\"></i></button>\n  <span class=\"zoom-pct\">{{ ZoomPercent }}%</span>\n  <button type=\"button\" title=\"Zoom in (hold for continuous)\"\n          (pointerdown)=\"OnZoomPressStart($event, 1)\"\n          (pointerup)=\"OnZoomPressEnd()\"\n          (pointerleave)=\"OnZoomPressEnd()\"\n          (pointercancel)=\"OnZoomPressEnd()\"\n          (click)=\"OnZoomClick(1)\"><i class=\"fa-solid fa-plus\"></i></button>\n  <span class=\"zoom-sep\"></span>\n  <button type=\"button\" title=\"Fit to content\" (click)=\"Fit.emit()\"><i class=\"fa-solid fa-compress\"></i></button>\n  <button type=\"button\" title=\"Mini-map\" [class.on]=\"MinimapOpen\" (click)=\"ToggleMinimap.emit()\"><i class=\"fa-regular fa-map\"></i></button>\n</div>\n"]}

package/dist/lib/whiteboard.module.d.ts

@@ -0,0 +1,29 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./whiteboard-board.component";
+import * as i2 from "./whiteboard-toolbar.component";
+import * as i3 from "./whiteboard-zoom.component";
+import * as i4 from "./whiteboard-pages.component";
+import * as i5 from "./whiteboard-agent-sees-popover.component";
+import * as i6 from "./whiteboard-host.component";
+import * as i7 from "./whiteboard-snapshot.component";
+import * as i8 from "./whiteboard-srcdoc.pipe";
+/**
+ * Convenience NgModule that re-exports every standalone whiteboard component (and the
+ * `wbWidgetSrcdoc` pipe), for consumers organized around NgModules. All components in
+ * this package are STANDALONE — apps using standalone bootstrapping can import the
+ * component classes directly and skip this module entirely.
+ */
+export declare class WhiteboardModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<WhiteboardModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<WhiteboardModule, never, [typeof i1.RealtimeWhiteboardBoardComponent, typeof i2.RealtimeWhiteboardToolbarComponent, typeof i3.RealtimeWhiteboardZoomComponent, typeof i4.RealtimeWhiteboardPagesComponent, typeof i5.RealtimeWhiteboardAgentSeesPopoverComponent, typeof i6.RealtimeWhiteboardHostComponent, typeof i7.WhiteboardSnapshotComponent, typeof i8.WhiteboardWidgetSrcdocPipe], [typeof i1.RealtimeWhiteboardBoardComponent, typeof i2.RealtimeWhiteboardToolbarComponent, typeof i3.RealtimeWhiteboardZoomComponent, typeof i4.RealtimeWhiteboardPagesComponent, typeof i5.RealtimeWhiteboardAgentSeesPopoverComponent, typeof i6.RealtimeWhiteboardHostComponent, typeof i7.WhiteboardSnapshotComponent, typeof i8.WhiteboardWidgetSrcdocPipe]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<WhiteboardModule>;
+}
+/**
+ * Tree-shaking prevention hook. The whiteboard components are usually referenced
+ * statically (standalone `imports` arrays), which is enough to retain them — call this
+ * from your bootstrap path only when every usage in your app is resolved DYNAMICALLY
+ * (e.g. a plugin returns a component type through the MJ ClassFactory) and the bundler
+ * would otherwise see no static reference to this package.
+ */
+export declare function LoadWhiteboardComponents(): void;
+//# sourceMappingURL=whiteboard.module.d.ts.map

package/dist/lib/whiteboard.module.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"whiteboard.module.d.ts","sourceRoot":"","sources":["../../src/lib/whiteboard.module.ts"],"names":[],"mappings":";;;;;;;;;AAUA;;;;;GAKG;AACH,qBAsBa,gBAAgB;yCAAhB,gBAAgB;0CAAhB,gBAAgB;0CAAhB,gBAAgB;CAAG;AAEhC;;;;;;GAMG;AACH,wBAAgB,wBAAwB,IAAI,IAAI,CAE/C"}