@matterfact/embed 0.12.0 → 0.15.0

package/dist/react.cjs

@@ -480,7 +480,7 @@ function mfTools(win) {
   if (typeof document2 === "function") {
     out.push({
       name: "mf.resolveDocument",
-      description: 'Resolve a matterfact document (dossier, report, briefing) that is NOT on the current page to a concrete id. Call it with the document type and a key (e.g. a ticker) when the site map shows the document lives on another route. Returns {id, label, href}. Cite the result inline as <MFRef kind="document" id="<id>" label="<label>" /> \u2014 it renders as a chip that opens the document in the side panel; href is its "open on page" deeplink.',
+      description: `Resolve a matterfact document (dossier, report, briefing) that is NOT on the current page to a concrete id. Call it with the document type and the subject's key, when the site map shows the document lives on another route. For the key, use the current route parameter VERBATIM when the page context states one (e.g. ticker = BP~+LN+Equity \u2192 key "BP~+LN+Equity"): it is the host's own identifier and often differs from the ticker or name a person would write. Do not normalise, decode or re-spell it, and do not substitute what the user typed. Returns {id, label, href}. Cite the result inline as <MFRef kind="document" id="<id>" label="<label>" /> \u2014 it renders as a chip that opens the document in the side panel; href is its "open on page" deeplink.`,
       inputSchema: {
         type: "object",
         properties: {
@@ -1193,6 +1193,7 @@ async function resolveDeclaredContext() {
 async function publishContext() {
   if (!pageContextOn()) return;
   const declared = await resolveDeclaredContext();
+  if (!pageContextOn()) return;
   send?.({ type: "host.context", context: buildPageContext(declared) });
 }
 function provideContext() {
@@ -1270,6 +1271,7 @@ function navigateHost(href) {
   location.assign(target.href);
 }
 function pushActivity(e) {
+  if (!allowsAuto(effectivePageContextMode())) return;
   activity.push({ ...e, seq: ++activitySeq, ts: Date.now() });
   if (activity.length > MAX_ACTIVITY) activity.shift();
   send?.({ type: "host.activity", events: [activity[activity.length - 1]] });
@@ -1334,6 +1336,7 @@ function watchNavigation() {
     publishSitemap();
     publishTools();
   };
+  if (navFire) return;
   navFire = fire;
   for (const name of ["pushState", "replaceState"]) {
     const orig = history[name];
@@ -1404,6 +1407,7 @@ async function sendSnapshot(emit) {
     return;
   }
   const { snapshot: snapshot2 } = await loadSnapshotModule();
+  if (!allowsAuto(effectivePageContextMode())) return;
   const { yaml, truncated, visibleRefs } = snapshot2();
   emit({
     type: "host.snapshot",
@@ -1415,6 +1419,7 @@ async function sendSnapshot(emit) {
 async function sendRegion(ref, emit) {
   if (!allowsAuto(effectivePageContextMode())) return;
   const { snapshotRegion: snapshotRegion2, resolveRef: resolveRef2 } = await loadSnapshotModule();
+  if (!allowsAuto(effectivePageContextMode())) return;
   const el = resolveRef2(ref);
   if (!el) {
     emit({
@@ -1454,13 +1459,39 @@ async function callTool(call, emit) {
     error: r.error
   });
 }
-function stop() {
+function installAutoObservers() {
+  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
+  });
+}
+function removeAutoObservers() {
   document.removeEventListener("click", onClick, { capture: true });
   document.removeEventListener("submit", onSubmit, { capture: true });
   document.removeEventListener("change", onChange, { capture: true });
   document.removeEventListener("selectionchange", scheduleFocus);
   document.removeEventListener("focusin", scheduleFocus, { capture: true });
   window.removeEventListener("scroll", scheduleFocus, { capture: true });
+  if (focusTimer) {
+    clearTimeout(focusTimer);
+    focusTimer = null;
+  }
+}
+function unwatchNavigation() {
   if (navFire) {
     window.removeEventListener("popstate", navFire);
     navFire = null;
@@ -1473,10 +1504,10 @@ function stop() {
     history.replaceState = origReplaceState;
     origReplaceState = null;
   }
-  if (focusTimer) {
-    clearTimeout(focusTimer);
-    focusTimer = null;
-  }
+}
+function stop() {
+  removeAutoObservers();
+  unwatchNavigation();
   send = null;
   contextProvider = void 0;
   activity.length = 0;
@@ -1486,6 +1517,22 @@ function stop() {
 }
 function setPageContextMax(max) {
   adminPageContextMax = parsePageContextMode(max);
+  applyObservation();
+}
+function applyObservation() {
+  const mode = effectivePageContextMode();
+  if (allowsAuto(mode)) {
+    installAutoObservers();
+  } else {
+    removeAutoObservers();
+    activity.length = 0;
+    lastFocus = {};
+  }
+  if (allowsDeclared(mode)) {
+    watchNavigation();
+  } else {
+    unwatchNavigation();
+  }
 }
 function start(emit, origin, pageContext = true, provider) {
   stop();
@@ -1498,33 +1545,8 @@ function start(emit, origin, pageContext = true, provider) {
     void publishContext();
     publishArtifactGrants();
     publishSitemap();
-    watchNavigation();
-    if (allowsAuto(effectivePageContextMode())) {
-      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
-      });
-    }
   }
+  applyObservation();
   const theme = matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
   emit({ type: "host.theme", mode: theme });
   {
@@ -1588,10 +1610,12 @@ var init_context = __esm({
 var react_exports = {};
 __export(react_exports, {
   MatterfactAgent: () => MatterfactAgent,
-  MatterfactArtifact: () => MatterfactArtifact
+  MatterfactArtifact: () => MatterfactArtifact,
+  MatterfactAuthProvider: () => MatterfactAuthProvider,
+  MatterfactDoc: () => MatterfactDoc
 });
 module.exports = __toCommonJS(react_exports);
-var import_react = require("react");
+var import_react2 = require("react");
 
 // src/protocol.ts
 var PROTOCOL_VERSION = 3;
@@ -2202,6 +2226,13 @@ var EmbedHost = class {
       case "widget.chat":
         this.emit({ type: "chat", phase: msg.phase, chatId: msg.chatId });
         break;
+      case "widget.artifactParams":
+        this.emit({
+          type: "artifactParams",
+          params: msg.params,
+          source: msg.source
+        });
+        break;
     }
   }
   /**
@@ -2347,6 +2378,23 @@ var EmbedHost = class {
     this.queue = [];
     for (const m of pending) this.send(m);
   }
+  /**
+   * Push artifact param values into the widget — a PARTIAL patch; only the named
+   * params change. Buffered like every other host→widget message until the widget
+   * says it's listening.
+   *
+   * Explicit and deliberate, so it applies even to a param whose page-context binding
+   * the viewer has overridden (spec §7.3).
+   */
+  setArtifactParams(params) {
+    if (params == null || typeof params !== "object" || Array.isArray(params)) {
+      console.error(
+        "[matterfact] setArtifactParams expects an object of param values"
+      );
+      return;
+    }
+    this.send({ type: "host.artifactParams", params });
+  }
   /** 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. */
@@ -2364,12 +2412,70 @@ var EmbedHost = class {
 function mount(config) {
   const host = new EmbedHost(config);
   host.mount();
+  window.matterfact = {
+    ...window.matterfact ?? {},
+    setArtifactParams: (params) => host.setArtifactParams(params)
+  };
   return host;
 }
 
-// src/react.tsx
+// src/react-context.tsx
+var import_react = require("react");
 var import_jsx_runtime = require("react/jsx-runtime");
 var DEFAULT_ORIGIN = "https://app.matterfact.com";
+var MatterfactAuthContext = (0, import_react.createContext)(null);
+function useMatterfactConfig() {
+  return (0, import_react.useContext)(MatterfactAuthContext);
+}
+function MatterfactAuthProvider({
+  publishableKey,
+  widgetOrigin: widgetOrigin2,
+  getAuthToken,
+  theme,
+  onEvent,
+  children
+}) {
+  const resolvedWidgetOrigin = widgetOrigin2 || DEFAULT_ORIGIN;
+  const value = (0, import_react.useMemo)(
+    () => ({
+      publishableKey,
+      widgetOrigin: resolvedWidgetOrigin,
+      getAuthToken,
+      theme: theme || "auto",
+      onEvent
+    }),
+    [publishableKey, resolvedWidgetOrigin, getAuthToken, theme, onEvent]
+  );
+  (0, import_react.useEffect)(() => {
+    if (typeof window === "undefined" || !getAuthToken) return;
+    let inflight = null;
+    const onMessage = (e) => {
+      if (e.origin !== resolvedWidgetOrigin) return;
+      if (!e.data || e.data.type !== "mf.hostAuth.request") return;
+      const source = e.source;
+      if (!source) return;
+      try {
+        inflight = inflight ?? Promise.resolve(getAuthToken()).catch(() => null);
+      } catch {
+        return;
+      }
+      const p = inflight;
+      void p.then((token) => {
+        if (p === inflight) inflight = null;
+        if (typeof token === "string" && token) {
+          source.postMessage({ type: "mf.hostAuth.grant", token }, resolvedWidgetOrigin);
+        }
+      });
+    };
+    window.addEventListener("message", onMessage);
+    return () => window.removeEventListener("message", onMessage);
+  }, [getAuthToken, resolvedWidgetOrigin]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MatterfactAuthContext.Provider, { value, children });
+}
+
+// src/react.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var DEFAULT_ORIGIN2 = "https://app.matterfact.com";
 function writeActionsGlobal(actions) {
   if (typeof window === "undefined") return;
   const w = window;
@@ -2413,11 +2519,11 @@ function toolDescriptorKey(artifacts, resolve, tools) {
   });
 }
 function MatterfactAgent({
-  publishableKey,
-  widgetOrigin: widgetOrigin2,
+  publishableKey: publishableKeyProp,
+  widgetOrigin: widgetOriginProp,
   surface = "",
-  theme = "auto",
-  getAuthToken,
+  theme: themeProp,
+  getAuthToken: getAuthTokenProp,
   getPageContext,
   inline = false,
   className: className2,
@@ -2432,30 +2538,41 @@ function MatterfactAgent({
   onToolEvent,
   onEvent
 }) {
-  const authRef = (0, import_react.useRef)(getAuthToken);
+  const ctx = useMatterfactConfig();
+  const publishableKey = publishableKeyProp ?? ctx?.publishableKey;
+  if (!publishableKey) {
+    throw new Error(
+      "MatterfactAgent requires publishableKey (as a prop or via MatterfactAuthProvider)"
+    );
+  }
+  const widgetOrigin2 = widgetOriginProp ?? ctx?.widgetOrigin ?? DEFAULT_ORIGIN2;
+  const getAuthToken = getAuthTokenProp ?? ctx?.getAuthToken;
+  const theme = themeProp ?? ctx?.theme ?? "auto";
+  const authRef = (0, import_react2.useRef)(getAuthToken);
   authRef.current = getAuthToken;
-  const pageContextRef = (0, import_react.useRef)(getPageContext);
+  const pageContextRef = (0, import_react2.useRef)(getPageContext);
   pageContextRef.current = getPageContext;
-  const actionsRef = (0, import_react.useRef)(actions);
+  const actionsRef = (0, import_react2.useRef)(actions);
   actionsRef.current = actions;
   const actionsKey = JSON.stringify(actions ?? null);
-  const slot = (0, import_react.useRef)(null);
+  const slot = (0, import_react2.useRef)(null);
   const sitemapKey = JSON.stringify(sitemap ?? null);
-  (0, import_react.useEffect)(() => {
+  (0, import_react2.useEffect)(() => {
     writeSitemapGlobal(sitemap);
   }, [sitemapKey]);
-  (0, import_react.useEffect)(() => {
+  (0, import_react2.useEffect)(() => {
     writeToolGlobals(artifacts, resolve, tools, onToolEvent, onEvent);
   });
   const toolsKey = toolDescriptorKey(artifacts, resolve, tools);
-  (0, import_react.useEffect)(() => {
+  (0, import_react2.useEffect)(() => {
     if (typeof window === "undefined") return;
     if (inline && !slot.current) return;
     writeActionsGlobal(actionsRef.current);
     writeToolGlobals(artifacts, resolve, tools, onToolEvent, onEvent);
     const config = {
       publishableKey,
-      origin: widgetOrigin2 || DEFAULT_ORIGIN,
+      // Already fully resolved above (prop ?? context ?? DEFAULT_ORIGIN).
+      origin: widgetOrigin2,
       theme,
       surface,
       // Always present; a null return (no getAuthToken supplied) makes the core fall
@@ -2497,7 +2614,7 @@ function MatterfactAgent({
     // eslint-disable-next-line react-hooks/exhaustive-deps
   ]);
   if (!inline) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
     "div",
     {
       ref: slot,
@@ -2508,30 +2625,139 @@ function MatterfactAgent({
 }
 var DEFAULT_ARTIFACT_ORIGIN = "https://app.matterfact.com";
 function MatterfactArtifact({
+  name: nameProp,
   slug,
   owner,
   token,
-  widgetOrigin: widgetOrigin2,
-  theme = "auto",
+  widgetOrigin: widgetOriginProp,
+  theme: themeProp,
   className: className2,
   style
 }) {
-  const origin = widgetOrigin2 || DEFAULT_ARTIFACT_ORIGIN;
-  const src = `${origin}/embed/artifacts/${encodeURIComponent(slug)}?owner=${encodeURIComponent(owner)}&t=${encodeURIComponent(token)}&theme=${theme}`;
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  const ctx = useMatterfactConfig();
+  const artifactName = nameProp ?? slug;
+  if (!artifactName) {
+    throw new Error(
+      "MatterfactArtifact requires name (or its deprecated alias, slug)"
+    );
+  }
+  const origin = widgetOriginProp ?? ctx?.widgetOrigin ?? DEFAULT_ARTIFACT_ORIGIN;
+  const theme = themeProp ?? ctx?.theme ?? "auto";
+  let src;
+  if (token) {
+    src = `${origin}/embed/artifacts/${encodeURIComponent(artifactName)}?owner=${encodeURIComponent(owner)}&t=${encodeURIComponent(token)}&theme=${theme}`;
+  } else if (ctx) {
+    const hostOrigin = typeof window === "undefined" ? "" : window.location.origin;
+    src = `${origin}/embed/artifacts/${encodeURIComponent(artifactName)}?owner=${encodeURIComponent(owner)}&k=${encodeURIComponent(ctx.publishableKey)}&o=${encodeURIComponent(hostOrigin)}&theme=${theme}`;
+  } else {
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+      "div",
+      {
+        className: className2,
+        style: {
+          width: "100%",
+          height: 600,
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          textAlign: "center",
+          ...style
+        },
+        children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { children: "This embedded artifact link is incomplete." })
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
     "iframe",
     {
       src,
-      title: `matterfact artifact ${slug}`,
+      title: `matterfact artifact ${artifactName}`,
       className: className2,
       style: { width: "100%", height: 600, border: 0, ...style },
       sandbox: "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-downloads"
     }
   );
 }
+var DEFAULT_DOC_ORIGIN = "https://app.matterfact.com";
+function diffDocParams(params, sent) {
+  const changed = {};
+  for (const [key, value] of Object.entries(params)) {
+    if (value === void 0) continue;
+    const snapshot2 = JSON.stringify(value);
+    if (sent.get(key) === snapshot2) continue;
+    changed[key] = value;
+    sent.set(key, snapshot2);
+  }
+  return changed;
+}
+function MatterfactDoc({
+  docKey,
+  ticker = "",
+  version = "latest",
+  theme: themeProp,
+  params,
+  className: className2,
+  style
+}) {
+  const ctx = useMatterfactConfig();
+  const iframeRef = (0, import_react2.useRef)(null);
+  const sentParamsRef = (0, import_react2.useRef)(/* @__PURE__ */ new Map());
+  const origin = ctx?.widgetOrigin ?? DEFAULT_DOC_ORIGIN;
+  const paramsKey = JSON.stringify(params ?? null);
+  const pushParams = (force) => {
+    if (!params) return;
+    const win = iframeRef.current?.contentWindow;
+    if (!win) return;
+    if (force) sentParamsRef.current.clear();
+    const changed = diffDocParams(params, sentParamsRef.current);
+    if (Object.keys(changed).length === 0) return;
+    win.postMessage({ type: "host.docParams", params: changed }, origin);
+  };
+  (0, import_react2.useEffect)(() => {
+    pushParams(false);
+  }, [paramsKey]);
+  if (!docKey) {
+    throw new Error("MatterfactDoc requires docKey");
+  }
+  if (!ctx || !ctx.publishableKey) {
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+      "div",
+      {
+        className: className2,
+        style: {
+          width: "100%",
+          height: 600,
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          textAlign: "center",
+          ...style
+        },
+        children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { children: "This embedded document link is incomplete." })
+      }
+    );
+  }
+  const theme = themeProp ?? ctx.theme ?? "auto";
+  const hostOrigin = typeof window === "undefined" ? "" : window.location.origin;
+  const src = `${origin}/embed/document?k=${encodeURIComponent(ctx.publishableKey)}&o=${encodeURIComponent(hostOrigin)}&key=${encodeURIComponent(docKey)}&ticker=${encodeURIComponent(ticker)}&version=${encodeURIComponent(version)}&theme=${theme}`;
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    "iframe",
+    {
+      ref: iframeRef,
+      src,
+      title: `matterfact document ${docKey}`,
+      className: className2,
+      style: { width: "100%", height: 600, border: 0, ...style },
+      sandbox: "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-downloads",
+      onLoad: () => pushParams(true)
+    }
+  );
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   MatterfactAgent,
-  MatterfactArtifact
+  MatterfactArtifact,
+  MatterfactAuthProvider,
+  MatterfactDoc
 });
 //# sourceMappingURL=react.cjs.map