@nimblebrain/synapse 0.10.2 → 0.12.0-rc.0

package/dist/synapse-ui.iife.global.js

@@ -0,0 +1 @@
+(function(){'use strict';var de={"--color-background-primary":"#ffffff","--color-background-secondary":"#fafafa","--color-background-tertiary":"#f3f4f6","--color-text-primary":"#111827","--color-text-secondary":"#6b7280","--color-text-tertiary":"#9ca3af","--color-text-accent":"#2563eb","--nb-color-accent-foreground":"#ffffff","--color-border-primary":"#e5e7eb","--color-border-secondary":"#d1d5db","--color-ring-primary":"#2563eb","--nb-color-danger":"#dc2626","--nb-color-success":"#059669","--nb-color-warning":"#f59e0b","--nb-color-warm":"#d4620a","--nb-color-warm-light":"#fef5ee","--nb-color-processing":"#7c3aed","--nb-color-processing-light":"#f3eeff","--nb-color-info-light":"#eef4ff"},ue={"--color-background-primary":"#18181b","--color-background-secondary":"#27272a","--color-background-tertiary":"#2f2f34","--color-text-primary":"#fafafa","--color-text-secondary":"#a1a1aa","--color-text-tertiary":"#71717a","--color-text-accent":"#818cf8","--nb-color-accent-foreground":"#ffffff","--color-border-primary":"#3f3f46","--color-border-secondary":"#52525b","--color-ring-primary":"#818cf8","--nb-color-danger":"#f87171","--nb-color-success":"#34d399","--nb-color-warning":"#fbbf24","--nb-color-warm":"#fb923c","--nb-color-warm-light":"#3a2a1e","--nb-color-processing":"#a78bfa","--nb-color-processing-light":"#2a2440","--nb-color-info-light":"#1e2a44"},pe={light:de,dark:ue};function N(t,r){if(typeof document>"u")return;let n=document.documentElement.style;for(let[i,l]of Object.entries(pe[t]))n.setProperty(i,l);if(r&&typeof r=="object")for(let[i,l]of Object.entries(r))typeof i=="string"&&typeof l=="string"&&n.setProperty(i,l);}function R(t){typeof document<"u"&&document.documentElement.setAttribute("data-theme",t.mode),N(t.mode,t.tokens);}function C(t){try{if(t?.matchMedia?.("(prefers-color-scheme: dark)").matches)return "dark"}catch{}return "light"}function h(t,r){return t==="light"||t==="dark"?t:r}var b=class extends Error{constructor(r,n){super(`"${r}" is not supported by the "${n}" host`),this.name="HostUnsupportedError";}},A="synapse-ui-data",z="ui-lifecycle-iframe-ready",j="ui-lifecycle-iframe-render-data",G="ui-size-change",K="link",W="prompt",S="openai:set_globals",F="2026-01-26",Z="ui/initialize",q="ui/notifications/initialized",Y="ui/notifications/tool-result",V="ui/notifications/host-context-changed",B="ui/notifications/size-changed",Q="ui/open-link",$="ui/message",X="ui/resource-teardown",J="tools/call";function ee(t,r){let n=()=>t.openai,i=n()?.toolOutput??null,l={mode:h(n()?.theme,"light"),tokens:{}},a=new Set,p=new Set,f=false,m=s=>{if(f)return;let c=s.detail?.globals;if(c){if("toolOutput"in c&&c.toolOutput!=null){i=c.toolOutput;for(let u of a)u(i);}if("theme"in c&&c.theme!=null){let u=h(c.theme,l.mode);if(u!==l.mode){l={mode:u,tokens:{}};for(let P of p)P(l);}}}};return {host:"chatgpt",getData:()=>i,onData(s){return a.add(s),()=>a.delete(s)},getTheme:()=>l,onTheme(s){return p.add(s),()=>p.delete(s)},async callTool(s,c){let u=n()?.callTool;if(!u)throw new b("callTool","chatgpt");return await u(s,c??{})},sendPrompt(s){let c=n();(c?.sendFollowUpMessage??c?.sendFollowupMessage)?.({prompt:s});},openLink(s){let c=n()?.openExternal;c?c({href:s}):t.open(s,"_blank","noopener,noreferrer");},resize(){},capabilities(){let s=n();return {pull:typeof s?.callTool=="function",sendPrompt:typeof s?.sendFollowUpMessage=="function"||typeof s?.sendFollowupMessage=="function",openLink:true}},start(){t.addEventListener(S,m,{passive:true}),i=n()?.toolOutput??i;},destroy(){f||(f=true,t.removeEventListener(S,m),a.clear(),p.clear());}}}function O(t,r){if(!t)return null;let i=t.getElementById(r)?.textContent;if(!i)return null;try{return JSON.parse(i)??null}catch{return null}}function L(t){if(t==null||typeof t!="object")return null;let r=t,n=r.renderData,i=n!=null&&typeof n=="object"?n:r;return i.toolOutput!=null?i.toolOutput:i.structuredContent!=null?i.structuredContent:i}function te(t,r){let n=r.dataElementId??A,i=null,l={mode:C(t),tokens:{}},a=new Set,p=false,f=null,m=s=>{if(p)return;let c=h(s.matches?"dark":"light",l.mode);if(c!==l.mode){l={mode:c,tokens:{}};for(let u of a)u(l);}};return {host:"generic",getData:()=>i,onData(){return ()=>{}},getTheme:()=>l,onTheme(s){return a.add(s),()=>a.delete(s)},async callTool(s){throw new b("callTool","generic")},sendPrompt(){},openLink(s){t.open(s,"_blank","noopener,noreferrer");},resize(){},capabilities(){return {pull:false,sendPrompt:false,openLink:true}},start(){i=O(t.document,n);try{f=t.matchMedia?.("(prefers-color-scheme: dark)")??null,f?.addEventListener?.("change",m);}catch{f=null;}},destroy(){p||(p=true,f?.removeEventListener?.("change",m),f=null,a.clear());}}}var fe=3e4;function ne(t,r){let n=r.dataElementId??A,i=r.autoResize!==false,l=null,a={mode:C(t),tokens:{}},p=new Set,f=new Set,m=false,s=false,c=1,u=new Map,P=-1,v=null,k=null,U=()=>t.parent??t;function I(e){U().postMessage(e,"*");}function _(e){s||I(e);}function x(e,o){I({jsonrpc:"2.0",method:e,params:o??{}});}function w(e,o){let d=c++;return new Promise((g,y)=>{let T=setTimeout(()=>{u.delete(d),y(new Error(`"${e}" timed out`));},fe);u.set(d,{resolve:g,reject:y,timer:T}),I({jsonrpc:"2.0",id:d,method:e,params:o??{}});})}function D(e){if(e!=null){l=e;for(let o of p)o(e);}}function M(e){if(!e||typeof e!="object")return;let{mode:o,tokens:d}=a,g=false;if(e.theme!=null){let T=h(e.theme,o);T!==o&&(o=T,g=true);}let y=e.styles;if(y?.variables&&typeof y.variables=="object"&&(d={...d,...y.variables},g=true),g){a={mode:o,tokens:d};for(let T of f)T(a);}}function E(e){if(m)return;let o=typeof e=="number"?e:Math.ceil(t.document.body.scrollHeight);o!==P&&(P=o,x(B,{height:o}),_({type:G,payload:{height:o}}));}function se(e){let o=Number(e.id),d=u.get(o);if(d)if(u.delete(o),clearTimeout(d.timer),e.error!=null){let g=e.error;d.reject(new Error(g.message??"request failed"));}else d.resolve(e.result);}function ie(e,o){if(e===Y){let d=o.structuredContent;D(d??L(o));}else e===V&&M(o);}function ae(e){e.method===X&&I({jsonrpc:"2.0",id:e.id,result:{}});}function le(e){if(e.type===j||e.type==="renderData"){let{theme:o,...d}=e.payload??{};o!=null&&M({theme:o}),Object.keys(d).length>0&&D(L(d));}}let H=e=>{if(m||e.source&&e.source!==U())return;let o=e.data;if(!(!o||typeof o!="object")){if(o.jsonrpc!=="2.0"){le(o);return}o.id!=null&&("result"in o||"error"in o)?se(o):typeof o.method=="string"&&(o.id!=null?ae(o):ie(o.method,o.params??{}));}};function ce(){k=()=>E(),t.addEventListener("resize",k),typeof t.ResizeObserver<"u"&&(v=new t.ResizeObserver(()=>E()),v.observe(t.document.body));}return {host:"claude",getData:()=>l,onData(e){return p.add(e),()=>p.delete(e)},getTheme:()=>a,onTheme(e){return f.add(e),()=>f.delete(e)},async callTool(e,o){return await w(J,{name:e,arguments:o??{}})},sendPrompt(e){w($,{role:"user",content:[{type:"text",text:e}]}).catch(()=>{}),_({type:W,payload:{prompt:e}});},openLink(e){w(Q,{url:e}).catch(()=>{}),_({type:K,payload:{url:e}});},resize(e){E(e);},capabilities(){return {pull:true,sendPrompt:true,openLink:true}},start(){t.addEventListener("message",H),l=O(t.document,n),i&&ce(),I({type:z}),w(Z,{appInfo:{name:r.name??"synapse-ui",version:r.version??"0.0.0"},appCapabilities:{availableDisplayModes:["inline"]},protocolVersion:F}).then(e=>{m||(s=true,M(e?.hostContext),x(q,{}),P=-1,E());}).catch(()=>{}),E();},destroy(){if(!m){m=true,t.removeEventListener("message",H),k&&t.removeEventListener("resize",k),k=null,v?.disconnect(),v=null;for(let e of u.values())clearTimeout(e.timer),e.reject(new Error("adapter destroyed"));u.clear(),p.clear(),f.clear();}}}}function me(t){if(t.openai!=null)return "chatgpt";try{if(t.parent!=null&&t.parent!==t)return "claude"}catch{return "claude"}return "generic"}function ge(t,r,n){switch(t){case "chatgpt":return ee(r);case "claude":case "nimblebrain":return ne(r,n);default:return te(r,n)}}function oe(t,r){let n=r.host??me(t);return ge(n,t,r)}function re(t={}){let r=t.window??globalThis,n=oe(r,t);R(n.getTheme());let i=n.onTheme(R);n.start();let l=false;return {data:()=>n.getData(),onData:a=>n.onData(a),theme:()=>n.getTheme(),onTheme:a=>n.onTheme(a),callTool:(a,p)=>n.callTool(a,p),sendPrompt:a=>n.sendPrompt(a),openLink:a=>n.openLink(a),resize:a=>n.resize(a),capabilities:()=>n.capabilities(),host:()=>n.host,destroy(){l||(l=true,i(),n.destroy());}}}globalThis.SynapseUI={connect:re};})();

package/dist/ui/base.cjs

@@ -0,0 +1,13 @@
+'use strict';
+
+var chunkRX6XCLFF_cjs = require('../chunk-RX6XCLFF.cjs');
+
+// src/ui/base.ts
+chunkRX6XCLFF_cjs.injectBaseReset();
+
+Object.defineProperty(exports, "injectBaseReset", {
+  enumerable: true,
+  get: function () { return chunkRX6XCLFF_cjs.injectBaseReset; }
+});
+//# sourceMappingURL=base.cjs.map
+//# sourceMappingURL=base.cjs.map

package/dist/ui/base.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/ui/base.ts"],"names":["injectBaseReset"],"mappings":";;;;;AAqBAA,iCAAA,EAAgB","file":"base.cjs","sourcesContent":["/**\n * Establishes the root-height chain a full-pane Synapse app needs. Import for\n * the side effect:\n *\n * ```ts\n * import \"@nimblebrain/synapse/ui/base\";\n * ```\n *\n * This injects `html, body, #root { height: 100% }` (so a `height: 100%` app\n * shell resolves against the iframe's allocated pane) and `body { margin: 0 }`\n * (so the pane has no UA-margin gap). See `./internal/base-reset.ts` for why a\n * percentage chain — not a viewport unit — is the correct mechanism.\n *\n * `AppFrame` already calls `injectBaseReset()` on render, so apps built on it\n * get the chain automatically. Import this module explicitly to establish the\n * chain *before* React mounts — avoiding a first-paint layout jump — or for an\n * app that renders a full-pane root without `AppFrame`.\n */\n\nimport { injectBaseReset } from \"./internal/base-reset.js\";\n\ninjectBaseReset();\n\nexport { injectBaseReset };\n"]}

package/dist/ui/base.d.cts

@@ -0,0 +1,27 @@
+/**
+ * The root-height chain every full-pane Synapse app needs, as a plain function
+ * (no side effect on import — so a component can call it on render without the
+ * mere act of importing injecting anything). The side-effect entry point is
+ * `../base.ts` (`@nimblebrain/synapse/ui/base`).
+ *
+ * `AppFrame` sizes the app shell with `height: 100%`, which only resolves if its
+ * ancestor chain (`#root` → `body` → `html`) has a definite height. Each app
+ * iframe is its own bare document, so without this chain the shell collapses to
+ * content height — full width, short height — inside the host pane.
+ *
+ * Percentages resolve against the actual pane box, which is correct whether the
+ * app is sandboxed in an iframe or mounted into a host panel. A viewport unit
+ * (`vh`/`dvh`) would instead assume the pane equals the viewport — wrong on
+ * hosts that allocate a pane shorter than the viewport (it overflows with a
+ * second scrollbar). The `#root` rule targets the conventional mount id and
+ * harmlessly matches nothing if an app mounts elsewhere; `html, body` still
+ * apply. `body { margin: 0 }` removes the UA default so the pane has no gap.
+ */
+/**
+ * Inject the root-height + body-margin reset once. Idempotent (keyed by a
+ * single style id) and SSR-safe (no-ops when `document` is unavailable, via
+ * `ensureStyle`).
+ */
+declare function injectBaseReset(): void;
+
+export { injectBaseReset };

package/dist/ui/base.d.ts

@@ -0,0 +1,27 @@
+/**
+ * The root-height chain every full-pane Synapse app needs, as a plain function
+ * (no side effect on import — so a component can call it on render without the
+ * mere act of importing injecting anything). The side-effect entry point is
+ * `../base.ts` (`@nimblebrain/synapse/ui/base`).
+ *
+ * `AppFrame` sizes the app shell with `height: 100%`, which only resolves if its
+ * ancestor chain (`#root` → `body` → `html`) has a definite height. Each app
+ * iframe is its own bare document, so without this chain the shell collapses to
+ * content height — full width, short height — inside the host pane.
+ *
+ * Percentages resolve against the actual pane box, which is correct whether the
+ * app is sandboxed in an iframe or mounted into a host panel. A viewport unit
+ * (`vh`/`dvh`) would instead assume the pane equals the viewport — wrong on
+ * hosts that allocate a pane shorter than the viewport (it overflows with a
+ * second scrollbar). The `#root` rule targets the conventional mount id and
+ * harmlessly matches nothing if an app mounts elsewhere; `html, body` still
+ * apply. `body { margin: 0 }` removes the UA default so the pane has no gap.
+ */
+/**
+ * Inject the root-height + body-margin reset once. Idempotent (keyed by a
+ * single style id) and SSR-safe (no-ops when `document` is unavailable, via
+ * `ensureStyle`).
+ */
+declare function injectBaseReset(): void;
+
+export { injectBaseReset };

package/dist/ui/base.js

@@ -0,0 +1,7 @@
+import { injectBaseReset } from '../chunk-3HQGHPNC.js';
+export { injectBaseReset } from '../chunk-3HQGHPNC.js';
+
+// src/ui/base.ts
+injectBaseReset();
+//# sourceMappingURL=base.js.map
+//# sourceMappingURL=base.js.map

package/dist/ui/base.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/ui/base.ts"],"names":[],"mappings":";;;;AAqBA,eAAA,EAAgB","file":"base.js","sourcesContent":["/**\n * Establishes the root-height chain a full-pane Synapse app needs. Import for\n * the side effect:\n *\n * ```ts\n * import \"@nimblebrain/synapse/ui/base\";\n * ```\n *\n * This injects `html, body, #root { height: 100% }` (so a `height: 100%` app\n * shell resolves against the iframe's allocated pane) and `body { margin: 0 }`\n * (so the pane has no UA-margin gap). See `./internal/base-reset.ts` for why a\n * percentage chain — not a viewport unit — is the correct mechanism.\n *\n * `AppFrame` already calls `injectBaseReset()` on render, so apps built on it\n * get the chain automatically. Import this module explicitly to establish the\n * chain *before* React mounts — avoiding a first-paint layout jump — or for an\n * app that renders a full-pane root without `AppFrame`.\n */\n\nimport { injectBaseReset } from \"./internal/base-reset.js\";\n\ninjectBaseReset();\n\nexport { injectBaseReset };\n"]}

package/dist/ui/index.cjs

@@ -1,10 +1,9 @@
 'use strict';
 
+var chunkRX6XCLFF_cjs = require('../chunk-RX6XCLFF.cjs');
 var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
-// src/ui/components/Avatar.tsx
-
 // src/ui/tokens.ts
 var tokens = {
   // ── Surfaces ──
@@ -166,16 +165,6 @@ function Badge({ tone = "neutral", style, children, ...rest }) {
     }
   );
 }
-
-// src/ui/internal/inject-style.ts
-function ensureStyle(id, css) {
-  if (typeof document === "undefined") return;
-  if (document.getElementById(id)) return;
-  const style = document.createElement("style");
-  style.id = id;
-  style.textContent = css;
-  document.head.appendChild(style);
-}
 var STYLE_ID = "nb-synapse-button";
 var RULES = `
 .nb-btn {
@@ -223,7 +212,7 @@ function Button({
   children,
   ...rest
 }) {
-  ensureStyle(STYLE_ID, RULES);
+  chunkRX6XCLFF_cjs.ensureStyle(STYLE_ID, RULES);
   const vars = {
     "--nb-btn-radius": tokens.radiusSm,
     "--nb-btn-font": tokens.fontSans,
@@ -253,7 +242,7 @@ function Button({
   return /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: `nb-btn ${className ?? ""}`.trim(), style: btnStyle, ...rest, children });
 }
 function TextLink({ tone = "muted", style, className, children, ...rest }) {
-  ensureStyle(STYLE_ID, RULES);
+  chunkRX6XCLFF_cjs.ensureStyle(STYLE_ID, RULES);
   const resting = tone === "danger" ? tokens.danger : tone === "default" ? tokens.fg : tokens.fgMuted;
   const hover = tone === "danger" ? tokens.danger : tokens.accent;
   const linkStyle = {
@@ -295,7 +284,7 @@ function Card({
   children,
   ...rest
 }) {
-  if (interactive) ensureStyle(STYLE_ID2, RULES2);
+  if (interactive) chunkRX6XCLFF_cjs.ensureStyle(STYLE_ID2, RULES2);
   const cardStyle = {
     background: tokens.bgRaised,
     border: `${tokens.borderWidth} solid ${tokens.border}`,
@@ -353,7 +342,7 @@ function DrawerRoot({
   children,
   ...rest
 }) {
-  ensureStyle(STYLE_ID3, RULES3);
+  chunkRX6XCLFF_cjs.ensureStyle(STYLE_ID3, RULES3);
   const dialogRef = react.useRef(null);
   const labelId = react.useId();
   const [hasTitle, setHasTitle] = react.useState(false);
@@ -672,7 +661,7 @@ function ListRow({
   className,
   ...rest
 }) {
-  ensureStyle(STYLE_ID4, RULES4);
+  chunkRX6XCLFF_cjs.ensureStyle(STYLE_ID4, RULES4);
   const rowStyle = {
     "--nb-listrow-hover": tokens.bgSubtle,
     display: "grid",
@@ -812,7 +801,7 @@ var RULES5 = `
 .nb-prose strong { font-weight: ${tokens.weightSemibold}; }
 `;
 function Prose({ html, children, className, ...rest }) {
-  ensureStyle(STYLE_ID5, RULES5);
+  chunkRX6XCLFF_cjs.ensureStyle(STYLE_ID5, RULES5);
   const cls = `nb-prose ${className ?? ""}`.trim();
   if (html !== void 0) {
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cls, dangerouslySetInnerHTML: { __html: html }, ...rest });
@@ -850,7 +839,7 @@ function SearchField({
   type = "search",
   ...rest
 }) {
-  ensureStyle(STYLE_ID6, RULES6);
+  chunkRX6XCLFF_cjs.ensureStyle(STYLE_ID6, RULES6);
   const fieldStyle = {
     "--nb-search-font": tokens.fontSans,
     "--nb-search-fg": tokens.fg,
@@ -909,7 +898,7 @@ function SegmentedControl({
   className,
   ...rest
 }) {
-  ensureStyle(STYLE_ID7, RULES7);
+  chunkRX6XCLFF_cjs.ensureStyle(STYLE_ID7, RULES7);
   const trackStyle = {
     "--nb-seg-radius": tokens.radiusSm,
     "--nb-seg-track": tokens.bgSubtle,
@@ -945,7 +934,7 @@ var RULES8 = `
 @media (prefers-reduced-motion: reduce) { .nb-spinner { animation-duration: 1.6s; } }
 `;
 function Spinner({ size = 16, color, style, className, ...rest }) {
-  ensureStyle(STYLE_ID8, RULES8);
+  chunkRX6XCLFF_cjs.ensureStyle(STYLE_ID8, RULES8);
   const spinnerStyle = {
     display: "inline-block",
     flexShrink: 0,
@@ -996,7 +985,7 @@ function StatusDot({
   className,
   ...rest
 }) {
-  ensureStyle(STYLE_ID9, KEYFRAMES);
+  chunkRX6XCLFF_cjs.ensureStyle(STYLE_ID9, KEYFRAMES);
   const dotColor = color ?? COLOR[status];
   const working = status === "working";
   const dotStyle = {
@@ -1049,7 +1038,7 @@ function Table({
   className,
   ...rest
 }) {
-  ensureStyle(STYLE_ID10, RULES9);
+  chunkRX6XCLFF_cjs.ensureStyle(STYLE_ID10, RULES9);
   const vars = {
     "--nb-table-font": tokens.fontSans,
     "--nb-table-fg": tokens.fg,
@@ -1103,6 +1092,7 @@ function columnStyle(width) {
   return width === "reading" ? { maxWidth: READING_MAX, marginInline: "auto", width: "100%" } : {};
 }
 function AppFrameRoot({ contentWidth = "full", style, children, ...rest }) {
+  chunkRX6XCLFF_cjs.injectBaseReset();
   return /* @__PURE__ */ jsxRuntime.jsx(ContentWidthCtx.Provider, { value: contentWidth, children: /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -1297,7 +1287,7 @@ function SidebarLayoutRoot({
 }
 function Sidebar({ style, children, ...rest }) {
   const { collapsed, mode, side, width, open, setOpen } = useSidebar();
-  ensureStyle(STYLE_ID11, RULES10);
+  chunkRX6XCLFF_cjs.ensureStyle(STYLE_ID11, RULES10);
   if (!collapsed) {
     const border = `${tokens.borderWidth} solid ${tokens.border}`;
     return /* @__PURE__ */ jsxRuntime.jsx(