@flanksource/clicky-ui 0.3.45 → 0.3.47

package/dist/data/ai/SessionInspector.legacy.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SessionInspector.legacy.cjs","sources":["../../../src/data/ai/SessionInspector.legacy.tsx"],"sourcesContent":["import { useState, type ReactNode } from \"react\";\nimport { cn } from \"../../lib/utils\";\nimport { SessionInspectorPanel } from \"./SessionInspector.panels\";\nimport { CompactSessionInspectorToolbar } from \"./SessionInspector.compact\";\nimport { InspectorTabs } from \"./SessionInspector.tabs\";\nimport {\n  inspectorTabs,\n  type SessionInspectorTab,\n} from \"./SessionInspector.tabs.model\";\nimport { useInspectorTab } from \"./SessionInspector.tab-state\";\nimport { SessionViewer, type SessionViewerProps } from \"./SessionViewer\";\nimport {\n  getSessionMetadata,\n  type SessionInput,\n  type SessionMetadataSummary,\n} from \"./SessionViewer.model\";\n\n/** The inspector for a non-unified session (legacy entries or raw log text):\n *  only the transcript carries content, so it has no hierarchy or facets. */\nexport function LegacySessionInspector({\n  session,\n  className,\n  defaultTab = \"transcript\",\n  tab: controlledTab,\n  onTabChange,\n  transcriptProps,\n  composer,\n  layout = \"default\",\n  metadata,\n  toolbarActions,\n}: {\n  session: SessionInput;\n  className?: string;\n  defaultTab?: SessionInspectorTab;\n  tab?: SessionInspectorTab;\n  onTabChange?: (tab: SessionInspectorTab) => void;\n  transcriptProps?: Omit<SessionViewerProps, \"session\">;\n  composer?: ReactNode;\n  layout?: \"default\" | \"compact\";\n  metadata?: SessionMetadataSummary;\n  toolbarActions?: ReactNode;\n}) {\n  const compact = layout === \"compact\";\n  const [menuHost, setMenuHost] = useState<HTMLSpanElement | null>(null);\n  const [tab, setTab] = useInspectorTab(\n    defaultTab,\n    false,\n    controlledTab,\n    onTabChange,\n  );\n  const transcriptClassName = cn(\"h-full\", transcriptProps?.className);\n  const compactTabs = inspectorTabs(false);\n  const compactMetadata = metadata ?? getSessionMetadata(session);\n  const viewerProps = compact\n    ? {\n        ...transcriptProps,\n        menuContainer: menuHost,\n        showMenu: menuHost !== null && transcriptProps?.showMenu !== false,\n      }\n    : transcriptProps;\n  return (\n    <div\n      className={cn(\n        \"flex h-full min-h-0 w-full max-w-full flex-col overflow-hidden bg-background text-sm\",\n        compact\n          ? \"@container rounded-none border-0 shadow-none\"\n          : \"rounded-xl border border-border shadow-sm\",\n        className,\n      )}\n    >\n      {compact ? (\n        <CompactSessionInspectorToolbar\n          tabs={compactTabs}\n          activeTab={tab}\n          onSelect={(next) => setTab(next as SessionInspectorTab)}\n          onMenuHost={setMenuHost}\n          {...(compactMetadata ? { metadata: compactMetadata } : {})}\n          {...(toolbarActions ? { toolbarActions } : {})}\n        />\n      ) : (\n        <InspectorTabs tab={tab} tabs={compactTabs} onSelect={setTab} />\n      )}\n      <div className=\"flex min-h-0 flex-1 flex-col overflow-hidden\">\n        {compact ? (\n          <>\n            <div\n              className={cn(\n                \"min-h-0 flex-1 overflow-hidden\",\n                tab !== \"transcript\" && \"hidden\",\n              )}\n            >\n              <SessionViewer\n                session={session}\n                scrollable\n                showRowMetadata\n                {...viewerProps}\n                className={transcriptClassName}\n                showHeader={false}\n                showContextMeter={false}\n              />\n            </div>\n            {tab !== \"transcript\" ? (\n              <div className=\"min-h-0 flex-1 overflow-auto p-density-4\">\n                <SessionInspectorPanel\n                  tab={tab}\n                  detail={undefined}\n                  session={session}\n                />\n              </div>\n            ) : null}\n          </>\n        ) : (\n          <div className=\"min-h-0 flex-1 overflow-hidden\">\n            {tab === \"transcript\" ? (\n              <SessionViewer\n                session={session}\n                scrollable\n                showRowMetadata\n                {...transcriptProps}\n                className={transcriptClassName}\n              />\n            ) : (\n              <SessionInspectorPanel\n                tab={tab}\n                detail={undefined}\n                session={session}\n              />\n            )}\n          </div>\n        )}\n        {composer ? (\n          <div className=\"shrink-0 border-t border-border p-density-3\">\n            {composer}\n          </div>\n        ) : null}\n      </div>\n    </div>\n  );\n}\n"],"names":["useState","useInspectorTab","cn","inspectorTabs","getSessionMetadata","jsxs","jsx","CompactSessionInspectorToolbar","InspectorTabs","Fragment","SessionViewer","SessionInspectorPanel"],"mappings":";;;;;;;;;;;;AAmBO,SAAS,uBAAuB;AAAA,EACrC;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb,KAAK;AAAA,EACL;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AACF,GAWG;AACD,QAAM,UAAU,WAAW;AAC3B,QAAM,CAAC,UAAU,WAAW,IAAIA,MAAAA,SAAiC,IAAI;AACrE,QAAM,CAAC,KAAK,MAAM,IAAIC,0BAAAA;AAAAA,IACpB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEF,QAAM,sBAAsBC,MAAAA,GAAG,UAAU,mDAAiB,SAAS;AACnE,QAAM,cAAcC,4BAAAA,cAAc,KAAK;AACvC,QAAM,kBAAkB,YAAYC,oBAAAA,mBAAmB,OAAO;AAC9D,QAAM,cAAc,UAChB;AAAA,IACE,GAAG;AAAA,IACH,eAAe;AAAA,IACf,UAAU,aAAa,SAAQ,mDAAiB,cAAa;AAAA,EAAA,IAE/D;AACJ,SACEC,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWH,MAAAA;AAAAA,QACT;AAAA,QACA,UACI,iDACA;AAAA,QACJ;AAAA,MAAA;AAAA,MAGD,UAAA;AAAA,QAAA,UACCI,2BAAAA;AAAAA,UAACC,yBAAAA;AAAAA,UAAA;AAAA,YACC,MAAM;AAAA,YACN,WAAW;AAAA,YACX,UAAU,CAAC,SAAS,OAAO,IAA2B;AAAA,YACtD,YAAY;AAAA,YACX,GAAI,kBAAkB,EAAE,UAAU,gBAAA,IAAoB,CAAA;AAAA,YACtD,GAAI,iBAAiB,EAAE,mBAAmB,CAAA;AAAA,UAAC;AAAA,QAAA,IAG9CD,2BAAAA,IAACE,sBAAAA,eAAA,EAAc,KAAU,MAAM,aAAa,UAAU,QAAQ;AAAA,QAEhEH,2BAAAA,KAAC,OAAA,EAAI,WAAU,gDACZ,UAAA;AAAA,UAAA,UACCA,2BAAAA,KAAAI,qBAAA,EACE,UAAA;AAAA,YAAAH,2BAAAA;AAAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAWJ,MAAAA;AAAAA,kBACT;AAAA,kBACA,QAAQ,gBAAgB;AAAA,gBAAA;AAAA,gBAG1B,UAAAI,2BAAAA;AAAAA,kBAACI,cAAAA;AAAAA,kBAAA;AAAA,oBACC;AAAA,oBACA,YAAU;AAAA,oBACV,iBAAe;AAAA,oBACd,GAAG;AAAA,oBACJ,WAAW;AAAA,oBACX,YAAY;AAAA,oBACZ,kBAAkB;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACpB;AAAA,YAAA;AAAA,YAED,QAAQ,eACPJ,+BAAC,OAAA,EAAI,WAAU,4CACb,UAAAA,2BAAAA;AAAAA,cAACK,wBAAAA;AAAAA,cAAA;AAAA,gBACC;AAAA,gBACA,QAAQ;AAAA,gBACR;AAAA,cAAA;AAAA,YAAA,GAEJ,IACE;AAAA,UAAA,GACN,IAEAL,+BAAC,OAAA,EAAI,WAAU,kCACZ,kBAAQ,eACPA,2BAAAA;AAAAA,YAACI,cAAAA;AAAAA,YAAA;AAAA,cACC;AAAA,cACA,YAAU;AAAA,cACV,iBAAe;AAAA,cACd,GAAG;AAAA,cACJ,WAAW;AAAA,YAAA;AAAA,UAAA,IAGbJ,2BAAAA;AAAAA,YAACK,wBAAAA;AAAAA,YAAA;AAAA,cACC;AAAA,cACA,QAAQ;AAAA,cACR;AAAA,YAAA;AAAA,UAAA,GAGN;AAAA,UAED,WACCL,2BAAAA,IAAC,OAAA,EAAI,WAAU,+CACZ,oBACH,IACE;AAAA,QAAA,EAAA,CACN;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;;"}
+{"version":3,"file":"SessionInspector.legacy.cjs","sources":["../../../src/data/ai/SessionInspector.legacy.tsx"],"sourcesContent":["import { useState, type ReactNode } from \"react\";\nimport { cn } from \"../../lib/utils\";\nimport { SessionInspectorPanel } from \"./SessionInspector.panels\";\nimport { PinnedComposer } from \"./SessionInspector.composer-slot\";\nimport { CompactSessionInspectorToolbar } from \"./SessionInspector.compact\";\nimport { InspectorTabs } from \"./SessionInspector.tabs\";\nimport {\n  inspectorTabs,\n  type SessionInspectorTab,\n} from \"./SessionInspector.tabs.model\";\nimport { useInspectorTab } from \"./SessionInspector.tab-state\";\nimport { SessionViewer, type SessionViewerProps } from \"./SessionViewer\";\nimport {\n  getSessionMetadata,\n  type SessionInput,\n  type SessionMetadataSummary,\n} from \"./SessionViewer.model\";\n\n/** The inspector for a non-unified session (legacy entries or raw log text):\n *  only the transcript carries content, so it has no hierarchy or facets. */\nexport function LegacySessionInspector({\n  session,\n  className,\n  defaultTab = \"transcript\",\n  tab: controlledTab,\n  onTabChange,\n  transcriptProps,\n  composer,\n  layout = \"default\",\n  metadata,\n  toolbarActions,\n}: {\n  session: SessionInput;\n  className?: string;\n  defaultTab?: SessionInspectorTab;\n  tab?: SessionInspectorTab;\n  onTabChange?: (tab: SessionInspectorTab) => void;\n  transcriptProps?: Omit<SessionViewerProps, \"session\">;\n  composer?: ReactNode;\n  layout?: \"default\" | \"compact\";\n  metadata?: SessionMetadataSummary;\n  toolbarActions?: ReactNode;\n}) {\n  const compact = layout === \"compact\";\n  const [menuHost, setMenuHost] = useState<HTMLSpanElement | null>(null);\n  const [tab, setTab] = useInspectorTab(\n    defaultTab,\n    false,\n    controlledTab,\n    onTabChange,\n  );\n  const transcriptClassName = cn(\"h-full\", transcriptProps?.className);\n  const compactTabs = inspectorTabs(false);\n  const compactMetadata = metadata ?? getSessionMetadata(session);\n  const viewerProps = compact\n    ? {\n        ...transcriptProps,\n        menuContainer: menuHost,\n        showMenu: menuHost !== null && transcriptProps?.showMenu !== false,\n      }\n    : transcriptProps;\n  return (\n    <div\n      className={cn(\n        \"flex h-full min-h-0 w-full max-w-full flex-col overflow-hidden bg-background text-sm\",\n        compact\n          ? \"@container rounded-none border-0 shadow-none\"\n          : \"rounded-xl border border-border shadow-sm\",\n        className,\n      )}\n    >\n      {compact ? (\n        <CompactSessionInspectorToolbar\n          tabs={compactTabs}\n          activeTab={tab}\n          onSelect={(next) => setTab(next as SessionInspectorTab)}\n          onMenuHost={setMenuHost}\n          {...(compactMetadata ? { metadata: compactMetadata } : {})}\n          {...(toolbarActions ? { toolbarActions } : {})}\n        />\n      ) : (\n        <InspectorTabs tab={tab} tabs={compactTabs} onSelect={setTab} />\n      )}\n      <main className=\"flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden\">\n        {compact ? (\n          <>\n            <div\n              className={cn(\n                \"min-h-0 flex-1 overflow-hidden\",\n                tab !== \"transcript\" && \"hidden\",\n              )}\n            >\n              <SessionViewer\n                session={session}\n                scrollable\n                showRowMetadata\n                {...viewerProps}\n                className={transcriptClassName}\n                showHeader={false}\n                showContextMeter={false}\n              />\n            </div>\n            {tab !== \"transcript\" ? (\n              <div className=\"min-h-0 flex-1 overflow-auto p-density-4\">\n                <SessionInspectorPanel\n                  tab={tab}\n                  detail={undefined}\n                  session={session}\n                />\n              </div>\n            ) : null}\n          </>\n        ) : (\n          <div className=\"min-h-0 flex-1 overflow-hidden\">\n            {tab === \"transcript\" ? (\n              <SessionViewer\n                session={session}\n                scrollable\n                showRowMetadata\n                {...transcriptProps}\n                className={transcriptClassName}\n              />\n            ) : (\n              <SessionInspectorPanel\n                tab={tab}\n                detail={undefined}\n                session={session}\n              />\n            )}\n          </div>\n        )}\n      </main>\n      {composer ? <PinnedComposer>{composer}</PinnedComposer> : null}\n    </div>\n  );\n}\n"],"names":["useState","useInspectorTab","cn","inspectorTabs","getSessionMetadata","jsxs","jsx","CompactSessionInspectorToolbar","InspectorTabs","Fragment","SessionViewer","SessionInspectorPanel","PinnedComposer"],"mappings":";;;;;;;;;;;;;AAoBO,SAAS,uBAAuB;AAAA,EACrC;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb,KAAK;AAAA,EACL;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AACF,GAWG;AACD,QAAM,UAAU,WAAW;AAC3B,QAAM,CAAC,UAAU,WAAW,IAAIA,MAAAA,SAAiC,IAAI;AACrE,QAAM,CAAC,KAAK,MAAM,IAAIC,0BAAAA;AAAAA,IACpB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEF,QAAM,sBAAsBC,MAAAA,GAAG,UAAU,mDAAiB,SAAS;AACnE,QAAM,cAAcC,4BAAAA,cAAc,KAAK;AACvC,QAAM,kBAAkB,YAAYC,oBAAAA,mBAAmB,OAAO;AAC9D,QAAM,cAAc,UAChB;AAAA,IACE,GAAG;AAAA,IACH,eAAe;AAAA,IACf,UAAU,aAAa,SAAQ,mDAAiB,cAAa;AAAA,EAAA,IAE/D;AACJ,SACEC,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWH,MAAAA;AAAAA,QACT;AAAA,QACA,UACI,iDACA;AAAA,QACJ;AAAA,MAAA;AAAA,MAGD,UAAA;AAAA,QAAA,UACCI,2BAAAA;AAAAA,UAACC,yBAAAA;AAAAA,UAAA;AAAA,YACC,MAAM;AAAA,YACN,WAAW;AAAA,YACX,UAAU,CAAC,SAAS,OAAO,IAA2B;AAAA,YACtD,YAAY;AAAA,YACX,GAAI,kBAAkB,EAAE,UAAU,gBAAA,IAAoB,CAAA;AAAA,YACtD,GAAI,iBAAiB,EAAE,mBAAmB,CAAA;AAAA,UAAC;AAAA,QAAA,IAG9CD,2BAAAA,IAACE,sBAAAA,eAAA,EAAc,KAAU,MAAM,aAAa,UAAU,QAAQ;AAAA,QAEhEF,+BAAC,QAAA,EAAK,WAAU,wDACb,oBACCD,2BAAAA,KAAAI,qBAAA,EACE,UAAA;AAAA,UAAAH,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWJ,MAAAA;AAAAA,gBACT;AAAA,gBACA,QAAQ,gBAAgB;AAAA,cAAA;AAAA,cAG1B,UAAAI,2BAAAA;AAAAA,gBAACI,cAAAA;AAAAA,gBAAA;AAAA,kBACC;AAAA,kBACA,YAAU;AAAA,kBACV,iBAAe;AAAA,kBACd,GAAG;AAAA,kBACJ,WAAW;AAAA,kBACX,YAAY;AAAA,kBACZ,kBAAkB;AAAA,gBAAA;AAAA,cAAA;AAAA,YACpB;AAAA,UAAA;AAAA,UAED,QAAQ,eACPJ,+BAAC,OAAA,EAAI,WAAU,4CACb,UAAAA,2BAAAA;AAAAA,YAACK,wBAAAA;AAAAA,YAAA;AAAA,cACC;AAAA,cACA,QAAQ;AAAA,cACR;AAAA,YAAA;AAAA,UAAA,GAEJ,IACE;AAAA,QAAA,GACN,IAEAL,+BAAC,OAAA,EAAI,WAAU,kCACZ,kBAAQ,eACPA,2BAAAA;AAAAA,UAACI,cAAAA;AAAAA,UAAA;AAAA,YACC;AAAA,YACA,YAAU;AAAA,YACV,iBAAe;AAAA,YACd,GAAG;AAAA,YACJ,WAAW;AAAA,UAAA;AAAA,QAAA,IAGbJ,2BAAAA;AAAAA,UAACK,wBAAAA;AAAAA,UAAA;AAAA,YACC;AAAA,YACA,QAAQ;AAAA,YACR;AAAA,UAAA;AAAA,QAAA,GAGN,EAAA,CAEJ;AAAA,QACC,WAAWL,2BAAAA,IAACM,8BAAAA,gBAAA,EAAgB,UAAA,SAAA,CAAS,IAAoB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGhE;;"}

package/dist/data/ai/SessionInspector.legacy.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SessionInspector.legacy.d.ts","sourceRoot":"","sources":["../../../src/data/ai/SessionInspector.legacy.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAKjD,OAAO,EAEL,KAAK,mBAAmB,EACzB,MAAM,+BAA+B,CAAC;AAEvC,OAAO,EAAiB,KAAK,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACzE,OAAO,EAEL,KAAK,YAAY,EACjB,KAAK,sBAAsB,EAC5B,MAAM,uBAAuB,CAAC;AAE/B;6EAC6E;AAC7E,wBAAgB,sBAAsB,CAAC,EACrC,OAAO,EACP,SAAS,EACT,UAAyB,EACzB,GAAG,EAAE,aAAa,EAClB,WAAW,EACX,eAAe,EACf,QAAQ,EACR,MAAkB,EAClB,QAAQ,EACR,cAAc,GACf,EAAE;IACD,OAAO,EAAE,YAAY,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,mBAAmB,CAAC;IACjC,GAAG,CAAC,EAAE,mBAAmB,CAAC;IAC1B,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,mBAAmB,KAAK,IAAI,CAAC;IACjD,eAAe,CAAC,EAAE,IAAI,CAAC,kBAAkB,EAAE,SAAS,CAAC,CAAC;IACtD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAC/B,QAAQ,CAAC,EAAE,sBAAsB,CAAC;IAClC,cAAc,CAAC,EAAE,SAAS,CAAC;CAC5B,+BAiGA"}
+{"version":3,"file":"SessionInspector.legacy.d.ts","sourceRoot":"","sources":["../../../src/data/ai/SessionInspector.legacy.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAMjD,OAAO,EAEL,KAAK,mBAAmB,EACzB,MAAM,+BAA+B,CAAC;AAEvC,OAAO,EAAiB,KAAK,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACzE,OAAO,EAEL,KAAK,YAAY,EACjB,KAAK,sBAAsB,EAC5B,MAAM,uBAAuB,CAAC;AAE/B;6EAC6E;AAC7E,wBAAgB,sBAAsB,CAAC,EACrC,OAAO,EACP,SAAS,EACT,UAAyB,EACzB,GAAG,EAAE,aAAa,EAClB,WAAW,EACX,eAAe,EACf,QAAQ,EACR,MAAkB,EAClB,QAAQ,EACR,cAAc,GACf,EAAE;IACD,OAAO,EAAE,YAAY,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,mBAAmB,CAAC;IACjC,GAAG,CAAC,EAAE,mBAAmB,CAAC;IAC1B,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,mBAAmB,KAAK,IAAI,CAAC;IACjD,eAAe,CAAC,EAAE,IAAI,CAAC,kBAAkB,EAAE,SAAS,CAAC,CAAC;IACtD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAC/B,QAAQ,CAAC,EAAE,sBAAsB,CAAC;IAClC,cAAc,CAAC,EAAE,SAAS,CAAC;CAC5B,+BA6FA"}

package/dist/data/ai/SessionInspector.legacy.js

@@ -2,6 +2,7 @@ import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { useState } from "react";
 import { cn } from "../../lib/utils.js";
 import { SessionInspectorPanel } from "./SessionInspector.panels.js";
+import { PinnedComposer } from "./SessionInspector.composer-slot.js";
 import { CompactSessionInspectorToolbar } from "./SessionInspector.compact.js";
 import { InspectorTabs } from "./SessionInspector.tabs.js";
 import { inspectorTabs } from "./SessionInspector.tabs.model.js";
@@ -56,56 +57,54 @@ function LegacySessionInspector({
             ...toolbarActions ? { toolbarActions } : {}
           }
         ) : /* @__PURE__ */ jsx(InspectorTabs, { tab, tabs: compactTabs, onSelect: setTab }),
-        /* @__PURE__ */ jsxs("div", { className: "flex min-h-0 flex-1 flex-col overflow-hidden", children: [
-          compact ? /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: cn(
-                  "min-h-0 flex-1 overflow-hidden",
-                  tab !== "transcript" && "hidden"
-                ),
-                children: /* @__PURE__ */ jsx(
-                  SessionViewer,
-                  {
-                    session,
-                    scrollable: true,
-                    showRowMetadata: true,
-                    ...viewerProps,
-                    className: transcriptClassName,
-                    showHeader: false,
-                    showContextMeter: false
-                  }
-                )
-              }
-            ),
-            tab !== "transcript" ? /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 overflow-auto p-density-4", children: /* @__PURE__ */ jsx(
-              SessionInspectorPanel,
-              {
-                tab,
-                detail: void 0,
-                session
-              }
-            ) }) : null
-          ] }) : /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 overflow-hidden", children: tab === "transcript" ? /* @__PURE__ */ jsx(
-            SessionViewer,
+        /* @__PURE__ */ jsx("main", { className: "flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden", children: compact ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            "div",
             {
-              session,
-              scrollable: true,
-              showRowMetadata: true,
-              ...transcriptProps,
-              className: transcriptClassName
+              className: cn(
+                "min-h-0 flex-1 overflow-hidden",
+                tab !== "transcript" && "hidden"
+              ),
+              children: /* @__PURE__ */ jsx(
+                SessionViewer,
+                {
+                  session,
+                  scrollable: true,
+                  showRowMetadata: true,
+                  ...viewerProps,
+                  className: transcriptClassName,
+                  showHeader: false,
+                  showContextMeter: false
+                }
+              )
             }
-          ) : /* @__PURE__ */ jsx(
+          ),
+          tab !== "transcript" ? /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 overflow-auto p-density-4", children: /* @__PURE__ */ jsx(
             SessionInspectorPanel,
             {
               tab,
               detail: void 0,
               session
             }
-          ) }),
-          composer ? /* @__PURE__ */ jsx("div", { className: "shrink-0 border-t border-border p-density-3", children: composer }) : null
-        ] })
+          ) }) : null
+        ] }) : /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 overflow-hidden", children: tab === "transcript" ? /* @__PURE__ */ jsx(
+          SessionViewer,
+          {
+            session,
+            scrollable: true,
+            showRowMetadata: true,
+            ...transcriptProps,
+            className: transcriptClassName
+          }
+        ) : /* @__PURE__ */ jsx(
+          SessionInspectorPanel,
+          {
+            tab,
+            detail: void 0,
+            session
+          }
+        ) }) }),
+        composer ? /* @__PURE__ */ jsx(PinnedComposer, { children: composer }) : null
       ]
     }
   );

package/dist/data/ai/SessionInspector.legacy.js.map

@@ -1 +1 @@
-{"version":3,"file":"SessionInspector.legacy.js","sources":["../../../src/data/ai/SessionInspector.legacy.tsx"],"sourcesContent":["import { useState, type ReactNode } from \"react\";\nimport { cn } from \"../../lib/utils\";\nimport { SessionInspectorPanel } from \"./SessionInspector.panels\";\nimport { CompactSessionInspectorToolbar } from \"./SessionInspector.compact\";\nimport { InspectorTabs } from \"./SessionInspector.tabs\";\nimport {\n  inspectorTabs,\n  type SessionInspectorTab,\n} from \"./SessionInspector.tabs.model\";\nimport { useInspectorTab } from \"./SessionInspector.tab-state\";\nimport { SessionViewer, type SessionViewerProps } from \"./SessionViewer\";\nimport {\n  getSessionMetadata,\n  type SessionInput,\n  type SessionMetadataSummary,\n} from \"./SessionViewer.model\";\n\n/** The inspector for a non-unified session (legacy entries or raw log text):\n *  only the transcript carries content, so it has no hierarchy or facets. */\nexport function LegacySessionInspector({\n  session,\n  className,\n  defaultTab = \"transcript\",\n  tab: controlledTab,\n  onTabChange,\n  transcriptProps,\n  composer,\n  layout = \"default\",\n  metadata,\n  toolbarActions,\n}: {\n  session: SessionInput;\n  className?: string;\n  defaultTab?: SessionInspectorTab;\n  tab?: SessionInspectorTab;\n  onTabChange?: (tab: SessionInspectorTab) => void;\n  transcriptProps?: Omit<SessionViewerProps, \"session\">;\n  composer?: ReactNode;\n  layout?: \"default\" | \"compact\";\n  metadata?: SessionMetadataSummary;\n  toolbarActions?: ReactNode;\n}) {\n  const compact = layout === \"compact\";\n  const [menuHost, setMenuHost] = useState<HTMLSpanElement | null>(null);\n  const [tab, setTab] = useInspectorTab(\n    defaultTab,\n    false,\n    controlledTab,\n    onTabChange,\n  );\n  const transcriptClassName = cn(\"h-full\", transcriptProps?.className);\n  const compactTabs = inspectorTabs(false);\n  const compactMetadata = metadata ?? getSessionMetadata(session);\n  const viewerProps = compact\n    ? {\n        ...transcriptProps,\n        menuContainer: menuHost,\n        showMenu: menuHost !== null && transcriptProps?.showMenu !== false,\n      }\n    : transcriptProps;\n  return (\n    <div\n      className={cn(\n        \"flex h-full min-h-0 w-full max-w-full flex-col overflow-hidden bg-background text-sm\",\n        compact\n          ? \"@container rounded-none border-0 shadow-none\"\n          : \"rounded-xl border border-border shadow-sm\",\n        className,\n      )}\n    >\n      {compact ? (\n        <CompactSessionInspectorToolbar\n          tabs={compactTabs}\n          activeTab={tab}\n          onSelect={(next) => setTab(next as SessionInspectorTab)}\n          onMenuHost={setMenuHost}\n          {...(compactMetadata ? { metadata: compactMetadata } : {})}\n          {...(toolbarActions ? { toolbarActions } : {})}\n        />\n      ) : (\n        <InspectorTabs tab={tab} tabs={compactTabs} onSelect={setTab} />\n      )}\n      <div className=\"flex min-h-0 flex-1 flex-col overflow-hidden\">\n        {compact ? (\n          <>\n            <div\n              className={cn(\n                \"min-h-0 flex-1 overflow-hidden\",\n                tab !== \"transcript\" && \"hidden\",\n              )}\n            >\n              <SessionViewer\n                session={session}\n                scrollable\n                showRowMetadata\n                {...viewerProps}\n                className={transcriptClassName}\n                showHeader={false}\n                showContextMeter={false}\n              />\n            </div>\n            {tab !== \"transcript\" ? (\n              <div className=\"min-h-0 flex-1 overflow-auto p-density-4\">\n                <SessionInspectorPanel\n                  tab={tab}\n                  detail={undefined}\n                  session={session}\n                />\n              </div>\n            ) : null}\n          </>\n        ) : (\n          <div className=\"min-h-0 flex-1 overflow-hidden\">\n            {tab === \"transcript\" ? (\n              <SessionViewer\n                session={session}\n                scrollable\n                showRowMetadata\n                {...transcriptProps}\n                className={transcriptClassName}\n              />\n            ) : (\n              <SessionInspectorPanel\n                tab={tab}\n                detail={undefined}\n                session={session}\n              />\n            )}\n          </div>\n        )}\n        {composer ? (\n          <div className=\"shrink-0 border-t border-border p-density-3\">\n            {composer}\n          </div>\n        ) : null}\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;AAmBO,SAAS,uBAAuB;AAAA,EACrC;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb,KAAK;AAAA,EACL;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AACF,GAWG;AACD,QAAM,UAAU,WAAW;AAC3B,QAAM,CAAC,UAAU,WAAW,IAAI,SAAiC,IAAI;AACrE,QAAM,CAAC,KAAK,MAAM,IAAI;AAAA,IACpB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEF,QAAM,sBAAsB,GAAG,UAAU,mDAAiB,SAAS;AACnE,QAAM,cAAc,cAAc,KAAK;AACvC,QAAM,kBAAkB,YAAY,mBAAmB,OAAO;AAC9D,QAAM,cAAc,UAChB;AAAA,IACE,GAAG;AAAA,IACH,eAAe;AAAA,IACf,UAAU,aAAa,SAAQ,mDAAiB,cAAa;AAAA,EAAA,IAE/D;AACJ,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,UACI,iDACA;AAAA,QACJ;AAAA,MAAA;AAAA,MAGD,UAAA;AAAA,QAAA,UACC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAM;AAAA,YACN,WAAW;AAAA,YACX,UAAU,CAAC,SAAS,OAAO,IAA2B;AAAA,YACtD,YAAY;AAAA,YACX,GAAI,kBAAkB,EAAE,UAAU,gBAAA,IAAoB,CAAA;AAAA,YACtD,GAAI,iBAAiB,EAAE,mBAAmB,CAAA;AAAA,UAAC;AAAA,QAAA,IAG9C,oBAAC,eAAA,EAAc,KAAU,MAAM,aAAa,UAAU,QAAQ;AAAA,QAEhE,qBAAC,OAAA,EAAI,WAAU,gDACZ,UAAA;AAAA,UAAA,UACC,qBAAA,UAAA,EACE,UAAA;AAAA,YAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAW;AAAA,kBACT;AAAA,kBACA,QAAQ,gBAAgB;AAAA,gBAAA;AAAA,gBAG1B,UAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC;AAAA,oBACA,YAAU;AAAA,oBACV,iBAAe;AAAA,oBACd,GAAG;AAAA,oBACJ,WAAW;AAAA,oBACX,YAAY;AAAA,oBACZ,kBAAkB;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACpB;AAAA,YAAA;AAAA,YAED,QAAQ,eACP,oBAAC,OAAA,EAAI,WAAU,4CACb,UAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC;AAAA,gBACA,QAAQ;AAAA,gBACR;AAAA,cAAA;AAAA,YAAA,GAEJ,IACE;AAAA,UAAA,GACN,IAEA,oBAAC,OAAA,EAAI,WAAU,kCACZ,kBAAQ,eACP;AAAA,YAAC;AAAA,YAAA;AAAA,cACC;AAAA,cACA,YAAU;AAAA,cACV,iBAAe;AAAA,cACd,GAAG;AAAA,cACJ,WAAW;AAAA,YAAA;AAAA,UAAA,IAGb;AAAA,YAAC;AAAA,YAAA;AAAA,cACC;AAAA,cACA,QAAQ;AAAA,cACR;AAAA,YAAA;AAAA,UAAA,GAGN;AAAA,UAED,WACC,oBAAC,OAAA,EAAI,WAAU,+CACZ,oBACH,IACE;AAAA,QAAA,EAAA,CACN;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"SessionInspector.legacy.js","sources":["../../../src/data/ai/SessionInspector.legacy.tsx"],"sourcesContent":["import { useState, type ReactNode } from \"react\";\nimport { cn } from \"../../lib/utils\";\nimport { SessionInspectorPanel } from \"./SessionInspector.panels\";\nimport { PinnedComposer } from \"./SessionInspector.composer-slot\";\nimport { CompactSessionInspectorToolbar } from \"./SessionInspector.compact\";\nimport { InspectorTabs } from \"./SessionInspector.tabs\";\nimport {\n  inspectorTabs,\n  type SessionInspectorTab,\n} from \"./SessionInspector.tabs.model\";\nimport { useInspectorTab } from \"./SessionInspector.tab-state\";\nimport { SessionViewer, type SessionViewerProps } from \"./SessionViewer\";\nimport {\n  getSessionMetadata,\n  type SessionInput,\n  type SessionMetadataSummary,\n} from \"./SessionViewer.model\";\n\n/** The inspector for a non-unified session (legacy entries or raw log text):\n *  only the transcript carries content, so it has no hierarchy or facets. */\nexport function LegacySessionInspector({\n  session,\n  className,\n  defaultTab = \"transcript\",\n  tab: controlledTab,\n  onTabChange,\n  transcriptProps,\n  composer,\n  layout = \"default\",\n  metadata,\n  toolbarActions,\n}: {\n  session: SessionInput;\n  className?: string;\n  defaultTab?: SessionInspectorTab;\n  tab?: SessionInspectorTab;\n  onTabChange?: (tab: SessionInspectorTab) => void;\n  transcriptProps?: Omit<SessionViewerProps, \"session\">;\n  composer?: ReactNode;\n  layout?: \"default\" | \"compact\";\n  metadata?: SessionMetadataSummary;\n  toolbarActions?: ReactNode;\n}) {\n  const compact = layout === \"compact\";\n  const [menuHost, setMenuHost] = useState<HTMLSpanElement | null>(null);\n  const [tab, setTab] = useInspectorTab(\n    defaultTab,\n    false,\n    controlledTab,\n    onTabChange,\n  );\n  const transcriptClassName = cn(\"h-full\", transcriptProps?.className);\n  const compactTabs = inspectorTabs(false);\n  const compactMetadata = metadata ?? getSessionMetadata(session);\n  const viewerProps = compact\n    ? {\n        ...transcriptProps,\n        menuContainer: menuHost,\n        showMenu: menuHost !== null && transcriptProps?.showMenu !== false,\n      }\n    : transcriptProps;\n  return (\n    <div\n      className={cn(\n        \"flex h-full min-h-0 w-full max-w-full flex-col overflow-hidden bg-background text-sm\",\n        compact\n          ? \"@container rounded-none border-0 shadow-none\"\n          : \"rounded-xl border border-border shadow-sm\",\n        className,\n      )}\n    >\n      {compact ? (\n        <CompactSessionInspectorToolbar\n          tabs={compactTabs}\n          activeTab={tab}\n          onSelect={(next) => setTab(next as SessionInspectorTab)}\n          onMenuHost={setMenuHost}\n          {...(compactMetadata ? { metadata: compactMetadata } : {})}\n          {...(toolbarActions ? { toolbarActions } : {})}\n        />\n      ) : (\n        <InspectorTabs tab={tab} tabs={compactTabs} onSelect={setTab} />\n      )}\n      <main className=\"flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden\">\n        {compact ? (\n          <>\n            <div\n              className={cn(\n                \"min-h-0 flex-1 overflow-hidden\",\n                tab !== \"transcript\" && \"hidden\",\n              )}\n            >\n              <SessionViewer\n                session={session}\n                scrollable\n                showRowMetadata\n                {...viewerProps}\n                className={transcriptClassName}\n                showHeader={false}\n                showContextMeter={false}\n              />\n            </div>\n            {tab !== \"transcript\" ? (\n              <div className=\"min-h-0 flex-1 overflow-auto p-density-4\">\n                <SessionInspectorPanel\n                  tab={tab}\n                  detail={undefined}\n                  session={session}\n                />\n              </div>\n            ) : null}\n          </>\n        ) : (\n          <div className=\"min-h-0 flex-1 overflow-hidden\">\n            {tab === \"transcript\" ? (\n              <SessionViewer\n                session={session}\n                scrollable\n                showRowMetadata\n                {...transcriptProps}\n                className={transcriptClassName}\n              />\n            ) : (\n              <SessionInspectorPanel\n                tab={tab}\n                detail={undefined}\n                session={session}\n              />\n            )}\n          </div>\n        )}\n      </main>\n      {composer ? <PinnedComposer>{composer}</PinnedComposer> : null}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;AAoBO,SAAS,uBAAuB;AAAA,EACrC;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb,KAAK;AAAA,EACL;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AACF,GAWG;AACD,QAAM,UAAU,WAAW;AAC3B,QAAM,CAAC,UAAU,WAAW,IAAI,SAAiC,IAAI;AACrE,QAAM,CAAC,KAAK,MAAM,IAAI;AAAA,IACpB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEF,QAAM,sBAAsB,GAAG,UAAU,mDAAiB,SAAS;AACnE,QAAM,cAAc,cAAc,KAAK;AACvC,QAAM,kBAAkB,YAAY,mBAAmB,OAAO;AAC9D,QAAM,cAAc,UAChB;AAAA,IACE,GAAG;AAAA,IACH,eAAe;AAAA,IACf,UAAU,aAAa,SAAQ,mDAAiB,cAAa;AAAA,EAAA,IAE/D;AACJ,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,UACI,iDACA;AAAA,QACJ;AAAA,MAAA;AAAA,MAGD,UAAA;AAAA,QAAA,UACC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAM;AAAA,YACN,WAAW;AAAA,YACX,UAAU,CAAC,SAAS,OAAO,IAA2B;AAAA,YACtD,YAAY;AAAA,YACX,GAAI,kBAAkB,EAAE,UAAU,gBAAA,IAAoB,CAAA;AAAA,YACtD,GAAI,iBAAiB,EAAE,mBAAmB,CAAA;AAAA,UAAC;AAAA,QAAA,IAG9C,oBAAC,eAAA,EAAc,KAAU,MAAM,aAAa,UAAU,QAAQ;AAAA,QAEhE,oBAAC,QAAA,EAAK,WAAU,wDACb,oBACC,qBAAA,UAAA,EACE,UAAA;AAAA,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW;AAAA,gBACT;AAAA,gBACA,QAAQ,gBAAgB;AAAA,cAAA;AAAA,cAG1B,UAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC;AAAA,kBACA,YAAU;AAAA,kBACV,iBAAe;AAAA,kBACd,GAAG;AAAA,kBACJ,WAAW;AAAA,kBACX,YAAY;AAAA,kBACZ,kBAAkB;AAAA,gBAAA;AAAA,cAAA;AAAA,YACpB;AAAA,UAAA;AAAA,UAED,QAAQ,eACP,oBAAC,OAAA,EAAI,WAAU,4CACb,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC;AAAA,cACA,QAAQ;AAAA,cACR;AAAA,YAAA;AAAA,UAAA,GAEJ,IACE;AAAA,QAAA,GACN,IAEA,oBAAC,OAAA,EAAI,WAAU,kCACZ,kBAAQ,eACP;AAAA,UAAC;AAAA,UAAA;AAAA,YACC;AAAA,YACA,YAAU;AAAA,YACV,iBAAe;AAAA,YACd,GAAG;AAAA,YACJ,WAAW;AAAA,UAAA;AAAA,QAAA,IAGb;AAAA,UAAC;AAAA,UAAA;AAAA,YACC;AAAA,YACA,QAAQ;AAAA,YACR;AAAA,UAAA;AAAA,QAAA,GAGN,EAAA,CAEJ;AAAA,QACC,WAAW,oBAAC,gBAAA,EAAgB,UAAA,SAAA,CAAS,IAAoB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGhE;"}

package/dist/data/ai/SessionInspector.remote-view.cjs

@@ -2,10 +2,12 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const utils = require("../../lib/utils.cjs");
+const SessionInspector_composerSlot = require("./SessionInspector.composer-slot.cjs");
 function RemoteSessionStatus({
   loading,
   error,
   className,
+  composer,
   children
 }) {
   const alert = error ? /* @__PURE__ */ jsxRuntime.jsx(
@@ -22,21 +24,24 @@ function RemoteSessionStatus({
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-h-0 flex-1", children })
     ] });
   }
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
       "aria-busy": loading,
       className: utils.cn(
-        "flex h-full min-h-0 w-full flex-col gap-density-3 rounded-xl border border-border bg-background p-density-4 text-sm shadow-sm",
+        "flex h-full min-h-0 w-full flex-col overflow-hidden rounded-xl border border-border bg-background text-sm shadow-sm",
         className
       ),
-      children: alert ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground", children: "Loading session…" }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-control-h w-1/3 animate-pulse rounded-md bg-muted" }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-4 w-full animate-pulse rounded bg-muted" }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-4 w-5/6 animate-pulse rounded bg-muted" }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-4 w-2/3 animate-pulse rounded bg-muted" })
-      ] })
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex min-h-0 flex-1 flex-col gap-density-3 overflow-y-auto p-density-4", children: alert ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground", children: "Loading session…" }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-control-h w-1/3 animate-pulse rounded-md bg-muted" }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-4 w-full animate-pulse rounded bg-muted" }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-4 w-5/6 animate-pulse rounded bg-muted" }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-4 w-2/3 animate-pulse rounded bg-muted" })
+        ] }) }),
+        composer ? /* @__PURE__ */ jsxRuntime.jsx(SessionInspector_composerSlot.PinnedComposer, { children: composer }) : null
+      ]
     }
   );
 }

package/dist/data/ai/SessionInspector.remote-view.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SessionInspector.remote-view.cjs","sources":["../../../src/data/ai/SessionInspector.remote-view.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { cn } from \"../../lib/utils\";\n\n/** Loading and error chrome for a SessionInspector fed from a URL. With\n *  `children` (a session already loaded) the error sits above it; without,\n *  it replaces the inspector: a skeleton while loading, the alert on failure. */\nexport function RemoteSessionStatus({\n  loading,\n  error,\n  className,\n  children,\n}: {\n  loading: boolean;\n  error?: string;\n  className?: string;\n  children?: ReactNode;\n}) {\n  const alert = error ? (\n    <div\n      role=\"alert\"\n      className=\"shrink-0 whitespace-pre-wrap break-words rounded-md border border-destructive/40 bg-destructive/5 px-density-3 py-density-2 text-xs text-destructive\"\n    >\n      {error}\n    </div>\n  ) : null;\n  if (children) {\n    return (\n      <div className={cn(\"flex h-full min-h-0 w-full flex-col gap-density-2\", className)}>\n        {alert}\n        <div className=\"min-h-0 flex-1\">{children}</div>\n      </div>\n    );\n  }\n  return (\n    <div\n      aria-busy={loading}\n      className={cn(\n        \"flex h-full min-h-0 w-full flex-col gap-density-3 rounded-xl border border-border bg-background p-density-4 text-sm shadow-sm\",\n        className,\n      )}\n    >\n      {alert ?? (\n        <>\n          <p className=\"text-xs text-muted-foreground\">Loading session…</p>\n          <div className=\"h-control-h w-1/3 animate-pulse rounded-md bg-muted\" />\n          <div className=\"h-4 w-full animate-pulse rounded bg-muted\" />\n          <div className=\"h-4 w-5/6 animate-pulse rounded bg-muted\" />\n          <div className=\"h-4 w-2/3 animate-pulse rounded bg-muted\" />\n        </>\n      )}\n    </div>\n  );\n}\n"],"names":["jsx","cn","jsxs","Fragment"],"mappings":";;;;AAMO,SAAS,oBAAoB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKG;AACD,QAAM,QAAQ,QACZA,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAU;AAAA,MAET,UAAA;AAAA,IAAA;AAAA,EAAA,IAED;AACJ,MAAI,UAAU;AACZ,2CACG,OAAA,EAAI,WAAWC,MAAAA,GAAG,qDAAqD,SAAS,GAC9E,UAAA;AAAA,MAAA;AAAA,MACDD,2BAAAA,IAAC,OAAA,EAAI,WAAU,kBAAkB,SAAA,CAAS;AAAA,IAAA,GAC5C;AAAA,EAEJ;AACA,SACEA,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAW;AAAA,MACX,WAAWC,MAAAA;AAAAA,QACT;AAAA,QACA;AAAA,MAAA;AAAA,MAGD,mBACCC,2BAAAA,KAAAC,WAAAA,UAAA,EACE,UAAA;AAAA,QAAAH,2BAAAA,IAAC,KAAA,EAAE,WAAU,iCAAgC,UAAA,oBAAgB;AAAA,QAC7DA,2BAAAA,IAAC,OAAA,EAAI,WAAU,sDAAA,CAAsD;AAAA,QACrEA,2BAAAA,IAAC,OAAA,EAAI,WAAU,4CAAA,CAA4C;AAAA,QAC3DA,2BAAAA,IAAC,OAAA,EAAI,WAAU,2CAAA,CAA2C;AAAA,QAC1DA,2BAAAA,IAAC,OAAA,EAAI,WAAU,2CAAA,CAA2C;AAAA,MAAA,EAAA,CAC5D;AAAA,IAAA;AAAA,EAAA;AAIR;;"}
+{"version":3,"file":"SessionInspector.remote-view.cjs","sources":["../../../src/data/ai/SessionInspector.remote-view.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { cn } from \"../../lib/utils\";\nimport { PinnedComposer } from \"./SessionInspector.composer-slot\";\n\n/** Loading and error chrome for a SessionInspector fed from a URL. With\n *  `children` (a session already loaded) the error sits above it; without,\n *  it replaces the inspector: a skeleton while loading, the alert on failure.\n *  The `composer` slot is rendered pinned below the status even before there is\n *  a session, so the input never disappears while loading or after a failure\n *  (with `children` the loaded inspector pins the composer itself). */\nexport function RemoteSessionStatus({\n  loading,\n  error,\n  className,\n  composer,\n  children,\n}: {\n  loading: boolean;\n  error?: string;\n  className?: string;\n  composer?: ReactNode;\n  children?: ReactNode;\n}) {\n  const alert = error ? (\n    <div\n      role=\"alert\"\n      className=\"shrink-0 whitespace-pre-wrap break-words rounded-md border border-destructive/40 bg-destructive/5 px-density-3 py-density-2 text-xs text-destructive\"\n    >\n      {error}\n    </div>\n  ) : null;\n  if (children) {\n    return (\n      <div className={cn(\"flex h-full min-h-0 w-full flex-col gap-density-2\", className)}>\n        {alert}\n        <div className=\"min-h-0 flex-1\">{children}</div>\n      </div>\n    );\n  }\n  return (\n    <div\n      aria-busy={loading}\n      className={cn(\n        \"flex h-full min-h-0 w-full flex-col overflow-hidden rounded-xl border border-border bg-background text-sm shadow-sm\",\n        className,\n      )}\n    >\n      <div className=\"flex min-h-0 flex-1 flex-col gap-density-3 overflow-y-auto p-density-4\">\n        {alert ?? (\n          <>\n            <p className=\"text-xs text-muted-foreground\">Loading session…</p>\n            <div className=\"h-control-h w-1/3 animate-pulse rounded-md bg-muted\" />\n            <div className=\"h-4 w-full animate-pulse rounded bg-muted\" />\n            <div className=\"h-4 w-5/6 animate-pulse rounded bg-muted\" />\n            <div className=\"h-4 w-2/3 animate-pulse rounded bg-muted\" />\n          </>\n        )}\n      </div>\n      {composer ? <PinnedComposer>{composer}</PinnedComposer> : null}\n    </div>\n  );\n}\n"],"names":["jsx","cn","jsxs","Fragment","PinnedComposer"],"mappings":";;;;;AAUO,SAAS,oBAAoB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAMG;AACD,QAAM,QAAQ,QACZA,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAU;AAAA,MAET,UAAA;AAAA,IAAA;AAAA,EAAA,IAED;AACJ,MAAI,UAAU;AACZ,2CACG,OAAA,EAAI,WAAWC,MAAAA,GAAG,qDAAqD,SAAS,GAC9E,UAAA;AAAA,MAAA;AAAA,MACDD,2BAAAA,IAAC,OAAA,EAAI,WAAU,kBAAkB,SAAA,CAAS;AAAA,IAAA,GAC5C;AAAA,EAEJ;AACA,SACEE,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAW;AAAA,MACX,WAAWD,MAAAA;AAAAA,QACT;AAAA,QACA;AAAA,MAAA;AAAA,MAGF,UAAA;AAAA,QAAAD,+BAAC,OAAA,EAAI,WAAU,0EACZ,UAAA,SACCE,2BAAAA,KAAAC,qBAAA,EACE,UAAA;AAAA,UAAAH,2BAAAA,IAAC,KAAA,EAAE,WAAU,iCAAgC,UAAA,oBAAgB;AAAA,UAC7DA,2BAAAA,IAAC,OAAA,EAAI,WAAU,sDAAA,CAAsD;AAAA,UACrEA,2BAAAA,IAAC,OAAA,EAAI,WAAU,4CAAA,CAA4C;AAAA,UAC3DA,2BAAAA,IAAC,OAAA,EAAI,WAAU,2CAAA,CAA2C;AAAA,UAC1DA,2BAAAA,IAAC,OAAA,EAAI,WAAU,2CAAA,CAA2C;AAAA,QAAA,EAAA,CAC5D,EAAA,CAEJ;AAAA,QACC,WAAWA,2BAAAA,IAACI,8BAAAA,gBAAA,EAAgB,UAAA,SAAA,CAAS,IAAoB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGhE;;"}

package/dist/data/ai/SessionInspector.remote-view.d.ts

@@ -1,11 +1,15 @@
 import { ReactNode } from 'react';
 /** Loading and error chrome for a SessionInspector fed from a URL. With
  *  `children` (a session already loaded) the error sits above it; without,
- *  it replaces the inspector: a skeleton while loading, the alert on failure. */
-export declare function RemoteSessionStatus({ loading, error, className, children, }: {
+ *  it replaces the inspector: a skeleton while loading, the alert on failure.
+ *  The `composer` slot is rendered pinned below the status even before there is
+ *  a session, so the input never disappears while loading or after a failure
+ *  (with `children` the loaded inspector pins the composer itself). */
+export declare function RemoteSessionStatus({ loading, error, className, composer, children, }: {
     loading: boolean;
     error?: string;
     className?: string;
+    composer?: ReactNode;
     children?: ReactNode;
 }): import("react").JSX.Element;
 //# sourceMappingURL=SessionInspector.remote-view.d.ts.map

package/dist/data/ai/SessionInspector.remote-view.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SessionInspector.remote-view.d.ts","sourceRoot":"","sources":["../../../src/data/ai/SessionInspector.remote-view.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC;;iFAEiF;AACjF,wBAAgB,mBAAmB,CAAC,EAClC,OAAO,EACP,KAAK,EACL,SAAS,EACT,QAAQ,GACT,EAAE;IACD,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,+BAoCA"}
+{"version":3,"file":"SessionInspector.remote-view.d.ts","sourceRoot":"","sources":["../../../src/data/ai/SessionInspector.remote-view.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC;;;;;uEAKuE;AACvE,wBAAgB,mBAAmB,CAAC,EAClC,OAAO,EACP,KAAK,EACL,SAAS,EACT,QAAQ,EACR,QAAQ,GACT,EAAE;IACD,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,+BAuCA"}

package/dist/data/ai/SessionInspector.remote-view.js

@@ -1,9 +1,11 @@
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { cn } from "../../lib/utils.js";
+import { PinnedComposer } from "./SessionInspector.composer-slot.js";
 function RemoteSessionStatus({
   loading,
   error,
   className,
+  composer,
   children
 }) {
   const alert = error ? /* @__PURE__ */ jsx(
@@ -20,21 +22,24 @@ function RemoteSessionStatus({
       /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1", children })
     ] });
   }
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsxs(
     "div",
     {
       "aria-busy": loading,
       className: cn(
-        "flex h-full min-h-0 w-full flex-col gap-density-3 rounded-xl border border-border bg-background p-density-4 text-sm shadow-sm",
+        "flex h-full min-h-0 w-full flex-col overflow-hidden rounded-xl border border-border bg-background text-sm shadow-sm",
         className
       ),
-      children: alert ?? /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Loading session…" }),
-        /* @__PURE__ */ jsx("div", { className: "h-control-h w-1/3 animate-pulse rounded-md bg-muted" }),
-        /* @__PURE__ */ jsx("div", { className: "h-4 w-full animate-pulse rounded bg-muted" }),
-        /* @__PURE__ */ jsx("div", { className: "h-4 w-5/6 animate-pulse rounded bg-muted" }),
-        /* @__PURE__ */ jsx("div", { className: "h-4 w-2/3 animate-pulse rounded bg-muted" })
-      ] })
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "flex min-h-0 flex-1 flex-col gap-density-3 overflow-y-auto p-density-4", children: alert ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Loading session…" }),
+          /* @__PURE__ */ jsx("div", { className: "h-control-h w-1/3 animate-pulse rounded-md bg-muted" }),
+          /* @__PURE__ */ jsx("div", { className: "h-4 w-full animate-pulse rounded bg-muted" }),
+          /* @__PURE__ */ jsx("div", { className: "h-4 w-5/6 animate-pulse rounded bg-muted" }),
+          /* @__PURE__ */ jsx("div", { className: "h-4 w-2/3 animate-pulse rounded bg-muted" })
+        ] }) }),
+        composer ? /* @__PURE__ */ jsx(PinnedComposer, { children: composer }) : null
+      ]
     }
   );
 }

package/dist/data/ai/SessionInspector.remote-view.js.map

@@ -1 +1 @@
-{"version":3,"file":"SessionInspector.remote-view.js","sources":["../../../src/data/ai/SessionInspector.remote-view.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { cn } from \"../../lib/utils\";\n\n/** Loading and error chrome for a SessionInspector fed from a URL. With\n *  `children` (a session already loaded) the error sits above it; without,\n *  it replaces the inspector: a skeleton while loading, the alert on failure. */\nexport function RemoteSessionStatus({\n  loading,\n  error,\n  className,\n  children,\n}: {\n  loading: boolean;\n  error?: string;\n  className?: string;\n  children?: ReactNode;\n}) {\n  const alert = error ? (\n    <div\n      role=\"alert\"\n      className=\"shrink-0 whitespace-pre-wrap break-words rounded-md border border-destructive/40 bg-destructive/5 px-density-3 py-density-2 text-xs text-destructive\"\n    >\n      {error}\n    </div>\n  ) : null;\n  if (children) {\n    return (\n      <div className={cn(\"flex h-full min-h-0 w-full flex-col gap-density-2\", className)}>\n        {alert}\n        <div className=\"min-h-0 flex-1\">{children}</div>\n      </div>\n    );\n  }\n  return (\n    <div\n      aria-busy={loading}\n      className={cn(\n        \"flex h-full min-h-0 w-full flex-col gap-density-3 rounded-xl border border-border bg-background p-density-4 text-sm shadow-sm\",\n        className,\n      )}\n    >\n      {alert ?? (\n        <>\n          <p className=\"text-xs text-muted-foreground\">Loading session…</p>\n          <div className=\"h-control-h w-1/3 animate-pulse rounded-md bg-muted\" />\n          <div className=\"h-4 w-full animate-pulse rounded bg-muted\" />\n          <div className=\"h-4 w-5/6 animate-pulse rounded bg-muted\" />\n          <div className=\"h-4 w-2/3 animate-pulse rounded bg-muted\" />\n        </>\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;AAMO,SAAS,oBAAoB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKG;AACD,QAAM,QAAQ,QACZ;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAU;AAAA,MAET,UAAA;AAAA,IAAA;AAAA,EAAA,IAED;AACJ,MAAI,UAAU;AACZ,gCACG,OAAA,EAAI,WAAW,GAAG,qDAAqD,SAAS,GAC9E,UAAA;AAAA,MAAA;AAAA,MACD,oBAAC,OAAA,EAAI,WAAU,kBAAkB,SAAA,CAAS;AAAA,IAAA,GAC5C;AAAA,EAEJ;AACA,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAW;AAAA,MACX,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MAAA;AAAA,MAGD,mBACC,qBAAA,UAAA,EACE,UAAA;AAAA,QAAA,oBAAC,KAAA,EAAE,WAAU,iCAAgC,UAAA,oBAAgB;AAAA,QAC7D,oBAAC,OAAA,EAAI,WAAU,sDAAA,CAAsD;AAAA,QACrE,oBAAC,OAAA,EAAI,WAAU,4CAAA,CAA4C;AAAA,QAC3D,oBAAC,OAAA,EAAI,WAAU,2CAAA,CAA2C;AAAA,QAC1D,oBAAC,OAAA,EAAI,WAAU,2CAAA,CAA2C;AAAA,MAAA,EAAA,CAC5D;AAAA,IAAA;AAAA,EAAA;AAIR;"}
+{"version":3,"file":"SessionInspector.remote-view.js","sources":["../../../src/data/ai/SessionInspector.remote-view.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { cn } from \"../../lib/utils\";\nimport { PinnedComposer } from \"./SessionInspector.composer-slot\";\n\n/** Loading and error chrome for a SessionInspector fed from a URL. With\n *  `children` (a session already loaded) the error sits above it; without,\n *  it replaces the inspector: a skeleton while loading, the alert on failure.\n *  The `composer` slot is rendered pinned below the status even before there is\n *  a session, so the input never disappears while loading or after a failure\n *  (with `children` the loaded inspector pins the composer itself). */\nexport function RemoteSessionStatus({\n  loading,\n  error,\n  className,\n  composer,\n  children,\n}: {\n  loading: boolean;\n  error?: string;\n  className?: string;\n  composer?: ReactNode;\n  children?: ReactNode;\n}) {\n  const alert = error ? (\n    <div\n      role=\"alert\"\n      className=\"shrink-0 whitespace-pre-wrap break-words rounded-md border border-destructive/40 bg-destructive/5 px-density-3 py-density-2 text-xs text-destructive\"\n    >\n      {error}\n    </div>\n  ) : null;\n  if (children) {\n    return (\n      <div className={cn(\"flex h-full min-h-0 w-full flex-col gap-density-2\", className)}>\n        {alert}\n        <div className=\"min-h-0 flex-1\">{children}</div>\n      </div>\n    );\n  }\n  return (\n    <div\n      aria-busy={loading}\n      className={cn(\n        \"flex h-full min-h-0 w-full flex-col overflow-hidden rounded-xl border border-border bg-background text-sm shadow-sm\",\n        className,\n      )}\n    >\n      <div className=\"flex min-h-0 flex-1 flex-col gap-density-3 overflow-y-auto p-density-4\">\n        {alert ?? (\n          <>\n            <p className=\"text-xs text-muted-foreground\">Loading session…</p>\n            <div className=\"h-control-h w-1/3 animate-pulse rounded-md bg-muted\" />\n            <div className=\"h-4 w-full animate-pulse rounded bg-muted\" />\n            <div className=\"h-4 w-5/6 animate-pulse rounded bg-muted\" />\n            <div className=\"h-4 w-2/3 animate-pulse rounded bg-muted\" />\n          </>\n        )}\n      </div>\n      {composer ? <PinnedComposer>{composer}</PinnedComposer> : null}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;AAUO,SAAS,oBAAoB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAMG;AACD,QAAM,QAAQ,QACZ;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAU;AAAA,MAET,UAAA;AAAA,IAAA;AAAA,EAAA,IAED;AACJ,MAAI,UAAU;AACZ,gCACG,OAAA,EAAI,WAAW,GAAG,qDAAqD,SAAS,GAC9E,UAAA;AAAA,MAAA;AAAA,MACD,oBAAC,OAAA,EAAI,WAAU,kBAAkB,SAAA,CAAS;AAAA,IAAA,GAC5C;AAAA,EAEJ;AACA,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAW;AAAA,MACX,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MAAA;AAAA,MAGF,UAAA;AAAA,QAAA,oBAAC,OAAA,EAAI,WAAU,0EACZ,UAAA,SACC,qBAAA,UAAA,EACE,UAAA;AAAA,UAAA,oBAAC,KAAA,EAAE,WAAU,iCAAgC,UAAA,oBAAgB;AAAA,UAC7D,oBAAC,OAAA,EAAI,WAAU,sDAAA,CAAsD;AAAA,UACrE,oBAAC,OAAA,EAAI,WAAU,4CAAA,CAA4C;AAAA,UAC3D,oBAAC,OAAA,EAAI,WAAU,2CAAA,CAA2C;AAAA,UAC1D,oBAAC,OAAA,EAAI,WAAU,2CAAA,CAA2C;AAAA,QAAA,EAAA,CAC5D,EAAA,CAEJ;AAAA,QACC,WAAW,oBAAC,gBAAA,EAAgB,UAAA,SAAA,CAAS,IAAoB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGhE;"}

package/dist/data/ai/SessionInspector.remote.cjs

@@ -13,12 +13,15 @@ const TERMINAL_SESSION_LIFECYCLES = [
 function isTerminalSessionLifecycle(status) {
   return status !== void 0 && TERMINAL_SESSION_LIFECYCLES.includes(status);
 }
-function sessionFollowUrl(src) {
+const DEFAULT_SESSION_PAGE_SIZE = 100;
+function sessionUrl(src, params) {
   const hashAt = src.indexOf("#");
   const base = hashAt === -1 ? src : src.slice(0, hashAt);
   const hash = hashAt === -1 ? "" : src.slice(hashAt);
-  const separator = !base.includes("?") ? "?" : base.endsWith("?") || base.endsWith("&") ? "" : "&";
-  return `${base}${separator}follow=1${hash}`;
+  const queryAt = base.indexOf("?");
+  const query = new URLSearchParams(queryAt === -1 ? "" : base.slice(queryAt + 1));
+  for (const [name, value] of Object.entries(params)) query.set(name, String(value));
+  return `${queryAt === -1 ? base : base.slice(0, queryAt)}?${query}${hash}`;
 }
 async function fetchRemoteSession(src, signal) {
   const response = await fetch(src, {
@@ -47,7 +50,8 @@ async function fetchRemoteSession(src, signal) {
   return parsed;
 }
 function mergeSessionMessages(base, incoming) {
-  const merged = [...base ?? []];
+  const real = incoming.some((message) => !message.placeholder);
+  const merged = (base ?? []).filter((message) => !(real && message.placeholder));
   for (const message of incoming) {
     const index = merged.findIndex((existing) => existing.id === message.id);
     if (index === -1) merged.push(message);
@@ -57,10 +61,13 @@ function mergeSessionMessages(base, incoming) {
 }
 function openRemoteSession(src, {
   follow,
+  pageSize = DEFAULT_SESSION_PAGE_SIZE,
   eventSourceFactory,
   onChange
 }) {
-  const url = sessionFollowUrl(src);
+  let url = sessionUrl(src, { follow: 1 });
+  let olderPage;
+  let pageError;
   const aborter = new AbortController();
   const streamed = /* @__PURE__ */ new Map();
   let closed = false;
@@ -84,23 +91,51 @@ function openRemoteSession(src, {
     emit({ ...state, loading: false, error: message });
   };
   const refresh = async () => {
-    var _a;
+    var _a, _b, _c, _d;
     const current = ++generation;
     const startedAt = seq;
-    const fetched = await fetchRemoteSession(src, aborter.signal);
+    const fetched = await fetchRemoteSession(sessionUrl(src, { tail: pageSize }), aborter.signal);
     if (closed || current !== generation) return void 0;
     const fetchedIds = new Set((_a = fetched.messages) == null ? void 0 : _a.map((message) => message.id));
     const keep = [...streamed.values()].filter((entry) => entry.seq > startedAt || !fetchedIds.has(entry.message.id)).map((entry) => entry.message);
+    const held = mergeSessionMessages((_b = state.session) == null ? void 0 : _b.messages, fetched.messages ?? []);
     const session = {
       ...fetched,
-      messages: mergeSessionMessages(fetched.messages, keep)
+      messages: mergeSessionMessages(held, keep)
     };
     if (typeof fetched.revision === "number") {
       revision = Math.max(revision ?? fetched.revision, fetched.revision);
     }
-    emit({ ...state, session, loading: false });
+    const hasOlder = state.session === void 0 ? (((_c = fetched.window) == null ? void 0 : _c.messages) ?? 0) > (((_d = fetched.messages) == null ? void 0 : _d.length) ?? 0) : state.hasOlder;
+    emit({ ...state, session, loading: false, hasOlder: hasOlder ?? false });
     return session;
   };
+  const loadOlder = () => {
+    var _a, _b, _c;
+    const oldest = (_c = (_b = (_a = state.session) == null ? void 0 : _a.messages) == null ? void 0 : _b[0]) == null ? void 0 : _c.id;
+    if (closed || olderPage || !state.hasOlder || !oldest) return olderPage ?? Promise.resolve();
+    emit({ ...state, loadingOlder: true });
+    olderPage = fetchRemoteSession(sessionUrl(src, { before: oldest, limit: pageSize }), aborter.signal).then((page) => {
+      const older = page.messages ?? [];
+      const { error, ...rest } = state;
+      const session = state.session;
+      emit({
+        ...rest,
+        ...error !== void 0 && error !== pageError ? { error } : {},
+        loadingOlder: false,
+        hasOlder: older.length === pageSize,
+        session: { ...session, messages: mergeSessionMessages(older, session.messages ?? []) }
+      });
+      pageError = void 0;
+    }).catch((reason) => {
+      if (closed) return;
+      pageError = errorMessage(reason);
+      emit({ ...state, loadingOlder: false, error: pageError });
+    }).finally(() => {
+      olderPage = void 0;
+    });
+    return olderPage;
+  };
   const readFrame = (event) => {
     try {
       return JSON.parse(event.data);
@@ -152,6 +187,9 @@ function openRemoteSession(src, {
     if (isTerminalSessionLifecycle(next.lifecycleStatus)) stopFollowing();
   };
   const startFollowing = () => {
+    var _a, _b, _c;
+    const newest = (_c = (_b = (_a = state.session) == null ? void 0 : _a.messages) == null ? void 0 : _b.filter((message) => !message.placeholder).at(-1)) == null ? void 0 : _c.id;
+    url = sessionUrl(src, newest ? { follow: 1, after: newest } : { follow: 1 });
     const es = eventSourceFactory(url);
     source = es;
     let received = false;
@@ -194,6 +232,7 @@ function openRemoteSession(src, {
   );
   return {
     loaded,
+    loadOlder,
     close: () => {
       closed = true;
       aborter.abort();
@@ -203,24 +242,51 @@ function openRemoteSession(src, {
 }
 const IDLE = { loading: false };
 const LOADING = { loading: true };
-function useRemoteSession(src, { follow } = {}) {
+function useRemoteSession(src, { follow, pageSize } = {}) {
   const eventSourceFactory = eventSource.useEventSourceFactory();
   const factoryRef = react.useRef(eventSourceFactory);
   factoryRef.current = eventSourceFactory;
+  const handleRef = react.useRef(void 0);
   const [snapshot, setSnapshot] = react.useState();
   react.useEffect(() => {
     if (src === void 0) return void 0;
     setSnapshot({ src, state: LOADING });
     const handle = openRemoteSession(src, {
       ...follow === void 0 ? {} : { follow },
+      ...pageSize === void 0 ? {} : { pageSize },
       eventSourceFactory: factoryRef.current,
-      onChange: (state) => setSnapshot({ src, state })
+      onChange: (state2) => setSnapshot({ src, state: state2 })
     });
+    handleRef.current = handle;
     handle.loaded.catch(() => void 0);
-    return handle.close;
-  }, [src, follow]);
-  if (src === void 0) return IDLE;
-  return (snapshot == null ? void 0 : snapshot.src) === src ? snapshot.state : LOADING;
+    return () => {
+      handle.close();
+      if (handleRef.current === handle) handleRef.current = void 0;
+    };
+  }, [src, follow, pageSize]);
+  const loadOlder = react.useCallback(() => {
+    var _a;
+    return ((_a = handleRef.current) == null ? void 0 : _a.loadOlder()) ?? Promise.resolve();
+  }, []);
+  const state = src === void 0 ? IDLE : (snapshot == null ? void 0 : snapshot.src) === src ? snapshot.state : LOADING;
+  return react.useMemo(() => ({ ...state, loadOlder }), [state, loadOlder]);
+}
+function useReportLoadState({
+  state,
+  enabled,
+  onChange
+}) {
+  const onChangeRef = react.useRef(onChange);
+  onChangeRef.current = onChange;
+  const { loading, error } = state;
+  react.useEffect(() => {
+    var _a;
+    if (!enabled) return;
+    (_a = onChangeRef.current) == null ? void 0 : _a.call(
+      onChangeRef,
+      error !== void 0 ? { status: "error", error: new Error(error) } : { status: loading ? "loading" : "ready" }
+    );
+  }, [enabled, loading, error]);
 }
 function useRemoteCollection(collection, options = {}) {
   const current = collection == null ? void 0 : collection.sessions.find(
@@ -264,12 +330,14 @@ function errorMessage(reason) {
 function isRecord(value) {
   return typeof value === "object" && value !== null && !Array.isArray(value);
 }
+exports.DEFAULT_SESSION_PAGE_SIZE = DEFAULT_SESSION_PAGE_SIZE;
 exports.TERMINAL_SESSION_LIFECYCLES = TERMINAL_SESSION_LIFECYCLES;
 exports.fetchRemoteSession = fetchRemoteSession;
 exports.isTerminalSessionLifecycle = isTerminalSessionLifecycle;
 exports.mergeSessionMessages = mergeSessionMessages;
 exports.openRemoteSession = openRemoteSession;
-exports.sessionFollowUrl = sessionFollowUrl;
+exports.sessionUrl = sessionUrl;
 exports.useRemoteCollection = useRemoteCollection;
 exports.useRemoteSession = useRemoteSession;
+exports.useReportLoadState = useReportLoadState;
 //# sourceMappingURL=SessionInspector.remote.cjs.map