@backmatter/studio 0.0.1 → 0.0.3

package/dist/chunks/{dashboard-XKKZuJGm.js → dashboard-nvFBzpZv.js}

@@ -3,7 +3,7 @@ var Ze = (e, t, n) => t in e ? Qe(e, t, { enumerable: !0, configurable: !0, writ
 var D = (e, t, n) => Ze(e, typeof t != "symbol" ? t + "" : t, n);
 import { jsxs as R, jsx as o, Fragment as be } from "react/jsx-runtime";
 import { useRef as et, useCallback as tt, useSyncExternalStore as nt, useState as E, useEffect as J, Suspense as we, lazy as rt } from "react";
-import { _ as st, $ as Ce, a0 as it, T as O, a1 as at, p as ot, a2 as lt, a3 as Ie, a4 as qe, a5 as Fe, a6 as ct, a7 as ut, W as ze, a8 as dt, a9 as ae, e as V, b as Be, aa as ft, ab as Me, B as ht, S as se, F as Z, I as ee, a as ye, ac as pt, Z as z, ad as gt, M as ve, ae as te, P as mt, af as xt, ag as yt, o as vt, ah as bt, ai as wt, aj as St, A as kt, G as Et, ak as De, L as Rt, al as _t, am as Ot, an as Tt, N as Pt, R as Lt, O as Ut, Q as Nt, U as jt, V as q, X as At, Y as Ct } from "./WorkspaceRoutes-DgRtdie8.js";
+import { _ as st, $ as Ce, a0 as it, T as O, a1 as at, p as ot, a2 as lt, a3 as Ie, a4 as qe, a5 as Fe, a6 as ct, a7 as ut, W as ze, a8 as dt, a9 as ae, e as V, b as Be, aa as ft, ab as Me, B as ht, S as se, F as Z, I as ee, a as ye, ac as pt, Z as z, ad as gt, M as ve, ae as te, P as mt, af as xt, ag as yt, o as vt, ah as bt, ai as wt, aj as St, A as kt, G as Et, ak as De, L as Rt, al as _t, am as Ot, an as Tt, N as Pt, R as Lt, O as Ut, Q as Nt, U as jt, V as q, X as At, Y as Ct } from "./WorkspaceRoutes-DyRVES9t.js";
 const ne = /* @__PURE__ */ Object.create(null), W = (e) => {
   var t, n;
   return ((t = globalThis.process) == null ? void 0 : t.env) || ((n = globalThis.Deno) == null ? void 0 : n.env.toObject()) || globalThis.__env__ || (e ? ne : globalThis);
@@ -1676,7 +1676,7 @@ function vr({
     /* @__PURE__ */ o(Be, { to: "/", variant: "secondary", children: "Back to the dashboard" })
   ] }) }) });
 }
-const Q = De() ? rt(() => import("./UiKitPage-CgNMOqfE.js").then((e) => ({
+const Q = De() ? rt(() => import("./UiKitPage-CTZtLwJ0.js").then((e) => ({
   default: e.UiKitPage
 }))) : null;
 function br(e) {

package/dist/chunks/{index-CFAIR8GH.js → index-Cr-IOgdC.js}

@@ -1,7 +1,7 @@
 var Rs = Object.defineProperty;
 var Es = (r, e, t) => e in r ? Rs(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t;
 var M = (r, e, t) => Es(r, typeof e != "symbol" ? e + "" : e, t);
-import { ao as Bt, ap as Bs, aq as a0, ar as ct, as as xt, at as ea, au as Gn, av as Is, aw as Ls, ax as Ds, ay as La, az as Ps, aA as Os, aB as Le, aC as qs } from "./WorkspaceRoutes-DgRtdie8.js";
+import { ao as Bt, ap as Bs, aq as a0, ar as ct, as as xt, at as ea, au as Gn, av as Is, aw as Ls, ax as Ds, ay as La, az as Ps, aA as Os, aB as Le, aC as qs } from "./WorkspaceRoutes-DyRVES9t.js";
 function Fs() {
   return {
     enter: {

package/dist/dashboard.js

@@ -1,5 +1,5 @@
-import { A as a, i as s } from "./chunks/dashboard-XKKZuJGm.js";
-import { J as t, K as f } from "./chunks/WorkspaceRoutes-DgRtdie8.js";
+import { A as a, i as s } from "./chunks/dashboard-nvFBzpZv.js";
+import { J as t, K as f } from "./chunks/WorkspaceRoutes-DyRVES9t.js";
 export {
   a as DashboardApp,
   t as configureStudio,

package/dist/index.js

@@ -1,7 +1,7 @@
-import { jsx as n, jsxs as g } from "react/jsx-runtime";
-import { useLayoutEffect as Y, useEffect as p, useRef as J, useState as v, useMemo as Q } from "react";
-import { i as B, h as X, E as Z, C as ee, j as te, k as ne, l as ie, D as M, m as re, n as _, o as G, q as $, r as oe, T as b, a as C, I as se, s as S, t as ae, v as ce, w as le, x as ue, y as de, z as fe, A as me, G as he, H as ge, J as j, K as P, L as pe, M as ve, N as we, R as be, O as ye, Q as xe, U as ke, V as R, W as D, X as Ee, Y as Ce, Z as Se } from "./chunks/WorkspaceRoutes-DgRtdie8.js";
-import { _ as We } from "./chunks/WorkspaceRoutes-DgRtdie8.js";
+import { jsx as n, jsxs as p } from "react/jsx-runtime";
+import { useLayoutEffect as Y, useEffect as g, useRef as J, useState as w, useMemo as Q } from "react";
+import { i as B, h as X, E as Z, C as ee, j as te, k as ne, l as ie, D as M, m as oe, n as _, o as G, q as $, r as re, T as b, a as C, I as se, s as S, t as ae, v as ce, w as le, x as ue, y as de, z as fe, A as me, G as he, H as pe, J as j, K as P, L as ge, M as we, N as ve, R as be, O as ye, Q as xe, U as ke, V as R, W as D, X as Ee, Y as Ce, Z as Se } from "./chunks/WorkspaceRoutes-DyRVES9t.js";
+import { _ as We } from "./chunks/WorkspaceRoutes-DyRVES9t.js";
 import { u as Re, S as ze } from "./chunks/define-studio-BYtYDGLX.js";
 import { d as Je } from "./chunks/define-studio-BYtYDGLX.js";
 const z = {
@@ -15,19 +15,19 @@ function Pe(e) {
 }
 const Ue = [z.accent, z.accentHover, z.focus];
 function Ne() {
-  var t, o;
-  const e = (o = (t = Re().theme) == null ? void 0 : t.accent) == null ? void 0 : o.trim();
+  var t, r;
+  const e = (r = (t = Re().theme) == null ? void 0 : t.accent) == null ? void 0 : r.trim();
   return Y(() => {
     if (!e) return;
-    const a = document.documentElement, s = Ue.map(Pe).filter((r) => !!r);
-    for (const r of s) a.style.setProperty(r, e);
+    const a = document.documentElement, s = Ue.map(Pe).filter((o) => !!o);
+    for (const o of s) a.style.setProperty(o, e);
     return () => {
-      for (const r of s) a.style.removeProperty(r);
+      for (const o of s) a.style.removeProperty(o);
     };
   }, [e]), null;
 }
 function Le({ workspaceId: e }) {
-  return p(() => B(), []), /* @__PURE__ */ n(X, { children: /* @__PURE__ */ n(Z, { children: /* @__PURE__ */ n(ee, { workspaceId: e, startOpen: !0, children: /* @__PURE__ */ g(te, { children: [
+  return g(() => B(), []), /* @__PURE__ */ n(X, { children: /* @__PURE__ */ n(Z, { children: /* @__PURE__ */ n(ee, { workspaceId: e, startOpen: !0, children: /* @__PURE__ */ p(te, { children: [
     /* @__PURE__ */ n(Te, {}),
     /* @__PURE__ */ n(Me, {}),
     /* @__PURE__ */ n(ne, { fill: !0 })
@@ -43,46 +43,46 @@ function k() {
 }
 function Te() {
   const { setFocus: e } = ie();
-  return p(() => {
+  return g(() => {
     const t = k();
-    function o(a) {
+    function r(a) {
       if (!t || a.origin !== t) return;
       const s = a.data;
       if ((s == null ? void 0 : s.type) !== "backmatter:focus") return;
-      const r = s.doc;
-      !(r != null && r.locale) || !r.type || !r.slug || e({
-        docRef: { locale: r.locale, type: r.type, slug: r.slug },
+      const o = s.doc;
+      !(o != null && o.locale) || !o.type || !o.slug || e({
+        docRef: { locale: o.locale, type: o.type, slug: o.slug },
         frontmatter: {},
         body: "",
         selection: null
       });
     }
-    return window.addEventListener("message", o), t && window.parent.postMessage({ type: "backmatter:chat-ready" }, t), () => window.removeEventListener("message", o);
-  }, [e]), p(() => {
+    return window.addEventListener("message", r), t && window.parent.postMessage({ type: "backmatter:chat-ready" }, t), () => window.removeEventListener("message", r);
+  }, [e]), g(() => {
     const t = k();
-    function o(a) {
+    function r(a) {
       const s = a.detail;
       !t || !(s != null && s.docRef) || window.parent.postMessage({ type: "backmatter:doc-changed", doc: s.docRef }, t);
     }
-    return window.addEventListener(M, o), () => window.removeEventListener(M, o);
+    return window.addEventListener(M, r), () => window.removeEventListener(M, r);
   }, []), null;
 }
 function Me() {
-  const { panel: e, dispatch: t } = re(), o = e.mode, a = J(o);
-  return p(() => {
+  const { panel: e, dispatch: t } = oe(), r = e.mode, a = J(r);
+  return g(() => {
     const s = k();
     if (!s || window.parent === window) return;
-    const r = _(a.current);
-    a.current = o, r && !_(o) && window.parent.postMessage({ type: "backmatter:chat-closed" }, s);
-  }, [o]), p(() => {
+    const o = _(a.current);
+    a.current = r, o && !_(r) && window.parent.postMessage({ type: "backmatter:chat-closed" }, s);
+  }, [r]), g(() => {
     const s = k();
-    function r(d) {
+    function o(d) {
       var f;
       !s || d.origin !== s || ((f = d.data) == null ? void 0 : f.type) === "backmatter:chat-open" && (t({ type: "open" }), requestAnimationFrame(() => {
         window.dispatchEvent(new Event("backmatter:chat-focus"));
       }));
     }
-    return window.addEventListener("message", r), () => window.removeEventListener("message", r);
+    return window.addEventListener("message", o), () => window.removeEventListener("message", o);
   }, [t]), null;
 }
 const _e = 8e3;
@@ -105,9 +105,9 @@ function q(e) {
 function De({
   workspaceId: e
 }) {
-  p(() => B(), []);
-  const [t, o] = v(null), [a, s] = v("viewer"), [r, d] = v(""), [f, m] = v(null), [c, y] = v(!1), [U, N] = v(null);
-  p(() => {
+  g(() => B(), []);
+  const [t, r] = w(null), [a, s] = w("viewer"), [o, d] = w(""), [f, m] = w(null), [c, y] = w(!1), [U, N] = w(null);
+  g(() => {
     let i = !1;
     return G(e).then((l) => {
       i || s(l.workspace.role);
@@ -116,12 +116,12 @@ function De({
     }), () => {
       i = !0;
     };
-  }, [e]), p(() => {
+  }, [e]), g(() => {
     let i = !1;
     const l = () => {
       S(e).then((u) => {
         if (i) return;
-        o(u);
+        r(u);
         const T = O();
         T && window.parent.postMessage({
           type: "backmatter:git",
@@ -133,15 +133,15 @@ function De({
       });
     };
     l();
-    const w = window.setInterval(l, _e);
+    const v = window.setInterval(l, _e);
     return () => {
-      i = !0, window.clearInterval(w);
+      i = !0, window.clearInterval(v);
     };
   }, [e]);
-  const h = (t == null ? void 0 : t.changes) ?? [], x = $(t), E = ae(x, fe(a)), V = Q(() => h.filter((i) => i.status === "conflict"), [h]), F = oe(h);
+  const h = (t == null ? void 0 : t.changes) ?? [], x = $(t), E = ae(x, fe(a)), V = Q(() => h.filter((i) => i.status === "conflict"), [h]), F = re(h);
   async function L(i, l) {
-    const w = `${q(i)}:${l}`;
-    N(w), m(null);
+    const v = `${q(i)}:${l}`;
+    N(v), m(null);
     try {
       await ce(e, i.locale, i.type, i.slug, l), le({
         workspaceId: e,
@@ -151,7 +151,7 @@ function De({
         status: l === "theirs" ? "clean" : "modified"
       });
       const u = await S(e);
-      o(u);
+      r(u);
     } catch (u) {
       m(u instanceof Error ? u.message : "Resolve failed");
     } finally {
@@ -162,12 +162,12 @@ function De({
     if (i.preventDefault(), !(c || E !== "commit" || h.length === 0)) {
       y(!0), m(null);
       try {
-        const l = await ue(e, r);
+        const l = await ue(e, o);
         d(""), de(e, l.files);
-        const w = O();
-        w && window.parent.postMessage({
+        const v = O();
+        v && window.parent.postMessage({
           type: "backmatter:published"
-        }, w), o(await S(e));
+        }, v), r(await S(e));
       } catch (l) {
         m($e(l));
       } finally {
@@ -176,22 +176,22 @@ function De({
     }
   }
   const W = c ? "Committing…" : x > 0 ? `Resolve ${x} ${x === 1 ? "conflict" : "conflicts"}` : E === "blocked" ? "Writers cannot publish" : h.length === 0 ? "Nothing to publish" : `Deploy ${h.length} ${h.length === 1 ? "change" : "changes"}`;
-  return /* @__PURE__ */ g("form", { className: "x78zum5 xdt5ytf x11cgr9k x1us19tq x9f619 x1t7e3gq x1hb2obb xqjzbou x1vrk1b5", onSubmit: (i) => void H(i), children: [
+  return /* @__PURE__ */ p("form", { className: "x78zum5 xdt5ytf x11cgr9k x1us19tq x9f619 x1t7e3gq x1hb2obb xqjzbou x1vrk1b5", onSubmit: (i) => void H(i), children: [
     /* @__PURE__ */ n(b, { as: "p", size: "sm", weight: "medium", tone: "muted", children: (t == null ? void 0 : t.currentBranch) ?? "Publish" }),
-    h.length === 0 ? /* @__PURE__ */ n(b, { as: "p", size: "sm", tone: "muted", children: "Nothing to publish" }) : /* @__PURE__ */ n("ul", { className: "x1ghz6dp x1717udv xe8uvvx x78zum5 xdt5ytf x1ndbd79", children: h.map((i) => /* @__PURE__ */ g("li", { className: "x78zum5 xdt5ytf x3smv4v", children: [
-      /* @__PURE__ */ g("span", { children: [
+    h.length === 0 ? /* @__PURE__ */ n(b, { as: "p", size: "sm", tone: "muted", children: "Nothing to publish" }) : /* @__PURE__ */ n("ul", { className: "x1ghz6dp x1717udv xe8uvvx x78zum5 xdt5ytf x1ndbd79", children: h.map((i) => /* @__PURE__ */ p("li", { className: "x78zum5 xdt5ytf x3smv4v", children: [
+      /* @__PURE__ */ p("span", { children: [
         i.status,
         " ",
         i.type,
         "/",
         i.slug
       ] }),
-      i.status === "conflict" ? /* @__PURE__ */ g("span", { className: "x78zum5 x3smv4v", children: [
+      i.status === "conflict" ? /* @__PURE__ */ p("span", { className: "x78zum5 x3smv4v", children: [
         /* @__PURE__ */ n(C, { size: "sm", variant: "secondary", disabled: U !== null, onClick: () => void L(i, "mine"), children: "Keep mine" }),
         /* @__PURE__ */ n(C, { size: "sm", variant: "secondary", disabled: U !== null, onClick: () => void L(i, "theirs"), children: "Take theirs" })
       ] }) : null
     ] }, q(i))) }),
-    V.length > 0 ? null : /* @__PURE__ */ n(se, { value: r, placeholder: F, "aria-label": "Commit message", onChange: (i) => d(i.target.value) }),
+    V.length > 0 ? null : /* @__PURE__ */ n(se, { value: o, placeholder: F, "aria-label": "Commit message", onChange: (i) => d(i.target.value) }),
     f ? /* @__PURE__ */ n(b, { as: "p", size: "sm", tone: "danger", children: f }) : null,
     /* @__PURE__ */ n(C, { type: "submit", size: "sm", disabled: c || E !== "commit" || h.length === 0, children: W })
   ] });
@@ -199,11 +199,14 @@ function De({
 const I = "backmatter:enter-at", Oe = 1e4;
 function K(e, t) {
   if (typeof window > "u") return !1;
-  const o = Number(window.sessionStorage.getItem(I) ?? 0);
-  return Date.now() - o < Oe ? !1 : (window.sessionStorage.setItem(I, String(Date.now())), window.location.assign(ge(t, {
+  const r = Number(window.sessionStorage.getItem(I) ?? 0);
+  if (Date.now() - r < Oe) return !1;
+  window.sessionStorage.setItem(I, String(Date.now()));
+  const a = window.top && window.top !== window ? window.top : window;
+  return a.location.assign(pe(t, {
     workspaceId: e,
-    returnUrl: window.location.href
-  })), !0);
+    returnUrl: a.location.href
+  })), !0;
 }
 function qe(e) {
   const t = e.dashboardUrl ?? "https://dash.backmatter.app";
@@ -215,22 +218,22 @@ function qe(e) {
     version: e.version,
     dashboardUrl: t,
     onUnauthorized: ({
-      status: o
+      status: r
     }) => {
-      o === 401 && K(e.workspaceId, t);
+      r === 401 && K(e.workspaceId, t);
     }
   }), P();
 }
 function Ve(e) {
-  const t = e.basePath ?? "/backmatter", [o] = v(() => qe(e));
-  return /* @__PURE__ */ n(ze, { definition: e.studio, children: /* @__PURE__ */ g(me, { children: [
+  const t = e.basePath ?? "/backmatter", [r] = w(() => qe(e));
+  return /* @__PURE__ */ n(ze, { definition: e.studio, children: /* @__PURE__ */ p(me, { children: [
     /* @__PURE__ */ n(Ne, {}),
     /* @__PURE__ */ n(he, { basename: t, children: /* @__PURE__ */ n(Ie, { ...e }) })
   ] }) });
 }
 function Ie(e) {
-  const t = pe(), o = e.dashboardUrl ?? "https://dash.backmatter.app", [a, s] = v("loading");
-  if (p(() => {
+  const t = ge(), r = e.dashboardUrl ?? "https://dash.backmatter.app", [a, s] = w("loading");
+  if (g(() => {
     let f = !1;
     const m = P().onUnauthorized;
     return j({
@@ -238,10 +241,10 @@ function Ie(e) {
       onUnauthorized: (c) => {
         c.status === 426 ? s("outdated") : m == null || m(c);
       }
-    }), ve().then(async (c) => {
+    }), we().then(async (c) => {
       if (f) return;
       if (!(c != null && c.user)) {
-        K(e.workspaceId, o) || s("unauthorized");
+        K(e.workspaceId, r) || s("unauthorized");
         return;
       }
       const {
@@ -259,9 +262,9 @@ function Ie(e) {
     }), () => {
       f = !0;
     };
-  }, [e.workspaceId, o]), a === "loading") return /* @__PURE__ */ n(we, {});
+  }, [e.workspaceId, r]), a === "loading") return /* @__PURE__ */ n(ve, {});
   if (a === "outdated")
-    return /* @__PURE__ */ g(A, { title: "This site's editor is out of date", children: [
+    return /* @__PURE__ */ p(A, { title: "This site's editor is out of date", children: [
       "Update ",
       /* @__PURE__ */ n("code", { children: "@backmatter/studio" }),
       " and ",
@@ -269,18 +272,18 @@ function Ie(e) {
       " on the site, then reload."
     ] });
   if (a === "unauthorized")
-    return /* @__PURE__ */ g(A, { title: "Could not start editing", children: [
+    return /* @__PURE__ */ p(A, { title: "Could not start editing", children: [
       "The site did not receive a session from the dashboard. Check that this site's origin is listed in the workspace settings and that ",
       /* @__PURE__ */ n("code", { children: "/api/backmatter" }),
       " routes are deployed."
     ] });
-  const r = t.pathname.match(/^\/embed\/chat\/([^/]+)\/?$/);
-  if (r != null && r[1])
-    return /* @__PURE__ */ n(Le, { workspaceId: decodeURIComponent(r[1]) });
+  const o = t.pathname.match(/^\/embed\/chat\/([^/]+)\/?$/);
+  if (o != null && o[1])
+    return /* @__PURE__ */ n(Le, { workspaceId: decodeURIComponent(o[1]) });
   const d = t.pathname.match(/^\/embed\/publish\/([^/]+)\/?$/);
   return d != null && d[1] ? /* @__PURE__ */ n(De, { workspaceId: decodeURIComponent(d[1]) }) : /* @__PURE__ */ n(be, { user: a.user, children: /* @__PURE__ */ n(ye, { children: /* @__PURE__ */ n(xe, { userId: a.user.id, email: a.user.email, onLogout: () => {
-    Ae(e.previewEntryPath ?? "/api/backmatter/preview", o);
-  }, children: /* @__PURE__ */ g(ke, { children: [
+    Ae(e.previewEntryPath ?? "/api/backmatter/preview", r);
+  }, children: /* @__PURE__ */ p(ke, { children: [
     /* @__PURE__ */ n(R, { path: "/", element: /* @__PURE__ */ n(D, { to: `/${a.slug}`, replace: !0 }) }),
     /* @__PURE__ */ n(R, { path: "/workspaces/:workspaceId/*", element: /* @__PURE__ */ n(Ee, {}) }),
     Ce(),
@@ -301,7 +304,7 @@ function A({
   title: e,
   children: t
 }) {
-  return /* @__PURE__ */ n("div", { className: "x1ov3xa9 xrvj5dj x1ku5rj1 x1t7e3gq", children: /* @__PURE__ */ g("div", { className: "x78zum5 xdt5ytf x1ndbd79 xq2pcee x1t7e3gq x4pepcl x1d0qn7y", children: [
+  return /* @__PURE__ */ n("div", { className: "x1ov3xa9 xrvj5dj x1ku5rj1 x1t7e3gq", children: /* @__PURE__ */ p("div", { className: "x78zum5 xdt5ytf x1ndbd79 xq2pcee x1t7e3gq x4pepcl x1d0qn7y", children: [
     /* @__PURE__ */ n(b, { size: "lg", weight: "medium", children: e }),
     /* @__PURE__ */ n(b, { tone: "muted", children: t })
   ] }) });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backmatter/studio",
-  "version": "0.0.1",
+  "version": "0.0.3",
   "description": "The Backmatter editing surface: document editor, AI chat, publish. Mounted on your site or hosted on the dashboard.",
   "type": "module",
   "publishConfig": {
@@ -47,7 +47,7 @@
   },
   "dependencies": {
     "@ai-sdk/react": "^4.0.100",
-    "@backmatter/core": "^0.0.20",
+    "@backmatter/core": "^0.0.21",
     "@base-ui/react": "^1.6.0",
     "@dnd-kit/abstract": "^0.5.0",
     "@dnd-kit/react": "^0.5.0",

package/src/api.ts

@@ -261,6 +261,10 @@ export function attachGithubInstallation(
   });
 }
 
+export function fetchGithubRepositoryAccess(workspaceId: string) {
+  return api<{ url: string }>(`/workspaces/${workspaceId}/github/repository-access`);
+}
+
 export function fetchGithubRepos(workspaceId: string) {
   return api<{
     repos: Array<{ fullName: string; defaultBranch: string }>;

package/src/chat/ChatPanel.tsx

@@ -55,7 +55,7 @@ export function ChatPanel({ fill = false }: { fill?: boolean } = {}) {
   // one row so toggling the open document doesn't shift the content.
   const contextRows = Math.max(
     1,
-    (ui.focus && ui.includeFocus ? 1 : 0) + ui.mentions.length,
+    (ui.focus && ui.includeFocus ? 1 : 0) + ui.mentions.length + ui.pointers.length,
   );
   const contextReserve = contextRows * CONTEXT_ROW_HEIGHT + CONTEXT_BAR_PADDING + 12;
 

package/src/chat/ChatProvider.tsx

@@ -46,8 +46,11 @@ import {
 } from "../chrome/EditorFocusContext";
 import {
   addMention as addMentionTo,
+  addPointer as addPointerTo,
   buildChatContext,
   removeMention as removeMentionFrom,
+  removePointer as removePointerFrom,
+  type ChatPointer,
   type ChatRequestContext,
 } from "./chat-context";
 import {
@@ -63,6 +66,7 @@ import {
   type PanelAction,
   type PanelState,
 } from "./chat-state";
+import { fetchNotifyingSessionExpiry } from "./session-expiry";
 
 // ---------------------------------------------------------------------------
 // UI-level context (panel, thread selection, model, chips)
@@ -84,6 +88,12 @@ export type ChatUIValue = {
   mentions: DocRef[];
   addMention: (ref: DocRef) => void;
   removeMention: (ref: DocRef) => void;
+  /** Elements pointed at on the host site. Only the dev bar chat sets `pointer`. */
+  pointer: boolean;
+  pointers: ChatPointer[];
+  addPointer: (pointer: ChatPointer) => void;
+  removePointer: (pointer: ChatPointer) => void;
+  clearPointers: () => void;
   includeFocus: boolean;
   setIncludeFocus: (v: boolean) => void;
   focus: EditorFocus | null;
@@ -170,10 +180,13 @@ function refFromInput(input: unknown): DocRef | null {
 export function ChatProvider({
   workspaceId,
   startOpen = false,
+  pointer = false,
   children,
 }: {
   workspaceId: string;
   startOpen?: boolean;
+  /** Dev bar chat can point at elements on the host page. */
+  pointer?: boolean;
   children: React.ReactNode;
 }) {
   const [panel, dispatch] = useReducer(
@@ -188,6 +201,7 @@ export function ChatProvider({
   const [freshThread, setFreshThread] = useState(false);
   const [pendingText, setPendingText] = useState<string | null>(null);
   const [mentions, setMentions] = useState<DocRef[]>([]);
+  const [pointers, setPointers] = useState<ChatPointer[]>([]);
   const [includeFocus, setIncludeFocus] = useState(true);
   const [threadsVersion, setThreadsVersion] = useState(0);
   const { focus } = useEditorFocus();
@@ -222,6 +236,7 @@ export function ChatProvider({
     setFreshThread(false);
     setPendingText(null);
     setMentions([]);
+    setPointers([]);
     setIncludeFocus(true);
   }, [workspaceId]);
 
@@ -245,6 +260,7 @@ export function ChatProvider({
     setFreshThread(false);
     setPendingText(null);
     setMentions([]);
+    setPointers([]);
     dispatch({ type: "showChat" });
   }, []);
 
@@ -254,6 +270,13 @@ export function ChatProvider({
   const removeMention = useCallback((ref: DocRef) => {
     setMentions((prev) => removeMentionFrom(prev, ref));
   }, []);
+  const addPointer = useCallback((next: ChatPointer) => {
+    setPointers((prev) => addPointerTo(prev, next));
+  }, []);
+  const removePointer = useCallback((next: ChatPointer) => {
+    setPointers((prev) => removePointerFrom(prev, next));
+  }, []);
+  const clearPointers = useCallback(() => setPointers([]), []);
   const bumpThreads = useCallback(() => setThreadsVersion((v) => v + 1), []);
 
   // Context getter kept in a ref so the session never re-renders because of it.
@@ -261,8 +284,9 @@ export function ChatProvider({
     focusDoc: null,
     selection: null,
     mentions: [],
+    pointers: [],
   }));
-  contextRef.current = () => buildChatContext({ focus, includeFocus, mentions });
+  contextRef.current = () => buildChatContext({ focus, includeFocus, mentions, pointers });
   const modelRef = useRef<string | null>(model);
   modelRef.current = model;
 
@@ -294,6 +318,11 @@ export function ChatProvider({
       mentions,
       addMention,
       removeMention,
+      pointer,
+      pointers,
+      addPointer,
+      removePointer,
+      clearPointers,
       includeFocus,
       setIncludeFocus,
       focus,
@@ -314,6 +343,11 @@ export function ChatProvider({
       mentions,
       addMention,
       removeMention,
+      pointer,
+      pointers,
+      addPointer,
+      removePointer,
+      clearPointers,
       includeFocus,
       focus,
       threadsVersion,
@@ -513,6 +547,10 @@ function LiveSession({
         api: aiMessagesUrl(workspaceId, threadId),
         credentials: apiCredentials(),
         headers: apiHeaders(),
+        fetch: fetchNotifyingSessionExpiry(
+          typeof location === "undefined" ? "" : location.origin,
+          typeof window !== "undefined" && window.parent !== window ? window.parent : null,
+        ),
         prepareSendMessagesRequest: ({ messages, body }) => ({
           body: {
             message: messages[messages.length - 1],