@ai-matrx/chat 0.4.19 → 0.4.20

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @ai-matrx/chat
 
+## 0.4.20 — The credential capture card moves into the package
+
+- New `@ai-matrx/chat/agents/ui-first-tools/ui/CredentialCaptureCard`: the one card for an agent
+  that hit a login it has no saved credential for. Host ports `save(values)` and
+  `dismiss(reason)`; the card owns the leak boundary and the deadline. Replaces the browser
+  extension's and the website Cloud Browser's separate copies.
+
 ## 0.4.19 — Release verification repair
 
 - Restores the resume-stall coverage in the package's Jest module suite: the

package/dist/agents/ui-first-tools/ui/CredentialCaptureCard.d.ts

@@ -0,0 +1,31 @@
+export interface CredentialCaptureField {
+    fieldKey: string;
+    label: string;
+    /** Mask the box (password-style). */
+    secret: boolean;
+}
+/** The card's spec. Field NAMES only — a value has no place to ride in on it. */
+export interface CredentialCaptureSpec {
+    /** Stable id of this request (tool call id or handoff id); scopes input ids. */
+    id: string;
+    host: string;
+    displayName: string;
+    branch: "known" | "unknown";
+    /** Epoch ms after which the agent has moved on and no write may happen. */
+    expiresAtMs: number;
+    fields: CredentialCaptureField[];
+}
+export type CredentialCaptureSaveResult = {
+    ok: true;
+} | {
+    ok: false;
+    message?: string;
+};
+export type CredentialCaptureDismissReason = "cancelled" | "expired";
+export interface CredentialCaptureCardProps {
+    spec: CredentialCaptureSpec;
+    save: (values: Record<string, string>) => Promise<CredentialCaptureSaveResult>;
+    dismiss: (reason: CredentialCaptureDismissReason) => void | Promise<void>;
+}
+export declare function CredentialCaptureCard({ spec, save, dismiss }: CredentialCaptureCardProps): import("react").JSX.Element;
+export default CredentialCaptureCard;

package/dist/agents/ui-first-tools/ui/CredentialCaptureCard.js

@@ -0,0 +1,137 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useRef, useState } from "react";
+import { KeyRound, Loader2, ShieldCheck } from "lucide-react";
+import { Input } from "@ai-matrx/design-system";
+import { Button } from "@ai-matrx/design-system/controls";
+import { AgentCardShell } from "./AgentCardShell.js";
+function CredentialCaptureCard({ spec, save, dismiss }) {
+  const [values, setValues] = useState({});
+  const [busy, setBusy] = useState(false);
+  const [error, setError] = useState(null);
+  const [expired, setExpired] = useState(() => Date.now() >= spec.expiresAtMs);
+  const busyRef = useRef(false);
+  const dismissRef = useRef(dismiss);
+  dismissRef.current = dismiss;
+  useEffect(() => () => setValues({}), []);
+  useEffect(() => {
+    const ms = spec.expiresAtMs - Date.now();
+    if (ms <= 0) return;
+    const timer = setTimeout(() => {
+      setExpired(true);
+      if (busyRef.current) return;
+      setValues({});
+      void Promise.resolve(dismissRef.current("expired")).catch(() => void 0);
+    }, ms);
+    return () => clearTimeout(timer);
+  }, [spec.id, spec.expiresAtMs]);
+  const allFilled = spec.fields.every((f) => (values[f.fieldKey] ?? "").length > 0);
+  const onCancel = useCallback(async () => {
+    setValues({});
+    setBusy(true);
+    try {
+      await dismiss(expired ? "expired" : "cancelled");
+    } catch (cause) {
+      setError(cause instanceof Error ? cause.message : "Could not close this sign-in request.");
+    } finally {
+      setBusy(false);
+    }
+  }, [dismiss, expired]);
+  const onSave = useCallback(async () => {
+    if (busyRef.current) return;
+    if (expired || Date.now() >= spec.expiresAtMs) {
+      setExpired(true);
+      setValues({});
+      return;
+    }
+    busyRef.current = true;
+    setBusy(true);
+    setError(null);
+    const typed = {};
+    for (const f of spec.fields) typed[f.fieldKey] = values[f.fieldKey] ?? "";
+    let result;
+    try {
+      result = await save(typed);
+    } catch (cause) {
+      result = { ok: false, message: cause instanceof Error ? cause.message : void 0 };
+    }
+    setValues({});
+    busyRef.current = false;
+    setBusy(false);
+    if (result.ok) return;
+    if (Date.now() >= spec.expiresAtMs) {
+      setExpired(true);
+      void Promise.resolve(dismiss("expired")).catch(() => void 0);
+      return;
+    }
+    setError(result.message || "Could not save this sign-in. Try again or cancel.");
+  }, [dismiss, expired, save, spec, values]);
+  return /* @__PURE__ */ jsxs(
+    AgentCardShell,
+    {
+      tone: "warning",
+      icon: KeyRound,
+      eyebrow: "Sign-in needed",
+      title: `Save a login for ${spec.host}`,
+      titleInline: true,
+      "aria-label": `Save a login for ${spec.host}`,
+      badge: spec.branch === "known" ? /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1 rounded-full bg-muted px-2 py-0.5 text-xs", children: [
+        /* @__PURE__ */ jsx(ShieldCheck, { className: "size-3" }),
+        " Known site"
+      ] }) : null,
+      footer: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-2", children: [
+        /* @__PURE__ */ jsx(Button, { variant: "quiet", disabled: busy, onClick: () => void onCancel(), children: expired ? "Dismiss" : "Cancel" }),
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            variant: "primary",
+            disabled: busy || expired || !allFilled,
+            onClick: () => void onSave(),
+            children: [
+              busy ? /* @__PURE__ */ jsx(Loader2, { className: "mr-1 size-3 animate-spin" }) : null,
+              "Save and continue"
+            ]
+          }
+        )
+      ] }),
+      children: [
+        /* @__PURE__ */ jsxs("p", { className: "mb-3 text-xs text-muted-foreground", children: [
+          "Your agent needs to sign in to",
+          " ",
+          /* @__PURE__ */ jsx("span", { className: "font-medium text-foreground", children: spec.displayName }),
+          ". Enter it here; it goes to your vault and ",
+          /* @__PURE__ */ jsx("span", { className: "font-medium text-foreground", children: "the agent never sees it" }),
+          "."
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "grid gap-2", children: spec.fields.map((field) => {
+          const inputId = `capture-${spec.id}-${field.fieldKey}`;
+          return /* @__PURE__ */ jsxs("label", { htmlFor: inputId, className: "grid gap-1", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: field.label }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: inputId,
+                type: field.secret ? "password" : "text",
+                autoComplete: field.secret ? "new-password" : "off",
+                value: values[field.fieldKey] ?? "",
+                disabled: busy || expired,
+                className: "text-base",
+                onChange: (event) => {
+                  const next = event.target.value;
+                  setValues((prev) => ({ ...prev, [field.fieldKey]: next }));
+                }
+              }
+            )
+          ] }, field.fieldKey);
+        }) }),
+        expired ? /* @__PURE__ */ jsx("p", { className: "mt-2 text-xs text-muted-foreground", children: "This request expired and your agent has moved on. Ask it to try the sign-in again." }) : null,
+        error ? /* @__PURE__ */ jsx("p", { className: "mt-2 text-xs text-destructive", children: error }) : null
+      ]
+    }
+  );
+}
+var CredentialCaptureCard_default = CredentialCaptureCard;
+export {
+  CredentialCaptureCard,
+  CredentialCaptureCard_default as default
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ai-matrx/chat",
-  "version": "0.4.19",
+  "version": "0.4.20",
   "description": "THE one AI Matrx person-to-agent chat system: the full chat (running agents, conversations, tool calls, streaming, context, surfaces, voice) as per-module subpaths @ai-matrx/chat/<domain>/<module> over a host contract (/host, /host/react) whose only required value is a db; plus the kernel compatibility entries (., /external-store, /matrx, /react, /tools, styles.css, tokens.css) until P28.",
   "type": "module",
   "main": "./dist/index.cjs",
@@ -226,26 +226,26 @@
     "server-only": "^0.0.1",
     "uuid": "^14.0.2",
     "zod": "^4.6.5",
+    "@ai-matrx/alchemy": "latest",
     "@ai-matrx/associations": "latest",
     "@ai-matrx/browser-audio": "latest",
-    "@ai-matrx/alchemy": "latest",
     "@ai-matrx/canvas": "latest",
     "@ai-matrx/content-ir": "latest",
     "@ai-matrx/agents": "latest",
     "@ai-matrx/content-ir-react": "latest",
-    "@ai-matrx/design-system": "latest",
+    "@ai-matrx/data": "latest",
     "@ai-matrx/diff": "latest",
-    "@ai-matrx/icons": "latest",
+    "@ai-matrx/design-system": "latest",
+    "@ai-matrx/kit": "latest",
     "@ai-matrx/media": "latest",
     "@ai-matrx/print": "latest",
     "@ai-matrx/realtime": "latest",
     "@ai-matrx/records": "latest",
     "@ai-matrx/records-ui": "latest",
-    "@ai-matrx/rich-content": "latest",
-    "@ai-matrx/rich-editor": "latest",
+    "@ai-matrx/icons": "latest",
     "@ai-matrx/tap-target": "latest",
-    "@ai-matrx/data": "latest",
-    "@ai-matrx/kit": "latest"
+    "@ai-matrx/rich-editor": "latest",
+    "@ai-matrx/rich-content": "latest"
   },
   "devDependencies": {
     "@arethetypeswrong/cli": "^0.18.5",