@devicai/ui 0.57.0 → 0.59.0

package/dist/esm/components/ChatDrawer/QueueNotice.js

@@ -1,4 +1,5 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
+import { useTranslations } from '../../i18n/useTranslations.js';
 
 /**
  * The line above the input that says what happens to a message written while
@@ -10,7 +11,8 @@ import { jsxs, jsx } from 'react/jsx-runtime';
  * `options.queueNoticeRenderer`.
  */
 function QueueNotice({ queuedCount, willProcess, alert, }) {
-    return (jsxs("div", { className: "devic-queue-notice", "data-alert": alert ? 'true' : undefined, role: alert ? 'alert' : 'status', children: [jsx("span", { className: "devic-queue-notice-icon", "aria-hidden": "true", children: alert ? jsx(WarningIcon, {}) : jsx(ClockIcon, {}) }), jsx("span", { children: alert || noticeText(queuedCount, willProcess) })] }));
+    const t = useTranslations();
+    return (jsxs("div", { className: "devic-queue-notice", "data-alert": alert ? 'true' : undefined, role: alert ? 'alert' : 'status', children: [jsx("span", { className: "devic-queue-notice-icon", "aria-hidden": "true", children: alert ? jsx(WarningIcon, {}) : jsx(ClockIcon, {}) }), jsx("span", { children: alert || noticeText(t, queuedCount, willProcess) })] }));
 }
 /**
  * Three different promises, so three different sentences.
@@ -20,18 +22,28 @@ function QueueNotice({ queuedCount, willProcess, alert, }) {
  * sender to finish. Telling that person the assistant will pick it up "on its
  * next turn" describes a turn that is not happening.
  */
-function noticeText(queuedCount, willProcess) {
+function noticeText(t, queuedCount, willProcess) {
     if (queuedCount <= 0) {
-        return 'The assistant is still answering. Send anyway and your message joins its next turn.';
+        return t('The assistant is still answering. Send anyway and your message joins its next turn.');
     }
-    const subject = queuedCount === 1 ? '1 message' : `${queuedCount} messages`;
+    // Singular and plural are separate entries rather than a placeholder over a
+    // suffix: the two differ by more than an "s" in most languages.
+    const one = queuedCount === 1;
     if (willProcess === 'after_delay') {
-        return `${subject} waiting — the assistant is giving you a moment to finish before it answers.`;
+        return one
+            ? t('1 message waiting — the assistant is giving you a moment to finish before it answers.')
+            : t('{count} messages waiting — the assistant is giving you a moment to finish before it answers.', { count: queuedCount });
     }
     if (willProcess === 'on_resume') {
-        return `${subject} waiting — the assistant picks ${queuedCount === 1 ? 'it' : 'them'} up when it comes back to this conversation.`;
+        return one
+            ? t('1 message waiting — the assistant picks it up when it comes back to this conversation.')
+            : t('{count} messages waiting — the assistant picks them up when it comes back to this conversation.', { count: queuedCount });
     }
-    return `${subject} waiting — the assistant picks ${queuedCount === 1 ? 'it' : 'them'} up on its next turn.`;
+    return one
+        ? t('1 message waiting — the assistant picks it up on its next turn.')
+        : t('{count} messages waiting — the assistant picks them up on its next turn.', {
+            count: queuedCount,
+        });
 }
 function WarningIcon() {
     return (jsxs("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [jsx("path", { d: "M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z" }), jsx("line", { x1: "12", y1: "9", x2: "12", y2: "13" }), jsx("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })] }));

package/dist/esm/components/ChatDrawer/QueueNotice.js.map

@@ -1 +1 @@
-{"version":3,"file":"QueueNotice.js","sources":["../../../../src/components/ChatDrawer/QueueNotice.tsx"],"sourcesContent":["import React from 'react';\nimport type { QueueDisposition } from '../../api/types';\n\nexport interface QueueNoticeProps {\n  /** How many messages are waiting on this conversation right now. */\n  queuedCount: number;\n  /** What the last accepted message was told. Shapes the wording. */\n  willProcess?: QueueDisposition;\n  /**\n   * Something happened to a message that the count alone does not explain — it\n   * was turned down, or a stop threw it away. Replaces the standing text while\n   * it is set, since it is the more urgent of the two.\n   */\n  alert?: string;\n}\n\n/**\n * The line above the input that says what happens to a message written while\n * the assistant is working.\n *\n * Writing into a conversation that is busy is allowed but not obvious, so it is\n * spelled out twice: before sending, what the button will do; after, what became\n * of it. Suppress it with `options.hideQueueNotice`, or replace it with\n * `options.queueNoticeRenderer`.\n */\nexport function QueueNotice({\n  queuedCount,\n  willProcess,\n  alert,\n}: QueueNoticeProps): JSX.Element {\n  return (\n    <div\n      className=\"devic-queue-notice\"\n      data-alert={alert ? 'true' : undefined}\n      role={alert ? 'alert' : 'status'}\n    >\n      <span className=\"devic-queue-notice-icon\" aria-hidden=\"true\">\n        {alert ? <WarningIcon /> : <ClockIcon />}\n      </span>\n      <span>{alert || noticeText(queuedCount, willProcess)}</span>\n    </div>\n  );\n}\n\n/**\n * Three different promises, so three different sentences.\n *\n * `after_delay` is the one that is easy to get wrong: an assistant with an input\n * delay queues what is written while the conversation is *idle*, waiting for the\n * sender to finish. Telling that person the assistant will pick it up \"on its\n * next turn\" describes a turn that is not happening.\n */\nfunction noticeText(\n  queuedCount: number,\n  willProcess?: QueueDisposition\n): string {\n  if (queuedCount <= 0) {\n    return 'The assistant is still answering. Send anyway and your message joins its next turn.';\n  }\n\n  const subject = queuedCount === 1 ? '1 message' : `${queuedCount} messages`;\n\n  if (willProcess === 'after_delay') {\n    return `${subject} waiting — the assistant is giving you a moment to finish before it answers.`;\n  }\n  if (willProcess === 'on_resume') {\n    return `${subject} waiting — the assistant picks ${\n      queuedCount === 1 ? 'it' : 'them'\n    } up when it comes back to this conversation.`;\n  }\n  return `${subject} waiting — the assistant picks ${\n    queuedCount === 1 ? 'it' : 'them'\n  } up on its next turn.`;\n}\n\nfunction WarningIcon(): JSX.Element {\n  return (\n    <svg\n      width=\"14\"\n      height=\"14\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <path d=\"M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z\" />\n      <line x1=\"12\" y1=\"9\" x2=\"12\" y2=\"13\" />\n      <line x1=\"12\" y1=\"17\" x2=\"12.01\" y2=\"17\" />\n    </svg>\n  );\n}\n\nfunction ClockIcon(): JSX.Element {\n  return (\n    <svg\n      width=\"14\"\n      height=\"14\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <circle cx=\"12\" cy=\"12\" r=\"9\" />\n      <polyline points=\"12 7 12 12 15 14\" />\n    </svg>\n  );\n}\n"],"names":["_jsxs","_jsx"],"mappings":";;AAgBA;;;;;;;;AAQG;AACG,SAAU,WAAW,CAAC,EAC1B,WAAW,EACX,WAAW,EACX,KAAK,GACY,EAAA;AACjB,IAAA,QACEA,IAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAC,oBAAoB,EAAA,YAAA,EAClB,KAAK,GAAG,MAAM,GAAG,SAAS,EACtC,IAAI,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,EAAA,QAAA,EAAA,CAEhCC,cAAM,SAAS,EAAC,yBAAyB,EAAA,aAAA,EAAa,MAAM,EAAA,QAAA,EACzD,KAAK,GAAGA,GAAA,CAAC,WAAW,EAAA,EAAA,CAAG,GAAGA,GAAA,CAAC,SAAS,EAAA,EAAA,CAAG,EAAA,CACnC,EACPA,GAAA,CAAA,MAAA,EAAA,EAAA,QAAA,EAAO,KAAK,IAAI,UAAU,CAAC,WAAW,EAAE,WAAW,CAAC,EAAA,CAAQ,CAAA,EAAA,CACxD;AAEV;AAEA;;;;;;;AAOG;AACH,SAAS,UAAU,CACjB,WAAmB,EACnB,WAA8B,EAAA;AAE9B,IAAA,IAAI,WAAW,IAAI,CAAC,EAAE;AACpB,QAAA,OAAO,qFAAqF;IAC9F;AAEA,IAAA,MAAM,OAAO,GAAG,WAAW,KAAK,CAAC,GAAG,WAAW,GAAG,CAAA,EAAG,WAAW,WAAW;AAE3E,IAAA,IAAI,WAAW,KAAK,aAAa,EAAE;QACjC,OAAO,CAAA,EAAG,OAAO,CAAA,4EAAA,CAA8E;IACjG;AACA,IAAA,IAAI,WAAW,KAAK,WAAW,EAAE;AAC/B,QAAA,OAAO,CAAA,EAAG,OAAO,CAAA,+BAAA,EACf,WAAW,KAAK,CAAC,GAAG,IAAI,GAAG,MAC7B,8CAA8C;IAChD;AACA,IAAA,OAAO,CAAA,EAAG,OAAO,CAAA,+BAAA,EACf,WAAW,KAAK,CAAC,GAAG,IAAI,GAAG,MAC7B,uBAAuB;AACzB;AAEA,SAAS,WAAW,GAAA;AAClB,IAAA,QACED,IAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,GAAG,EACf,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EAAA,QAAA,EAAA,CAEtBC,GAAA,CAAA,MAAA,EAAA,EAAM,CAAC,EAAC,0FAA0F,EAAA,CAAG,EACrGA,cAAM,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAA,CAAG,EACvCA,GAAA,CAAA,MAAA,EAAA,EAAM,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,OAAO,EAAC,EAAE,EAAC,IAAI,EAAA,CAAG,CAAA,EAAA,CACvC;AAEV;AAEA,SAAS,SAAS,GAAA;IAChB,QACED,IAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,GAAG,EACf,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EAAA,QAAA,EAAA,CAEtBC,GAAA,CAAA,QAAA,EAAA,EAAQ,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,CAAC,EAAC,GAAG,EAAA,CAAG,EAChCA,GAAA,CAAA,UAAA,EAAA,EAAU,MAAM,EAAC,kBAAkB,EAAA,CAAG,CAAA,EAAA,CAClC;AAEV;;"}
+{"version":3,"file":"QueueNotice.js","sources":["../../../../src/components/ChatDrawer/QueueNotice.tsx"],"sourcesContent":["import React from 'react';\nimport type { QueueDisposition } from '../../api/types';\nimport { useTranslations } from '../../i18n';\nimport type { Translator } from '../../i18n';\n\nexport interface QueueNoticeProps {\n  /** How many messages are waiting on this conversation right now. */\n  queuedCount: number;\n  /** What the last accepted message was told. Shapes the wording. */\n  willProcess?: QueueDisposition;\n  /**\n   * Something happened to a message that the count alone does not explain — it\n   * was turned down, or a stop threw it away. Replaces the standing text while\n   * it is set, since it is the more urgent of the two.\n   */\n  alert?: string;\n}\n\n/**\n * The line above the input that says what happens to a message written while\n * the assistant is working.\n *\n * Writing into a conversation that is busy is allowed but not obvious, so it is\n * spelled out twice: before sending, what the button will do; after, what became\n * of it. Suppress it with `options.hideQueueNotice`, or replace it with\n * `options.queueNoticeRenderer`.\n */\nexport function QueueNotice({\n  queuedCount,\n  willProcess,\n  alert,\n}: QueueNoticeProps): JSX.Element {\n  const t = useTranslations();\n  return (\n    <div\n      className=\"devic-queue-notice\"\n      data-alert={alert ? 'true' : undefined}\n      role={alert ? 'alert' : 'status'}\n    >\n      <span className=\"devic-queue-notice-icon\" aria-hidden=\"true\">\n        {alert ? <WarningIcon /> : <ClockIcon />}\n      </span>\n      <span>{alert || noticeText(t, queuedCount, willProcess)}</span>\n    </div>\n  );\n}\n\n/**\n * Three different promises, so three different sentences.\n *\n * `after_delay` is the one that is easy to get wrong: an assistant with an input\n * delay queues what is written while the conversation is *idle*, waiting for the\n * sender to finish. Telling that person the assistant will pick it up \"on its\n * next turn\" describes a turn that is not happening.\n */\nfunction noticeText(\n  t: Translator,\n  queuedCount: number,\n  willProcess?: QueueDisposition\n): string {\n  if (queuedCount <= 0) {\n    return t(\n      'The assistant is still answering. Send anyway and your message joins its next turn.'\n    );\n  }\n\n  // Singular and plural are separate entries rather than a placeholder over a\n  // suffix: the two differ by more than an \"s\" in most languages.\n  const one = queuedCount === 1;\n\n  if (willProcess === 'after_delay') {\n    return one\n      ? t(\n          '1 message waiting — the assistant is giving you a moment to finish before it answers.'\n        )\n      : t(\n          '{count} messages waiting — the assistant is giving you a moment to finish before it answers.',\n          { count: queuedCount }\n        );\n  }\n  if (willProcess === 'on_resume') {\n    return one\n      ? t(\n          '1 message waiting — the assistant picks it up when it comes back to this conversation.'\n        )\n      : t(\n          '{count} messages waiting — the assistant picks them up when it comes back to this conversation.',\n          { count: queuedCount }\n        );\n  }\n  return one\n    ? t('1 message waiting — the assistant picks it up on its next turn.')\n    : t('{count} messages waiting — the assistant picks them up on its next turn.', {\n        count: queuedCount,\n      });\n}\n\nfunction WarningIcon(): JSX.Element {\n  return (\n    <svg\n      width=\"14\"\n      height=\"14\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <path d=\"M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z\" />\n      <line x1=\"12\" y1=\"9\" x2=\"12\" y2=\"13\" />\n      <line x1=\"12\" y1=\"17\" x2=\"12.01\" y2=\"17\" />\n    </svg>\n  );\n}\n\nfunction ClockIcon(): JSX.Element {\n  return (\n    <svg\n      width=\"14\"\n      height=\"14\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <circle cx=\"12\" cy=\"12\" r=\"9\" />\n      <polyline points=\"12 7 12 12 15 14\" />\n    </svg>\n  );\n}\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/components/ChatDrawer/RecalledMemoriesWidget.js

@@ -1,5 +1,6 @@
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { useState } from 'react';
+import { useTranslations } from '../../i18n/useTranslations.js';
 
 const SOURCE_LABELS = {
     conversation_start: "Automatic recall",
@@ -47,6 +48,7 @@ function ChevronIcon({ up }) {
  * Renders nothing when the records carry no content.
  */
 function RecalledMemoriesWidget({ records, isLoading = false, renderer, }) {
+    const t = useTranslations();
     const [expanded, setExpanded] = useState(false);
     if (renderer) {
         return jsx(Fragment, { children: renderer({ records, isLoading }) });
@@ -56,19 +58,29 @@ function RecalledMemoriesWidget({ records, isLoading = false, renderer, }) {
     const turns = records
         .filter((r) => r.source === "conversation_start")
         .flatMap((r) => r.turns ?? []);
-    const sources = [...new Set(records.map((r) => SOURCE_LABELS[r.source]))];
+    const sources = [
+        ...new Set(records.map((r) => t(SOURCE_LABELS[r.source]))),
+    ];
     if (!facts.length && !entities.length && !turns.length)
         return null;
     const summaryParts = [];
     if (facts.length) {
-        summaryParts.push(`${facts.length} fact${facts.length > 1 ? "s" : ""}`);
+        summaryParts.push(facts.length === 1
+            ? t("1 fact")
+            : t("{count} facts", { count: facts.length }));
     }
     if (entities.length) {
-        summaryParts.push(`${entities.length} entit${entities.length > 1 ? "ies" : "y"}`);
+        summaryParts.push(entities.length === 1
+            ? t("1 entity")
+            : t("{count} entities", { count: entities.length }));
     }
-    return (jsxs("div", { className: "devic-recall", children: [jsxs("button", { type: "button", className: "devic-recall-header", onClick: () => setExpanded((v) => !v), "aria-expanded": expanded, children: [jsx(BrainIcon, {}), jsx("span", { className: "devic-recall-title", children: "Recalled memories" }), summaryParts.length > 0 && (jsx("span", { className: "devic-recall-summary", children: summaryParts.join(" · ") })), jsx("span", { className: "devic-recall-spacer" }), sources.map((s) => (jsx("span", { className: "devic-recall-source", children: s }, s))), jsx(ChevronIcon, { up: expanded })] }), expanded && (jsxs("div", { className: "devic-recall-body", children: [facts.length > 0 && (jsx("div", { className: "devic-recall-facts", children: facts.map((fact, i) => (jsxs("div", { className: "devic-recall-fact", children: [jsx("span", { children: fact.fact }), jsxs("span", { className: "devic-recall-fact-meta", children: [fact.source && fact.target
+    return (jsxs("div", { className: "devic-recall", children: [jsxs("button", { type: "button", className: "devic-recall-header", onClick: () => setExpanded((v) => !v), "aria-expanded": expanded, children: [jsx(BrainIcon, {}), jsx("span", { className: "devic-recall-title", children: t("Recalled memories") }), summaryParts.length > 0 && (jsx("span", { className: "devic-recall-summary", children: summaryParts.join(" · ") })), jsx("span", { className: "devic-recall-spacer" }), sources.map((s) => (jsx("span", { className: "devic-recall-source", children: s }, s))), jsx(ChevronIcon, { up: expanded })] }), expanded && (jsxs("div", { className: "devic-recall-body", children: [facts.length > 0 && (jsx("div", { className: "devic-recall-facts", children: facts.map((fact, i) => (jsxs("div", { className: "devic-recall-fact", children: [jsx("span", { children: fact.fact }), jsxs("span", { className: "devic-recall-fact-meta", children: [fact.source && fact.target
                                             ? `${fact.source} → ${fact.relation} → ${fact.target}`
-                                            : fact.relation, fact.validAt ? ` · since ${fact.validAt.slice(0, 10)}` : ""] })] }, i))) })), entities.length > 0 && (jsx("div", { className: "devic-recall-entities", children: entities.map((entity) => (jsxs("span", { className: "devic-recall-entity", title: entity.summary || undefined, children: [entity.name, jsxs("span", { className: "devic-recall-entity-type", children: [" ", "\u00B7 ", entity.type] })] }, entity.id))) })), turns.length > 0 && (jsxs("div", { className: "devic-recall-turns", children: [jsx("span", { className: "devic-recall-turns-title", children: "Previous session context" }), turns.map((turn, i) => (jsxs("span", { className: "devic-recall-turn", children: [jsxs("span", { className: "devic-recall-turn-role", children: [turn.role, ":"] }), " ", turn.content] }, i)))] }))] }))] }));
+                                            : fact.relation, fact.validAt
+                                            ? ` · ${t("since {date}", {
+                                                date: fact.validAt.slice(0, 10),
+                                            })}`
+                                            : ""] })] }, i))) })), entities.length > 0 && (jsx("div", { className: "devic-recall-entities", children: entities.map((entity) => (jsxs("span", { className: "devic-recall-entity", title: entity.summary || undefined, children: [entity.name, jsxs("span", { className: "devic-recall-entity-type", children: [" ", "\u00B7 ", entity.type] })] }, entity.id))) })), turns.length > 0 && (jsxs("div", { className: "devic-recall-turns", children: [jsx("span", { className: "devic-recall-turns-title", children: t("Previous session context") }), turns.map((turn, i) => (jsxs("span", { className: "devic-recall-turn", children: [jsxs("span", { className: "devic-recall-turn-role", children: [turn.role, ":"] }), " ", turn.content] }, i)))] }))] }))] }));
 }
 
 export { RecalledMemoriesWidget };

package/dist/esm/components/ChatDrawer/RecalledMemoriesWidget.js.map

@@ -1 +1 @@
-{"version":3,"file":"RecalledMemoriesWidget.js","sources":["../../../../src/components/ChatDrawer/RecalledMemoriesWidget.tsx"],"sourcesContent":["import { useState, type JSX, type ReactNode } from \"react\";\nimport type {\n  RecalledMemoryEntity,\n  RecalledMemoryFact,\n  RecalledMemoryRecord,\n} from \"../../api/types\";\n\n/** Data handed to a custom recalled-memories renderer. */\nexport interface RecalledMemoriesRendererProps {\n  /** The recall events anchored at this point of the conversation. */\n  records: RecalledMemoryRecord[];\n  /** True while the run that produced (or is producing) them is in flight. */\n  isLoading: boolean;\n}\n\n/** Replaces the built-in \"Recalled memories\" strip. Return null to hide it. */\nexport type RecalledMemoriesRenderer = (\n  props: RecalledMemoriesRendererProps\n) => ReactNode;\n\nconst SOURCE_LABELS: Record<RecalledMemoryRecord[\"source\"], string> = {\n  conversation_start: \"Automatic recall\",\n  search_memory: \"Memory search\",\n  search_memory_nodes: \"Graph node search\",\n  explore_memory_graph: \"Graph exploration\",\n};\n\nfunction dedupeFacts(records: RecalledMemoryRecord[]): RecalledMemoryFact[] {\n  const seen = new Set<string>();\n  const facts: RecalledMemoryFact[] = [];\n  for (const record of records) {\n    for (const fact of record.facts ?? []) {\n      const key = (fact.fact ?? \"\").trim().toLowerCase();\n      if (!key || seen.has(key)) continue;\n      seen.add(key);\n      facts.push(fact);\n    }\n  }\n  return facts;\n}\n\nfunction dedupeEntities(\n  records: RecalledMemoryRecord[]\n): RecalledMemoryEntity[] {\n  const seen = new Set<string>();\n  return records\n    .flatMap((r) => r.entities ?? [])\n    .filter((e) => {\n      const key = (e.name ?? \"\").trim().toLowerCase();\n      if (!key || seen.has(key)) return false;\n      seen.add(key);\n      return true;\n    });\n}\n\nfunction BrainIcon(): JSX.Element {\n  return (\n    <svg\n      className=\"devic-recall-icon\"\n      width=\"14\"\n      height=\"14\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden=\"true\"\n    >\n      <path d=\"M9.5 2a2.5 2.5 0 0 0-2.45 2A3.5 3.5 0 0 0 4.6 8.6 3.5 3.5 0 0 0 3 11.5c0 1.1.5 2.08 1.29 2.73A3.5 3.5 0 0 0 7 20a3 3 0 0 0 5-2.24V4.5A2.5 2.5 0 0 0 9.5 2Z\" />\n      <path d=\"M14.5 2a2.5 2.5 0 0 1 2.45 2 3.5 3.5 0 0 1 2.45 4.6A3.5 3.5 0 0 1 21 11.5a3.49 3.49 0 0 1-1.29 2.73A3.5 3.5 0 0 1 17 20a3 3 0 0 1-5-2.24V4.5A2.5 2.5 0 0 1 14.5 2Z\" />\n    </svg>\n  );\n}\n\nfunction ChevronIcon({ up }: { up: boolean }): JSX.Element {\n  return (\n    <svg\n      className=\"devic-recall-chevron\"\n      width=\"12\"\n      height=\"12\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden=\"true\"\n      style={{ transform: up ? \"rotate(180deg)\" : undefined }}\n    >\n      <polyline points=\"6 9 12 15 18 9\" />\n    </svg>\n  );\n}\n\nexport interface RecalledMemoriesWidgetProps {\n  records: RecalledMemoryRecord[];\n  /** True while the run that produced the records is still processing. */\n  isLoading?: boolean;\n  /** Custom renderer replacing the built-in strip. */\n  renderer?: RecalledMemoriesRenderer;\n}\n\n/**\n * Collapsible \"Recalled memories\" strip interleaved in the chat with the\n * message that brought long-term memories into the conversation. Collapsed it\n * summarizes (\"N facts · M entities\"); expanded it lists the facts (with\n * their graph endpoints), the entities and any previous-session context.\n * Renders nothing when the records carry no content.\n */\nexport function RecalledMemoriesWidget({\n  records,\n  isLoading = false,\n  renderer,\n}: RecalledMemoriesWidgetProps): JSX.Element | null {\n  const [expanded, setExpanded] = useState(false);\n\n  if (renderer) {\n    return <>{renderer({ records, isLoading })}</>;\n  }\n\n  const facts = dedupeFacts(records);\n  const entities = dedupeEntities(records);\n  const turns = records\n    .filter((r) => r.source === \"conversation_start\")\n    .flatMap((r) => r.turns ?? []);\n  const sources = [...new Set(records.map((r) => SOURCE_LABELS[r.source]))];\n\n  if (!facts.length && !entities.length && !turns.length) return null;\n\n  const summaryParts: string[] = [];\n  if (facts.length) {\n    summaryParts.push(`${facts.length} fact${facts.length > 1 ? \"s\" : \"\"}`);\n  }\n  if (entities.length) {\n    summaryParts.push(\n      `${entities.length} entit${entities.length > 1 ? \"ies\" : \"y\"}`\n    );\n  }\n\n  return (\n    <div className=\"devic-recall\">\n      <button\n        type=\"button\"\n        className=\"devic-recall-header\"\n        onClick={() => setExpanded((v) => !v)}\n        aria-expanded={expanded}\n      >\n        <BrainIcon />\n        <span className=\"devic-recall-title\">Recalled memories</span>\n        {summaryParts.length > 0 && (\n          <span className=\"devic-recall-summary\">\n            {summaryParts.join(\" · \")}\n          </span>\n        )}\n        <span className=\"devic-recall-spacer\" />\n        {sources.map((s) => (\n          <span key={s} className=\"devic-recall-source\">\n            {s}\n          </span>\n        ))}\n        <ChevronIcon up={expanded} />\n      </button>\n\n      {expanded && (\n        <div className=\"devic-recall-body\">\n          {facts.length > 0 && (\n            <div className=\"devic-recall-facts\">\n              {facts.map((fact, i) => (\n                <div key={i} className=\"devic-recall-fact\">\n                  <span>{fact.fact}</span>\n                  <span className=\"devic-recall-fact-meta\">\n                    {fact.source && fact.target\n                      ? `${fact.source} → ${fact.relation} → ${fact.target}`\n                      : fact.relation}\n                    {fact.validAt ? ` · since ${fact.validAt.slice(0, 10)}` : \"\"}\n                  </span>\n                </div>\n              ))}\n            </div>\n          )}\n\n          {entities.length > 0 && (\n            <div className=\"devic-recall-entities\">\n              {entities.map((entity) => (\n                <span\n                  key={entity.id}\n                  className=\"devic-recall-entity\"\n                  title={entity.summary || undefined}\n                >\n                  {entity.name}\n                  <span className=\"devic-recall-entity-type\">\n                    {\" \"}\n                    · {entity.type}\n                  </span>\n                </span>\n              ))}\n            </div>\n          )}\n\n          {turns.length > 0 && (\n            <div className=\"devic-recall-turns\">\n              <span className=\"devic-recall-turns-title\">\n                Previous session context\n              </span>\n              {turns.map((turn, i) => (\n                <span key={i} className=\"devic-recall-turn\">\n                  <span className=\"devic-recall-turn-role\">{turn.role}:</span>{\" \"}\n                  {turn.content}\n                </span>\n              ))}\n            </div>\n          )}\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport default RecalledMemoriesWidget;\n"],"names":["_jsxs","_jsx","_Fragment"],"mappings":"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"}
+{"version":3,"file":"RecalledMemoriesWidget.js","sources":["../../../../src/components/ChatDrawer/RecalledMemoriesWidget.tsx"],"sourcesContent":["import { useState, type JSX, type ReactNode } from \"react\";\nimport { useTranslations } from \"../../i18n\";\nimport type {\n  RecalledMemoryEntity,\n  RecalledMemoryFact,\n  RecalledMemoryRecord,\n} from \"../../api/types\";\n\n/** Data handed to a custom recalled-memories renderer. */\nexport interface RecalledMemoriesRendererProps {\n  /** The recall events anchored at this point of the conversation. */\n  records: RecalledMemoryRecord[];\n  /** True while the run that produced (or is producing) them is in flight. */\n  isLoading: boolean;\n}\n\n/** Replaces the built-in \"Recalled memories\" strip. Return null to hide it. */\nexport type RecalledMemoriesRenderer = (\n  props: RecalledMemoriesRendererProps\n) => ReactNode;\n\nconst SOURCE_LABELS: Record<RecalledMemoryRecord[\"source\"], string> = {\n  conversation_start: \"Automatic recall\",\n  search_memory: \"Memory search\",\n  search_memory_nodes: \"Graph node search\",\n  explore_memory_graph: \"Graph exploration\",\n};\n\nfunction dedupeFacts(records: RecalledMemoryRecord[]): RecalledMemoryFact[] {\n  const seen = new Set<string>();\n  const facts: RecalledMemoryFact[] = [];\n  for (const record of records) {\n    for (const fact of record.facts ?? []) {\n      const key = (fact.fact ?? \"\").trim().toLowerCase();\n      if (!key || seen.has(key)) continue;\n      seen.add(key);\n      facts.push(fact);\n    }\n  }\n  return facts;\n}\n\nfunction dedupeEntities(\n  records: RecalledMemoryRecord[]\n): RecalledMemoryEntity[] {\n  const seen = new Set<string>();\n  return records\n    .flatMap((r) => r.entities ?? [])\n    .filter((e) => {\n      const key = (e.name ?? \"\").trim().toLowerCase();\n      if (!key || seen.has(key)) return false;\n      seen.add(key);\n      return true;\n    });\n}\n\nfunction BrainIcon(): JSX.Element {\n  return (\n    <svg\n      className=\"devic-recall-icon\"\n      width=\"14\"\n      height=\"14\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden=\"true\"\n    >\n      <path d=\"M9.5 2a2.5 2.5 0 0 0-2.45 2A3.5 3.5 0 0 0 4.6 8.6 3.5 3.5 0 0 0 3 11.5c0 1.1.5 2.08 1.29 2.73A3.5 3.5 0 0 0 7 20a3 3 0 0 0 5-2.24V4.5A2.5 2.5 0 0 0 9.5 2Z\" />\n      <path d=\"M14.5 2a2.5 2.5 0 0 1 2.45 2 3.5 3.5 0 0 1 2.45 4.6A3.5 3.5 0 0 1 21 11.5a3.49 3.49 0 0 1-1.29 2.73A3.5 3.5 0 0 1 17 20a3 3 0 0 1-5-2.24V4.5A2.5 2.5 0 0 1 14.5 2Z\" />\n    </svg>\n  );\n}\n\nfunction ChevronIcon({ up }: { up: boolean }): JSX.Element {\n  return (\n    <svg\n      className=\"devic-recall-chevron\"\n      width=\"12\"\n      height=\"12\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden=\"true\"\n      style={{ transform: up ? \"rotate(180deg)\" : undefined }}\n    >\n      <polyline points=\"6 9 12 15 18 9\" />\n    </svg>\n  );\n}\n\nexport interface RecalledMemoriesWidgetProps {\n  records: RecalledMemoryRecord[];\n  /** True while the run that produced the records is still processing. */\n  isLoading?: boolean;\n  /** Custom renderer replacing the built-in strip. */\n  renderer?: RecalledMemoriesRenderer;\n}\n\n/**\n * Collapsible \"Recalled memories\" strip interleaved in the chat with the\n * message that brought long-term memories into the conversation. Collapsed it\n * summarizes (\"N facts · M entities\"); expanded it lists the facts (with\n * their graph endpoints), the entities and any previous-session context.\n * Renders nothing when the records carry no content.\n */\nexport function RecalledMemoriesWidget({\n  records,\n  isLoading = false,\n  renderer,\n}: RecalledMemoriesWidgetProps): JSX.Element | null {\n  const t = useTranslations();\n  const [expanded, setExpanded] = useState(false);\n\n  if (renderer) {\n    return <>{renderer({ records, isLoading })}</>;\n  }\n\n  const facts = dedupeFacts(records);\n  const entities = dedupeEntities(records);\n  const turns = records\n    .filter((r) => r.source === \"conversation_start\")\n    .flatMap((r) => r.turns ?? []);\n  const sources = [\n    ...new Set(records.map((r) => t(SOURCE_LABELS[r.source]))),\n  ];\n\n  if (!facts.length && !entities.length && !turns.length) return null;\n\n  const summaryParts: string[] = [];\n  if (facts.length) {\n    summaryParts.push(\n      facts.length === 1\n        ? t(\"1 fact\")\n        : t(\"{count} facts\", { count: facts.length })\n    );\n  }\n  if (entities.length) {\n    summaryParts.push(\n      entities.length === 1\n        ? t(\"1 entity\")\n        : t(\"{count} entities\", { count: entities.length })\n    );\n  }\n\n  return (\n    <div className=\"devic-recall\">\n      <button\n        type=\"button\"\n        className=\"devic-recall-header\"\n        onClick={() => setExpanded((v) => !v)}\n        aria-expanded={expanded}\n      >\n        <BrainIcon />\n        <span className=\"devic-recall-title\">{t(\"Recalled memories\")}</span>\n        {summaryParts.length > 0 && (\n          <span className=\"devic-recall-summary\">\n            {summaryParts.join(\" · \")}\n          </span>\n        )}\n        <span className=\"devic-recall-spacer\" />\n        {sources.map((s) => (\n          <span key={s} className=\"devic-recall-source\">\n            {s}\n          </span>\n        ))}\n        <ChevronIcon up={expanded} />\n      </button>\n\n      {expanded && (\n        <div className=\"devic-recall-body\">\n          {facts.length > 0 && (\n            <div className=\"devic-recall-facts\">\n              {facts.map((fact, i) => (\n                <div key={i} className=\"devic-recall-fact\">\n                  <span>{fact.fact}</span>\n                  <span className=\"devic-recall-fact-meta\">\n                    {fact.source && fact.target\n                      ? `${fact.source} → ${fact.relation} → ${fact.target}`\n                      : fact.relation}\n                    {fact.validAt\n                      ? ` · ${t(\"since {date}\", {\n                          date: fact.validAt.slice(0, 10),\n                        })}`\n                      : \"\"}\n                  </span>\n                </div>\n              ))}\n            </div>\n          )}\n\n          {entities.length > 0 && (\n            <div className=\"devic-recall-entities\">\n              {entities.map((entity) => (\n                <span\n                  key={entity.id}\n                  className=\"devic-recall-entity\"\n                  title={entity.summary || undefined}\n                >\n                  {entity.name}\n                  <span className=\"devic-recall-entity-type\">\n                    {\" \"}\n                    · {entity.type}\n                  </span>\n                </span>\n              ))}\n            </div>\n          )}\n\n          {turns.length > 0 && (\n            <div className=\"devic-recall-turns\">\n              <span className=\"devic-recall-turns-title\">\n                {t(\"Previous session context\")}\n              </span>\n              {turns.map((turn, i) => (\n                <span key={i} className=\"devic-recall-turn\">\n                  <span className=\"devic-recall-turn-role\">{turn.role}:</span>{\" \"}\n                  {turn.content}\n                </span>\n              ))}\n            </div>\n          )}\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport default RecalledMemoriesWidget;\n"],"names":["_jsxs","_jsx","_Fragment"],"mappings":"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"}

package/dist/esm/components/ChatDrawer/ReferenceChip.js

@@ -1,4 +1,5 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
+import { useTranslations } from '../../i18n/useTranslations.js';
 
 /**
  * Reusable chip node for an AIElementWrapper reference. Shared by the
@@ -7,10 +8,11 @@ import { jsxs, jsx } from 'react/jsx-runtime';
  * exact same chip markup and styling.
  */
 function ReferenceChip({ label, onRemove, variant = "input", icon, className, }) {
+    const t = useTranslations();
     const base = variant === "message"
         ? "devic-message-reference-chip"
         : "devic-reference-chip";
-    return (jsxs("div", { className: className ? `${base} ${className}` : base, title: label, children: [icon ?? jsx(ReferenceArrowIcon, {}), jsxs("span", { className: `${base}-label`, children: ["\"", label, "\""] }), onRemove && (jsx("button", { type: "button", className: "devic-reference-chip-remove", onClick: onRemove, "aria-label": "Quitar referencia", children: "\u00D7" }))] }));
+    return (jsxs("div", { className: className ? `${base} ${className}` : base, title: label, children: [icon ?? jsx(ReferenceArrowIcon, {}), jsxs("span", { className: `${base}-label`, children: ["\"", label, "\""] }), onRemove && (jsx("button", { type: "button", className: "devic-reference-chip-remove", onClick: onRemove, "aria-label": t("Remove reference"), children: "\u00D7" }))] }));
 }
 /** Corner-down-right arrow used as the default reference glyph. */
 function ReferenceArrowIcon() {

package/dist/esm/components/ChatDrawer/ReferenceChip.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReferenceChip.js","sources":["../../../../src/components/ChatDrawer/ReferenceChip.tsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * Visual context a {@link ReferenceChip} is rendered in:\n * - `input`: inside the prompt box, as an editable, removable chip.\n * - `message`: above a sent user bubble, as a read-only chip.\n */\nexport type ReferenceChipVariant = \"input\" | \"message\";\n\nexport interface ReferenceChipProps {\n  /** Short label shown inside the chip (quoted automatically). */\n  label: string;\n  /**\n   * When provided, renders a remove (×) button that invokes this handler.\n   * Only meaningful for the `input` variant.\n   */\n  onRemove?: () => void;\n  /** Visual context. Defaults to `input`. */\n  variant?: ReferenceChipVariant;\n  /** Optional custom icon replacing the default reference arrow. */\n  icon?: React.ReactNode;\n  /** Extra className appended to the chip root. */\n  className?: string;\n}\n\n/**\n * Reusable chip node for an AIElementWrapper reference. Shared by the\n * ChatInput (active references in the prompt box) and ChatMessages\n * (references parsed out of a sent user message), so both render the\n * exact same chip markup and styling.\n */\nexport function ReferenceChip({\n  label,\n  onRemove,\n  variant = \"input\",\n  icon,\n  className,\n}: ReferenceChipProps): JSX.Element {\n  const base =\n    variant === \"message\"\n      ? \"devic-message-reference-chip\"\n      : \"devic-reference-chip\";\n\n  return (\n    <div className={className ? `${base} ${className}` : base} title={label}>\n      {icon ?? <ReferenceArrowIcon />}\n      <span className={`${base}-label`}>\"{label}\"</span>\n      {onRemove && (\n        <button\n          type=\"button\"\n          className=\"devic-reference-chip-remove\"\n          onClick={onRemove}\n          aria-label=\"Quitar referencia\"\n        >\n          &times;\n        </button>\n      )}\n    </div>\n  );\n}\n\n/** Corner-down-right arrow used as the default reference glyph. */\nfunction ReferenceArrowIcon(): JSX.Element {\n  return (\n    <svg\n      width=\"12\"\n      height=\"12\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden=\"true\"\n    >\n      <polyline points=\"15 10 20 15 15 20\" />\n      <path d=\"M4 4v7a4 4 0 0 0 4 4h12\" />\n    </svg>\n  );\n}\n"],"names":["_jsxs","_jsx"],"mappings":";;AAyBA;;;;;AAKG;AACG,SAAU,aAAa,CAAC,EAC5B,KAAK,EACL,QAAQ,EACR,OAAO,GAAG,OAAO,EACjB,IAAI,EACJ,SAAS,GACU,EAAA;AACnB,IAAA,MAAM,IAAI,GACR,OAAO,KAAK;AACV,UAAE;UACA,sBAAsB;IAE5B,QACEA,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,SAAS,GAAG,CAAA,EAAG,IAAI,CAAA,CAAA,EAAI,SAAS,CAAA,CAAE,GAAG,IAAI,EAAE,KAAK,EAAE,KAAK,EAAA,QAAA,EAAA,CACpE,IAAI,IAAIC,GAAA,CAAC,kBAAkB,EAAA,EAAA,CAAG,EAC/BD,IAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,CAAA,EAAG,IAAI,CAAA,MAAA,CAAQ,EAAA,QAAA,EAAA,CAAA,IAAA,EAAI,KAAK,EAAA,IAAA,CAAA,EAAA,CAAS,EACjD,QAAQ,KACPC,GAAA,CAAA,QAAA,EAAA,EACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,6BAA6B,EACvC,OAAO,EAAE,QAAQ,EAAA,YAAA,EACN,mBAAmB,EAAA,QAAA,EAAA,QAAA,EAAA,CAGvB,CACV,CAAA,EAAA,CACG;AAEV;AAEA;AACA,SAAS,kBAAkB,GAAA;IACzB,QACED,cACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,GAAG,EACf,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EAAA,aAAA,EACV,MAAM,EAAA,QAAA,EAAA,CAElBC,GAAA,CAAA,UAAA,EAAA,EAAU,MAAM,EAAC,mBAAmB,EAAA,CAAG,EACvCA,GAAA,CAAA,MAAA,EAAA,EAAM,CAAC,EAAC,yBAAyB,EAAA,CAAG,CAAA,EAAA,CAChC;AAEV;;"}
+{"version":3,"file":"ReferenceChip.js","sources":["../../../../src/components/ChatDrawer/ReferenceChip.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTranslations } from \"../../i18n\";\n\n/**\n * Visual context a {@link ReferenceChip} is rendered in:\n * - `input`: inside the prompt box, as an editable, removable chip.\n * - `message`: above a sent user bubble, as a read-only chip.\n */\nexport type ReferenceChipVariant = \"input\" | \"message\";\n\nexport interface ReferenceChipProps {\n  /** Short label shown inside the chip (quoted automatically). */\n  label: string;\n  /**\n   * When provided, renders a remove (×) button that invokes this handler.\n   * Only meaningful for the `input` variant.\n   */\n  onRemove?: () => void;\n  /** Visual context. Defaults to `input`. */\n  variant?: ReferenceChipVariant;\n  /** Optional custom icon replacing the default reference arrow. */\n  icon?: React.ReactNode;\n  /** Extra className appended to the chip root. */\n  className?: string;\n}\n\n/**\n * Reusable chip node for an AIElementWrapper reference. Shared by the\n * ChatInput (active references in the prompt box) and ChatMessages\n * (references parsed out of a sent user message), so both render the\n * exact same chip markup and styling.\n */\nexport function ReferenceChip({\n  label,\n  onRemove,\n  variant = \"input\",\n  icon,\n  className,\n}: ReferenceChipProps): JSX.Element {\n  const t = useTranslations();\n  const base =\n    variant === \"message\"\n      ? \"devic-message-reference-chip\"\n      : \"devic-reference-chip\";\n\n  return (\n    <div className={className ? `${base} ${className}` : base} title={label}>\n      {icon ?? <ReferenceArrowIcon />}\n      <span className={`${base}-label`}>\"{label}\"</span>\n      {onRemove && (\n        <button\n          type=\"button\"\n          className=\"devic-reference-chip-remove\"\n          onClick={onRemove}\n          aria-label={t(\"Remove reference\")}\n        >\n          &times;\n        </button>\n      )}\n    </div>\n  );\n}\n\n/** Corner-down-right arrow used as the default reference glyph. */\nfunction ReferenceArrowIcon(): JSX.Element {\n  return (\n    <svg\n      width=\"12\"\n      height=\"12\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden=\"true\"\n    >\n      <polyline points=\"15 10 20 15 15 20\" />\n      <path d=\"M4 4v7a4 4 0 0 0 4 4h12\" />\n    </svg>\n  );\n}\n"],"names":["_jsxs","_jsx"],"mappings":";;;AA0BA;;;;;AAKG;AACG,SAAU,aAAa,CAAC,EAC5B,KAAK,EACL,QAAQ,EACR,OAAO,GAAG,OAAO,EACjB,IAAI,EACJ,SAAS,GACU,EAAA;AACnB,IAAA,MAAM,CAAC,GAAG,eAAe,EAAE;AAC3B,IAAA,MAAM,IAAI,GACR,OAAO,KAAK;AACV,UAAE;UACA,sBAAsB;AAE5B,IAAA,QACEA,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,SAAS,GAAG,CAAA,EAAG,IAAI,CAAA,CAAA,EAAI,SAAS,CAAA,CAAE,GAAG,IAAI,EAAE,KAAK,EAAE,KAAK,EAAA,QAAA,EAAA,CACpE,IAAI,IAAIC,GAAA,CAAC,kBAAkB,EAAA,EAAA,CAAG,EAC/BD,eAAM,SAAS,EAAE,CAAA,EAAG,IAAI,CAAA,MAAA,CAAQ,EAAA,QAAA,EAAA,CAAA,IAAA,EAAI,KAAK,EAAA,IAAA,CAAA,EAAA,CAAS,EACjD,QAAQ,KACPC,GAAA,CAAA,QAAA,EAAA,EACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,6BAA6B,EACvC,OAAO,EAAE,QAAQ,EAAA,YAAA,EACL,CAAC,CAAC,kBAAkB,CAAC,EAAA,QAAA,EAAA,QAAA,EAAA,CAG1B,CACV,CAAA,EAAA,CACG;AAEV;AAEA;AACA,SAAS,kBAAkB,GAAA;IACzB,QACED,cACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,GAAG,EACf,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EAAA,aAAA,EACV,MAAM,EAAA,QAAA,EAAA,CAElBC,GAAA,CAAA,UAAA,EAAA,EAAU,MAAM,EAAC,mBAAmB,EAAA,CAAG,EACvCA,GAAA,CAAA,MAAA,EAAA,EAAM,CAAC,EAAC,yBAAyB,EAAA,CAAG,CAAA,EAAA,CAChC;AAEV;;;;"}

package/dist/esm/components/ChatDrawer/ToolTimeline.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolTimeline.js","sources":["../../../../src/components/ChatDrawer/ToolTimeline.tsx"],"sourcesContent":["import React from 'react';\nimport type { ToolTimelineProps } from './ChatDrawer.types';\n\n/**\n * Tool execution timeline component\n */\nexport function ToolTimeline({ toolCalls }: ToolTimelineProps): JSX.Element | null {\n  if (toolCalls.length === 0) {\n    return null;\n  }\n\n  return (\n    <div className=\"devic-tool-timeline\">\n      {toolCalls.map((tool) => (\n        <div key={tool.id} className=\"devic-tool-item\">\n          <span className=\"devic-tool-status\" data-status={tool.status} />\n          <span className=\"devic-tool-name\">{formatToolName(tool.name)}</span>\n          {tool.status === 'error' && tool.error && (\n            <span className=\"devic-tool-error\">{tool.error}</span>\n          )}\n        </div>\n      ))}\n    </div>\n  );\n}\n\n/**\n * Format tool name for display\n */\nfunction formatToolName(name: string): string {\n  // Convert snake_case or camelCase to Title Case with spaces\n  return name\n    .replace(/_/g, ' ')\n    .replace(/([a-z])([A-Z])/g, '$1 $2')\n    .replace(/\\b\\w/g, (char) => char.toUpperCase());\n}\n"],"names":["_jsx","_jsxs"],"mappings":";;AAGA;;AAEG;AACG,SAAU,YAAY,CAAC,EAAE,SAAS,EAAqB,EAAA;AAC3D,IAAA,IAAI,SAAS,CAAC,MAAM,KAAK,CAAC,EAAE;AAC1B,QAAA,OAAO,IAAI;IACb;AAEA,IAAA,QACEA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,qBAAqB,EAAA,QAAA,EACjC,SAAS,CAAC,GAAG,CAAC,CAAC,IAAI,MAClBC,IAAA,CAAA,KAAA,EAAA,EAAmB,SAAS,EAAC,iBAAiB,EAAA,QAAA,EAAA,CAC5CD,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,mBAAmB,EAAA,aAAA,EAAc,IAAI,CAAC,MAAM,GAAI,EAChEA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,iBAAiB,EAAA,QAAA,EAAE,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,EAAA,CAAQ,EACnE,IAAI,CAAC,MAAM,KAAK,OAAO,IAAI,IAAI,CAAC,KAAK,KACpCA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,kBAAkB,EAAA,QAAA,EAAE,IAAI,CAAC,KAAK,GAAQ,CACvD,CAAA,EAAA,EALO,IAAI,CAAC,EAAE,CAMX,CACP,CAAC,EAAA,CACE;AAEV;AAEA;;AAEG;AACH,SAAS,cAAc,CAAC,IAAY,EAAA;;AAElC,IAAA,OAAO;AACJ,SAAA,OAAO,CAAC,IAAI,EAAE,GAAG;AACjB,SAAA,OAAO,CAAC,iBAAiB,EAAE,OAAO;AAClC,SAAA,OAAO,CAAC,OAAO,EAAE,CAAC,IAAI,KAAK,IAAI,CAAC,WAAW,EAAE,CAAC;AACnD;;"}
+{"version":3,"file":"ToolTimeline.js","sources":["../../../../src/components/ChatDrawer/ToolTimeline.tsx"],"sourcesContent":["import React from 'react';\nimport type { ToolTimelineProps } from './ChatDrawer.types';\n\n/**\n * Tool execution timeline component\n */\nexport function ToolTimeline({ toolCalls }: ToolTimelineProps): JSX.Element | null {\n  if (toolCalls.length === 0) {\n    return null;\n  }\n\n  return (\n    <div className=\"devic-tool-timeline\">\n      {toolCalls.map((tool) => (\n        <div key={tool.id} className=\"devic-tool-item\">\n          <span className=\"devic-tool-status\" data-status={tool.status} />\n          <span className=\"devic-tool-name\">{formatToolName(tool.name)}</span>\n          {tool.status === 'error' && tool.error && (\n            <span className=\"devic-tool-error\">{tool.error}</span>\n          )}\n        </div>\n      ))}\n    </div>\n  );\n}\n\n/**\n * Format tool name for display\n */\nfunction formatToolName(name: string): string {\n  // Convert snake_case or camelCase to Title Case with spaces\n  return name\n    .replace(/_/g, ' ')\n    .replace(/([a-z])([A-Z])/g, '$1 $2')\n    .replace(/\\b\\w/g, (char) => char.toUpperCase());\n}\n"],"names":["_jsx","_jsxs"],"mappings":";;AAGA;;AAEG;AACG,SAAU,YAAY,CAAC,EAAE,SAAS,EAAqB,EAAA;AAC3D,IAAA,IAAI,SAAS,CAAC,MAAM,KAAK,CAAC,EAAE;AAC1B,QAAA,OAAO,IAAI;IACb;AAEA,IAAA,QACEA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,qBAAqB,EAAA,QAAA,EACjC,SAAS,CAAC,GAAG,CAAC,CAAC,IAAI,MAClBC,IAAA,CAAA,KAAA,EAAA,EAAmB,SAAS,EAAC,iBAAiB,EAAA,QAAA,EAAA,CAC5CD,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,mBAAmB,EAAA,aAAA,EAAc,IAAI,CAAC,MAAM,GAAI,EAChEA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,iBAAiB,EAAA,QAAA,EAAE,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,EAAA,CAAQ,EACnE,IAAI,CAAC,MAAM,KAAK,OAAO,IAAI,IAAI,CAAC,KAAK,KACpCA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,kBAAkB,EAAA,QAAA,EAAE,IAAI,CAAC,KAAK,GAAQ,CACvD,CAAA,EAAA,EALO,IAAI,CAAC,EAAE,CAMX,CACP,CAAC,EAAA,CACE;AAEV;AAEA;;AAEG;AACH,SAAS,cAAc,CAAC,IAAY,EAAA;;AAElC,IAAA,OAAO;AACJ,SAAA,OAAO,CAAC,IAAI,EAAE,GAAG;AACjB,SAAA,OAAO,CAAC,iBAAiB,EAAE,OAAO;AAClC,SAAA,OAAO,CAAC,OAAO,EAAE,CAAC,IAAI,KAAK,IAAI,CAAC,WAAW,EAAE,CAAC;AACnD;;;;"}

package/dist/esm/components/ChatDrawer/UsageBar.js

@@ -2,6 +2,7 @@ import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { useMemo, useState, useCallback, useEffect } from 'react';
 import { useOptionalDevicContext } from '../../provider/DevicContext.js';
 import { DevicApiClient } from '../../api/client.js';
+import { useTranslations } from '../../i18n/useTranslations.js';
 
 const DEFAULT_DISPLAY = {
     showValues: false,
@@ -24,24 +25,27 @@ function formatAmount(value, metric) {
     }
     return Math.round(value).toLocaleString();
 }
-function windowLabel(unit, every) {
-    const u = every > 1 ? `${unit}s` : unit;
-    return every > 1 ? `every ${every} ${u}` : `per ${unit}`;
+// The unit names are translated on their own so a dictionary can decline
+// them; the sentence around them is a separate entry with placeholders, which
+// is what a language with a different word order needs.
+function windowLabel(t, unit, every) {
+    const u = every > 1 ? t(`{count} ${unit}s`, { count: every }) : t(unit);
+    return every > 1 ? t('every {window}', { window: u }) : t('per {window}', { window: u });
 }
-function resetLabel(resetsAt) {
+function resetLabel(t, resetsAt) {
     if (!resetsAt)
         return '';
     const ms = resetsAt - Date.now();
     if (ms <= 0)
-        return 'resets now';
+        return t('resets now');
     const mins = Math.round(ms / 60000);
     if (mins < 60)
-        return `resets in ${mins}m`;
+        return t('resets in {count}m', { count: mins });
     const hours = Math.round(mins / 60);
     if (hours < 48)
-        return `resets in ${hours}h`;
+        return t('resets in {count}h', { count: hours });
     const days = Math.round(hours / 24);
-    return `resets in ${days}d`;
+    return t('resets in {count}d', { count: days });
 }
 /**
  * A thin usage bar showing the current tenant/subtenant usage window(s).
@@ -49,6 +53,7 @@ function resetLabel(resetsAt) {
  * Renders nothing when there are no usage limits configured for the tenant.
  */
 function UsageBar({ apiKey, baseUrl, tenantId, subtenantId, mode = 'always', metric, display, customUsageBar, color = '#1890ff', refreshKey, debug = false, }) {
+    const t = useTranslations();
     const cfg = useMemo(() => ({ ...DEFAULT_DISPLAY, ...display }), [display]);
     const devicContext = useOptionalDevicContext();
     const getTenantSession = devicContext?.getTenantSession;
@@ -112,14 +117,14 @@ function UsageBar({ apiKey, baseUrl, tenantId, subtenantId, mode = 'always', met
     }
     // onDemand, collapsed: show a small toggle button.
     if (mode === 'onDemand' && !visible) {
-        return (jsx("div", { className: "devic-usage-bar-wrap", "data-mode": "onDemand", children: jsxs("button", { type: "button", className: "devic-usage-toggle", onClick: () => setVisible(true), title: "Show usage", children: [jsx(GaugeIcon, {}), jsx("span", { children: "Usage" })] }) }));
+        return (jsx("div", { className: "devic-usage-bar-wrap", "data-mode": "onDemand", children: jsxs("button", { type: "button", className: "devic-usage-toggle", onClick: () => setVisible(true), title: t('Show usage'), children: [jsx(GaugeIcon, {}), jsx("span", { children: t('Usage') })] }) }));
     }
     // No configured limits (or not loaded yet with nothing to show): render nothing
     // in 'always' mode; in expanded onDemand, show a subtle note so the toggle isn't
     // confusing.
     if (rules.length === 0) {
         if (mode === 'onDemand' && loaded) {
-            return (jsx("div", { className: "devic-usage-bar-wrap", "data-mode": "onDemand", children: jsxs("div", { className: "devic-usage-bar", "data-empty": "true", children: [jsx("span", { className: "devic-usage-bar-label", children: "No usage limits" }), jsx("button", { type: "button", className: "devic-usage-collapse", onClick: () => setVisible(false), title: "Hide usage", "aria-label": "Hide usage", children: "\u00D7" })] }) }));
+            return (jsx("div", { className: "devic-usage-bar-wrap", "data-mode": "onDemand", children: jsxs("div", { className: "devic-usage-bar", "data-empty": "true", children: [jsx("span", { className: "devic-usage-bar-label", children: t('No usage limits') }), jsx("button", { type: "button", className: "devic-usage-collapse", onClick: () => setVisible(false), title: t('Hide usage'), "aria-label": t('Hide usage'), children: "\u00D7" })] }) }));
         }
         return null;
     }
@@ -127,20 +132,20 @@ function UsageBar({ apiKey, baseUrl, tenantId, subtenantId, mode = 'always', met
     const multi = rules.length > 1;
     // A header carries the tier chip and/or the onDemand collapse control, so the
     // collapse "×" has a stable home regardless of how many rows render below.
-    const header = showTierChip || mode === 'onDemand' ? (jsxs("div", { className: "devic-usage-bar-head", children: [showTierChip ? (jsx("span", { className: "devic-usage-tier", title: `Tier: ${tierId}`, children: tierId })) : (jsx("span", {})), mode === 'onDemand' && (jsx("button", { type: "button", className: "devic-usage-collapse", onClick: () => setVisible(false), title: "Hide usage", "aria-label": "Hide usage", children: "\u00D7" }))] })) : null;
+    const header = showTierChip || mode === 'onDemand' ? (jsxs("div", { className: "devic-usage-bar-head", children: [showTierChip ? (jsx("span", { className: "devic-usage-tier", title: t('Tier: {tier}', { tier: tierId }), children: tierId })) : (jsx("span", {})), mode === 'onDemand' && (jsx("button", { type: "button", className: "devic-usage-collapse", onClick: () => setVisible(false), title: t('Hide usage'), "aria-label": t('Hide usage'), children: "\u00D7" }))] })) : null;
     return (jsxs("div", { className: "devic-usage-bar-wrap", "data-mode": mode, children: [header, jsx("div", { className: "devic-usage-bar-group", children: rules.map((rule, i) => {
                     const pct = Math.min(100, Math.round(rule.percent));
                     const fill = fillColor(pct, color);
-                    const valuesText = `${formatAmount(rule.current, rule.metric)} / ${formatAmount(rule.limit, rule.metric)} ${rule.metric}`;
+                    const valuesText = `${formatAmount(rule.current, rule.metric)} / ${formatAmount(rule.limit, rule.metric)} ${t(rule.metric)}`;
                     // Distinguish rows by metric when several render; otherwise use the
                     // scope-aware label so single-rule mode reads "Usage 24%".
                     const prefix = multi
                         ? rule.metric === 'cost'
-                            ? 'Cost'
-                            : 'Tokens'
+                            ? t('Cost')
+                            : t('Tokens')
                         : rule.scope === 'subtenant'
-                            ? 'Your usage'
-                            : 'Usage';
+                            ? t('Your usage')
+                            : t('Usage');
                     const main = [];
                     if (cfg.showPercent)
                         main.push(`${pct}%`);
@@ -149,8 +154,8 @@ function UsageBar({ apiKey, baseUrl, tenantId, subtenantId, mode = 'always', met
                     if (main.length === 0)
                         main.push(`${pct}%`);
                     const label = `${prefix} ${main.join(' · ')}`.trim();
-                    const reset = resetLabel(rule.resetsAt);
-                    const win = windowLabel(rule.windowUnit, rule.windowEvery);
+                    const reset = resetLabel(t, rule.resetsAt);
+                    const win = windowLabel(t, rule.windowUnit, rule.windowEvery);
                     const title = `${valuesText} · ${win}${reset ? ` · ${reset}` : ''}`;
                     return (jsxs("div", { className: "devic-usage-bar", title: title, "data-state": pct >= 100 ? 'exceeded' : 'ok', children: [jsx("span", { className: "devic-usage-bar-label", children: label }), jsx("div", { className: "devic-usage-bar-track", children: jsx("div", { className: "devic-usage-bar-fill", style: { width: `${pct}%`, backgroundColor: fill } }) }), cfg.showWindow && (jsx("span", { className: "devic-usage-bar-window", children: win })), reset && jsx("span", { className: "devic-usage-bar-reset", children: reset })] }, `${rule.metric}-${rule.windowUnit}-${rule.windowEvery}-${rule.scope}-${i}`));
                 }) })] }));

package/dist/esm/components/ChatDrawer/UsageBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"UsageBar.js","sources":["../../../../src/components/ChatDrawer/UsageBar.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from 'react';\nimport { useOptionalDevicContext } from '../../provider';\nimport { DevicApiClient } from '../../api/client';\nimport type { TenantUsage, TenantUsageRule } from '../../api/types';\n\n/**\n * Controls what each usage row renders. All flags compose, so a developer can,\n * for example, show absolute values together with the percentage and the tier.\n */\nexport interface UsageBarDisplay {\n  /**\n   * Show the absolute amount of the active window: `current / limit metric`\n   * (e.g. `1,200 / 5,000 tokens`).\n   * @default false\n   */\n  showValues?: boolean;\n  /**\n   * Show the utilization percentage (e.g. `24%`).\n   * @default true\n   */\n  showPercent?: boolean;\n  /**\n   * Show the temporal dimension of the window (e.g. `per 3h`, `every 3 hours`).\n   * @default true\n   */\n  showWindow?: boolean;\n  /**\n   * Show the tier (plan) the limits come from, as a chip above the bar(s).\n   * @default false\n   */\n  showTier?: boolean;\n  /**\n   * When more than one limit rule applies, render every rule (`true`) or only\n   * the single most restrictive one (`false`, highest utilization). The\n   * per-row presentation still follows the flags above.\n   * @default true\n   */\n  showAllRules?: boolean;\n}\n\nconst DEFAULT_DISPLAY: Required<UsageBarDisplay> = {\n  showValues: false,\n  showPercent: true,\n  showWindow: true,\n  showTier: false,\n  showAllRules: true,\n};\n\n/**\n * Usage data handed to a `customUsageBar` renderer so a developer can build\n * their own component with the live consumption / limits.\n */\nexport interface UsageBarData {\n  /** Tenant the usage belongs to. */\n  tenantId?: string;\n  /** Subtenant the usage is scoped to, if any. */\n  subtenantId?: string;\n  /** Tier (plan) the limits come from, if any. */\n  tierId?: string;\n  /**\n   * Applicable usage rules (filtered by `metric` when set), sorted by\n   * utilization descending — the most restrictive first.\n   */\n  rules: TenantUsageRule[];\n  /** `true` until the first fetch resolves. */\n  loading: boolean;\n}\n\n/**\n * Props for the UsageBar component.\n */\nexport interface UsageBarProps {\n  /** API key (resolved from provider by the ChatDrawer). */\n  apiKey?: string;\n  /** Base URL (resolved from provider by the ChatDrawer). */\n  baseUrl?: string;\n  /** Tenant whose usage is displayed. Required — without it the bar renders nothing. */\n  tenantId?: string;\n  /** Optional subtenant to scope the usage to a specific end user. */\n  subtenantId?: string;\n  /**\n   * Display mode:\n   * - 'always': the bar is always visible.\n   * - 'onDemand': a small toggle button is shown; the bar appears on click.\n   */\n  mode?: 'always' | 'onDemand';\n  /** Restrict the bar to a single metric. When omitted, all applicable rules are considered. */\n  metric?: 'tokens' | 'cost';\n  /**\n   * What to render per rule (values / percentage / window / tier) and whether\n   * to render all applicable rules or only the most restrictive one.\n   */\n  display?: UsageBarDisplay;\n  /**\n   * Render your own component instead of the built-in bar(s). Receives the live\n   * usage data (rules + tier + loading) and renders in the same slot, replacing\n   * the default UI entirely. When set, fetching/polling is still handled here;\n   * `mode`/`display` only affect the default UI and are ignored.\n   */\n  customUsageBar?: (data: UsageBarData) => React.ReactNode;\n  /** Primary color for the bar fill (below the warning threshold). */\n  color?: string;\n  /**\n   * Changes to this value trigger a refetch (e.g. the message count, so the bar\n   * refreshes after each assistant turn).\n   */\n  refreshKey?: number | string;\n  /** Enable debug logging of fetch errors to the console. */\n  debug?: boolean;\n}\n\nconst WARN_THRESHOLD = 90;\n\nfunction fillColor(percent: number, base: string): string {\n  if (percent >= 100) return '#ff4d4f';\n  if (percent >= WARN_THRESHOLD) return '#faad14';\n  return base;\n}\n\nfunction formatAmount(value: number, metric: 'tokens' | 'cost'): string {\n  if (metric === 'cost') {\n    return `$${value.toFixed(value < 1 ? 4 : 2)}`;\n  }\n  return Math.round(value).toLocaleString();\n}\n\nfunction windowLabel(unit: string, every: number): string {\n  const u = every > 1 ? `${unit}s` : unit;\n  return every > 1 ? `every ${every} ${u}` : `per ${unit}`;\n}\n\nfunction resetLabel(resetsAt?: number): string {\n  if (!resetsAt) return '';\n  const ms = resetsAt - Date.now();\n  if (ms <= 0) return 'resets now';\n  const mins = Math.round(ms / 60000);\n  if (mins < 60) return `resets in ${mins}m`;\n  const hours = Math.round(mins / 60);\n  if (hours < 48) return `resets in ${hours}h`;\n  const days = Math.round(hours / 24);\n  return `resets in ${days}d`;\n}\n\n/**\n * A thin usage bar showing the current tenant/subtenant usage window(s).\n * Rendered above the chat input. Antd-free — styled via `.devic-usage-*` classes.\n * Renders nothing when there are no usage limits configured for the tenant.\n */\nexport function UsageBar({\n  apiKey,\n  baseUrl,\n  tenantId,\n  subtenantId,\n  mode = 'always',\n  metric,\n  display,\n  customUsageBar,\n  color = '#1890ff',\n  refreshKey,\n  debug = false,\n}: UsageBarProps): JSX.Element | null {\n  const cfg = useMemo(() => ({ ...DEFAULT_DISPLAY, ...display }), [display]);\n\n  const devicContext = useOptionalDevicContext();\n  const getTenantSession = devicContext?.getTenantSession;\n  const onSessionExpired = devicContext?.onSessionExpired;\n  const client = useMemo(() => {\n    if (!apiKey && !getTenantSession) return null;\n    return new DevicApiClient({\n      apiKey,\n      baseUrl: baseUrl || 'https://api.devic.ai',\n      getTenantSession,\n      onSessionExpired,\n    });\n  }, [apiKey, getTenantSession, baseUrl]);\n\n  const [usage, setUsage] = useState<TenantUsage | null>(null);\n  const [loaded, setLoaded] = useState(false);\n  // onDemand starts hidden; 'always' is effectively visible from the start.\n  const [visible, setVisible] = useState(mode !== 'onDemand');\n\n  const fetchUsage = useCallback(async () => {\n    if (!client || !tenantId) return;\n    try {\n      const data = await client.getTenantUsage(tenantId, subtenantId);\n      setUsage(data || null);\n    } catch (err) {\n      if (debug) console.warn('[UsageBar] getTenantUsage failed:', err);\n      setUsage(null);\n    } finally {\n      setLoaded(true);\n    }\n  }, [client, tenantId, subtenantId, debug]);\n\n  // A custom renderer always wants the data, regardless of the onDemand toggle.\n  const active = !!customUsageBar || visible;\n\n  useEffect(() => {\n    if (!active) return;\n    void fetchUsage();\n  }, [active, fetchUsage, refreshKey]);\n\n  // Applicable rules: filter by metric, sort most-restrictive first.\n  const filteredSorted = useMemo(() => {\n    const pool = (usage?.usage || []).filter(\n      (r) => !metric || r.metric === metric,\n    );\n    return [...pool].sort((a, b) => b.percent - a.percent);\n  }, [usage, metric]);\n\n  // Default UI honours showAllRules; custom renderers always get the full set.\n  const rules = useMemo(\n    () => (cfg.showAllRules ? filteredSorted : filteredSorted.slice(0, 1)),\n    [filteredSorted, cfg.showAllRules],\n  );\n\n  const tierId = usage?.tierId || filteredSorted[0]?.tierId;\n\n  if (!tenantId || !client) return null;\n\n  // Custom renderer fully replaces the default UI; hand it the live data.\n  if (customUsageBar) {\n    return (\n      <>\n        {customUsageBar({\n          tenantId,\n          subtenantId,\n          tierId,\n          rules: filteredSorted,\n          loading: !loaded,\n        })}\n      </>\n    );\n  }\n\n  // onDemand, collapsed: show a small toggle button.\n  if (mode === 'onDemand' && !visible) {\n    return (\n      <div className=\"devic-usage-bar-wrap\" data-mode=\"onDemand\">\n        <button\n          type=\"button\"\n          className=\"devic-usage-toggle\"\n          onClick={() => setVisible(true)}\n          title=\"Show usage\"\n        >\n          <GaugeIcon />\n          <span>Usage</span>\n        </button>\n      </div>\n    );\n  }\n\n  // No configured limits (or not loaded yet with nothing to show): render nothing\n  // in 'always' mode; in expanded onDemand, show a subtle note so the toggle isn't\n  // confusing.\n  if (rules.length === 0) {\n    if (mode === 'onDemand' && loaded) {\n      return (\n        <div className=\"devic-usage-bar-wrap\" data-mode=\"onDemand\">\n          <div className=\"devic-usage-bar\" data-empty=\"true\">\n            <span className=\"devic-usage-bar-label\">No usage limits</span>\n            <button\n              type=\"button\"\n              className=\"devic-usage-collapse\"\n              onClick={() => setVisible(false)}\n              title=\"Hide usage\"\n              aria-label=\"Hide usage\"\n            >\n              &times;\n            </button>\n          </div>\n        </div>\n      );\n    }\n    return null;\n  }\n\n  const showTierChip = cfg.showTier && !!tierId;\n  const multi = rules.length > 1;\n  // A header carries the tier chip and/or the onDemand collapse control, so the\n  // collapse \"×\" has a stable home regardless of how many rows render below.\n  const header =\n    showTierChip || mode === 'onDemand' ? (\n      <div className=\"devic-usage-bar-head\">\n        {showTierChip ? (\n          <span className=\"devic-usage-tier\" title={`Tier: ${tierId}`}>\n            {tierId}\n          </span>\n        ) : (\n          <span />\n        )}\n        {mode === 'onDemand' && (\n          <button\n            type=\"button\"\n            className=\"devic-usage-collapse\"\n            onClick={() => setVisible(false)}\n            title=\"Hide usage\"\n            aria-label=\"Hide usage\"\n          >\n            &times;\n          </button>\n        )}\n      </div>\n    ) : null;\n\n  return (\n    <div className=\"devic-usage-bar-wrap\" data-mode={mode}>\n      {header}\n      {/* All rows share a single container by default. */}\n      <div className=\"devic-usage-bar-group\">\n        {rules.map((rule, i) => {\n          const pct = Math.min(100, Math.round(rule.percent));\n          const fill = fillColor(pct, color);\n          const valuesText = `${formatAmount(rule.current, rule.metric)} / ${formatAmount(\n            rule.limit,\n            rule.metric,\n          )} ${rule.metric}`;\n          // Distinguish rows by metric when several render; otherwise use the\n          // scope-aware label so single-rule mode reads \"Usage 24%\".\n          const prefix = multi\n            ? rule.metric === 'cost'\n              ? 'Cost'\n              : 'Tokens'\n            : rule.scope === 'subtenant'\n              ? 'Your usage'\n              : 'Usage';\n          const main: string[] = [];\n          if (cfg.showPercent) main.push(`${pct}%`);\n          if (cfg.showValues) main.push(valuesText);\n          if (main.length === 0) main.push(`${pct}%`);\n          const label = `${prefix} ${main.join(' · ')}`.trim();\n          const reset = resetLabel(rule.resetsAt);\n          const win = windowLabel(rule.windowUnit, rule.windowEvery);\n          const title = `${valuesText} · ${win}${reset ? ` · ${reset}` : ''}`;\n\n          return (\n            <div\n              key={`${rule.metric}-${rule.windowUnit}-${rule.windowEvery}-${rule.scope}-${i}`}\n              className=\"devic-usage-bar\"\n              title={title}\n              data-state={pct >= 100 ? 'exceeded' : 'ok'}\n            >\n              <span className=\"devic-usage-bar-label\">{label}</span>\n              <div className=\"devic-usage-bar-track\">\n                <div\n                  className=\"devic-usage-bar-fill\"\n                  style={{ width: `${pct}%`, backgroundColor: fill }}\n                />\n              </div>\n              {cfg.showWindow && (\n                <span className=\"devic-usage-bar-window\">{win}</span>\n              )}\n              {reset && <span className=\"devic-usage-bar-reset\">{reset}</span>}\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n}\n\n/** Small gauge icon for the on-demand toggle. */\nfunction GaugeIcon(): JSX.Element {\n  return (\n    <svg\n      width=\"14\"\n      height=\"14\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <path d=\"M12 14a4 4 0 1 0-4-4\" />\n      <path d=\"M3 18a9 9 0 0 1 18 0\" />\n      <line x1=\"12\" y1=\"14\" x2=\"15\" y2=\"11\" />\n    </svg>\n  );\n}\n"],"names":["_jsx","_Fragment","_jsxs"],"mappings":"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"}
+{"version":3,"file":"UsageBar.js","sources":["../../../../src/components/ChatDrawer/UsageBar.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from 'react';\nimport { useOptionalDevicContext } from '../../provider';\nimport { DevicApiClient } from '../../api/client';\nimport type { TenantUsage, TenantUsageRule } from '../../api/types';\nimport { useTranslations } from '../../i18n';\nimport type { Translator } from '../../i18n';\n\n/**\n * Controls what each usage row renders. All flags compose, so a developer can,\n * for example, show absolute values together with the percentage and the tier.\n */\nexport interface UsageBarDisplay {\n  /**\n   * Show the absolute amount of the active window: `current / limit metric`\n   * (e.g. `1,200 / 5,000 tokens`).\n   * @default false\n   */\n  showValues?: boolean;\n  /**\n   * Show the utilization percentage (e.g. `24%`).\n   * @default true\n   */\n  showPercent?: boolean;\n  /**\n   * Show the temporal dimension of the window (e.g. `per 3h`, `every 3 hours`).\n   * @default true\n   */\n  showWindow?: boolean;\n  /**\n   * Show the tier (plan) the limits come from, as a chip above the bar(s).\n   * @default false\n   */\n  showTier?: boolean;\n  /**\n   * When more than one limit rule applies, render every rule (`true`) or only\n   * the single most restrictive one (`false`, highest utilization). The\n   * per-row presentation still follows the flags above.\n   * @default true\n   */\n  showAllRules?: boolean;\n}\n\nconst DEFAULT_DISPLAY: Required<UsageBarDisplay> = {\n  showValues: false,\n  showPercent: true,\n  showWindow: true,\n  showTier: false,\n  showAllRules: true,\n};\n\n/**\n * Usage data handed to a `customUsageBar` renderer so a developer can build\n * their own component with the live consumption / limits.\n */\nexport interface UsageBarData {\n  /** Tenant the usage belongs to. */\n  tenantId?: string;\n  /** Subtenant the usage is scoped to, if any. */\n  subtenantId?: string;\n  /** Tier (plan) the limits come from, if any. */\n  tierId?: string;\n  /**\n   * Applicable usage rules (filtered by `metric` when set), sorted by\n   * utilization descending — the most restrictive first.\n   */\n  rules: TenantUsageRule[];\n  /** `true` until the first fetch resolves. */\n  loading: boolean;\n}\n\n/**\n * Props for the UsageBar component.\n */\nexport interface UsageBarProps {\n  /** API key (resolved from provider by the ChatDrawer). */\n  apiKey?: string;\n  /** Base URL (resolved from provider by the ChatDrawer). */\n  baseUrl?: string;\n  /** Tenant whose usage is displayed. Required — without it the bar renders nothing. */\n  tenantId?: string;\n  /** Optional subtenant to scope the usage to a specific end user. */\n  subtenantId?: string;\n  /**\n   * Display mode:\n   * - 'always': the bar is always visible.\n   * - 'onDemand': a small toggle button is shown; the bar appears on click.\n   */\n  mode?: 'always' | 'onDemand';\n  /** Restrict the bar to a single metric. When omitted, all applicable rules are considered. */\n  metric?: 'tokens' | 'cost';\n  /**\n   * What to render per rule (values / percentage / window / tier) and whether\n   * to render all applicable rules or only the most restrictive one.\n   */\n  display?: UsageBarDisplay;\n  /**\n   * Render your own component instead of the built-in bar(s). Receives the live\n   * usage data (rules + tier + loading) and renders in the same slot, replacing\n   * the default UI entirely. When set, fetching/polling is still handled here;\n   * `mode`/`display` only affect the default UI and are ignored.\n   */\n  customUsageBar?: (data: UsageBarData) => React.ReactNode;\n  /** Primary color for the bar fill (below the warning threshold). */\n  color?: string;\n  /**\n   * Changes to this value trigger a refetch (e.g. the message count, so the bar\n   * refreshes after each assistant turn).\n   */\n  refreshKey?: number | string;\n  /** Enable debug logging of fetch errors to the console. */\n  debug?: boolean;\n}\n\nconst WARN_THRESHOLD = 90;\n\nfunction fillColor(percent: number, base: string): string {\n  if (percent >= 100) return '#ff4d4f';\n  if (percent >= WARN_THRESHOLD) return '#faad14';\n  return base;\n}\n\nfunction formatAmount(value: number, metric: 'tokens' | 'cost'): string {\n  if (metric === 'cost') {\n    return `$${value.toFixed(value < 1 ? 4 : 2)}`;\n  }\n  return Math.round(value).toLocaleString();\n}\n\n// The unit names are translated on their own so a dictionary can decline\n// them; the sentence around them is a separate entry with placeholders, which\n// is what a language with a different word order needs.\nfunction windowLabel(t: Translator, unit: string, every: number): string {\n  const u = every > 1 ? t(`{count} ${unit}s`, { count: every }) : t(unit);\n  return every > 1 ? t('every {window}', { window: u }) : t('per {window}', { window: u });\n}\n\nfunction resetLabel(t: Translator, resetsAt?: number): string {\n  if (!resetsAt) return '';\n  const ms = resetsAt - Date.now();\n  if (ms <= 0) return t('resets now');\n  const mins = Math.round(ms / 60000);\n  if (mins < 60) return t('resets in {count}m', { count: mins });\n  const hours = Math.round(mins / 60);\n  if (hours < 48) return t('resets in {count}h', { count: hours });\n  const days = Math.round(hours / 24);\n  return t('resets in {count}d', { count: days });\n}\n\n/**\n * A thin usage bar showing the current tenant/subtenant usage window(s).\n * Rendered above the chat input. Antd-free — styled via `.devic-usage-*` classes.\n * Renders nothing when there are no usage limits configured for the tenant.\n */\nexport function UsageBar({\n  apiKey,\n  baseUrl,\n  tenantId,\n  subtenantId,\n  mode = 'always',\n  metric,\n  display,\n  customUsageBar,\n  color = '#1890ff',\n  refreshKey,\n  debug = false,\n}: UsageBarProps): JSX.Element | null {\n  const t = useTranslations();\n  const cfg = useMemo(() => ({ ...DEFAULT_DISPLAY, ...display }), [display]);\n\n  const devicContext = useOptionalDevicContext();\n  const getTenantSession = devicContext?.getTenantSession;\n  const onSessionExpired = devicContext?.onSessionExpired;\n  const client = useMemo(() => {\n    if (!apiKey && !getTenantSession) return null;\n    return new DevicApiClient({\n      apiKey,\n      baseUrl: baseUrl || 'https://api.devic.ai',\n      getTenantSession,\n      onSessionExpired,\n    });\n  }, [apiKey, getTenantSession, baseUrl]);\n\n  const [usage, setUsage] = useState<TenantUsage | null>(null);\n  const [loaded, setLoaded] = useState(false);\n  // onDemand starts hidden; 'always' is effectively visible from the start.\n  const [visible, setVisible] = useState(mode !== 'onDemand');\n\n  const fetchUsage = useCallback(async () => {\n    if (!client || !tenantId) return;\n    try {\n      const data = await client.getTenantUsage(tenantId, subtenantId);\n      setUsage(data || null);\n    } catch (err) {\n      if (debug) console.warn('[UsageBar] getTenantUsage failed:', err);\n      setUsage(null);\n    } finally {\n      setLoaded(true);\n    }\n  }, [client, tenantId, subtenantId, debug]);\n\n  // A custom renderer always wants the data, regardless of the onDemand toggle.\n  const active = !!customUsageBar || visible;\n\n  useEffect(() => {\n    if (!active) return;\n    void fetchUsage();\n  }, [active, fetchUsage, refreshKey]);\n\n  // Applicable rules: filter by metric, sort most-restrictive first.\n  const filteredSorted = useMemo(() => {\n    const pool = (usage?.usage || []).filter(\n      (r) => !metric || r.metric === metric,\n    );\n    return [...pool].sort((a, b) => b.percent - a.percent);\n  }, [usage, metric]);\n\n  // Default UI honours showAllRules; custom renderers always get the full set.\n  const rules = useMemo(\n    () => (cfg.showAllRules ? filteredSorted : filteredSorted.slice(0, 1)),\n    [filteredSorted, cfg.showAllRules],\n  );\n\n  const tierId = usage?.tierId || filteredSorted[0]?.tierId;\n\n  if (!tenantId || !client) return null;\n\n  // Custom renderer fully replaces the default UI; hand it the live data.\n  if (customUsageBar) {\n    return (\n      <>\n        {customUsageBar({\n          tenantId,\n          subtenantId,\n          tierId,\n          rules: filteredSorted,\n          loading: !loaded,\n        })}\n      </>\n    );\n  }\n\n  // onDemand, collapsed: show a small toggle button.\n  if (mode === 'onDemand' && !visible) {\n    return (\n      <div className=\"devic-usage-bar-wrap\" data-mode=\"onDemand\">\n        <button\n          type=\"button\"\n          className=\"devic-usage-toggle\"\n          onClick={() => setVisible(true)}\n          title={t('Show usage')}\n        >\n          <GaugeIcon />\n          <span>{t('Usage')}</span>\n        </button>\n      </div>\n    );\n  }\n\n  // No configured limits (or not loaded yet with nothing to show): render nothing\n  // in 'always' mode; in expanded onDemand, show a subtle note so the toggle isn't\n  // confusing.\n  if (rules.length === 0) {\n    if (mode === 'onDemand' && loaded) {\n      return (\n        <div className=\"devic-usage-bar-wrap\" data-mode=\"onDemand\">\n          <div className=\"devic-usage-bar\" data-empty=\"true\">\n            <span className=\"devic-usage-bar-label\">\n              {t('No usage limits')}\n            </span>\n            <button\n              type=\"button\"\n              className=\"devic-usage-collapse\"\n              onClick={() => setVisible(false)}\n              title={t('Hide usage')}\n              aria-label={t('Hide usage')}\n            >\n              &times;\n            </button>\n          </div>\n        </div>\n      );\n    }\n    return null;\n  }\n\n  const showTierChip = cfg.showTier && !!tierId;\n  const multi = rules.length > 1;\n  // A header carries the tier chip and/or the onDemand collapse control, so the\n  // collapse \"×\" has a stable home regardless of how many rows render below.\n  const header =\n    showTierChip || mode === 'onDemand' ? (\n      <div className=\"devic-usage-bar-head\">\n        {showTierChip ? (\n          <span className=\"devic-usage-tier\" title={t('Tier: {tier}', { tier: tierId })}>\n            {tierId}\n          </span>\n        ) : (\n          <span />\n        )}\n        {mode === 'onDemand' && (\n          <button\n            type=\"button\"\n            className=\"devic-usage-collapse\"\n            onClick={() => setVisible(false)}\n            title={t('Hide usage')}\n            aria-label={t('Hide usage')}\n          >\n            &times;\n          </button>\n        )}\n      </div>\n    ) : null;\n\n  return (\n    <div className=\"devic-usage-bar-wrap\" data-mode={mode}>\n      {header}\n      {/* All rows share a single container by default. */}\n      <div className=\"devic-usage-bar-group\">\n        {rules.map((rule, i) => {\n          const pct = Math.min(100, Math.round(rule.percent));\n          const fill = fillColor(pct, color);\n          const valuesText = `${formatAmount(rule.current, rule.metric)} / ${formatAmount(\n            rule.limit,\n            rule.metric,\n          )} ${t(rule.metric)}`;\n          // Distinguish rows by metric when several render; otherwise use the\n          // scope-aware label so single-rule mode reads \"Usage 24%\".\n          const prefix = multi\n            ? rule.metric === 'cost'\n              ? t('Cost')\n              : t('Tokens')\n            : rule.scope === 'subtenant'\n              ? t('Your usage')\n              : t('Usage');\n          const main: string[] = [];\n          if (cfg.showPercent) main.push(`${pct}%`);\n          if (cfg.showValues) main.push(valuesText);\n          if (main.length === 0) main.push(`${pct}%`);\n          const label = `${prefix} ${main.join(' · ')}`.trim();\n          const reset = resetLabel(t, rule.resetsAt);\n          const win = windowLabel(t, rule.windowUnit, rule.windowEvery);\n          const title = `${valuesText} · ${win}${reset ? ` · ${reset}` : ''}`;\n\n          return (\n            <div\n              key={`${rule.metric}-${rule.windowUnit}-${rule.windowEvery}-${rule.scope}-${i}`}\n              className=\"devic-usage-bar\"\n              title={title}\n              data-state={pct >= 100 ? 'exceeded' : 'ok'}\n            >\n              <span className=\"devic-usage-bar-label\">{label}</span>\n              <div className=\"devic-usage-bar-track\">\n                <div\n                  className=\"devic-usage-bar-fill\"\n                  style={{ width: `${pct}%`, backgroundColor: fill }}\n                />\n              </div>\n              {cfg.showWindow && (\n                <span className=\"devic-usage-bar-window\">{win}</span>\n              )}\n              {reset && <span className=\"devic-usage-bar-reset\">{reset}</span>}\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n}\n\n/** Small gauge icon for the on-demand toggle. */\nfunction GaugeIcon(): JSX.Element {\n  return (\n    <svg\n      width=\"14\"\n      height=\"14\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <path d=\"M12 14a4 4 0 1 0-4-4\" />\n      <path d=\"M3 18a9 9 0 0 1 18 0\" />\n      <line x1=\"12\" y1=\"14\" x2=\"15\" y2=\"11\" />\n    </svg>\n  );\n}\n"],"names":["_jsx","_Fragment","_jsxs"],"mappings":"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"}

package/dist/esm/components/ChatDrawer/index.d.ts

@@ -15,6 +15,8 @@ export type { QueueNoticeProps } from './QueueNotice';
 export { RecalledMemoriesWidget } from './RecalledMemoriesWidget';
 export type { CompactionWidgetProps, CompactionRenderer, CompactionRendererProps, } from './CompactionWidget';
 export { CompactionWidget } from './CompactionWidget';
+export { GuardrailNotice } from './GuardrailNotice';
+export type { GuardrailNoticeProps, GuardrailRenderer, GuardrailPayload, } from './GuardrailNotice';
 export type { RecalledMemoriesWidgetProps, RecalledMemoriesRenderer, RecalledMemoriesRendererProps, } from './RecalledMemoriesWidget';
 export type { ChatDrawerProps, ChatDrawerOptions, ChatDrawerHandle, ChatMessagesProps, ChatInputProps, CustomPromptBoxProps, MessageBubbleRenderer, MessageBubbleRendererProps, ToolTimelineProps, AllowedFileTypes, ConversationSelectorProps, SuggestedMessage, } from './ChatDrawer.types';
 export type { HandoffSubagentWidgetProps } from './HandoffSubagentWidget';

package/dist/esm/components/ChatDrawer/pastedText.js.map

@@ -1 +1 @@
-{"version":3,"file":"pastedText.js","sources":["../../../../src/components/ChatDrawer/pastedText.ts"],"sourcesContent":["/**\n * Shared contract for long blocks of pasted text.\n *\n * A long paste is shown in the prompt box as an attachment card instead of\n * flooding the textarea, but its content still reaches the model in full: on\n * send it is prepended to the message inside a <pasted-text> block. The thread\n * parses those blocks back out so the bubble shows a card too, rather than\n * thousands of lines of raw text.\n *\n * Both sides of that round-trip live here so they can never drift apart.\n */\n\nexport interface PastedText {\n  id: string;\n  text: string;\n}\n\n/**\n * A pasted block could itself contain the literal closing tag (pasting this\n * very file, say), which would truncate the block when parsed back. Escaping it\n * on the way out keeps the round-trip exact and still reads as the intended\n * text to the model.\n */\nconst CLOSING_TAG = '</pasted-text>';\nconst ESCAPED_CLOSING_TAG = '<\\\\/pasted-text>';\n\nconst PASTED_BLOCK_RE = /<pasted-text id=\"([^\"]*)\">\\n([\\s\\S]*?)\\n<\\/pasted-text>/g;\n\n/** Serialize a pasted block for the message sent to the assistant. */\nexport function toPastedBlock({ id, text }: PastedText): string {\n  const escaped = text.split(CLOSING_TAG).join(ESCAPED_CLOSING_TAG);\n  return `<pasted-text id=\"${id}\">\\n${escaped}\\n${CLOSING_TAG}`;\n}\n\n/**\n * Pull the pasted blocks out of a user message, returning them alongside the\n * message with those blocks removed. Returns null when there are none, so\n * callers can keep rendering untouched messages exactly as before.\n */\nexport function parsePastedBlocks(\n  content: string\n): { blocks: PastedText[]; cleanContent: string } | null {\n  const blocks: PastedText[] = [];\n  const cleanContent = content\n    .replace(PASTED_BLOCK_RE, (_match, id: string, text: string) => {\n      blocks.push({\n        id,\n        text: text.split(ESCAPED_CLOSING_TAG).join(CLOSING_TAG),\n      });\n      return '';\n    })\n    .trim();\n\n  if (blocks.length === 0) return null;\n  return { blocks, cleanContent };\n}\n\n/** Short, single-line-ish excerpt shown on the collapsed card. */\nexport function pastedPreview(text: string, maxChars = 160): string {\n  const collapsed = text.replace(/\\s+/g, ' ').trim();\n  return collapsed.length > maxChars\n    ? `${collapsed.slice(0, maxChars)}…`\n    : collapsed;\n}\n\n/** Line count shown on the card, mirroring how editors report a selection. */\nexport function pastedLineCount(text: string): number {\n  return text.split('\\n').length;\n}\n"],"names":[],"mappings":"AAAA;;;;;;;;;;AAUG;AAOH;;;;;AAKG;AACH,MAAM,WAAW,GAAG,gBAAgB;AACpC,MAAM,mBAAmB,GAAG,kBAAkB;AAE9C,MAAM,eAAe,GAAG,0DAA0D;AAElF;SACgB,aAAa,CAAC,EAAE,EAAE,EAAE,IAAI,EAAc,EAAA;AACpD,IAAA,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,mBAAmB,CAAC;AACjE,IAAA,OAAO,oBAAoB,EAAE,CAAA,IAAA,EAAO,OAAO,CAAA,EAAA,EAAK,WAAW,EAAE;AAC/D;AAEA;;;;AAIG;AACG,SAAU,iBAAiB,CAC/B,OAAe,EAAA;IAEf,MAAM,MAAM,GAAiB,EAAE;IAC/B,MAAM,YAAY,GAAG;SAClB,OAAO,CAAC,eAAe,EAAE,CAAC,MAAM,EAAE,EAAU,EAAE,IAAY,KAAI;QAC7D,MAAM,CAAC,IAAI,CAAC;YACV,EAAE;YACF,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC;AACxD,SAAA,CAAC;AACF,QAAA,OAAO,EAAE;AACX,IAAA,CAAC;AACA,SAAA,IAAI,EAAE;AAET,IAAA,IAAI,MAAM,CAAC,MAAM,KAAK,CAAC;AAAE,QAAA,OAAO,IAAI;AACpC,IAAA,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE;AACjC;AAEA;SACgB,aAAa,CAAC,IAAY,EAAE,QAAQ,GAAG,GAAG,EAAA;AACxD,IAAA,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE;AAClD,IAAA,OAAO,SAAS,CAAC,MAAM,GAAG;UACtB,CAAA,EAAG,SAAS,CAAC,KAAK,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAA,CAAA;UAC/B,SAAS;AACf;AAEA;AACM,SAAU,eAAe,CAAC,IAAY,EAAA;IAC1C,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,MAAM;AAChC;;"}
+{"version":3,"file":"pastedText.js","sources":["../../../../src/components/ChatDrawer/pastedText.ts"],"sourcesContent":["/**\n * Shared contract for long blocks of pasted text.\n *\n * A long paste is shown in the prompt box as an attachment card instead of\n * flooding the textarea, but its content still reaches the model in full: on\n * send it is prepended to the message inside a <pasted-text> block. The thread\n * parses those blocks back out so the bubble shows a card too, rather than\n * thousands of lines of raw text.\n *\n * Both sides of that round-trip live here so they can never drift apart.\n */\n\nexport interface PastedText {\n  id: string;\n  text: string;\n}\n\n/**\n * A pasted block could itself contain the literal closing tag (pasting this\n * very file, say), which would truncate the block when parsed back. Escaping it\n * on the way out keeps the round-trip exact and still reads as the intended\n * text to the model.\n */\nconst CLOSING_TAG = '</pasted-text>';\nconst ESCAPED_CLOSING_TAG = '<\\\\/pasted-text>';\n\nconst PASTED_BLOCK_RE = /<pasted-text id=\"([^\"]*)\">\\n([\\s\\S]*?)\\n<\\/pasted-text>/g;\n\n/** Serialize a pasted block for the message sent to the assistant. */\nexport function toPastedBlock({ id, text }: PastedText): string {\n  const escaped = text.split(CLOSING_TAG).join(ESCAPED_CLOSING_TAG);\n  return `<pasted-text id=\"${id}\">\\n${escaped}\\n${CLOSING_TAG}`;\n}\n\n/**\n * Pull the pasted blocks out of a user message, returning them alongside the\n * message with those blocks removed. Returns null when there are none, so\n * callers can keep rendering untouched messages exactly as before.\n */\nexport function parsePastedBlocks(\n  content: string\n): { blocks: PastedText[]; cleanContent: string } | null {\n  const blocks: PastedText[] = [];\n  const cleanContent = content\n    .replace(PASTED_BLOCK_RE, (_match, id: string, text: string) => {\n      blocks.push({\n        id,\n        text: text.split(ESCAPED_CLOSING_TAG).join(CLOSING_TAG),\n      });\n      return '';\n    })\n    .trim();\n\n  if (blocks.length === 0) return null;\n  return { blocks, cleanContent };\n}\n\n/** Short, single-line-ish excerpt shown on the collapsed card. */\nexport function pastedPreview(text: string, maxChars = 160): string {\n  const collapsed = text.replace(/\\s+/g, ' ').trim();\n  return collapsed.length > maxChars\n    ? `${collapsed.slice(0, maxChars)}…`\n    : collapsed;\n}\n\n/** Line count shown on the card, mirroring how editors report a selection. */\nexport function pastedLineCount(text: string): number {\n  return text.split('\\n').length;\n}\n"],"names":[],"mappings":"AAAA;;;;;;;;;;AAUG;AAOH;;;;;AAKG;AACH,MAAM,WAAW,GAAG,gBAAgB;AACpC,MAAM,mBAAmB,GAAG,kBAAkB;AAE9C,MAAM,eAAe,GAAG,0DAA0D;AAElF;SACgB,aAAa,CAAC,EAAE,EAAE,EAAE,IAAI,EAAc,EAAA;AACpD,IAAA,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,mBAAmB,CAAC;AACjE,IAAA,OAAO,oBAAoB,EAAE,CAAA,IAAA,EAAO,OAAO,CAAA,EAAA,EAAK,WAAW,EAAE;AAC/D;AAEA;;;;AAIG;AACG,SAAU,iBAAiB,CAC/B,OAAe,EAAA;IAEf,MAAM,MAAM,GAAiB,EAAE;IAC/B,MAAM,YAAY,GAAG;SAClB,OAAO,CAAC,eAAe,EAAE,CAAC,MAAM,EAAE,EAAU,EAAE,IAAY,KAAI;QAC7D,MAAM,CAAC,IAAI,CAAC;YACV,EAAE;YACF,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC;AACxD,SAAA,CAAC;AACF,QAAA,OAAO,EAAE;AACX,IAAA,CAAC;AACA,SAAA,IAAI,EAAE;AAET,IAAA,IAAI,MAAM,CAAC,MAAM,KAAK,CAAC;AAAE,QAAA,OAAO,IAAI;AACpC,IAAA,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE;AACjC;AAEA;SACgB,aAAa,CAAC,IAAY,EAAE,QAAQ,GAAG,GAAG,EAAA;AACxD,IAAA,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE;AAClD,IAAA,OAAO,SAAS,CAAC,MAAM,GAAG;UACtB,CAAA,EAAG,SAAS,CAAC,KAAK,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAA,CAAA;UAC/B,SAAS;AACf;AAEA;AACM,SAAU,eAAe,CAAC,IAAY,EAAA;IAC1C,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,MAAM;AAChC;;;;"}

package/dist/esm/components/CoreMemoryModal/CoreMemoryModal.js

@@ -4,6 +4,7 @@ import { createPortal } from 'react-dom';
 import { DevicApiClient } from '../../api/client.js';
 import { useOptionalDevicContext } from '../../provider/DevicContext.js';
 import { themeVars } from '../theme.js';
+import { useTranslations } from '../../i18n/useTranslations.js';
 
 /** Canonical sections of the core tier, in display order. */
 const SECTIONS = ["persona", "instructions", "decisions", "profile"];
@@ -47,15 +48,25 @@ function PinIcon() {
  * the API key needs that endpoint allowed.
  */
 function CoreMemoryModal({ isOpen, onClose, assistantId, tenantId, subtenantId, apiKey, baseUrl, editable = true, title, labels, theme, }) {
-    const l = useMemo(() => ({
-        ...DEFAULT_CORE_MEMORY_LABELS,
-        ...labels,
-        title: labels?.title ?? title ?? DEFAULT_CORE_MEMORY_LABELS.title,
-        sections: {
-            ...DEFAULT_CORE_MEMORY_LABELS.sections,
-            ...labels?.sections,
-        },
-    }), [labels, title]);
+    const t = useTranslations();
+    // Three layers, narrowest first: the `labels` this host passed, then the
+    // dictionary, then English. `labels` stays authoritative — a host that
+    // already spells this dialog out itself must not have it changed underneath
+    // by a page-wide dictionary.
+    const l = useMemo(() => {
+        const translated = Object.fromEntries(Object.entries(DEFAULT_CORE_MEMORY_LABELS)
+            .filter(([, value]) => typeof value === "string")
+            .map(([key, value]) => [key, t(value)]));
+        return {
+            ...translated,
+            ...labels,
+            title: labels?.title ?? title ?? t(DEFAULT_CORE_MEMORY_LABELS.title),
+            sections: {
+                ...Object.fromEntries(Object.entries(DEFAULT_CORE_MEMORY_LABELS.sections).map(([key, value]) => [key, t(value)])),
+                ...labels?.sections,
+            },
+        };
+    }, [labels, title, t]);
     const context = useOptionalDevicContext();
     const resolvedBaseUrl = baseUrl || context?.baseUrl || "https://api.devic.ai";
     const resolvedTenantId = tenantId || context?.tenantId;