@agent-native/core 0.99.2 → 0.100.0

package/dist/client/agent-page/types.js

@@ -0,0 +1,9 @@
+/**
+ * Shared contracts for the full-page Agent surface (`AgentTabsPage`).
+ *
+ * Ownership note for concurrent implementation work: the page shell and the
+ * Files/MCP/Connect tabs may ADD exports here; the Context and Jobs tab
+ * implementations consume these types but must not edit this file.
+ */
+export {};
+//# sourceMappingURL=types.js.map

package/dist/client/agent-page/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/client/agent-page/types.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG","sourcesContent":["/**\n * Shared contracts for the full-page Agent surface (`AgentTabsPage`).\n *\n * Ownership note for concurrent implementation work: the page shell and the\n * Files/MCP/Connect tabs may ADD exports here; the Context and Jobs tab\n * implementations consume these types but must not edit this file.\n */\n\n/** Which configuration scope the page-level toggle is showing. */\nexport type AgentPageScope = \"user\" | \"org\";\n\n/** Props every Agent page tab receives from the page shell. */\nexport interface AgentPageTabProps {\n  /** Current scope selected by the page-level Personal/Organization toggle. */\n  scope: AgentPageScope;\n  /** Whether the current user can administer org-scoped agent config. */\n  canManageOrg?: boolean;\n}\n"]}

package/dist/client/agent-page/use-jobs.d.ts

@@ -0,0 +1,61 @@
+export type JobsScope = "user" | "org";
+export interface RecurringJob {
+    id: string;
+    name: string;
+    path: string;
+    scope: "personal" | "organization";
+    schedule: string;
+    scheduleDescription: string;
+    instructions: string;
+    enabled: boolean;
+    lastRun: string | null;
+    lastStatus: string | null;
+    lastError: string | null;
+    nextRun: string | null;
+    createdBy: string | null;
+    canUpdate: boolean;
+}
+export interface Automation {
+    id: string;
+    name: string;
+    path: string;
+    scope: "personal" | "organization";
+    triggerType: "event" | "schedule";
+    event: string | null;
+    schedule: string | null;
+    scheduleDescription: string | null;
+    condition: string | null;
+    body: string;
+    enabled: boolean;
+    lastRun: string | null;
+    lastStatus: string | null;
+    lastError: string | null;
+    nextRun: string | null;
+    createdBy: string | null;
+    canUpdate: boolean;
+}
+export type ManageJobInput = {
+    operation: "update" | "delete";
+    name: string;
+    scope: "personal" | "organization";
+    enabled?: boolean;
+};
+export type ManageAutomationInput = {
+    operation: "update" | "delete";
+    name: string;
+    scope: "personal" | "organization";
+    enabled?: boolean;
+};
+export declare function useRecurringJobs(scope: JobsScope): import("@tanstack/react-query").UseQueryResult<NoInfer<RecurringJob[]>, Error>;
+export declare function useAutomations(scope: JobsScope): import("@tanstack/react-query").UseQueryResult<NoInfer<Automation[]>, Error>;
+export declare function useManageRecurringJob(scope: JobsScope): import("@tanstack/react-query").UseMutationResult<{
+    deleted?: boolean;
+    name: string;
+    enabled?: boolean;
+}, Error, ManageJobInput, unknown>;
+export declare function useManageAutomation(scope: JobsScope): import("@tanstack/react-query").UseMutationResult<{
+    deleted?: boolean;
+    name: string;
+    enabled?: boolean;
+}, Error, ManageAutomationInput, unknown>;
+//# sourceMappingURL=use-jobs.d.ts.map

package/dist/client/agent-page/use-jobs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-jobs.d.ts","sourceRoot":"","sources":["../../../src/client/agent-page/use-jobs.ts"],"names":[],"mappings":"AAIA,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,KAAK,CAAC;AAEvC,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,UAAU,GAAG,cAAc,CAAC;IACnC,QAAQ,EAAE,MAAM,CAAC;IACjB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,UAAU;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,UAAU,GAAG,cAAc,CAAC;IACnC,WAAW,EAAE,OAAO,GAAG,UAAU,CAAC;IAClC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,mBAAmB,EAAE,MAAM,GAAG,IAAI,CAAC;IACnC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,MAAM,cAAc,GAAG;IAC3B,SAAS,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,UAAU,GAAG,cAAc,CAAC;IACnC,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,SAAS,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,UAAU,GAAG,cAAc,CAAC;IACnC,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAUF,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,SAAS,kFAMhD;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,SAAS,gFAM9C;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,SAAS;cAMtC,OAAO;UAAQ,MAAM;cAAY,OAAO;mCA0BvD;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,SAAS;cAMpC,OAAO;UAAQ,MAAM;cAAY,OAAO;0CA4BvD"}

package/dist/client/agent-page/use-jobs.js

@@ -0,0 +1,71 @@
+import { useQueryClient } from "@tanstack/react-query";
+import { useActionMutation, useActionQuery } from "../use-action.js";
+function recurringParams(scope) {
+    return { scope: scope === "org" ? "organization" : "personal" };
+}
+function automationParams(scope) {
+    return { scope: scope === "org" ? "organization" : "personal" };
+}
+export function useRecurringJobs(scope) {
+    return useActionQuery("list-recurring-jobs", recurringParams(scope), { staleTime: 5_000 });
+}
+export function useAutomations(scope) {
+    return useActionQuery("list-automations", automationParams(scope), { staleTime: 5_000 });
+}
+export function useManageRecurringJob(scope) {
+    const queryClient = useQueryClient();
+    const params = recurringParams(scope);
+    const queryKey = ["action", "list-recurring-jobs", params];
+    return useActionMutation("manage-recurring-job", {
+        onMutate: async (variables) => {
+            await queryClient.cancelQueries({ queryKey });
+            const previous = queryClient.getQueryData(queryKey);
+            queryClient.setQueryData(queryKey, (current) => {
+                if (!current)
+                    return current;
+                if (variables.operation === "delete") {
+                    return current.filter((job) => job.name !== variables.name);
+                }
+                return current.map((job) => job.name === variables.name && variables.enabled !== undefined
+                    ? { ...job, enabled: variables.enabled }
+                    : job);
+            });
+            return { previous };
+        },
+        onError: (_error, _variables, context) => {
+            const rollback = context;
+            if (rollback && "previous" in rollback) {
+                queryClient.setQueryData(queryKey, rollback.previous);
+            }
+        },
+    });
+}
+export function useManageAutomation(scope) {
+    const queryClient = useQueryClient();
+    const params = automationParams(scope);
+    const queryKey = ["action", "list-automations", params];
+    return useActionMutation("manage-automation", {
+        onMutate: async (variables) => {
+            await queryClient.cancelQueries({ queryKey });
+            const previous = queryClient.getQueryData(queryKey);
+            queryClient.setQueryData(queryKey, (current) => {
+                if (!current)
+                    return current;
+                if (variables.operation === "delete") {
+                    return current.filter((automation) => automation.name !== variables.name);
+                }
+                return current.map((automation) => automation.name === variables.name && variables.enabled !== undefined
+                    ? { ...automation, enabled: variables.enabled }
+                    : automation);
+            });
+            return { previous };
+        },
+        onError: (_error, _variables, context) => {
+            const rollback = context;
+            if (rollback && "previous" in rollback) {
+                queryClient.setQueryData(queryKey, rollback.previous);
+            }
+        },
+    });
+}
+//# sourceMappingURL=use-jobs.js.map

package/dist/client/agent-page/use-jobs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-jobs.js","sourceRoot":"","sources":["../../../src/client/agent-page/use-jobs.ts"],"names":[],"mappings":"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","sourcesContent":["import { useQueryClient } from \"@tanstack/react-query\";\n\nimport { useActionMutation, useActionQuery } from \"../use-action.js\";\n\nexport type JobsScope = \"user\" | \"org\";\n\nexport interface RecurringJob {\n  id: string;\n  name: string;\n  path: string;\n  scope: \"personal\" | \"organization\";\n  schedule: string;\n  scheduleDescription: string;\n  instructions: string;\n  enabled: boolean;\n  lastRun: string | null;\n  lastStatus: string | null;\n  lastError: string | null;\n  nextRun: string | null;\n  createdBy: string | null;\n  canUpdate: boolean;\n}\n\nexport interface Automation {\n  id: string;\n  name: string;\n  path: string;\n  scope: \"personal\" | \"organization\";\n  triggerType: \"event\" | \"schedule\";\n  event: string | null;\n  schedule: string | null;\n  scheduleDescription: string | null;\n  condition: string | null;\n  body: string;\n  enabled: boolean;\n  lastRun: string | null;\n  lastStatus: string | null;\n  lastError: string | null;\n  nextRun: string | null;\n  createdBy: string | null;\n  canUpdate: boolean;\n}\n\nexport type ManageJobInput = {\n  operation: \"update\" | \"delete\";\n  name: string;\n  scope: \"personal\" | \"organization\";\n  enabled?: boolean;\n};\n\nexport type ManageAutomationInput = {\n  operation: \"update\" | \"delete\";\n  name: string;\n  scope: \"personal\" | \"organization\";\n  enabled?: boolean;\n};\n\nfunction recurringParams(scope: JobsScope) {\n  return { scope: scope === \"org\" ? \"organization\" : \"personal\" } as const;\n}\n\nfunction automationParams(scope: JobsScope) {\n  return { scope: scope === \"org\" ? \"organization\" : \"personal\" } as const;\n}\n\nexport function useRecurringJobs(scope: JobsScope) {\n  return useActionQuery<RecurringJob[]>(\n    \"list-recurring-jobs\",\n    recurringParams(scope),\n    { staleTime: 5_000 },\n  );\n}\n\nexport function useAutomations(scope: JobsScope) {\n  return useActionQuery<Automation[]>(\n    \"list-automations\",\n    automationParams(scope),\n    { staleTime: 5_000 },\n  );\n}\n\nexport function useManageRecurringJob(scope: JobsScope) {\n  const queryClient = useQueryClient();\n  const params = recurringParams(scope);\n  const queryKey = [\"action\", \"list-recurring-jobs\", params] as const;\n\n  return useActionMutation<\n    { deleted?: boolean; name: string; enabled?: boolean },\n    ManageJobInput\n  >(\"manage-recurring-job\", {\n    onMutate: async (variables) => {\n      await queryClient.cancelQueries({ queryKey });\n      const previous = queryClient.getQueryData<RecurringJob[]>(queryKey);\n      queryClient.setQueryData<RecurringJob[]>(queryKey, (current) => {\n        if (!current) return current;\n        if (variables.operation === \"delete\") {\n          return current.filter((job) => job.name !== variables.name);\n        }\n        return current.map((job) =>\n          job.name === variables.name && variables.enabled !== undefined\n            ? { ...job, enabled: variables.enabled }\n            : job,\n        );\n      });\n      return { previous };\n    },\n    onError: (_error, _variables, context) => {\n      const rollback = context as { previous?: RecurringJob[] } | undefined;\n      if (rollback && \"previous\" in rollback) {\n        queryClient.setQueryData(queryKey, rollback.previous);\n      }\n    },\n  });\n}\n\nexport function useManageAutomation(scope: JobsScope) {\n  const queryClient = useQueryClient();\n  const params = automationParams(scope);\n  const queryKey = [\"action\", \"list-automations\", params] as const;\n\n  return useActionMutation<\n    { deleted?: boolean; name: string; enabled?: boolean },\n    ManageAutomationInput\n  >(\"manage-automation\", {\n    onMutate: async (variables) => {\n      await queryClient.cancelQueries({ queryKey });\n      const previous = queryClient.getQueryData<Automation[]>(queryKey);\n      queryClient.setQueryData<Automation[]>(queryKey, (current) => {\n        if (!current) return current;\n        if (variables.operation === \"delete\") {\n          return current.filter(\n            (automation) => automation.name !== variables.name,\n          );\n        }\n        return current.map((automation) =>\n          automation.name === variables.name && variables.enabled !== undefined\n            ? { ...automation, enabled: variables.enabled }\n            : automation,\n        );\n      });\n      return { previous };\n    },\n    onError: (_error, _variables, context) => {\n      const rollback = context as { previous?: Automation[] } | undefined;\n      if (rollback && \"previous\" in rollback) {\n        queryClient.setQueryData(queryKey, rollback.previous);\n      }\n    },\n  });\n}\n"]}

package/dist/client/context-xray/ContextMeter.d.ts

@@ -1,5 +1,7 @@
-export declare function ContextMeter({ threadId, enabled, }: {
+import type { ContextManifest } from "../../shared/context-xray.js";
+export declare function ContextMeter({ threadId, manifest: providedManifest, enabled, }: {
     threadId?: string | null;
+    manifest?: ContextManifest | null;
     enabled?: boolean;
 }): import("react").JSX.Element | null;
 //# sourceMappingURL=ContextMeter.d.ts.map

package/dist/client/context-xray/ContextMeter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMeter.d.ts","sourceRoot":"","sources":["../../../src/client/context-xray/ContextMeter.tsx"],"names":[],"mappings":"AA6DA,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,OAAc,GACf,EAAE;IACD,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,sCAuHA"}
+{"version":3,"file":"ContextMeter.d.ts","sourceRoot":"","sources":["../../../src/client/context-xray/ContextMeter.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EACV,eAAe,EAEhB,MAAM,8BAA8B,CAAC;AA4DtC,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,QAAQ,EAAE,gBAAgB,EAC1B,OAAc,GACf,EAAE;IACD,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,QAAQ,CAAC,EAAE,eAAe,GAAG,IAAI,CAAC;IAClC,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,sCAkIA"}

package/dist/client/context-xray/ContextMeter.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { lazy, Suspense, useEffect, useRef, useState } from "react";
+import { manifestConversationTokens, manifestSystemTokens, } from "../../shared/context-xray.js";
 import { Popover, PopoverContent, PopoverTrigger, } from "../components/ui/popover.js";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, } from "../components/ui/tooltip.js";
 import { useActionMutation, useActionQuery } from "../use-action.js";
@@ -15,11 +16,11 @@ function ContextDonut({ pct, advisory }) {
     const dashOffset = circumference - (displayPct / 100) * circumference;
     return (_jsxs("span", { className: "relative flex size-5 items-center justify-center", children: [_jsxs("svg", { "aria-hidden": "true", viewBox: "0 0 20 20", className: "-rotate-90 size-5", children: [_jsx("circle", { cx: "10", cy: "10", r: radius, className: "stroke-muted", fill: "none", strokeWidth: "3" }), _jsx("circle", { cx: "10", cy: "10", r: radius, className: cn(advisory ? "stroke-amber-500" : "stroke-[#00B5FF]"), fill: "none", strokeLinecap: "round", strokeWidth: "3", strokeDasharray: circumference, strokeDashoffset: dashOffset })] }), _jsx("span", { className: "absolute size-2 rounded-full bg-background" })] }));
 }
-export function ContextMeter({ threadId, enabled = true, }) {
+export function ContextMeter({ threadId, manifest: providedManifest, enabled = true, }) {
     const [open, setOpen] = useState(false);
     const [optimistic, setOptimistic] = useState(new Map());
     const currentThreadId = useRef(threadId);
-    const shouldQuery = Boolean(threadId && enabled);
+    const shouldQuery = Boolean(threadId && enabled && !providedManifest);
     const query = useActionQuery("context-manifest-get", shouldQuery && threadId ? { threadId } : undefined, {
         enabled: shouldQuery,
         staleTime: 1000,
@@ -41,12 +42,18 @@ export function ContextMeter({ threadId, enabled = true, }) {
             setOpen(true);
         }
     }, [enabled, threadId]);
-    const manifest = query.data;
+    const manifest = providedManifest ?? query.data;
     const contextWindow = resolveContextWindow(manifest?.model);
     const pct = manifest
         ? Math.min(100, Math.round((manifest.totalTokens / contextWindow) * 100))
         : 0;
-    if (!shouldQuery || !threadId || !manifest || manifest.rawTokens <= 0) {
+    const systemTokens = manifest ? manifestSystemTokens(manifest) : 0;
+    const conversationTokens = manifest
+        ? manifestConversationTokens(manifest)
+        : 0;
+    if ((!shouldQuery && !providedManifest) ||
+        !manifest ||
+        (manifest.rawTokens <= 0 && manifest.totalTokens <= 0)) {
         return null;
     }
     const mutateStatus = (segmentId, status, action) => {
@@ -67,6 +74,8 @@ export function ContextMeter({ threadId, enabled = true, }) {
         if (action === "restore")
             restore.mutate(params, options);
     };
-    return (_jsx(TooltipProvider, { delayDuration: 200, children: _jsxs(Popover, { open: open, onOpenChange: setOpen, children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(PopoverTrigger, { asChild: true, children: _jsx("button", { type: "button", "aria-label": `Context ${pct}%, ${formatTokens(manifest.totalTokens)}. Open Context X-Ray.`, className: cn("flex size-7 shrink-0 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent/50 hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring", open && "bg-accent/60 text-foreground"), children: _jsx(ContextDonut, { pct: pct, advisory: !manifest.enforceable }) }) }) }), _jsxs(TooltipContent, { children: ["Context ", pct, "% \u00B7 ", formatTokens(manifest.totalTokens)] })] }), _jsx(PopoverContent, { align: "end", side: "top", sideOffset: 8, className: "w-[min(92vw,380px)] overflow-hidden border-border/70 p-0", children: open ? (_jsx(Suspense, { fallback: _jsx("div", { className: "flex h-52 items-center justify-center text-xs text-muted-foreground", children: "Loading context view\u2026" }), children: _jsx(ContextXRayPanel, { manifest: manifest, optimistic: optimistic, onPin: (segmentId) => mutateStatus(segmentId, "pinned", "pin"), onEvict: (segmentId) => mutateStatus(segmentId, "evicted", "evict"), onRestore: (segmentId) => mutateStatus(segmentId, "active", "restore") }) })) : null })] }) }));
+    return (_jsx(TooltipProvider, { delayDuration: 200, children: _jsxs(Popover, { open: open, onOpenChange: setOpen, children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(PopoverTrigger, { asChild: true, children: _jsx("button", { type: "button", "aria-label": `Context ${pct}%, ${formatTokens(manifest.totalTokens)}${systemTokens > 0 ? ` total: ${formatTokens(systemTokens)} system + ${formatTokens(conversationTokens)} conversation` : ""}. Open Context X-Ray.`, className: cn("flex size-7 shrink-0 cursor-pointer items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent/50 hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring", open && "bg-accent/60 text-foreground"), children: _jsx(ContextDonut, { pct: pct, advisory: !manifest.enforceable }) }) }) }), _jsxs(TooltipContent, { children: ["Context ", pct, "% \u00B7 ", formatTokens(manifest.totalTokens), systemTokens > 0
+                                    ? ` (${formatTokens(systemTokens)} system + ${formatTokens(conversationTokens)} conversation)`
+                                    : ""] })] }), _jsx(PopoverContent, { align: "end", side: "top", sideOffset: 8, className: "w-[min(92vw,380px)] overflow-hidden border-border/70 p-0", children: open ? (_jsx(Suspense, { fallback: _jsx("div", { className: "flex h-52 items-center justify-center text-xs text-muted-foreground", children: "Loading context view\u2026" }), children: _jsx(ContextXRayPanel, { manifest: manifest, optimistic: optimistic, onPin: (segmentId) => mutateStatus(segmentId, "pinned", "pin"), onEvict: (segmentId) => mutateStatus(segmentId, "evicted", "evict"), onRestore: (segmentId) => mutateStatus(segmentId, "active", "restore") }) })) : null })] }) }));
 }
 //# sourceMappingURL=ContextMeter.js.map

package/dist/client/context-xray/ContextMeter.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMeter.js","sourceRoot":"","sources":["../../../src/client/context-xray/ContextMeter.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAMpE,OAAO,EACL,OAAO,EACP,cAAc,EACd,cAAc,GACf,MAAM,6BAA6B,CAAC;AACrC,OAAO,EACL,OAAO,EACP,cAAc,EACd,eAAe,EACf,cAAc,GACf,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AACrE,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,YAAY,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAEjE,MAAM,gBAAgB,GAAG,IAAI,CAAC,GAAG,EAAE,CACjC,MAAM,CAAC,uBAAuB,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;IAC3C,OAAO,EAAE,CAAC,CAAC,gBAAgB;CAC5B,CAAC,CAAC,CACJ,CAAC;AAEF,SAAS,YAAY,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAsC;IACzE,MAAM,MAAM,GAAG,GAAG,CAAC;IACnB,MAAM,aAAa,GAAG,CAAC,GAAG,IAAI,CAAC,EAAE,GAAG,MAAM,CAAC;IAC3C,MAAM,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC;IACnD,MAAM,UAAU,GAAG,aAAa,GAAG,CAAC,UAAU,GAAG,GAAG,CAAC,GAAG,aAAa,CAAC;IAEtE,OAAO,CACL,gBAAM,SAAS,EAAC,kDAAkD,aAChE,8BAAiB,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,SAAS,EAAC,mBAAmB,aACvE,iBACE,EAAE,EAAC,IAAI,EACP,EAAE,EAAC,IAAI,EACP,CAAC,EAAE,MAAM,EACT,SAAS,EAAC,cAAc,EACxB,IAAI,EAAC,MAAM,EACX,WAAW,EAAC,GAAG,GACf,EACF,iBACE,EAAE,EAAC,IAAI,EACP,EAAE,EAAC,IAAI,EACP,CAAC,EAAE,MAAM,EACT,SAAS,EAAE,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,kBAAkB,CAAC,EACjE,IAAI,EAAC,MAAM,EACX,aAAa,EAAC,OAAO,EACrB,WAAW,EAAC,GAAG,EACf,eAAe,EAAE,aAAa,EAC9B,gBAAgB,EAAE,UAAU,GAC5B,IACE,EACN,eAAM,SAAS,EAAC,4CAA4C,GAAG,IAC1D,CACR,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,YAAY,CAAC,EAC3B,QAAQ,EACR,OAAO,GAAG,IAAI,GAIf;IACC,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACxC,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAE1C,IAAI,GAAG,EAAE,CAAC,CAAC;IACb,MAAM,eAAe,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC;IACzC,MAAM,WAAW,GAAG,OAAO,CAAC,QAAQ,IAAI,OAAO,CAAC,CAAC;IACjD,MAAM,KAAK,GAAG,cAAc,CAC1B,sBAAsB,EACtB,WAAW,IAAI,QAAQ,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,SAAS,EAClD;QACE,OAAO,EAAE,WAAW;QACpB,SAAS,EAAE,IAAI;KAChB,CAC4B,CAAC;IAChC,MAAM,GAAG,GAAG,iBAAiB,CAAC,aAAa,CAAC,CAAC;IAC7C,MAAM,KAAK,GAAG,iBAAiB,CAAC,eAAe,CAAC,CAAC;IACjD,MAAM,OAAO,GAAG,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAErD,SAAS,CAAC,GAAG,EAAE;QACb,eAAe,CAAC,OAAO,GAAG,QAAQ,CAAC;QACnC,aAAa,CAAC,IAAI,GAAG,EAAE,CAAC,CAAC;IAC3B,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,QAAQ,IAAI,CAAC,OAAO,IAAI,OAAO,MAAM,KAAK,WAAW;YAAE,OAAO;QACnE,MAAM,MAAM,GAAG,IAAI,eAAe,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;QAC3D,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAC,aAAa,CAAC,KAAK,GAAG,CAAC;QACpD,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;QAC5C,IAAI,SAAS,IAAI,CAAC,CAAC,YAAY,IAAI,YAAY,KAAK,QAAQ,CAAC,EAAE,CAAC;YAC9D,OAAO,CAAC,IAAI,CAAC,CAAC;QAChB,CAAC;IACH,CAAC,EAAE,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC;IAExB,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC;IAC5B,MAAM,aAAa,GAAG,oBAAoB,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;IAC5D,MAAM,GAAG,GAAG,QAAQ;QAClB,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,WAAW,GAAG,aAAa,CAAC,GAAG,GAAG,CAAC,CAAC;QACzE,CAAC,CAAC,CAAC,CAAC;IAEN,IAAI,CAAC,WAAW,IAAI,CAAC,QAAQ,IAAI,CAAC,QAAQ,IAAI,QAAQ,CAAC,SAAS,IAAI,CAAC,EAAE,CAAC;QACtE,OAAO,IAAI,CAAC;IACd,CAAC;IAED,MAAM,YAAY,GAAG,CACnB,SAAiB,EACjB,MAA4B,EAC5B,MAAmC,EACnC,EAAE;QACF,MAAM,QAAQ,GAAG,IAAI,GAAG,CAAC,UAAU,CAAC,CAAC;QACrC,aAAa,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC;QAC9D,MAAM,MAAM,GAAG,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC;QACvC,MAAM,OAAO,GAAG;YACd,OAAO,EAAE,GAAG,EAAE;gBACZ,IAAI,eAAe,CAAC,OAAO,KAAK,QAAQ,EAAE,CAAC;oBACzC,aAAa,CAAC,QAAQ,CAAC,CAAC;gBAC1B,CAAC;YACH,CAAC;SACF,CAAC;QACF,IAAI,MAAM,KAAK,KAAK;YAAE,GAAG,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QAClD,IAAI,MAAM,KAAK,OAAO;YAAE,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QACtD,IAAI,MAAM,KAAK,SAAS;YAAE,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC5D,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,eAAe,IAAC,aAAa,EAAE,GAAG,YACjC,MAAC,OAAO,IAAC,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE,OAAO,aACxC,MAAC,OAAO,eACN,KAAC,cAAc,IAAC,OAAO,kBACrB,KAAC,cAAc,IAAC,OAAO,kBACrB,iBACE,IAAI,EAAC,QAAQ,gBACD,WAAW,GAAG,MAAM,YAAY,CAC1C,QAAQ,CAAC,WAAW,CACrB,uBAAuB,EACxB,SAAS,EAAE,EAAE,CACX,sNAAsN,EACtN,IAAI,IAAI,8BAA8B,CACvC,YAED,KAAC,YAAY,IAAC,GAAG,EAAE,GAAG,EAAE,QAAQ,EAAE,CAAC,QAAQ,CAAC,WAAW,GAAI,GACpD,GACM,GACF,EACjB,MAAC,cAAc,2BACJ,GAAG,eAAM,YAAY,CAAC,QAAQ,CAAC,WAAW,CAAC,IACrC,IACT,EACV,KAAC,cAAc,IACb,KAAK,EAAC,KAAK,EACX,IAAI,EAAC,KAAK,EACV,UAAU,EAAE,CAAC,EACb,SAAS,EAAC,0DAA0D,YAEnE,IAAI,CAAC,CAAC,CAAC,CACN,KAAC,QAAQ,IACP,QAAQ,EACN,cAAK,SAAS,EAAC,qEAAqE,2CAE9E,YAGR,KAAC,gBAAgB,IACf,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,CAAC,SAAS,EAAE,EAAE,CAAC,YAAY,CAAC,SAAS,EAAE,QAAQ,EAAE,KAAK,CAAC,EAC9D,OAAO,EAAE,CAAC,SAAS,EAAE,EAAE,CACrB,YAAY,CAAC,SAAS,EAAE,SAAS,EAAE,OAAO,CAAC,EAE7C,SAAS,EAAE,CAAC,SAAS,EAAE,EAAE,CACvB,YAAY,CAAC,SAAS,EAAE,QAAQ,EAAE,SAAS,CAAC,GAE9C,GACO,CACZ,CAAC,CAAC,CAAC,IAAI,GACO,IACT,GACM,CACnB,CAAC;AACJ,CAAC","sourcesContent":["import { lazy, Suspense, useEffect, useRef, useState } from \"react\";\n\nimport type {\n  ContextManifest,\n  ContextSegmentStatus,\n} from \"../../shared/context-xray.js\";\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from \"../components/ui/popover.js\";\nimport {\n  Tooltip,\n  TooltipContent,\n  TooltipProvider,\n  TooltipTrigger,\n} from \"../components/ui/tooltip.js\";\nimport { useActionMutation, useActionQuery } from \"../use-action.js\";\nimport { cn } from \"../utils.js\";\nimport { formatTokens, resolveContextWindow } from \"./format.js\";\n\nconst ContextXRayPanel = lazy(() =>\n  import(\"./ContextXRayPanel.js\").then((m) => ({\n    default: m.ContextXRayPanel,\n  })),\n);\n\nfunction ContextDonut({ pct, advisory }: { pct: number; advisory: boolean }) {\n  const radius = 7.5;\n  const circumference = 2 * Math.PI * radius;\n  const displayPct = Math.max(3, Math.min(100, pct));\n  const dashOffset = circumference - (displayPct / 100) * circumference;\n\n  return (\n    <span className=\"relative flex size-5 items-center justify-center\">\n      <svg aria-hidden=\"true\" viewBox=\"0 0 20 20\" className=\"-rotate-90 size-5\">\n        <circle\n          cx=\"10\"\n          cy=\"10\"\n          r={radius}\n          className=\"stroke-muted\"\n          fill=\"none\"\n          strokeWidth=\"3\"\n        />\n        <circle\n          cx=\"10\"\n          cy=\"10\"\n          r={radius}\n          className={cn(advisory ? \"stroke-amber-500\" : \"stroke-[#00B5FF]\")}\n          fill=\"none\"\n          strokeLinecap=\"round\"\n          strokeWidth=\"3\"\n          strokeDasharray={circumference}\n          strokeDashoffset={dashOffset}\n        />\n      </svg>\n      <span className=\"absolute size-2 rounded-full bg-background\" />\n    </span>\n  );\n}\n\nexport function ContextMeter({\n  threadId,\n  enabled = true,\n}: {\n  threadId?: string | null;\n  enabled?: boolean;\n}) {\n  const [open, setOpen] = useState(false);\n  const [optimistic, setOptimistic] = useState<\n    Map<string, ContextSegmentStatus>\n  >(new Map());\n  const currentThreadId = useRef(threadId);\n  const shouldQuery = Boolean(threadId && enabled);\n  const query = useActionQuery(\n    \"context-manifest-get\",\n    shouldQuery && threadId ? { threadId } : undefined,\n    {\n      enabled: shouldQuery,\n      staleTime: 1000,\n    },\n  ) as { data?: ContextManifest };\n  const pin = useActionMutation(\"context-pin\");\n  const evict = useActionMutation(\"context-evict\");\n  const restore = useActionMutation(\"context-restore\");\n\n  useEffect(() => {\n    currentThreadId.current = threadId;\n    setOptimistic(new Map());\n  }, [threadId]);\n\n  useEffect(() => {\n    if (!threadId || !enabled || typeof window === \"undefined\") return;\n    const params = new URLSearchParams(window.location.search);\n    const wantsXray = params.get(\"contextXray\") === \"1\";\n    const targetThread = params.get(\"threadId\");\n    if (wantsXray && (!targetThread || targetThread === threadId)) {\n      setOpen(true);\n    }\n  }, [enabled, threadId]);\n\n  const manifest = query.data;\n  const contextWindow = resolveContextWindow(manifest?.model);\n  const pct = manifest\n    ? Math.min(100, Math.round((manifest.totalTokens / contextWindow) * 100))\n    : 0;\n\n  if (!shouldQuery || !threadId || !manifest || manifest.rawTokens <= 0) {\n    return null;\n  }\n\n  const mutateStatus = (\n    segmentId: string,\n    status: ContextSegmentStatus,\n    action: \"pin\" | \"evict\" | \"restore\",\n  ) => {\n    const previous = new Map(optimistic);\n    setOptimistic((prev) => new Map(prev).set(segmentId, status));\n    const params = { threadId, segmentId };\n    const options = {\n      onError: () => {\n        if (currentThreadId.current === threadId) {\n          setOptimistic(previous);\n        }\n      },\n    };\n    if (action === \"pin\") pin.mutate(params, options);\n    if (action === \"evict\") evict.mutate(params, options);\n    if (action === \"restore\") restore.mutate(params, options);\n  };\n\n  return (\n    <TooltipProvider delayDuration={200}>\n      <Popover open={open} onOpenChange={setOpen}>\n        <Tooltip>\n          <TooltipTrigger asChild>\n            <PopoverTrigger asChild>\n              <button\n                type=\"button\"\n                aria-label={`Context ${pct}%, ${formatTokens(\n                  manifest.totalTokens,\n                )}. Open Context X-Ray.`}\n                className={cn(\n                  \"flex size-7 shrink-0 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent/50 hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring\",\n                  open && \"bg-accent/60 text-foreground\",\n                )}\n              >\n                <ContextDonut pct={pct} advisory={!manifest.enforceable} />\n              </button>\n            </PopoverTrigger>\n          </TooltipTrigger>\n          <TooltipContent>\n            Context {pct}% · {formatTokens(manifest.totalTokens)}\n          </TooltipContent>\n        </Tooltip>\n        <PopoverContent\n          align=\"end\"\n          side=\"top\"\n          sideOffset={8}\n          className=\"w-[min(92vw,380px)] overflow-hidden border-border/70 p-0\"\n        >\n          {open ? (\n            <Suspense\n              fallback={\n                <div className=\"flex h-52 items-center justify-center text-xs text-muted-foreground\">\n                  Loading context view…\n                </div>\n              }\n            >\n              <ContextXRayPanel\n                manifest={manifest}\n                optimistic={optimistic}\n                onPin={(segmentId) => mutateStatus(segmentId, \"pinned\", \"pin\")}\n                onEvict={(segmentId) =>\n                  mutateStatus(segmentId, \"evicted\", \"evict\")\n                }\n                onRestore={(segmentId) =>\n                  mutateStatus(segmentId, \"active\", \"restore\")\n                }\n              />\n            </Suspense>\n          ) : null}\n        </PopoverContent>\n      </Popover>\n    </TooltipProvider>\n  );\n}\n"]}
+{"version":3,"file":"ContextMeter.js","sourceRoot":"","sources":["../../../src/client/context-xray/ContextMeter.tsx"],"names":[],"mappings":"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","sourcesContent":["import { lazy, Suspense, useEffect, useRef, useState } from \"react\";\n\nimport type {\n  ContextManifest,\n  ContextSegmentStatus,\n} from \"../../shared/context-xray.js\";\nimport {\n  manifestConversationTokens,\n  manifestSystemTokens,\n} from \"../../shared/context-xray.js\";\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from \"../components/ui/popover.js\";\nimport {\n  Tooltip,\n  TooltipContent,\n  TooltipProvider,\n  TooltipTrigger,\n} from \"../components/ui/tooltip.js\";\nimport { useActionMutation, useActionQuery } from \"../use-action.js\";\nimport { cn } from \"../utils.js\";\nimport { formatTokens, resolveContextWindow } from \"./format.js\";\n\nconst ContextXRayPanel = lazy(() =>\n  import(\"./ContextXRayPanel.js\").then((m) => ({\n    default: m.ContextXRayPanel,\n  })),\n);\n\nfunction ContextDonut({ pct, advisory }: { pct: number; advisory: boolean }) {\n  const radius = 7.5;\n  const circumference = 2 * Math.PI * radius;\n  const displayPct = Math.max(3, Math.min(100, pct));\n  const dashOffset = circumference - (displayPct / 100) * circumference;\n\n  return (\n    <span className=\"relative flex size-5 items-center justify-center\">\n      <svg aria-hidden=\"true\" viewBox=\"0 0 20 20\" className=\"-rotate-90 size-5\">\n        <circle\n          cx=\"10\"\n          cy=\"10\"\n          r={radius}\n          className=\"stroke-muted\"\n          fill=\"none\"\n          strokeWidth=\"3\"\n        />\n        <circle\n          cx=\"10\"\n          cy=\"10\"\n          r={radius}\n          className={cn(advisory ? \"stroke-amber-500\" : \"stroke-[#00B5FF]\")}\n          fill=\"none\"\n          strokeLinecap=\"round\"\n          strokeWidth=\"3\"\n          strokeDasharray={circumference}\n          strokeDashoffset={dashOffset}\n        />\n      </svg>\n      <span className=\"absolute size-2 rounded-full bg-background\" />\n    </span>\n  );\n}\n\nexport function ContextMeter({\n  threadId,\n  manifest: providedManifest,\n  enabled = true,\n}: {\n  threadId?: string | null;\n  manifest?: ContextManifest | null;\n  enabled?: boolean;\n}) {\n  const [open, setOpen] = useState(false);\n  const [optimistic, setOptimistic] = useState<\n    Map<string, ContextSegmentStatus>\n  >(new Map());\n  const currentThreadId = useRef(threadId);\n  const shouldQuery = Boolean(threadId && enabled && !providedManifest);\n  const query = useActionQuery(\n    \"context-manifest-get\",\n    shouldQuery && threadId ? { threadId } : undefined,\n    {\n      enabled: shouldQuery,\n      staleTime: 1000,\n    },\n  ) as { data?: ContextManifest };\n  const pin = useActionMutation(\"context-pin\");\n  const evict = useActionMutation(\"context-evict\");\n  const restore = useActionMutation(\"context-restore\");\n\n  useEffect(() => {\n    currentThreadId.current = threadId;\n    setOptimistic(new Map());\n  }, [threadId]);\n\n  useEffect(() => {\n    if (!threadId || !enabled || typeof window === \"undefined\") return;\n    const params = new URLSearchParams(window.location.search);\n    const wantsXray = params.get(\"contextXray\") === \"1\";\n    const targetThread = params.get(\"threadId\");\n    if (wantsXray && (!targetThread || targetThread === threadId)) {\n      setOpen(true);\n    }\n  }, [enabled, threadId]);\n\n  const manifest = providedManifest ?? query.data;\n  const contextWindow = resolveContextWindow(manifest?.model);\n  const pct = manifest\n    ? Math.min(100, Math.round((manifest.totalTokens / contextWindow) * 100))\n    : 0;\n  const systemTokens = manifest ? manifestSystemTokens(manifest) : 0;\n  const conversationTokens = manifest\n    ? manifestConversationTokens(manifest)\n    : 0;\n\n  if (\n    (!shouldQuery && !providedManifest) ||\n    !manifest ||\n    (manifest.rawTokens <= 0 && manifest.totalTokens <= 0)\n  ) {\n    return null;\n  }\n\n  const mutateStatus = (\n    segmentId: string,\n    status: ContextSegmentStatus,\n    action: \"pin\" | \"evict\" | \"restore\",\n  ) => {\n    const previous = new Map(optimistic);\n    setOptimistic((prev) => new Map(prev).set(segmentId, status));\n    const params = { threadId, segmentId };\n    const options = {\n      onError: () => {\n        if (currentThreadId.current === threadId) {\n          setOptimistic(previous);\n        }\n      },\n    };\n    if (action === \"pin\") pin.mutate(params, options);\n    if (action === \"evict\") evict.mutate(params, options);\n    if (action === \"restore\") restore.mutate(params, options);\n  };\n\n  return (\n    <TooltipProvider delayDuration={200}>\n      <Popover open={open} onOpenChange={setOpen}>\n        <Tooltip>\n          <TooltipTrigger asChild>\n            <PopoverTrigger asChild>\n              <button\n                type=\"button\"\n                aria-label={`Context ${pct}%, ${formatTokens(\n                  manifest.totalTokens,\n                )}${systemTokens > 0 ? ` total: ${formatTokens(systemTokens)} system + ${formatTokens(conversationTokens)} conversation` : \"\"}. Open Context X-Ray.`}\n                className={cn(\n                  \"flex size-7 shrink-0 cursor-pointer items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent/50 hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring\",\n                  open && \"bg-accent/60 text-foreground\",\n                )}\n              >\n                <ContextDonut pct={pct} advisory={!manifest.enforceable} />\n              </button>\n            </PopoverTrigger>\n          </TooltipTrigger>\n          <TooltipContent>\n            Context {pct}% · {formatTokens(manifest.totalTokens)}\n            {systemTokens > 0\n              ? ` (${formatTokens(systemTokens)} system + ${formatTokens(conversationTokens)} conversation)`\n              : \"\"}\n          </TooltipContent>\n        </Tooltip>\n        <PopoverContent\n          align=\"end\"\n          side=\"top\"\n          sideOffset={8}\n          className=\"w-[min(92vw,380px)] overflow-hidden border-border/70 p-0\"\n        >\n          {open ? (\n            <Suspense\n              fallback={\n                <div className=\"flex h-52 items-center justify-center text-xs text-muted-foreground\">\n                  Loading context view…\n                </div>\n              }\n            >\n              <ContextXRayPanel\n                manifest={manifest}\n                optimistic={optimistic}\n                onPin={(segmentId) => mutateStatus(segmentId, \"pinned\", \"pin\")}\n                onEvict={(segmentId) =>\n                  mutateStatus(segmentId, \"evicted\", \"evict\")\n                }\n                onRestore={(segmentId) =>\n                  mutateStatus(segmentId, \"active\", \"restore\")\n                }\n              />\n            </Suspense>\n          ) : null}\n        </PopoverContent>\n      </Popover>\n    </TooltipProvider>\n  );\n}\n"]}

package/dist/client/context-xray/ContextTreemap.d.ts

@@ -1,6 +1,7 @@
-import type { ContextManifestSegment } from "../../shared/context-xray.js";
-export declare function ContextTreemap({ segments, onSelect, }: {
+import type { ContextManifestSegment, ContextManifestSystemSection } from "../../shared/context-xray.js";
+export declare function ContextTreemap({ segments, systemSections, onSelect, }: {
     segments: ContextManifestSegment[];
+    systemSections?: ContextManifestSystemSection[];
     onSelect?: (segmentId: string) => void;
 }): import("react").JSX.Element;
 //# sourceMappingURL=ContextTreemap.d.ts.map

package/dist/client/context-xray/ContextTreemap.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ContextTreemap.d.ts","sourceRoot":"","sources":["../../../src/client/context-xray/ContextTreemap.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,8BAA8B,CAAC;AA4C3E,wBAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,sBAAsB,EAAE,CAAC;IACnC,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CACxC,+BA4DA"}
+{"version":3,"file":"ContextTreemap.d.ts","sourceRoot":"","sources":["../../../src/client/context-xray/ContextTreemap.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,sBAAsB,EACtB,4BAA4B,EAC7B,MAAM,8BAA8B,CAAC;AA4CtC,wBAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,cAAmB,EACnB,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,sBAAsB,EAAE,CAAC;IACnC,cAAc,CAAC,EAAE,4BAA4B,EAAE,CAAC;IAChD,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CACxC,+BAsEA"}

package/dist/client/context-xray/ContextTreemap.js

@@ -9,7 +9,7 @@ function TreemapContent(props) {
     const showLabel = width > 90 && height > 42;
     return (_jsxs("g", { children: [_jsx("rect", { x: x, y: y, width: width, height: height, rx: 3, ry: 3, fill: groupFill(group), stroke: "var(--background)", strokeWidth: 2 }), showLabel && (_jsx("foreignObject", { x: x + 6, y: y + 6, width: width - 12, height: height - 12, children: _jsxs("div", { className: "flex h-full flex-col justify-between overflow-hidden text-[11px] leading-tight text-white", children: [_jsx("div", { className: "truncate font-medium", children: name }), _jsx("div", { className: "text-white/85", children: formatTokens(size) })] }) }))] }));
 }
-export function ContextTreemap({ segments, onSelect, }) {
+export function ContextTreemap({ segments, systemSections = [], onSelect, }) {
     const containerRef = useRef(null);
     const [chartWidth, setChartWidth] = useState(0);
     const data = segments
@@ -20,6 +20,14 @@ export function ContextTreemap({ segments, onSelect, }) {
         group: segment.group,
         segmentId: segment.segmentId,
     }));
+    data.push(...systemSections
+        .filter((section) => section.tokenCount > 0)
+        .map((section) => ({
+        name: section.label,
+        size: section.tokenCount,
+        group: `System · ${section.governance}`,
+        segmentId: section.segmentId,
+    })));
     useEffect(() => {
         const element = containerRef.current;
         if (!element)

package/dist/client/context-xray/ContextTreemap.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextTreemap.js","sourceRoot":"","sources":["../../../src/client/context-xray/ContextTreemap.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { Treemap } from \"recharts\";\n\nimport type { ContextManifestSegment } from \"../../shared/context-xray.js\";\nimport { formatTokens, groupFill } from \"./format.js\";\n\ninterface TreemapDatum {\n  name: string;\n  size: number;\n  group: string;\n  segmentId: string;\n}\n\nfunction TreemapContent(props: any) {\n  const { x, y, width, height, name, group, size } = props;\n  if (width < 8 || height < 8) return null;\n  const showLabel = width > 90 && height > 42;\n  return (\n    <g>\n      <rect\n        x={x}\n        y={y}\n        width={width}\n        height={height}\n        rx={3}\n        ry={3}\n        fill={groupFill(group)}\n        stroke=\"var(--background)\"\n        strokeWidth={2}\n      />\n      {showLabel && (\n        <foreignObject\n          x={x + 6}\n          y={y + 6}\n          width={width - 12}\n          height={height - 12}\n        >\n          <div className=\"flex h-full flex-col justify-between overflow-hidden text-[11px] leading-tight text-white\">\n            <div className=\"truncate font-medium\">{name}</div>\n            <div className=\"text-white/85\">{formatTokens(size)}</div>\n          </div>\n        </foreignObject>\n      )}\n    </g>\n  );\n}\n\nexport function ContextTreemap({\n  segments,\n  onSelect,\n}: {\n  segments: ContextManifestSegment[];\n  onSelect?: (segmentId: string) => void;\n}) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const [chartWidth, setChartWidth] = useState(0);\n  const data: TreemapDatum[] = segments\n    .filter((segment) => segment.status !== \"evicted\" && segment.tokenCount > 0)\n    .map((segment) => ({\n      name: segment.label,\n      size: segment.tokenCount,\n      group: segment.group,\n      segmentId: segment.segmentId,\n    }));\n\n  useEffect(() => {\n    const element = containerRef.current;\n    if (!element) return;\n\n    const updateWidth = () => {\n      setChartWidth(Math.max(0, Math.floor(element.clientWidth - 8)));\n    };\n    updateWidth();\n\n    const observer =\n      typeof ResizeObserver !== \"undefined\"\n        ? new ResizeObserver(updateWidth)\n        : null;\n    observer?.observe(element);\n    window.addEventListener(\"resize\", updateWidth);\n    return () => {\n      observer?.disconnect();\n      window.removeEventListener(\"resize\", updateWidth);\n    };\n  }, []);\n\n  if (data.length === 0) {\n    return (\n      <div className=\"flex h-52 items-center justify-center rounded-md bg-muted/30 text-xs text-muted-foreground\">\n        No active segments\n      </div>\n    );\n  }\n\n  return (\n    <div ref={containerRef} className=\"h-56 min-w-0 rounded-md bg-muted/25 p-1\">\n      {chartWidth > 0 && (\n        <Treemap\n          width={chartWidth}\n          height={216}\n          data={data as any}\n          dataKey=\"size\"\n          nameKey=\"name\"\n          aspectRatio={4 / 3}\n          isAnimationActive={false}\n          content={<TreemapContent />}\n          onClick={(datum: any) => {\n            if (datum?.segmentId) onSelect?.(datum.segmentId);\n          }}\n        />\n      )}\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"ContextTreemap.js","sourceRoot":"","sources":["../../../src/client/context-xray/ContextTreemap.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { Treemap } from \"recharts\";\n\nimport type {\n  ContextManifestSegment,\n  ContextManifestSystemSection,\n} from \"../../shared/context-xray.js\";\nimport { formatTokens, groupFill } from \"./format.js\";\n\ninterface TreemapDatum {\n  name: string;\n  size: number;\n  group: string;\n  segmentId: string;\n}\n\nfunction TreemapContent(props: any) {\n  const { x, y, width, height, name, group, size } = props;\n  if (width < 8 || height < 8) return null;\n  const showLabel = width > 90 && height > 42;\n  return (\n    <g>\n      <rect\n        x={x}\n        y={y}\n        width={width}\n        height={height}\n        rx={3}\n        ry={3}\n        fill={groupFill(group)}\n        stroke=\"var(--background)\"\n        strokeWidth={2}\n      />\n      {showLabel && (\n        <foreignObject\n          x={x + 6}\n          y={y + 6}\n          width={width - 12}\n          height={height - 12}\n        >\n          <div className=\"flex h-full flex-col justify-between overflow-hidden text-[11px] leading-tight text-white\">\n            <div className=\"truncate font-medium\">{name}</div>\n            <div className=\"text-white/85\">{formatTokens(size)}</div>\n          </div>\n        </foreignObject>\n      )}\n    </g>\n  );\n}\n\nexport function ContextTreemap({\n  segments,\n  systemSections = [],\n  onSelect,\n}: {\n  segments: ContextManifestSegment[];\n  systemSections?: ContextManifestSystemSection[];\n  onSelect?: (segmentId: string) => void;\n}) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const [chartWidth, setChartWidth] = useState(0);\n  const data: TreemapDatum[] = segments\n    .filter((segment) => segment.status !== \"evicted\" && segment.tokenCount > 0)\n    .map((segment) => ({\n      name: segment.label,\n      size: segment.tokenCount,\n      group: segment.group,\n      segmentId: segment.segmentId,\n    }));\n  data.push(\n    ...systemSections\n      .filter((section) => section.tokenCount > 0)\n      .map((section) => ({\n        name: section.label,\n        size: section.tokenCount,\n        group: `System · ${section.governance}`,\n        segmentId: section.segmentId,\n      })),\n  );\n\n  useEffect(() => {\n    const element = containerRef.current;\n    if (!element) return;\n\n    const updateWidth = () => {\n      setChartWidth(Math.max(0, Math.floor(element.clientWidth - 8)));\n    };\n    updateWidth();\n\n    const observer =\n      typeof ResizeObserver !== \"undefined\"\n        ? new ResizeObserver(updateWidth)\n        : null;\n    observer?.observe(element);\n    window.addEventListener(\"resize\", updateWidth);\n    return () => {\n      observer?.disconnect();\n      window.removeEventListener(\"resize\", updateWidth);\n    };\n  }, []);\n\n  if (data.length === 0) {\n    return (\n      <div className=\"flex h-52 items-center justify-center rounded-md bg-muted/30 text-xs text-muted-foreground\">\n        No active segments\n      </div>\n    );\n  }\n\n  return (\n    <div ref={containerRef} className=\"h-56 min-w-0 rounded-md bg-muted/25 p-1\">\n      {chartWidth > 0 && (\n        <Treemap\n          width={chartWidth}\n          height={216}\n          data={data as any}\n          dataKey=\"size\"\n          nameKey=\"name\"\n          aspectRatio={4 / 3}\n          isAnimationActive={false}\n          content={<TreemapContent />}\n          onClick={(datum: any) => {\n            if (datum?.segmentId) onSelect?.(datum.segmentId);\n          }}\n        />\n      )}\n    </div>\n  );\n}\n"]}

package/dist/client/context-xray/ContextXRayPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ContextXRayPanel.d.ts","sourceRoot":"","sources":["../../../src/client/context-xray/ContextXRayPanel.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EACV,eAAe,EAEf,oBAAoB,EACrB,MAAM,8BAA8B,CAAC;AA8DtC,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,UAAU,EACV,KAAK,EACL,OAAO,EACP,SAAS,GACV,EAAE;IACD,QAAQ,EAAE,eAAe,CAAC;IAC1B,UAAU,EAAE,GAAG,CAAC,MAAM,EAAE,oBAAoB,CAAC,CAAC;IAC9C,KAAK,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,OAAO,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,SAAS,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CACxC,+BAuKA"}
+{"version":3,"file":"ContextXRayPanel.d.ts","sourceRoot":"","sources":["../../../src/client/context-xray/ContextXRayPanel.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EACV,eAAe,EAGf,oBAAoB,EACrB,MAAM,8BAA8B,CAAC;AAkItC,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,UAAU,EACV,KAAK,EACL,OAAO,EACP,SAAS,GACV,EAAE;IACD,QAAQ,EAAE,eAAe,CAAC;IAC1B,UAAU,EAAE,GAAG,CAAC,MAAM,EAAE,oBAAoB,CAAC,CAAC;IAC9C,KAAK,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,OAAO,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,SAAS,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CACxC,+BAsQA"}

package/dist/client/context-xray/ContextXRayPanel.js

@@ -1,7 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { IconChartTreemap, IconChevronDown, IconChevronRight, IconListDetails, } from "@tabler/icons-react";
+import { IconChartTreemap, IconChevronDown, IconChevronRight, IconLock, IconListDetails, } from "@tabler/icons-react";
 import { useMemo, useState } from "react";
+import { manifestConversationTokens, manifestSystemTokens, } from "../../shared/context-xray.js";
 import { Tooltip, TooltipContent, TooltipTrigger, } from "../components/ui/tooltip.js";
+import { useT } from "../i18n.js";
 import { cn } from "../utils.js";
 import { ContextSegmentRow } from "./ContextSegmentRow.js";
 import { ContextTreemap } from "./ContextTreemap.js";
@@ -47,18 +49,71 @@ function groupedSegments(segments) {
         return b.tokens - a.tokens;
     });
 }
+const GOVERNANCE_ORDER = ["required", "inherited", "user"];
+function governanceLabel(governance, t) {
+    switch (governance) {
+        case "required":
+            return t("contextXray.governance.required", {
+                defaultValue: "Required",
+            });
+        case "inherited":
+            return t("contextXray.governance.inherited", {
+                defaultValue: "Inherited",
+            });
+        case "user":
+            return t("contextXray.governance.user", {
+                defaultValue: "Your context",
+            });
+    }
+}
+function sourceLabel(section) {
+    return (section.sourceRef?.path ??
+        section.sourceRef?.resourceId ??
+        section.sourceRef?.scope ??
+        "framework");
+}
+function SystemSectionRow({ section, totalTokens, }) {
+    const share = totalTokens > 0 ? Math.round((section.tokenCount / totalTokens) * 100) : 0;
+    return (_jsxs("div", { className: "flex min-h-12 items-start gap-2 rounded-sm px-2 py-1.5", children: [_jsx("span", { className: "mt-1 flex size-6 shrink-0 items-center justify-center rounded-md text-muted-foreground", children: _jsx(IconLock, { className: "h-3.5 w-3.5" }) }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: "truncate text-[13px] font-medium leading-5 text-foreground", children: section.label }), _jsxs("div", { className: "truncate text-[11px] text-muted-foreground", children: [sourceLabel(section), " \u00B7 ", formatTokens(section.tokenCount), " tokens \u00B7", " ", share, "%", section.tokenMethod === "estimate" ? " · estimated" : ""] }), section.preview ? (_jsx("div", { className: "mt-0.5 line-clamp-2 text-[11px] text-muted-foreground/80", children: section.preview })) : null] })] }));
+}
 export function ContextXRayPanel({ manifest, optimistic, onPin, onEvict, onRestore, }) {
+    const t = useT();
     const [mode, setMode] = useState("list");
     const [collapsed, setCollapsed] = useState(new Set());
     const segments = useMemo(() => applyOptimisticStatus(manifest.segments, optimistic), [manifest.segments, optimistic]);
     const groups = useMemo(() => groupedSegments(segments), [segments]);
+    const systemSections = manifest.systemSections ?? [];
+    const systemGroups = useMemo(() => {
+        const grouped = new Map();
+        for (const section of systemSections) {
+            const list = grouped.get(section.governance) ?? [];
+            list.push(section);
+            grouped.set(section.governance, list);
+        }
+        return GOVERNANCE_ORDER.flatMap((governance) => {
+            const sections = grouped.get(governance);
+            return sections && sections.length > 0
+                ? [
+                    {
+                        governance,
+                        sections,
+                        tokens: sections.reduce((sum, section) => sum + section.tokenCount, 0),
+                    },
+                ]
+                : [];
+        });
+    }, [systemSections]);
     const contextWindow = resolveContextWindow(manifest.model);
     const pct = Math.min(100, Math.round((manifest.totalTokens / contextWindow) * 100));
     const headroom = Math.max(0, contextWindow - manifest.totalTokens);
     const pinned = segments.filter((s) => s.status === "pinned").length;
     const evicted = segments.filter((s) => s.status === "evicted").length;
+    const systemTokens = manifestSystemTokens(manifest);
+    const conversationTokens = manifestConversationTokens(manifest);
     const details = [
         `${formatTokens(headroom)} free`,
+        systemTokens > 0 ? `${formatTokens(systemTokens)} system` : null,
+        `${formatTokens(conversationTokens)} conversation`,
         pinned > 0 ? `${pinned} pinned` : null,
         evicted > 0 ? `${evicted} evicted` : null,
         manifest.tokenCountMethod === "estimate" ? "estimated" : null,
@@ -67,29 +122,49 @@ export function ContextXRayPanel({ manifest, optimistic, onPin, onEvict, onResto
     return (_jsxs("div", { className: "flex max-h-[min(72vh,520px)] flex-col", children: [_jsxs("div", { className: "border-b border-border/60 px-3 py-2.5", children: [_jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsx("h2", { className: "min-w-0 truncate text-sm font-medium text-foreground", children: "Context X-Ray" }), _jsxs("div", { className: "shrink-0 text-xs tabular-nums text-muted-foreground", children: [formatTokens(manifest.totalTokens), " \u00B7 ", pct, "%"] })] }), _jsx("div", { className: "mt-2 h-1 overflow-hidden rounded-full bg-muted/70", children: _jsx("div", { className: "h-full rounded-full bg-foreground origin-left transition-transform duration-200", style: {
                                 transform: `scaleX(${Math.min(1, pct / 100)})`,
                                 width: "100%",
-                            } }) }), _jsxs("div", { className: "mt-1.5 flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] text-muted-foreground", children: [details.map((detail) => (_jsx("span", { children: detail }, detail))), manifest.reclaimedTokens > 0 && (_jsxs("span", { className: "font-medium text-emerald-600 dark:text-emerald-400", children: ["-", formatTokens(manifest.reclaimedTokens)] }))] })] }), _jsxs("div", { className: "overflow-y-auto px-2 py-2", children: [_jsx("div", { className: "mb-1 flex items-center justify-end", children: _jsxs("div", { className: "inline-flex rounded-md bg-muted/40 p-0.5", children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", onClick: () => setMode("list"), "aria-label": "Show context list", className: cn("flex size-7 items-center justify-center rounded text-muted-foreground", mode === "list"
+                            } }) }), _jsxs("div", { className: "mt-1.5 flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] text-muted-foreground", children: [details.map((detail) => (_jsx("span", { children: detail }, detail))), manifest.reclaimedTokens > 0 && (_jsxs("span", { className: "font-medium text-emerald-600 dark:text-emerald-400", children: ["-", formatTokens(manifest.reclaimedTokens)] }))] })] }), _jsxs("div", { className: "overflow-y-auto px-2 py-2", children: [_jsx("div", { className: "mb-1 flex items-center justify-end", children: _jsxs("div", { className: "inline-flex rounded-md bg-muted/40 p-0.5", children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", onClick: () => setMode("list"), "aria-label": "Show context list", className: cn("flex size-7 cursor-pointer items-center justify-center rounded text-muted-foreground", mode === "list"
                                                     ? "bg-background text-foreground shadow-sm"
-                                                    : "hover:text-foreground"), children: _jsx(IconListDetails, { className: "h-3.5 w-3.5" }) }) }), _jsx(TooltipContent, { children: "List" })] }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", onClick: () => setMode("map"), "aria-label": "Show context map", className: cn("flex size-7 items-center justify-center rounded text-muted-foreground", mode === "map"
+                                                    : "hover:text-foreground"), children: _jsx(IconListDetails, { className: "h-3.5 w-3.5" }) }) }), _jsx(TooltipContent, { children: "List" })] }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", onClick: () => setMode("map"), "aria-label": "Show context map", className: cn("flex size-7 cursor-pointer items-center justify-center rounded text-muted-foreground", mode === "map"
                                                     ? "bg-background text-foreground shadow-sm"
-                                                    : "hover:text-foreground"), children: _jsx(IconChartTreemap, { className: "h-3.5 w-3.5" }) }) }), _jsx(TooltipContent, { children: "Map" })] })] }) }), mode === "map" ? (_jsx(ContextTreemap, { segments: segments, onSelect: (segmentId) => {
+                                                    : "hover:text-foreground"), children: _jsx(IconChartTreemap, { className: "h-3.5 w-3.5" }) }) }), _jsx(TooltipContent, { children: "Map" })] })] }) }), mode === "map" ? (_jsx(ContextTreemap, { segments: segments, systemSections: systemSections, onSelect: (segmentId) => {
                             const segment = segments.find((s) => s.segmentId === segmentId);
                             if (segment)
                                 setCollapsed(new Set());
-                        } })) : (_jsx("div", { className: "divide-y divide-border/60", children: groups.map((group) => {
-                            const isCollapsed = collapsed.has(group.name);
-                            return (_jsxs("div", { children: [_jsxs("button", { type: "button", onClick: () => {
-                                            setCollapsed((prev) => {
-                                                const next = new Set(prev);
-                                                if (next.has(group.name))
-                                                    next.delete(group.name);
-                                                else
-                                                    next.add(group.name);
-                                                return next;
-                                            });
-                                        }, className: "flex w-full items-center gap-2 rounded-sm px-1.5 py-2 text-left hover:bg-accent/35", children: [isCollapsed ? (_jsx(IconChevronRight, { className: "h-3.5 w-3.5 text-muted-foreground" })) : (_jsx(IconChevronDown, { className: "h-3.5 w-3.5 text-muted-foreground" })), _jsx("span", { className: cn("h-2 w-2 rounded-full", groupColor(group.name)) }), _jsx("span", { className: "min-w-0 flex-1 truncate text-xs font-medium", children: group.name }), _jsx("span", { className: "text-[11px] text-muted-foreground", children: formatTokens(group.tokens) })] }), !isCollapsed && (_jsx("div", { className: "pb-1", children: group.segments
-                                            .slice()
-                                            .sort((a, b) => b.tokenCount - a.tokenCount)
-                                            .map((segment) => (_jsx(ContextSegmentRow, { segment: segment, advisory: !manifest.enforceable, onPin: () => onPin(segment.segmentId), onEvict: () => onEvict(segment.segmentId), onRestore: () => onRestore(segment.segmentId) }, segment.segmentId))) }))] }, group.name));
-                        }) }))] })] }));
+                        } })) : (_jsxs("div", { className: "divide-y divide-border/60", children: [systemGroups.length > 0 && (_jsxs("div", { children: [_jsx("div", { className: "px-1.5 pb-1 pt-2 text-[10px] font-semibold uppercase tracking-[0.12em] text-muted-foreground", children: t("contextXray.systemOrdered", {
+                                            defaultValue: "System · ordered, not evictable",
+                                        }) }), systemGroups.map((group) => {
+                                        const groupKey = `system:${group.governance}`;
+                                        const isCollapsed = collapsed.has(groupKey);
+                                        return (_jsxs("div", { children: [_jsxs("button", { type: "button", onClick: () => {
+                                                        setCollapsed((prev) => {
+                                                            const next = new Set(prev);
+                                                            if (next.has(groupKey))
+                                                                next.delete(groupKey);
+                                                            else
+                                                                next.add(groupKey);
+                                                            return next;
+                                                        });
+                                                    }, className: "flex w-full cursor-pointer items-center gap-2 rounded-sm px-1.5 py-2 text-left hover:bg-accent/35", children: [isCollapsed ? (_jsx(IconChevronRight, { className: "h-3.5 w-3.5 text-muted-foreground" })) : (_jsx(IconChevronDown, { className: "h-3.5 w-3.5 text-muted-foreground" })), _jsx(IconLock, { className: "h-3 w-3 text-muted-foreground" }), _jsx("span", { className: "min-w-0 flex-1 truncate text-xs font-medium", children: governanceLabel(group.governance, t) }), _jsxs("span", { className: "text-[11px] text-muted-foreground", children: [formatTokens(group.tokens), " \u00B7", " ", manifest.totalTokens > 0
+                                                                    ? Math.round((group.tokens / manifest.totalTokens) * 100)
+                                                                    : 0, "%"] })] }), !isCollapsed && (_jsx("div", { className: "pb-1", children: group.sections
+                                                        .slice()
+                                                        .sort((a, b) => b.tokenCount - a.tokenCount)
+                                                        .map((section) => (_jsx(SystemSectionRow, { section: section, totalTokens: manifest.totalTokens }, section.segmentId))) }))] }, groupKey));
+                                    })] })), groups.map((group) => {
+                                const isCollapsed = collapsed.has(group.name);
+                                return (_jsxs("div", { children: [_jsxs("button", { type: "button", onClick: () => {
+                                                setCollapsed((prev) => {
+                                                    const next = new Set(prev);
+                                                    if (next.has(group.name))
+                                                        next.delete(group.name);
+                                                    else
+                                                        next.add(group.name);
+                                                    return next;
+                                                });
+                                            }, className: "flex w-full cursor-pointer items-center gap-2 rounded-sm px-1.5 py-2 text-left hover:bg-accent/35", children: [isCollapsed ? (_jsx(IconChevronRight, { className: "h-3.5 w-3.5 text-muted-foreground" })) : (_jsx(IconChevronDown, { className: "h-3.5 w-3.5 text-muted-foreground" })), _jsx("span", { className: cn("h-2 w-2 rounded-full", groupColor(group.name)) }), _jsx("span", { className: "min-w-0 flex-1 truncate text-xs font-medium", children: group.name }), _jsx("span", { className: "text-[11px] text-muted-foreground", children: formatTokens(group.tokens) })] }), !isCollapsed && (_jsx("div", { className: "pb-1", children: group.segments
+                                                .slice()
+                                                .sort((a, b) => b.tokenCount - a.tokenCount)
+                                                .map((segment) => (_jsx(ContextSegmentRow, { segment: segment, advisory: !manifest.enforceable, onPin: () => onPin(segment.segmentId), onEvict: () => onEvict(segment.segmentId), onRestore: () => onRestore(segment.segmentId) }, segment.segmentId))) }))] }, group.name));
+                            })] }))] })] }));
 }
 //# sourceMappingURL=ContextXRayPanel.js.map