@sightspool/sdk 0.2.1 → 0.3.0

package/dist/index.cjs

@@ -199,6 +199,125 @@ input { font: inherit; font-size: 13px; width: 100%; box-sizing: border-box; pad
   }
 });
 
+// src/probe.ts
+var probe_exports = {};
+__export(probe_exports, {
+  showProbe: () => showProbe
+});
+function findSlot(slot) {
+  try {
+    return document.querySelector(`[data-sightspool-slot="${slot}"]`);
+  } catch (e) {
+    return null;
+  }
+}
+function showProbe(config) {
+  return new Promise((resolve) => {
+    if (typeof document === "undefined") {
+      resolve({ dismissed: true, mounted: false });
+      return;
+    }
+    const anchor = config.slot ? findSlot(config.slot) : null;
+    if (config.slot && !anchor) {
+      resolve({ mounted: false });
+      return;
+    }
+    let settled = false;
+    const inline = !!anchor;
+    const host = document.createElement(inline ? "span" : "div");
+    const shadow = host.attachShadow({ mode: "open" });
+    function teardown() {
+      try {
+        host.remove();
+      } catch (e) {
+      }
+    }
+    function finish(result, disclose) {
+      if (settled) return;
+      settled = true;
+      resolve(result);
+      if (disclose) {
+        disclosure();
+        setTimeout(teardown, DISCLOSURE_MS);
+      } else {
+        teardown();
+      }
+    }
+    const style = document.createElement("style");
+    style.textContent = inline ? INLINE_STYLE : FLOATING_STYLE;
+    shadow.appendChild(style);
+    const wrap = document.createElement(inline ? "span" : "div");
+    if (!inline) wrap.className = "wrap";
+    shadow.appendChild(wrap);
+    function container() {
+      wrap.innerHTML = "";
+      if (inline) return wrap;
+      const c = document.createElement("div");
+      c.className = "card";
+      wrap.appendChild(c);
+      return c;
+    }
+    function probe() {
+      const c = container();
+      if (!inline) {
+        const x = document.createElement("button");
+        x.className = "x";
+        x.textContent = "\xD7";
+        x.setAttribute("aria-label", "Dismiss");
+        x.onclick = () => finish({ dismissed: true, mounted: true }, false);
+        c.appendChild(x);
+      }
+      const b = document.createElement("button");
+      b.className = "probe";
+      b.textContent = config.label;
+      b.onclick = () => finish({ voted: true, mounted: true }, true);
+      c.appendChild(b);
+    }
+    function disclosure() {
+      const c = container();
+      const p = document.createElement("p");
+      p.className = "done";
+      p.textContent = config.disclosure;
+      c.appendChild(p);
+    }
+    try {
+      (anchor != null ? anchor : document.body).appendChild(host);
+      probe();
+    } catch (e) {
+      finish({ dismissed: true, mounted: false }, false);
+    }
+  });
+}
+var FLOATING_STYLE, INLINE_STYLE, DISCLOSURE_MS;
+var init_probe = __esm({
+  "src/probe.ts"() {
+    FLOATING_STYLE = `
+:host { all: initial; }
+.wrap { position: fixed; bottom: 20px; right: 20px; z-index: 2147483000;
+  width: 340px; max-width: calc(100vw - 32px); font-family: system-ui, -apple-system, sans-serif; }
+.card { position: relative; background: #fff; color: #18181b; border: 1px solid #e4e4e7;
+  border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,.12); padding: 16px; }
+.probe { font: inherit; font-size: 13px; cursor: pointer; display: block; width: 100%;
+  text-align: left; border: 1px dashed #a1a1aa; border-radius: 8px; padding: 10px 12px;
+  background: #fafafa; color: #3f3f46; }
+.probe:hover { border-color: #18181b; color: #18181b; }
+.x { position: absolute; top: 8px; right: 10px; border: none; background: none; font-size: 16px;
+  color: #a1a1aa; padding: 2px 6px; cursor: pointer; }
+.done { font-size: 13px; color: #18181b; margin: 0; line-height: 1.4; }
+`;
+    INLINE_STYLE = `
+:host { all: initial; display: inline-block; max-width: 100%; }
+.probe { font: inherit; font-family: system-ui, -apple-system, sans-serif; font-size: 13px;
+  cursor: pointer; display: inline-block; text-align: left; border: 1px dashed #a1a1aa;
+  border-radius: 8px; padding: 8px 12px; background: transparent; color: #52525b; }
+.probe:hover { border-color: #18181b; color: #18181b; }
+.done { font-family: system-ui, -apple-system, sans-serif; font-size: 13px; color: #52525b;
+  margin: 0; line-height: 1.4; border: 1px dashed #d4d4d8; border-radius: 8px; padding: 8px 12px; }
+`;
+    DISCLOSURE_MS = 3200;
+  }
+});
+
 // src/survey.ts
 var survey_exports = {};
 __export(survey_exports, {
@@ -725,7 +844,7 @@ function canPrompt(state, now, caps = DEFAULT_CAPS) {
 }
 
 // src/intervention.ts
-var RENDERABLE = /* @__PURE__ */ new Set(["survey"]);
+var RENDERABLE = /* @__PURE__ */ new Set(["survey", "demand_probe"]);
 function str(v, max) {
   if (typeof v !== "string") return void 0;
   const t = v.trim();
@@ -748,6 +867,14 @@ function normalizeServed(raw) {
   const type = str(r.type, 40);
   if (!id || !type || !RENDERABLE.has(type)) return null;
   const cfg = r.config && typeof r.config === "object" ? r.config : {};
+  if (type === "demand_probe") {
+    const label = str(cfg.label, 200);
+    const disclosure = str(cfg.disclosure, 300);
+    if (!label || !disclosure) return null;
+    const rawSlot = str(cfg.slot, 64);
+    const slot = rawSlot && /^[a-z0-9][a-z0-9_-]*$/i.test(rawSlot) ? rawSlot : void 0;
+    return { id, type, config: { label, disclosure, ...slot ? { slot } : {} } };
+  }
   const question = str(cfg.question, 500);
   if (!question) return null;
   const options = Array.isArray(cfg.options) ? cfg.options.map((o) => str(o, 200)).filter((o) => !!o).slice(0, 6) : void 0;
@@ -756,7 +883,7 @@ function normalizeServed(raw) {
     ...options && options.length ? { options } : {},
     allow_text: cfg.allow_text === true
   };
-  return { id, type, config };
+  return { id, type: "survey", config };
 }
 function pickRespondentKey(userId, persisted, sessionRef) {
   const uid = str(userId, 200);
@@ -929,20 +1056,39 @@ async function maybeServeIntervention(c) {
     debug: c.config.debug
   });
   if (!served || !c.running) return;
+  const prevShown = c.interventionsShown;
+  const prevPromptAt = c.fatigue.lastPromptAt;
   c.surveyOnScreen = true;
   c.interventionsShown += 1;
   c.fatigue.lastPromptAt = Date.now();
   try {
-    const { showSurvey: showSurvey2 } = await Promise.resolve().then(() => (init_survey(), survey_exports));
-    const result = await showSurvey2(served.config);
-    if (!result.dismissed && (result.choice || result.text)) {
-      submitResponse({
-        endpoint: c.config.endpoint,
-        key: c.config.key,
-        interventionId: served.id,
-        response: { choice: result.choice, text: result.text },
-        respondentKey
-      });
+    if (served.type === "demand_probe") {
+      const { showProbe: showProbe2 } = await Promise.resolve().then(() => (init_probe(), probe_exports));
+      const result = await showProbe2(served.config);
+      if (!result.mounted) {
+        c.interventionsShown = prevShown;
+        c.fatigue.lastPromptAt = prevPromptAt;
+      } else if (result.voted) {
+        submitResponse({
+          endpoint: c.config.endpoint,
+          key: c.config.key,
+          interventionId: served.id,
+          response: { choice: "vote" },
+          respondentKey
+        });
+      }
+    } else {
+      const { showSurvey: showSurvey2 } = await Promise.resolve().then(() => (init_survey(), survey_exports));
+      const result = await showSurvey2(served.config);
+      if (!result.dismissed && (result.choice || result.text)) {
+        submitResponse({
+          endpoint: c.config.endpoint,
+          key: c.config.key,
+          interventionId: served.id,
+          response: { choice: result.choice, text: result.text },
+          respondentKey
+        });
+      }
     }
   } catch (e) {
   } finally {