npm - @agentprojectcontext/apx - Versions diffs - 1.34.0 → 1.36.0 - Mend

@agentprojectcontext/apx 1.34.0 → 1.36.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (75) hide show

package/package.json +1 -1
package/skills/apx/SKILL.md +1 -1
package/src/core/agent/build-agent-system.js +134 -58
package/src/core/agent/channels/voice-context.js +4 -4
package/src/core/agent/prompt-builder.js +176 -123
package/src/core/agent/prompts/channels/code.md +12 -10
package/src/core/agent/prompts/channels/desktop.md +5 -32
package/src/core/agent/prompts/channels/telegram.md +4 -15
package/src/core/agent/prompts/channels/web_code.md +11 -11
package/src/core/agent/prompts/core/agent-base.md +24 -0
package/src/core/agent/prompts/core/project-agent.md +11 -0
package/src/core/agent/prompts/core/super-agent.md +21 -0
package/src/core/agent/prompts/discipline/action.md +10 -0
package/src/core/agent/prompts/discipline/single-segment.md +6 -0
package/src/core/agent/prompts/discipline/two-segment.md +11 -0
package/src/core/agent/self-memory.js +43 -1
package/src/core/agent/skills/index-store.js +307 -0
package/src/core/agent/skills/index.js +15 -1
package/src/core/agent/skills/inspector.js +317 -0
package/src/core/agent/super-agent.js +7 -1
package/src/core/agent/tools/handlers/_git.js +50 -0
package/src/core/agent/tools/handlers/git-diff.js +44 -0
package/src/core/agent/tools/handlers/git-log.js +38 -0
package/src/core/agent/tools/handlers/git-show.js +34 -0
package/src/core/agent/tools/handlers/git-status.js +61 -0
package/src/core/agent/tools/names.js +31 -0
package/src/core/agent/tools/registry.js +36 -5
package/src/core/config/index.js +21 -0
package/src/core/runtime-skills/apx/SKILL.md +27 -39
package/src/core/runtime-skills/apx-agency-agents/SKILL.md +40 -56
package/src/core/runtime-skills/apx-agent/SKILL.md +27 -30
package/src/core/runtime-skills/apx-mcp/SKILL.md +31 -36
package/src/core/runtime-skills/apx-mcp-builder/SKILL.md +37 -51
package/src/core/runtime-skills/apx-project/SKILL.md +20 -29
package/src/core/runtime-skills/apx-routine/SKILL.md +34 -47
package/src/core/runtime-skills/apx-runtime/SKILL.md +32 -50
package/src/core/runtime-skills/apx-sessions/SKILL.md +96 -145
package/src/core/runtime-skills/apx-skill-builder/SKILL.md +53 -77
package/src/core/runtime-skills/apx-task/SKILL.md +18 -21
package/src/core/runtime-skills/apx-telegram/SKILL.md +43 -54
package/src/core/runtime-skills/apx-voice/SKILL.md +36 -56
package/src/core/stores/conversations.js +27 -2
package/src/host/daemon/api/exec.js +2 -0
package/src/host/daemon/api/skills.js +140 -6
package/src/host/daemon/api/super-agent.js +56 -1
package/src/host/daemon/index.js +17 -0
package/src/interfaces/cli/branding.js +53 -0
package/src/interfaces/cli/commands/skills.js +254 -0
package/src/interfaces/cli/index.js +84 -2
package/src/interfaces/web/dist/assets/index-Cm0KyPoZ.css +1 -0
package/src/interfaces/web/dist/assets/index-DJKA763h.js +628 -0
package/src/interfaces/web/dist/assets/index-DJKA763h.js.map +1 -0
package/src/interfaces/web/dist/index.html +2 -2
package/src/interfaces/web/src/App.tsx +0 -1
package/src/interfaces/web/src/components/chat/ChatList.tsx +412 -0
package/src/interfaces/web/src/components/chat/MessageBubble.tsx +21 -1
package/src/interfaces/web/src/components/settings/AppearancePanel.tsx +1 -1
package/src/interfaces/web/src/components/settings/MemoryPanel.tsx +69 -1
package/src/interfaces/web/src/components/settings/SkillsInspectorPanel.tsx +222 -0
package/src/interfaces/web/src/hooks/useChat.ts +54 -2
package/src/interfaces/web/src/i18n/en.ts +12 -1
package/src/interfaces/web/src/i18n/es.ts +12 -1
package/src/interfaces/web/src/lib/api/agents.ts +1 -1
package/src/interfaces/web/src/lib/api/skills.ts +70 -0
package/src/interfaces/web/src/screens/ProjectScreen.tsx +3 -5
package/src/interfaces/web/src/screens/SettingsScreen.tsx +12 -6
package/src/interfaces/web/src/screens/modules/VoiceScreen.tsx +1 -1
package/src/interfaces/web/src/screens/project/ChatTab.tsx +120 -87
package/src/interfaces/web/src/types/daemon.ts +10 -0
package/src/core/agent/prompts/action-discipline.md +0 -24
package/src/core/agent/prompts/super-agent-base.md +0 -42
package/src/interfaces/web/dist/assets/index-DdmSRtsz.css +0 -1
package/src/interfaces/web/dist/assets/index-M4FspaCH.js +0 -613
package/src/interfaces/web/dist/assets/index-M4FspaCH.js.map +0 -1
package/src/interfaces/web/src/screens/project/ThreadsTab.tsx +0 -100

package/src/interfaces/web/dist/index.html CHANGED Viewed

@@ -18,8 +18,8 @@
     <link rel="apple-touch-icon" href="/favicon/dark/apple-touch-icon.png" media="(prefers-color-scheme: dark)" />
     <link rel="manifest" href="/favicon/white/site.webmanifest" media="(prefers-color-scheme: light)" />
     <link rel="manifest" href="/favicon/dark/site.webmanifest" media="(prefers-color-scheme: dark)" />
-    <script type="module" crossorigin src="/assets/index-M4FspaCH.js"></script>
-    <link rel="stylesheet" crossorigin href="/assets/index-DdmSRtsz.css">
+    <script type="module" crossorigin src="/assets/index-DJKA763h.js"></script>
+    <link rel="stylesheet" crossorigin href="/assets/index-Cm0KyPoZ.css">
   </head>
   <body class="bg-background text-foreground antialiased">
     <div id="root"></div>

package/src/interfaces/web/src/App.tsx CHANGED Viewed

@@ -179,7 +179,6 @@ function settingsLabel(key?: string) {
 function projectLabel(key?: string) {
   switch (key) {
     case "chat": return t("project.nav.chat");
-    case "threads": return t("project.nav.threads");
     case "telegram": return t("project.nav.telegram");
     case "agents": return t("project.nav.agents");
     case "routines": return t("project.nav.routines");

package/src/interfaces/web/src/components/chat/ChatList.tsx ADDED Viewed

@@ -0,0 +1,412 @@
+import { useEffect, useMemo, useState, type ElementType } from "react";
+import useSWR from "swr";
+import clsx from "clsx";
+import {
+  Bot,
+  ChevronDown,
+  ChevronRight,
+  Clock,
+  FolderOpen,
+  MessageSquare,
+  Mic,
+  Monitor,
+  Plus,
+  Send,
+  Sparkles,
+  Timer,
+  User,
+} from "lucide-react";
+import { Conversations } from "../../lib/api";
+import { Input, Loading } from "../ui";
+import { UiSelect } from "../UiSelect";
+import { t } from "../../i18n";
+import type { AgentEntry, ConversationListEntry } from "../../types/daemon";
+// Channel taxonomy — same channels the daemon writes ("web", "voice",
+// "desktop", "telegram", …) folded into 8 sidebar groups. Each group has an
+// icon + a fixed display order so the sidebar is stable across reloads.
+export type ChannelGroupKey =
+  | "live"
+  | "telegram"
+  | "voice"
+  | "desktop"
+  | "web"
+  | "a2a"
+  | "schedule"
+  | "other";
+interface GroupMeta {
+  label: string;
+  icon: ElementType;
+  order: number;
+}
+const GROUP_META: Record<ChannelGroupKey, GroupMeta> = {
+  live:     { label: "Live", icon: Sparkles, order: 0 },
+  telegram: { label: "Telegram", icon: Send, order: 1 },
+  voice:    { label: "Voice", icon: Mic, order: 2 },
+  desktop:  { label: "Desktop", icon: Monitor, order: 3 },
+  web:      { label: "Web", icon: MessageSquare, order: 4 },
+  a2a:      { label: "Agent ↔ Agent", icon: Bot, order: 5 },
+  schedule: { label: "Schedule", icon: Timer, order: 6 },
+  other:    { label: "Other", icon: FolderOpen, order: 7 },
+};
+function channelGroup(channel?: string): ChannelGroupKey {
+  if (!channel) return "web";
+  const c = channel.toLowerCase();
+  if (c === "telegram") return "telegram";
+  if (c === "voice" || c === "overlay") return "voice";
+  if (c === "desktop") return "desktop";
+  if (c === "web" || c === "sidebar" || c === "web-sidebar") return "web";
+  if (c === "a2a" || c.startsWith("agent")) return "a2a";
+  if (c === "schedule" || c === "cron" || c === "routine") return "schedule";
+  return "other";
+}
+// Composite key identifying a sidebar selection: either a "live" agent session
+// (no conversation file yet) or a persisted conversation tied to an agent.
+export type ChatKey =
+  | { kind: "live"; agentSlug: string }
+  | { kind: "conv"; agentSlug: string; convId: string };
+export function chatKeyToString(k: ChatKey): string {
+  return k.kind === "live" ? `live:${k.agentSlug}` : `conv:${k.agentSlug}:${k.convId}`;
+}
+interface Props {
+  pid: string;
+  agents: AgentEntry[];
+  /** Virtual super-agent slug used by the dropdown (kept in sync with ChatTab). */
+  superAgentSlug: string;
+  superAgentLabel: string;
+  selected: ChatKey;
+  onSelect: (key: ChatKey) => void;
+  onNewChat: () => void;
+}
+// Per-agent SWR fetcher. Lives in a child so adding/removing agents doesn't
+// violate the rules of hooks in the parent.
+function AgentConvFetcher({
+  pid,
+  slug,
+  onLoaded,
+}: {
+  pid: string;
+  slug: string;
+  onLoaded: (slug: string, data: ConversationListEntry[] | undefined) => void;
+}) {
+  const { data } = useSWR(
+    `/projects/${pid}/agents/${slug}/conversations`,
+    () => Conversations.list(pid, slug),
+    { revalidateOnFocus: false },
+  );
+  // Bubble fetched data up to the parent on every change.
+  useEffect(() => {
+    onLoaded(slug, data);
+  }, [slug, data]); // eslint-disable-line react-hooks/exhaustive-deps
+  return null;
+}
+export function ChatList({
+  pid,
+  agents,
+  superAgentSlug,
+  superAgentLabel,
+  selected,
+  onSelect,
+  onNewChat,
+}: Props) {
+  const [query, setQuery] = useState("");
+  const [agentFilter, setAgentFilter] = useState("");
+  const [collapsed, setCollapsed] = useState<Partial<Record<ChannelGroupKey, boolean>>>({});
+  const [byAgent, setByAgent] = useState<Record<string, ConversationListEntry[]>>({});
+  const handleLoaded = (slug: string, data: ConversationListEntry[] | undefined) => {
+    if (!data) return;
+    setByAgent((prev) => {
+      const cur = prev[slug];
+      if (cur && cur.length === data.length && cur === data) return prev;
+      return { ...prev, [slug]: data };
+    });
+  };
+  const allConvs = useMemo<ConversationListEntry[]>(() => {
+    const out: ConversationListEntry[] = [];
+    for (const a of agents) {
+      for (const c of byAgent[a.slug] || []) {
+        out.push({ ...c, agent_slug: c.agent_slug || a.slug });
+      }
+    }
+    return out;
+  }, [agents, byAgent]);
+  const filteredConvs = useMemo(() => {
+    const q = query.trim().toLowerCase();
+    return allConvs.filter((c) => {
+      if (agentFilter && c.agent_slug !== agentFilter) return false;
+      if (q) {
+        const hay = `${c.title || ""} ${c.id} ${c.agent_slug}`.toLowerCase();
+        if (!hay.includes(q)) return false;
+      }
+      return true;
+    });
+  }, [allConvs, query, agentFilter]);
+  // Group: live entries (one per applicable agent) + stored conversations by channel.
+  const groups = useMemo(() => {
+    const byKey = new Map<ChannelGroupKey, ConversationListEntry[]>();
+    for (const c of filteredConvs) {
+      const key = channelGroup(c.channel);
+      const bucket = byKey.get(key);
+      if (bucket) bucket.push(c);
+      else byKey.set(key, [c]);
+    }
+    return Array.from(byKey.entries())
+      .map(([key, items]) => ({
+        key,
+        items: items.sort(
+          (a, b) => new Date(b.started_at || 0).getTime() - new Date(a.started_at || 0).getTime(),
+        ),
+      }))
+      .sort((a, b) => GROUP_META[a.key].order - GROUP_META[b.key].order);
+  }, [filteredConvs]);
+  // "Live" agents shown at the top: super-agent + project agents matching the
+  // current agent filter (so "filter by foo" hides the others everywhere).
+  const liveAgents = useMemo(() => {
+    if (agentFilter === superAgentSlug) {
+      return [{ slug: superAgentSlug, label: superAgentLabel }];
+    }
+    const out: { slug: string; label: string }[] = [];
+    if (!agentFilter) out.push({ slug: superAgentSlug, label: superAgentLabel });
+    for (const a of agents) {
+      if (agentFilter && a.slug !== agentFilter) continue;
+      out.push({ slug: a.slug, label: a.slug });
+    }
+    return out;
+  }, [agents, agentFilter, superAgentSlug, superAgentLabel]);
+  const agentOptions = useMemo(
+    () => [
+      { value: "", label: t("project.chat.list.all_agents") },
+      { value: superAgentSlug, label: superAgentLabel },
+      ...agents.map((a) => ({ value: a.slug, label: a.slug })),
+    ],
+    [agents, superAgentSlug, superAgentLabel],
+  );
+  const totalCount = allConvs.length + liveAgents.length;
+  const anyLoaded = Object.keys(byAgent).length > 0 || agents.length === 0;
+  return (
+    <aside className="flex h-full w-72 shrink-0 flex-col border-r border-border bg-card/30">
+      {/* Hidden per-agent fetchers — one SWR per agent, but with a stable
+          component per slug so rules-of-hooks are respected. */}
+      {agents.map((a) => (
+        <AgentConvFetcher key={a.slug} pid={pid} slug={a.slug} onLoaded={handleLoaded} />
+      ))}
+      <header className="flex h-[57px] shrink-0 items-center justify-between gap-2 border-b border-border px-3">
+        <div className="min-w-0">
+          <p className="truncate text-sm font-semibold">{t("project.chat.list.title")}</p>
+          <p className="text-[10px] text-muted-fg">
+            {t("project.chat.list.count", { n: totalCount })}
+          </p>
+        </div>
+        <button
+          type="button"
+          onClick={onNewChat}
+          className="inline-flex items-center gap-1 rounded-md border border-border bg-accent/60 px-2 py-1 text-[11px] font-medium hover:bg-accent"
+        >
+          <Plus className="size-3" /> {t("project.chat.list.new")}
+        </button>
+      </header>
+      <div className="space-y-2 border-b border-border p-2">
+        <Input
+          value={query}
+          onChange={(e) => setQuery(e.target.value)}
+          placeholder={t("project.chat.list.search")}
+        />
+        <UiSelect value={agentFilter} onChange={setAgentFilter} options={agentOptions} />
+      </div>
+      <div className="flex-1 space-y-3 overflow-y-auto p-2">
+        {!anyLoaded && (
+          <div className="px-2 py-1">
+            <Loading />
+          </div>
+        )}
+        {/* Live group — synthetic, always first. */}
+        {liveAgents.length > 0 && (
+          <ChannelGroup
+            keyName="live"
+            count={liveAgents.length}
+            collapsed={!!collapsed.live}
+            onToggle={() => setCollapsed((p) => ({ ...p, live: !p.live }))}
+          >
+            {liveAgents.map((a) => {
+              const isRoby = a.slug === superAgentSlug;
+              const active =
+                selected.kind === "live" && selected.agentSlug === a.slug;
+              return (
+                <ChatListItem
+                  key={`live-${a.slug}`}
+                  title={isRoby ? a.label : t("project.chat.list.live_with", { slug: a.slug })}
+                  subtitle={t("project.chat.list.live_subtitle")}
+                  badge={isRoby ? "super" : a.slug}
+                  selected={active}
+                  onClick={() => onSelect({ kind: "live", agentSlug: a.slug })}
+                />
+              );
+            })}
+          </ChannelGroup>
+        )}
+        {/* Stored conversations, grouped by channel. */}
+        {groups.map((g) => (
+          <ChannelGroup
+            key={g.key}
+            keyName={g.key}
+            count={g.items.length}
+            collapsed={!!collapsed[g.key]}
+            onToggle={() => setCollapsed((p) => ({ ...p, [g.key]: !p[g.key] }))}
+          >
+            {g.items.map((c) => {
+              const active =
+                selected.kind === "conv" &&
+                selected.agentSlug === c.agent_slug &&
+                selected.convId === c.id;
+              return (
+                <ChatListItem
+                  key={`${c.agent_slug}-${c.id}`}
+                  title={c.title || c.id}
+                  subtitle={[c.agent_slug, `${c.messages ?? 0} msg`]
+                    .filter(Boolean)
+                    .join(" · ")}
+                  badge={c.agent_slug}
+                  timeAgo={c.started_at}
+                  selected={active}
+                  onClick={() =>
+                    onSelect({ kind: "conv", agentSlug: c.agent_slug, convId: c.id })
+                  }
+                />
+              );
+            })}
+          </ChannelGroup>
+        ))}
+        {anyLoaded && allConvs.length === 0 && (
+          <p className="px-3 py-6 text-center text-xs text-muted-fg">
+            {t("project.chat.list.empty")}
+          </p>
+        )}
+      </div>
+    </aside>
+  );
+}
+function ChannelGroup({
+  keyName,
+  count,
+  collapsed,
+  onToggle,
+  children,
+}: {
+  keyName: ChannelGroupKey;
+  count: number;
+  collapsed: boolean;
+  onToggle: () => void;
+  children: React.ReactNode;
+}) {
+  const meta = GROUP_META[keyName];
+  const Icon = meta.icon;
+  return (
+    <section className="space-y-1">
+      <button
+        type="button"
+        onClick={onToggle}
+        className="flex w-full items-center justify-between rounded-md px-2 py-1 text-muted-fg hover:bg-accent/30"
+      >
+        <span className="inline-flex items-center gap-1.5">
+          {collapsed ? (
+            <ChevronRight className="size-3" />
+          ) : (
+            <ChevronDown className="size-3" />
+          )}
+          <Icon className="size-3" />
+          <span className="text-[10px] font-semibold uppercase tracking-wider">
+            {meta.label}
+          </span>
+        </span>
+        <span className="text-[10px]">{count}</span>
+      </button>
+      {!collapsed && <div className="space-y-0.5">{children}</div>}
+    </section>
+  );
+}
+function ChatListItem({
+  title,
+  subtitle,
+  badge,
+  timeAgo,
+  selected,
+  onClick,
+}: {
+  title: string;
+  subtitle?: string;
+  badge?: string;
+  timeAgo?: string;
+  selected?: boolean;
+  onClick: () => void;
+}) {
+  return (
+    <button
+      type="button"
+      onClick={onClick}
+      className={clsx(
+        "w-full rounded-md border px-2.5 py-2 text-left transition-colors",
+        selected
+          ? "border-primary/50 bg-primary/10"
+          : "border-transparent hover:border-border hover:bg-accent/40",
+      )}
+    >
+      <div className="flex items-start justify-between gap-2">
+        <p className={clsx("truncate text-sm", selected ? "font-semibold" : "font-medium")}>
+          {title}
+        </p>
+        {timeAgo && (
+          <span className="inline-flex shrink-0 items-center gap-0.5 text-[10px] text-muted-fg">
+            <Clock className="size-2.5" />
+            {formatTimeAgo(timeAgo)}
+          </span>
+        )}
+      </div>
+      <div className="mt-0.5 flex items-center justify-between gap-2 text-[10px] text-muted-fg">
+        <span className="truncate">{subtitle}</span>
+        {badge && (
+          <span className="inline-flex shrink-0 items-center gap-1 rounded bg-accent/50 px-1.5 py-0.5">
+            <User className="size-2.5" />
+            {badge}
+          </span>
+        )}
+      </div>
+    </button>
+  );
+}
+function formatTimeAgo(iso?: string): string {
+  if (!iso) return "";
+  const ts = new Date(iso).getTime();
+  if (!Number.isFinite(ts)) return "";
+  const diff = Date.now() - ts;
+  const m = Math.floor(diff / 60000);
+  if (m < 1) return "now";
+  if (m < 60) return `${m}m`;
+  const h = Math.floor(m / 60);
+  if (h < 24) return `${h}h`;
+  return `${Math.floor(h / 24)}d`;
+}

package/src/interfaces/web/src/components/chat/MessageBubble.tsx CHANGED Viewed

@@ -1,4 +1,4 @@
-import { Bot, Copy, User, Info } from "lucide-react";
+import { Bot, Copy, User, Info, Sparkles } from "lucide-react";
 import { cn } from "../../lib/cn";
 import { ToolCall } from "./ToolCall";
 import { AskQuestionsCard } from "./AskQuestionsCard";
@@ -49,6 +49,26 @@ export function MessageBubble({ msg, isLast, isAskAnswer, onCopy }: Props) {
           </div>
         )}
+        {/* Skill Inspector: which skills the per-turn RAG injected for this turn. */}
+        {!mine && msg.inspector && (msg.inspector.loaded?.length || msg.inspector.hinted?.length) ? (
+          <div
+            className="flex flex-wrap items-center gap-1 text-[10px] text-sky-400/90"
+            title={`Skill Inspector (${msg.inspector.embedder || "RAG"}) eligió estas skills para este turno`}
+          >
+            <Sparkles size={10} />
+            {msg.inspector.loaded?.map((s) => (
+              <span key={`l-${s}`} className="rounded bg-sky-500/15 px-1 py-0.5 font-mono">
+                {s}
+              </span>
+            ))}
+            {msg.inspector.hinted?.map((s) => (
+              <span key={`h-${s}`} className="rounded border border-sky-500/30 px-1 py-0.5 font-mono opacity-70">
+                {s}?
+              </span>
+            ))}
+          </div>
+        ) : null}
         {/* Ordered parts: interleaved assistant text + tool calls. */}
         {msg.parts.map((part, i) =>
           part.kind === "tool" ? (

package/src/interfaces/web/src/components/settings/AppearancePanel.tsx CHANGED Viewed

@@ -30,7 +30,7 @@ export function AppearancePanel() {
   };
   return (
-    <div className="space-y-6">
+    <div className="grid gap-6 xl:grid-cols-2 xl:items-start">
       <Section title={t("settings.appearance")}>
         <div className="flex items-center gap-2">
           <Button variant={theme === "light" ? "primary" : "secondary"} onClick={() => set("light")}>{t("settings.light_mode")}</Button>

package/src/interfaces/web/src/components/settings/MemoryPanel.tsx CHANGED Viewed

@@ -36,6 +36,10 @@ interface MemoryCfg {
     openai?: { api_key?: string; model?: string; base_url?: string };
     gemini?: { api_key?: string; model?: string };
   };
+  compact_threshold?: number;
+  keep_recent?: number;
+  compact_model?: string;
+  compact_fallback_model?: string;
 }
 const isMarker = (v: string) => v.startsWith("***");
@@ -97,7 +101,7 @@ export function MemoryPanel() {
   };
   return (
-    <div className="space-y-6">
+    <div className="grid gap-6 xl:grid-cols-2 xl:items-start">
       <Section
         title={t("memory_panel.embeddings_title")}
         description="Modelo que vectoriza el historial de todos los canales para la memoria relevante. Igual que TTS/STT: elegí proveedor y modelo. 'Automático' prueba local primero y cae al offline si no hay nada."
@@ -222,6 +226,70 @@ export function MemoryPanel() {
           />
         </Field>
       </Section>
+      <Section
+        title={t("memory_panel.compaction_title")}
+        description="Cuando un chat supera el umbral de turnos, los más viejos se resumen con un LLM liviano (local) y se guardan como [RESUMEN COMPACTADO], manteniendo el contexto acotado. Corre fuera del hot-path: el turno actual usa el resumen que ya exista."
+      >
+        <div className="grid gap-3 sm:grid-cols-2">
+          <Field label="Umbral de compactación" hint="Compactar una vez que el chat supera estos turnos (por defecto 60).">
+            <Input
+              type="number"
+              min={1}
+              defaultValue={mem.compact_threshold ?? 60}
+              placeholder="60"
+              disabled={busy}
+              onBlur={(ev) => {
+                const n = parseInt(ev.target.value, 10);
+                if (Number.isFinite(n) && n > 0 && n !== mem.compact_threshold) {
+                  apply({ "memory.compact_threshold": n });
+                }
+              }}
+              className="max-w-[10rem]"
+            />
+          </Field>
+          <Field label="Turnos recientes a preservar" hint="Turnos verbatim que NUNCA se compactan (por defecto 40). Debe ser menor al umbral.">
+            <Input
+              type="number"
+              min={1}
+              defaultValue={mem.keep_recent ?? 40}
+              placeholder="40"
+              disabled={busy}
+              onBlur={(ev) => {
+                const n = parseInt(ev.target.value, 10);
+                if (Number.isFinite(n) && n > 0 && n !== mem.keep_recent) {
+                  apply({ "memory.keep_recent": n });
+                }
+              }}
+              className="max-w-[10rem]"
+            />
+          </Field>
+        </div>
+        <Field label="Modelo de compactación" hint="LLM liviano para resumir. Ideal uno local (Ollama) para no gastar. Formato proveedor:modelo.">
+          <Input
+            defaultValue={mem.compact_model || "ollama:gemma4:31b-cloud"}
+            placeholder="ollama:gemma4:31b-cloud"
+            disabled={busy}
+            onBlur={(ev) => {
+              const v = ev.target.value.trim();
+              if (v && v !== mem.compact_model) apply({ "memory.compact_model": v });
+            }}
+            className="max-w-md"
+          />
+        </Field>
+        <Field label="Modelo de fallback" hint="Se usa si el de compactación falla. Vacío cae al modelo del super-agente.">
+          <Input
+            defaultValue={mem.compact_fallback_model || ""}
+            placeholder="(vacío → modelo del super-agente)"
+            disabled={busy}
+            onBlur={(ev) => {
+              const v = ev.target.value.trim();
+              if (v !== (mem.compact_fallback_model || "")) apply({ "memory.compact_fallback_model": v });
+            }}
+            className="max-w-md"
+          />
+        </Field>
+      </Section>
     </div>
   );
 }