@matterfact/embed 0.2.0

package/dist/react.cjs

@@ -0,0 +1,1157 @@
+"use client";
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __esm = (fn, res) => function __init() {
+  return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/dom/a11y.ts
+function createStyleCache() {
+  const cache = /* @__PURE__ */ new WeakMap();
+  return ((el, pseudo) => {
+    if (pseudo) return window.getComputedStyle(el, pseudo);
+    let style = cache.get(el);
+    if (!style) {
+      style = window.getComputedStyle(el);
+      cache.set(el, style);
+    }
+    return style;
+  });
+}
+function hasLayout() {
+  return document.documentElement.getClientRects().length > 0;
+}
+function isVisible(el, style, layout) {
+  const display = style.display;
+  if (display === "none") return false;
+  const visibility = style.visibility;
+  if (visibility === "hidden" || visibility === "collapse") return false;
+  if (Number(style.opacity) === 0) return false;
+  if (layout && display !== "contents") {
+    const box = el.getBoundingClientRect();
+    if (box.width <= 0 || box.height <= 0) return false;
+    if (el.getClientRects().length === 0) return false;
+    if (box.right < -2e3 || box.bottom < -2e3) return false;
+  }
+  return true;
+}
+function receivesPointerEvents(style) {
+  return style.pointerEvents !== "none";
+}
+function isEditable(el) {
+  const v = el.getAttribute("contenteditable");
+  return v !== null && v !== "false";
+}
+function isInteractive(el, role, style, parentStyle) {
+  const tag = el.tagName;
+  if (tag === "A" && el.hasAttribute("href")) return true;
+  if (INTERACTIVE_TAGS.has(tag)) return true;
+  if (role !== null && INTERACTIVE_ROLES.has(role)) return true;
+  const tabindex = el.getAttribute("tabindex");
+  if (tabindex !== null && Number(tabindex) >= 0) return true;
+  if (isEditable(el)) return true;
+  if (style.cursor === "pointer" && parentStyle?.cursor !== "pointer")
+    return true;
+  return false;
+}
+function isOpaque(el) {
+  return OPAQUE_TAGS.has(el.tagName) || isEditable(el);
+}
+function isFilled(el, role) {
+  const tag = el.tagName;
+  if (tag === "INPUT" || tag === "TEXTAREA") {
+    if (!VALUE_ROLES.has(role)) return false;
+    return (el.value ?? "").length > 0;
+  }
+  if (isEditable(el)) return (el.textContent ?? "").trim().length > 0;
+  return false;
+}
+function ariaFlag(el, attr) {
+  const v = el.getAttribute(attr);
+  if (v === "true") return "true";
+  if (v === "mixed") return "mixed";
+  return null;
+}
+function states(el, role) {
+  const out = [];
+  const tag = el.tagName;
+  if (tag === "INPUT" && (role === "checkbox" || role === "radio")) {
+    if (el.checked) out.push("[checked]");
+  } else {
+    const checked = ariaFlag(el, "aria-checked");
+    if (checked === "mixed") out.push("[checked=mixed]");
+    else if (checked === "true") out.push("[checked]");
+  }
+  if ((0, import_dom_accessibility_api.isDisabled)(el)) out.push("[disabled]");
+  const expanded = el.getAttribute("aria-expanded");
+  if (expanded === "true" || expanded === "false") {
+    if (expanded === "true") out.push("[expanded]");
+  } else if (tag === "SUMMARY") {
+    const details = el.parentElement;
+    if (details?.tagName === "DETAILS" && details.open) {
+      out.push("[expanded]");
+    }
+  }
+  if (role === "heading") {
+    const aria = el.getAttribute("aria-level");
+    const level = aria ? Number(aria) : Number(tag[1]);
+    if (Number.isFinite(level) && level > 0) out.push(`[level=${level}]`);
+  }
+  const pressed = ariaFlag(el, "aria-pressed");
+  if (pressed === "mixed") out.push("[pressed=mixed]");
+  else if (pressed === "true") out.push("[pressed]");
+  if (el.getAttribute("aria-selected") === "true") out.push("[selected]");
+  if (isFilled(el, role)) out.push("[filled]");
+  return out.join(" ");
+}
+function roleOf(el) {
+  if (isEditable(el)) return "textbox";
+  return (0, import_dom_accessibility_api.getRole)(el);
+}
+function nameIsUntrusted(el) {
+  const labelledby = el.getAttribute("aria-labelledby");
+  if (labelledby) {
+    for (const id of labelledby.split(/\s+/)) {
+      if (!id) continue;
+      const ref = el.ownerDocument.getElementById(id);
+      if (!ref) continue;
+      if (ref.matches(UNTRUSTED_CONTENT) || ref.querySelector(UNTRUSTED_CONTENT)) {
+        return true;
+      }
+    }
+    return false;
+  }
+  if (el.hasAttribute("aria-label")) return false;
+  return el.querySelector(UNTRUSTED_CONTENT) !== null;
+}
+function nameOf(el, styleOf) {
+  const name = (0, import_dom_accessibility_api.computeAccessibleName)(el, {
+    getComputedStyle: styleOf,
+    // jsdom logs a console error if you claim pseudo-element support it doesn't have.
+    computedStyleSupportsPseudoElements: false
+  });
+  if (!name) return "";
+  if (nameIsUntrusted(el)) {
+    return el.getAttribute("aria-label") || "";
+  }
+  return name;
+}
+var import_dom_accessibility_api, INTERACTIVE_ROLES, INTERACTIVE_TAGS, NAME_FROM_CONTENT, VALUE_ROLES, OPAQUE_TAGS, UNTRUSTED_CONTENT;
+var init_a11y = __esm({
+  "src/dom/a11y.ts"() {
+    "use strict";
+    import_dom_accessibility_api = require("dom-accessibility-api");
+    INTERACTIVE_ROLES = /* @__PURE__ */ new Set([
+      "button",
+      "checkbox",
+      "combobox",
+      "link",
+      "listbox",
+      "menuitem",
+      "menuitemcheckbox",
+      "menuitemradio",
+      "option",
+      "radio",
+      "searchbox",
+      "slider",
+      "spinbutton",
+      "switch",
+      "tab",
+      "textbox",
+      "treeitem"
+    ]);
+    INTERACTIVE_TAGS = /* @__PURE__ */ new Set([
+      "BUTTON",
+      "INPUT",
+      "SELECT",
+      "TEXTAREA",
+      "SUMMARY"
+    ]);
+    NAME_FROM_CONTENT = /* @__PURE__ */ new Set([
+      "button",
+      "cell",
+      "checkbox",
+      "columnheader",
+      "gridcell",
+      "heading",
+      "link",
+      "menuitem",
+      "menuitemcheckbox",
+      "menuitemradio",
+      "option",
+      "radio",
+      "row",
+      "rowheader",
+      "switch",
+      "tab",
+      "tooltip",
+      "treeitem"
+    ]);
+    VALUE_ROLES = /* @__PURE__ */ new Set(["textbox", "searchbox", "spinbutton"]);
+    OPAQUE_TAGS = /* @__PURE__ */ new Set(["INPUT", "TEXTAREA"]);
+    UNTRUSTED_CONTENT = 'input,textarea,select,[contenteditable=""],[contenteditable="true"],[aria-valuetext],[data-mf-private]';
+  }
+});
+
+// src/dom/refs.ts
+function beginSnapshot() {
+  generation++;
+  registry.clear();
+}
+function refFor(el, role, name) {
+  const key = `${role} ${name}`;
+  let entry = entries.get(el);
+  if (!entry || entry.key !== key) {
+    entry = { id: `e${++counter}`, key, gen: generation };
+    entries.set(el, entry);
+  } else {
+    entry.gen = generation;
+  }
+  registry.set(entry.id, el);
+  return entry.id;
+}
+function resolveRef(ref) {
+  const el = registry.get(ref);
+  if (!el) return null;
+  if (!el.isConnected) {
+    registry.delete(ref);
+    return null;
+  }
+  const entry = entries.get(el);
+  if (!entry || entry.id !== ref || entry.gen !== generation) return null;
+  return el;
+}
+var counter, generation, entries, registry;
+var init_refs = __esm({
+  "src/dom/refs.ts"() {
+    "use strict";
+    counter = 0;
+    generation = 0;
+    entries = /* @__PURE__ */ new WeakMap();
+    registry = /* @__PURE__ */ new Map();
+  }
+});
+
+// src/dom/snapshot.ts
+var snapshot_exports = {};
+__export(snapshot_exports, {
+  resolveRef: () => resolveRef,
+  snapshot: () => snapshot,
+  snapshotRegion: () => snapshotRegion
+});
+function withinBudget(w) {
+  if (w.nodes >= MAX_NODES || w.lines >= MAX_LINES) {
+    w.truncated = true;
+    return false;
+  }
+  return true;
+}
+function isOurs(el) {
+  return el.id === "matterfact-embed" || el.hasAttribute("data-mf-embed");
+}
+function isHidden(el, style, layout) {
+  if (el.getAttribute("aria-hidden") === "true") return true;
+  if (el.hasAttribute("hidden") || el.hasAttribute("inert")) return true;
+  return !isVisible(el, style, layout);
+}
+function childrenOf(el) {
+  if (el.shadowRoot) return el.shadowRoot.childNodes;
+  if (el.tagName === "SLOT") {
+    const assigned = el.assignedNodes({ flatten: true });
+    if (assigned.length) return assigned;
+  }
+  return el.childNodes;
+}
+function visitChildren(el, parent, style, w) {
+  const children = childrenOf(el);
+  for (let i = 0; i < children.length; i++) {
+    const child = children[i];
+    if (child) visitNode(child, parent, style, w);
+  }
+}
+function visitText(node, parent, w) {
+  const text = (node.nodeValue ?? "").replace(/\s+/g, " ").trim();
+  if (!text) return;
+  if (NAME_FROM_CONTENT.has(parent.role)) return;
+  if (!withinBudget(w)) return;
+  w.lines++;
+  parent.children.push(text);
+}
+function optionNode(opt) {
+  const disabled = opt.matches(":disabled") || (0, import_dom_accessibility_api2.isDisabled)(opt);
+  return {
+    role: "option",
+    name: (opt.label || opt.textContent || "").trim(),
+    props: (disabled ? " [disabled]" : "") + (opt.selected ? " [selected]" : ""),
+    children: []
+  };
+}
+function emitSelectOptions(select, parent, w) {
+  const options = select.options;
+  const shown = Math.min(options.length, MAX_OPTIONS);
+  for (let i = 0; i < shown; i++) {
+    if (!withinBudget(w)) return;
+    const opt = options[i];
+    if (!opt || isPrivate(opt)) continue;
+    w.lines++;
+    parent.children.push(optionNode(opt));
+  }
+  let extraSelected = 0;
+  const selected = select.selectedOptions;
+  for (let i = 0; i < selected.length; i++) {
+    const opt = selected[i];
+    if (opt && opt.index >= shown && !isPrivate(opt)) {
+      if (!withinBudget(w)) return;
+      w.lines++;
+      parent.children.push(optionNode(opt));
+      extraSelected++;
+    }
+  }
+  const remaining = options.length - shown - extraSelected;
+  if (remaining > 0 && withinBudget(w)) {
+    w.lines++;
+    parent.children.push(`\u2026 (+${remaining} more options)`);
+  }
+}
+function emitDatalistOptions(input, parent, w) {
+  const list = input.list;
+  if (!list) return;
+  const options = list.options;
+  const shown = Math.min(options.length, MAX_OPTIONS);
+  for (let i = 0; i < shown; i++) {
+    if (!withinBudget(w)) return;
+    const opt = options[i];
+    if (!opt || isPrivate(opt)) continue;
+    w.lines++;
+    parent.children.push(optionNode(opt));
+  }
+  const remaining = options.length - shown;
+  if (remaining > 0 && withinBudget(w)) {
+    w.lines++;
+    parent.children.push(`\u2026 (+${remaining} more options)`);
+  }
+}
+function visitElement(el, parent, parentStyle, w) {
+  if (!withinBudget(w)) return;
+  if (SKIP_TAGS.has(el.tagName) || isOurs(el)) return;
+  if (isPrivate(el)) return;
+  w.nodes++;
+  const style = w.styleOf(el);
+  if (isHidden(el, style, w.layout)) return;
+  const role = roleOf(el);
+  const transparent = role === null || TRANSPARENT.has(role);
+  const interactive = isInteractive(el, role, style, parentStyle);
+  if (transparent && !interactive) {
+    visitChildren(el, parent, style, w);
+    return;
+  }
+  const emittedRole = role === null || TRANSPARENT.has(role) ? "generic" : role;
+  const name = nameOf(el, w.styleOf);
+  let ref = "";
+  if (interactive && receivesPointerEvents(style)) {
+    const r = refFor(el, emittedRole, name);
+    ref = ` [ref=${r}]`;
+    w.onRef?.(r, el);
+  }
+  const state = states(el, emittedRole);
+  const node = {
+    role: emittedRole,
+    name,
+    props: (state ? ` ${state}` : "") + ref,
+    children: []
+  };
+  w.lines++;
+  parent.children.push(node);
+  if (el.tagName === "SELECT") {
+    emitSelectOptions(el, node, w);
+    return;
+  }
+  if (el.tagName === "INPUT" && el.list) {
+    emitDatalistOptions(el, node, w);
+  }
+  if (isOpaque(el)) return;
+  visitChildren(el, node, style, w);
+}
+function visitNode(node, parent, parentStyle, w) {
+  if (node.nodeType === 3) {
+    visitText(node, parent, w);
+  } else if (node.nodeType === 1) {
+    visitElement(node, parent, parentStyle, w);
+  }
+}
+function sanitize(text, max) {
+  const collapsed = text.replace(/\s+/g, " ").trim();
+  const clean = redact(collapsed);
+  return clean.length > max ? `${clean.slice(0, max - 1)}\u2026` : clean;
+}
+function quote(text) {
+  return `"${text.replace(/\\/g, "\\\\").replace(/"/g, '\\"')}"`;
+}
+function render(children, depth, out) {
+  const pad = "  ".repeat(depth);
+  for (const child of children) {
+    if (typeof child === "string") {
+      out.push(`${pad}- text: ${quote(sanitize(child, MAX_TEXT))}`);
+      continue;
+    }
+    const name = child.name ? ` ${quote(sanitize(child.name, MAX_NAME))}` : "";
+    const head = `${pad}- ${child.role}${name}${child.props}`;
+    if (child.children.length) {
+      out.push(`${head}:`);
+      render(child.children, depth + 1, out);
+    } else {
+      out.push(head);
+    }
+  }
+}
+function walk(root, onRef) {
+  const styleOf = createStyleCache();
+  const w = {
+    styleOf,
+    layout: hasLayout(),
+    nodes: 0,
+    lines: 0,
+    truncated: false,
+    onRef
+  };
+  if ((0, import_dom_accessibility_api2.isInaccessible)(root, { getComputedStyle: styleOf })) {
+    return { yaml: "", truncated: false };
+  }
+  const tree = { role: "", name: "", props: "", children: [] };
+  visitChildren(root, tree, styleOf(root), w);
+  const lines = [];
+  render(tree.children, 0, lines);
+  if (w.truncated && lines.length) {
+    lines[lines.length - 1] = '- text: "\u2026 (snapshot truncated \u2014 more of the page is below)"';
+  }
+  return { yaml: lines.join("\n"), truncated: w.truncated };
+}
+function snapshot() {
+  const root = document.body;
+  if (!root) return { yaml: "", truncated: false, visibleRefs: [] };
+  beginSnapshot();
+  const visibleRefs = [];
+  const vh = window.innerHeight || 0;
+  const vw = window.innerWidth || 0;
+  const result = walk(root, (ref, el) => {
+    const r = el.getBoundingClientRect();
+    if (r.bottom > 0 && r.top < vh && r.right > 0 && r.left < vw) {
+      visibleRefs.push(ref);
+    }
+  });
+  return { ...result, visibleRefs };
+}
+function snapshotRegion(root) {
+  if (!root.isConnected) return { yaml: "", truncated: false };
+  return walk(root);
+}
+var import_dom_accessibility_api2, MAX_NODES, MAX_LINES, MAX_NAME, MAX_TEXT, MAX_OPTIONS, TRANSPARENT, SKIP_TAGS;
+var init_snapshot = __esm({
+  "src/dom/snapshot.ts"() {
+    "use strict";
+    import_dom_accessibility_api2 = require("dom-accessibility-api");
+    init_context();
+    init_a11y();
+    init_refs();
+    init_refs();
+    MAX_NODES = 4e3;
+    MAX_LINES = 800;
+    MAX_NAME = 120;
+    MAX_TEXT = 120;
+    MAX_OPTIONS = 25;
+    TRANSPARENT = /* @__PURE__ */ new Set(["generic", "presentation", "none"]);
+    SKIP_TAGS = /* @__PURE__ */ new Set([
+      "SCRIPT",
+      "STYLE",
+      "NOSCRIPT",
+      "TEMPLATE",
+      "SVG",
+      "HEAD",
+      "LINK",
+      "META",
+      "BASE"
+    ]);
+  }
+});
+
+// src/context.ts
+var context_exports = {};
+__export(context_exports, {
+  beginAuth: () => beginAuth,
+  callTool: () => callTool,
+  isPrivate: () => isPrivate,
+  readPageContext: () => readPageContext,
+  redact: () => redact,
+  sendRegion: () => sendRegion,
+  sendSnapshot: () => sendSnapshot,
+  start: () => start
+});
+function redact(text) {
+  let out = text;
+  for (const re of PII) out = out.replace(re, "[redacted]");
+  return out;
+}
+function isPrivate(el) {
+  if (el.closest("[data-mf-private]")) return true;
+  const tag = el.tagName;
+  if (tag === "INPUT") {
+    const t = el.type;
+    if (t === "password" || t === "hidden") return true;
+  }
+  return false;
+}
+function embeddedMatterfactEntities() {
+  if (!widgetOrigin) return [];
+  const out = [];
+  for (const frame of Array.from(document.querySelectorAll("iframe"))) {
+    let u;
+    try {
+      u = new URL(frame.getAttribute("src") || "", location.href);
+    } catch {
+      continue;
+    }
+    if (u.origin !== widgetOrigin) continue;
+    const m = u.pathname.match(/^\/artifacts\/(.+?)\/?$/);
+    if (!m) continue;
+    const id = decodeURIComponent(m[1]);
+    if (!id || out.some((e) => e.id === id)) continue;
+    out.push({
+      kind: "artifact",
+      id,
+      label: redact(frame.getAttribute("title") || "") || id
+    });
+  }
+  return out;
+}
+function opaqueFrameCount() {
+  return Array.from(document.querySelectorAll("iframe")).filter((f) => {
+    try {
+      const u = new URL(f.getAttribute("src") || "", location.href);
+      return u.origin !== location.origin && u.origin !== widgetOrigin;
+    } catch {
+      return false;
+    }
+  }).length;
+}
+function readPageContext() {
+  const declared = window.matterfact?.context ?? {};
+  const found = embeddedMatterfactEntities();
+  const opaque = opaqueFrameCount();
+  return {
+    // Path only. A query string is where session ids, tokens and email addresses
+    // live; it is not ours to take.
+    url: location.origin + location.pathname,
+    path: location.pathname,
+    title: redact(document.title),
+    locale: document.documentElement.lang || void 0,
+    ...declared,
+    // After the spread: what we FOUND is additive to what the host DECLARED, never a
+    // replacement. A host that declares its own entities still gets the artifacts we
+    // spotted, and vice versa.
+    entities: [...declared.entities ?? [], ...found],
+    data: {
+      ...declared.data ?? {},
+      ...opaque ? { opaque_frames: opaque } : {}
+    }
+  };
+}
+function publishContext() {
+  send?.({ type: "host.context", context: readPageContext() });
+}
+function pushActivity(e) {
+  activity.push({ ...e, seq: ++activitySeq, ts: Date.now() });
+  if (activity.length > MAX_ACTIVITY) activity.shift();
+  send?.({ type: "host.activity", events: [activity[activity.length - 1]] });
+}
+function controlLabel(el) {
+  const aria = el.getAttribute("aria-label");
+  if (aria) return aria;
+  const id = el.id;
+  if (id) {
+    const forLabel = document.querySelector(`label[for="${CSS.escape(id)}"]`);
+    const t = forLabel?.textContent?.trim();
+    if (t) return t;
+  }
+  const wrapping = el.closest("label")?.textContent?.trim();
+  if (wrapping) return wrapping;
+  const placeholder = el.getAttribute("placeholder");
+  if (placeholder) return placeholder;
+  return "";
+}
+function describe(el) {
+  const role = el.getAttribute("role") || el.tagName.toLowerCase();
+  const label = el.getAttribute("aria-label") || (FORM_CONTROLS.has(el.tagName) ? controlLabel(el) : el.innerText?.trim().slice(0, 60)) || el.getAttribute("title") || "";
+  return label ? `${role} "${redact(label)}"` : role;
+}
+function onClick(ev) {
+  const target = ev.target;
+  if (!target || !(target instanceof Element)) return;
+  const label = target.closest("label");
+  const labelled = label ? label.getAttribute("for") && document.getElementById(label.getAttribute("for")) || label.querySelector("input,select,textarea") : null;
+  const actionable = labelled ?? target.closest(ACTIONABLE);
+  if (!actionable || isPrivate(actionable)) return;
+  pushActivity({ type: "click", summary: `clicked ${describe(actionable)}` });
+}
+function onSubmit(ev) {
+  const el = ev.target;
+  if (!el || isPrivate(el)) return;
+  pushActivity({ type: "submit", summary: `submitted ${describe(el)}` });
+}
+function onChange(ev) {
+  const el = ev.target;
+  if (!el || !(el instanceof Element) || isPrivate(el)) return;
+  const tag = el.tagName;
+  const type = el.type;
+  if (tag === "INPUT" && (type === "password" || type === "hidden")) return;
+  let summary = `changed ${describe(el)}`;
+  if (tag === "SELECT") {
+    const opt = el.selectedOptions[0]?.text;
+    if (opt) summary = `${describe(el)} \u2192 "${redact(opt)}"`;
+  } else if (type === "checkbox" || type === "radio") {
+    summary = `${el.checked ? "checked" : "unchecked"} ${describe(el)}`;
+  }
+  pushActivity({ type: "input", summary });
+}
+function watchNavigation() {
+  const fire = () => {
+    const url = location.pathname;
+    if (url === lastUrl) return;
+    lastUrl = url;
+    pushActivity({ type: "nav", summary: `navigated to ${url}` });
+    publishContext();
+  };
+  for (const name of ["pushState", "replaceState"]) {
+    const orig = history[name];
+    history[name] = function(...args) {
+      const r = orig.apply(this, args);
+      fire();
+      return r;
+    };
+  }
+  window.addEventListener("popstate", fire);
+}
+async function readFocus() {
+  const focus = {};
+  const sel = window.getSelection?.();
+  if (sel && !sel.isCollapsed) {
+    const anchor = sel.anchorNode?.parentElement ?? null;
+    if (!anchor || !anchor.closest("[data-mf-private]")) {
+      const text = sel.toString().trim().slice(0, 500);
+      if (text) focus.selection = redact(text);
+    }
+  }
+  const active = document.activeElement;
+  if (active && active !== document.body && !isPrivate(active) && !active.closest("[data-mf-private]")) {
+    const { snapshot: snapshot2 } = await Promise.resolve().then(() => (init_snapshot(), snapshot_exports));
+    void snapshot2;
+    focus.focused = {
+      label: redact(describeControl(active)),
+      role: active.getAttribute("role") || active.tagName.toLowerCase()
+    };
+  }
+  const doc = document.documentElement;
+  const scrollable = doc.scrollHeight - doc.clientHeight;
+  focus.scroll = scrollable > 0 ? Math.round(doc.scrollTop / scrollable * 100) / 100 : 0;
+  return focus;
+}
+function describeControl(el) {
+  return describe(el);
+}
+function scheduleFocus() {
+  if (focusTimer) return;
+  focusTimer = setTimeout(async () => {
+    focusTimer = null;
+    lastFocus = await readFocus();
+    send?.({ type: "host.focus", focus: lastFocus });
+  }, 250);
+}
+async function sendSnapshot(emit) {
+  const { snapshot: snapshot2 } = await Promise.resolve().then(() => (init_snapshot(), snapshot_exports));
+  const { yaml, truncated, visibleRefs } = snapshot2();
+  emit({
+    type: "host.snapshot",
+    snapshot: { yaml: redact(yaml), seq: ++snapshotSeq, truncated }
+  });
+  lastFocus = { ...lastFocus, visibleRefs };
+  emit({ type: "host.focus", focus: lastFocus });
+}
+async function sendRegion(ref, emit) {
+  const { snapshotRegion: snapshotRegion2, resolveRef: resolveRef2 } = await Promise.resolve().then(() => (init_snapshot(), snapshot_exports));
+  const el = resolveRef2(ref);
+  if (!el) {
+    emit({
+      type: "host.region",
+      ref,
+      yaml: "(this element is no longer on the page)"
+    });
+    return;
+  }
+  const { yaml } = snapshotRegion2(el);
+  emit({ type: "host.region", ref, yaml: redact(yaml) });
+}
+async function callTool(call, emit) {
+  emit({
+    type: "host.toolResult",
+    callId: call.callId,
+    ok: false,
+    error: "Host tools are read-only in this version; no action was taken."
+  });
+}
+function beginAuth(config, emit) {
+  const w = window.open(
+    `${config.origin}/embed/authorize?k=${encodeURIComponent(
+      config.publishableKey
+    )}&o=${encodeURIComponent(location.origin)}`,
+    "mf_auth",
+    "width=460,height=640"
+  );
+  if (!w) return;
+  const onMsg = (event) => {
+    if (event.origin !== config.origin) return;
+    const d = event.data;
+    if (d?.type !== "mf:embed:auth") return;
+    window.removeEventListener("message", onMsg);
+    emit({ type: "host.auth", token: d.token, expiresAt: d.expiresAt });
+  };
+  window.addEventListener("message", onMsg);
+}
+function start(emit, origin) {
+  send = emit;
+  widgetOrigin = origin || "";
+  lastUrl = location.pathname;
+  publishContext();
+  watchNavigation();
+  document.addEventListener("click", onClick, { capture: true, passive: true });
+  document.addEventListener("submit", onSubmit, {
+    capture: true,
+    passive: true
+  });
+  document.addEventListener("change", onChange, {
+    capture: true,
+    passive: true
+  });
+  document.addEventListener("selectionchange", scheduleFocus, {
+    passive: true
+  });
+  document.addEventListener("focusin", scheduleFocus, {
+    capture: true,
+    passive: true
+  });
+  window.addEventListener("scroll", scheduleFocus, {
+    capture: true,
+    passive: true
+  });
+  const theme = matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+  emit({ type: "host.theme", mode: theme });
+}
+var widgetOrigin, MAX_ACTIVITY, send, activitySeq, activity, lastUrl, PII, FORM_CONTROLS, ACTIONABLE, lastFocus, focusTimer, snapshotSeq;
+var init_context = __esm({
+  "src/context.ts"() {
+    "use strict";
+    widgetOrigin = "";
+    MAX_ACTIVITY = 40;
+    send = null;
+    activitySeq = 0;
+    activity = [];
+    lastUrl = "";
+    PII = [
+      /\b[\w.+-]+@[\w-]+\.[\w.]{2,}\b/g,
+      // email
+      /\b(?:\d[ -]?){13,19}\b/g,
+      // card-ish
+      /\b\d{3}[- ]?\d{2}[- ]?\d{4}\b/g,
+      // ssn — dashed, spaced, OR bare 9 digits
+      /\b\d{9,}\b/g,
+      // long bare digit runs: account / MRN / routing numbers
+      /(?:\+?\d{1,2}[\s.-]?)?\(?\d{3}\)?[\s.-]\d{3}[\s.-]\d{4}\b/g,
+      // us phone
+      /\b(?:sk|pk|rk|ak)_(?:live|test)_[A-Za-z0-9]{8,}\b/g,
+      // stripe-style api keys
+      /\beyJ[\w-]+\.[\w-]+\.[\w-]+\b/g
+      // jwt
+    ];
+    FORM_CONTROLS = /* @__PURE__ */ new Set(["INPUT", "SELECT", "TEXTAREA"]);
+    ACTIONABLE = 'a[href],button,input,select,textarea,summary,[role="button"],[role="link"],[role="menuitem"],[role="tab"],[role="option"],[role="checkbox"],[role="switch"],[role="radio"],[onclick],[tabindex]';
+    lastFocus = {};
+    focusTimer = null;
+    snapshotSeq = 0;
+  }
+});
+
+// src/react.tsx
+var react_exports = {};
+__export(react_exports, {
+  MatterfactAgent: () => MatterfactAgent
+});
+module.exports = __toCommonJS(react_exports);
+var import_react = require("react");
+
+// src/protocol.ts
+var PROTOCOL_VERSION = 1;
+var CHANNEL = "mf-embed";
+function envelope(payload, id) {
+  return {
+    channel: CHANNEL,
+    protocol: PROTOCOL_VERSION,
+    ...id ? { id } : {},
+    payload
+  };
+}
+function isEnvelope(data) {
+  return typeof data === "object" && data !== null && data.channel === CHANNEL;
+}
+
+// src/loader.ts
+function devRequested() {
+  try {
+    return new URLSearchParams(location.search).get("mfdev") === "1";
+  } catch {
+    return false;
+  }
+}
+var POS_KEY = "mf.embed.pos";
+var EmbedHost = class {
+  constructor(config) {
+    this.config = config;
+    this.iframe = null;
+    this.shadow = null;
+    /** Buffered until the widget says it's listening — postMessage before load is dropped silently. */
+    this.queue = [];
+    this.ready = false;
+    this.open = false;
+    this.expanded = false;
+    /** Null until the user drags; then it pins the corner offset and survives reloads. */
+    this.pos = null;
+    /** Where the launcher sat when the current drag began; deltas are applied to this. */
+    this.dragBase = null;
+    /** Loaded on first open. Holds everything that touches the customer's DOM. */
+    this.context = null;
+    /** The host element; kept so `destroy()` can remove it (React lifecycle). */
+    this.hostEl = null;
+    /**
+     * Every message is checked twice, on every single message — not once at setup.
+     *
+     * `channel` is a namespace, not a boundary. The origin and source checks are the
+     * boundary: any frame on the page can postMessage us, and a page with an ad iframe
+     * on it has plenty of frames.
+     */
+    this.onMessage = (event) => {
+      if (event.origin !== this.config.origin) return;
+      if (event.source !== this.iframe?.contentWindow) return;
+      if (!isEnvelope(event.data)) return;
+      const msg = event.data.payload;
+      switch (msg.type) {
+        case "widget.ready":
+          this.ready = true;
+          this.send({
+            type: "host.ready",
+            protocol: PROTOCOL_VERSION,
+            origin: location.origin
+          });
+          this.flush();
+          if (this.inline) void this.loadContext();
+          break;
+        case "widget.setOpen":
+          if (this.inline) break;
+          this.open = msg.open;
+          this.iframe?.setAttribute("data-open", String(msg.open));
+          if (!msg.open) {
+            this.expanded = false;
+            this.iframe?.setAttribute("data-expanded", "false");
+          }
+          if (msg.open) void this.loadContext();
+          break;
+        case "widget.setExpanded":
+          if (this.inline) break;
+          this.expanded = msg.expanded;
+          this.iframe?.setAttribute("data-expanded", String(msg.expanded));
+          if (this.iframe) this.iframe.style.height = "";
+          break;
+        case "widget.resize":
+          if (this.inline) break;
+          if (this.iframe && this.open && !this.expanded) {
+            this.iframe.style.height = `${Math.min(msg.height, window.innerHeight - 40)}px`;
+          }
+          break;
+        case "widget.requestSnapshot":
+          void this.loadContext().then((m) => m.sendSnapshot(this.send));
+          break;
+        case "widget.readRegion":
+          void this.loadContext().then((m) => m.sendRegion(msg.ref, this.send));
+          break;
+        case "widget.callTool":
+          void this.loadContext().then((m) => m.callTool(msg.call, this.send));
+          break;
+        // Everything below is LAUNCHER chrome: there is no launcher inline (the widget
+        // doesn't draw one), and moving or hiding the host's own panel from inside it
+        // would be us redecorating their app. An older cached loader could still be told
+        // any of these by a newer widget, so they're guarded rather than assumed absent.
+        case "widget.dragStart":
+          if (this.inline) break;
+          this.dragBase = this.cornerOffset();
+          break;
+        case "widget.dragMove":
+          if (this.inline) break;
+          this.dragTo(msg.dx, msg.dy);
+          break;
+        case "widget.dragEnd":
+          if (this.inline) break;
+          this.dragBase = null;
+          this.writePos(this.pos);
+          break;
+        case "widget.setMenu":
+          if (this.inline) break;
+          if (this.iframe && !this.open) {
+            this.iframe.style.height = msg.open ? `${64 + msg.height}px` : "";
+          }
+          break;
+        case "widget.resetPos":
+          if (this.inline) break;
+          this.resetPos();
+          break;
+        case "widget.hide":
+          if (this.inline) break;
+          if (this.hostEl) this.hostEl.style.display = "none";
+          break;
+        case "widget.needsAuth":
+          void this.provideAuth();
+          break;
+      }
+    };
+    this.send = (msg) => {
+      if (!this.ready) {
+        this.queue.push(msg);
+        return;
+      }
+      this.iframe?.contentWindow?.postMessage(envelope(msg), this.config.origin);
+    };
+    this.inline = !!config.container;
+  }
+  mount() {
+    const host = document.createElement("div");
+    this.hostEl = host;
+    host.id = "matterfact-embed";
+    if (this.inline) {
+      host.style.cssText = [
+        "all: initial",
+        "position: relative",
+        "display: block",
+        "width: 100%",
+        "height: 100%",
+        "contain: layout style"
+      ].join(";");
+      this.config.container.appendChild(host);
+    } else {
+      this.pos = this.readPos();
+      host.style.cssText = [
+        "all: initial",
+        "position: fixed",
+        `right: ${this.pos ? this.pos.right : 20}px`,
+        `bottom: ${this.pos ? this.pos.bottom : 20}px`,
+        // Below the max so a host that genuinely needs to cover us (a modal, a cookie
+        // banner they are legally obliged to show) still can.
+        "z-index: 2147483000",
+        "contain: layout style"
+      ].join(";");
+      document.body.appendChild(host);
+    }
+    this.shadow = host.attachShadow({ mode: "closed" });
+    const style = document.createElement("style");
+    style.textContent = ":host{all:initial}iframe{border:0;display:block;color-scheme:light dark;}" + (this.inline ? "iframe{width:100%;height:100%}" : 'iframe{border-radius:12px;box-shadow:0 8px 40px rgba(0,0,0,.16);width:400px;height:64px;transition:height .18s ease,width .18s ease}iframe[data-open="true"]{width:420px;height:640px}iframe[data-open="true"][data-expanded="true"]{width:min(600px,calc(100vw - 40px));height:calc(100vh - 40px)}');
+    this.shadow.appendChild(style);
+    const iframe = document.createElement("iframe");
+    iframe.title = "matterfact assistant";
+    iframe.setAttribute(
+      "sandbox",
+      "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox"
+    );
+    iframe.setAttribute("allow", "microphone");
+    iframe.src = `${this.config.origin}/embed/chat?k=${encodeURIComponent(
+      this.config.publishableKey
+    )}&o=${encodeURIComponent(location.origin)}` + (this.config.surface ? `&s=${encodeURIComponent(this.config.surface)}` : "") + (devRequested() ? "&dev=1" : "") + (this.inline ? "&inline=1" : "");
+    this.iframe = iframe;
+    this.shadow.appendChild(iframe);
+    window.addEventListener("message", this.onMessage);
+  }
+  /**
+   * Own a drag for its lifetime.
+   *
+   * The widget reports the press and then goes quiet: a cross-origin iframe only gets
+   * pointer events while the pointer is over it, and a drag leaves that box immediately.
+   * So we lay a transparent layer over the whole viewport and track the gesture in the
+   * host document, where it can't be lost. The layer also stops the pointer landing on
+   * the customer's own UI mid-drag (text selection, hover states, stray clicks).
+   *
+   * We are the dumb half on purpose — see `widget.dragMove` in the protocol for why the
+   * widget has to own the gesture. All we do is take a delta and place the element.
+   */
+  cornerOffset() {
+    const rect = this.hostEl.getBoundingClientRect();
+    return {
+      right: window.innerWidth - rect.right,
+      bottom: window.innerHeight - rect.bottom
+    };
+  }
+  dragTo(dx, dy) {
+    if (!this.dragBase || !this.hostEl) return;
+    const rect = this.hostEl.getBoundingClientRect();
+    const maxRight = Math.max(0, window.innerWidth - rect.width);
+    const maxBottom = Math.max(0, window.innerHeight - rect.height);
+    const right = Math.min(Math.max(0, this.dragBase.right - dx), maxRight);
+    const bottom = Math.min(Math.max(0, this.dragBase.bottom - dy), maxBottom);
+    this.pos = { right, bottom };
+    this.hostEl.style.right = `${right}px`;
+    this.hostEl.style.bottom = `${bottom}px`;
+  }
+  /** Reset to the default corner (a menu action — the drag is otherwise sticky). */
+  resetPos() {
+    this.pos = null;
+    this.writePos(null);
+    if (this.hostEl) {
+      this.hostEl.style.right = "20px";
+      this.hostEl.style.bottom = "20px";
+    }
+  }
+  readPos() {
+    try {
+      const raw = localStorage.getItem(POS_KEY);
+      if (!raw) return null;
+      const p = JSON.parse(raw);
+      return typeof p?.right === "number" && typeof p?.bottom === "number" ? { right: p.right, bottom: p.bottom } : null;
+    } catch {
+      return null;
+    }
+  }
+  writePos(pos) {
+    try {
+      if (pos) localStorage.setItem(POS_KEY, JSON.stringify(pos));
+      else localStorage.removeItem(POS_KEY);
+    } catch {
+    }
+  }
+  /**
+   * Answer `widget.needsAuth`. If a trusted first-party host has an auth-token provider,
+   * call it and hand the token straight to the widget via `host.auth` — no popup. The
+   * provider comes from EITHER the programmatic config (the React `<MatterfactAgent
+   * getAuthToken>` prop) OR a global the host page sets for the `<script>` loader:
+   *
+   *   window.matterfact = { getEmbedAuthToken: () => getIdToken(user) };
+   *
+   * Read fresh at call time (not at readConfig), so a global set after the loader booted
+   * — e.g. once the host's auth is ready — is still picked up. Otherwise fall back to the
+   * hosted-login popup. `expiresAt: 0`: the widget doesn't cache it, it exchanges the
+   * token for a rotating embed session anyway.
+   */
+  async provideAuth() {
+    const provider = this.config.authTokenProvider ?? globalThis.matterfact?.getEmbedAuthToken;
+    if (provider) {
+      try {
+        const token = await provider();
+        if (token) {
+          this.send({ type: "host.auth", token, expiresAt: 0 });
+          return;
+        }
+      } catch {
+      }
+    }
+    void this.loadContext().then((m) => m.beginAuth(this.config, this.send));
+  }
+  loadContext() {
+    this.context ?? (this.context = Promise.resolve().then(() => (init_context(), context_exports)).then((m) => {
+      m.start(this.send, this.config.origin);
+      return m;
+    }));
+    return this.context;
+  }
+  flush() {
+    const pending = this.queue;
+    this.queue = [];
+    for (const m of pending) this.send(m);
+  }
+  /** Tear down: stop listening and remove the host element. For the React wrapper's
+   * unmount — the vanilla `<script>` loader lives for the page's lifetime and never
+   * calls this. */
+  destroy() {
+    window.removeEventListener("message", this.onMessage);
+    this.hostEl?.remove();
+    this.hostEl = null;
+    this.iframe = null;
+    this.shadow = null;
+    this.ready = false;
+  }
+};
+function mount(config) {
+  const host = new EmbedHost(config);
+  host.mount();
+  return host;
+}
+
+// src/react.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var DEFAULT_ORIGIN = "https://app.matterfact.com";
+function MatterfactAgent({
+  publishableKey,
+  widgetOrigin: widgetOrigin2,
+  surface = "",
+  theme = "auto",
+  getAuthToken,
+  inline = false,
+  className,
+  style
+}) {
+  const authRef = (0, import_react.useRef)(getAuthToken);
+  authRef.current = getAuthToken;
+  const slot = (0, import_react.useRef)(null);
+  (0, import_react.useEffect)(() => {
+    if (typeof window === "undefined") return;
+    if (inline && !slot.current) return;
+    const config = {
+      publishableKey,
+      origin: widgetOrigin2 || DEFAULT_ORIGIN,
+      theme,
+      surface,
+      // Always present; a null return (no getAuthToken supplied) makes the core fall
+      // back to the popup/inline sign-in, so this is safe either way.
+      authTokenProvider: async () => await authRef.current?.() ?? null,
+      container: inline ? slot.current : null
+    };
+    let host = null;
+    try {
+      host = mount(config);
+    } catch (e) {
+      console.error("[matterfact] failed to mount the embed widget", e);
+    }
+    return () => host?.destroy();
+  }, [publishableKey, widgetOrigin2, surface, theme, inline]);
+  if (!inline) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      ref: slot,
+      className,
+      style: { width: "100%", height: "100%", ...style }
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  MatterfactAgent
+});
+//# sourceMappingURL=react.cjs.map