@athenaintel/react 0.43.0 → 0.48.0

package/dist/tools/use-elapsed-seconds.cjs

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const react = require("react");
+const require$$0 = require("react");
 const ELAPSED_COUNTER_AFTER_SECONDS = 3;
 function useElapsedSeconds(active) {
-  const [seconds, setSeconds] = react.useState(0);
-  react.useEffect(() => {
+  const [seconds, setSeconds] = require$$0.useState(0);
+  require$$0.useEffect(() => {
     setSeconds(0);
     if (!active) return;
     const startedAt = Date.now();

package/dist/tools/use-elapsed-seconds.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-elapsed-seconds.cjs","sources":["../../src/tools/use-elapsed-seconds.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\n\n/** Seconds a running row waits before it starts showing its elapsed counter. */\nexport const ELAPSED_COUNTER_AFTER_SECONDS = 3;\n\n/**\n * Whole seconds since `active` last became true; `0` while inactive. Ticks\n * once a second off the wall clock, so a tab that was throttled catches up on\n * its next tick instead of drifting.\n */\nexport function useElapsedSeconds(active: boolean): number {\n  const [seconds, setSeconds] = useState(0);\n  useEffect(() => {\n    setSeconds(0);\n    if (!active) return;\n    const startedAt = Date.now();\n    const timer = setInterval(() => {\n      setSeconds(Math.floor((Date.now() - startedAt) / 1000));\n    }, 1000);\n    return () => clearInterval(timer);\n  }, [active]);\n  return active ? seconds : 0;\n}\n\n/** `· 4s` once the counter is due, else nothing to append. */\nexport function elapsedSuffix(seconds: number): string | null {\n  return seconds >= ELAPSED_COUNTER_AFTER_SECONDS ? `${seconds}s` : null;\n}\n"],"names":["useState","useEffect"],"mappings":";;;AAGO,MAAM,gCAAgC;AAOtC,SAAS,kBAAkB,QAAyB;AACzD,QAAM,CAAC,SAAS,UAAU,IAAIA,MAAAA,SAAS,CAAC;AACxCC,QAAAA,UAAU,MAAM;AACd,eAAW,CAAC;AACZ,QAAI,CAAC,OAAQ;AACb,UAAM,YAAY,KAAK,IAAA;AACvB,UAAM,QAAQ,YAAY,MAAM;AAC9B,iBAAW,KAAK,OAAO,KAAK,QAAQ,aAAa,GAAI,CAAC;AAAA,IACxD,GAAG,GAAI;AACP,WAAO,MAAM,cAAc,KAAK;AAAA,EAClC,GAAG,CAAC,MAAM,CAAC;AACX,SAAO,SAAS,UAAU;AAC5B;AAGO,SAAS,cAAc,SAAgC;AAC5D,SAAO,WAAW,gCAAgC,GAAG,OAAO,MAAM;AACpE;;;;"}
+{"version":3,"file":"use-elapsed-seconds.cjs","sources":["../../src/tools/use-elapsed-seconds.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\n\n/** Seconds a running row waits before it starts showing its elapsed counter. */\nexport const ELAPSED_COUNTER_AFTER_SECONDS = 3;\n\n/**\n * Whole seconds since `active` last became true; `0` while inactive. Ticks\n * once a second off the wall clock, so a tab that was throttled catches up on\n * its next tick instead of drifting.\n */\nexport function useElapsedSeconds(active: boolean): number {\n  const [seconds, setSeconds] = useState(0);\n  useEffect(() => {\n    setSeconds(0);\n    if (!active) return;\n    const startedAt = Date.now();\n    const timer = setInterval(() => {\n      setSeconds(Math.floor((Date.now() - startedAt) / 1000));\n    }, 1000);\n    return () => clearInterval(timer);\n  }, [active]);\n  return active ? seconds : 0;\n}\n\n/** `· 4s` once the counter is due, else nothing to append. */\nexport function elapsedSuffix(seconds: number): string | null {\n  return seconds >= ELAPSED_COUNTER_AFTER_SECONDS ? `${seconds}s` : null;\n}\n"],"names":["useState","useEffect"],"mappings":";;;AAGO,MAAM,gCAAgC;AAOtC,SAAS,kBAAkB,QAAyB;AACzD,QAAM,CAAC,SAAS,UAAU,IAAIA,WAAAA,SAAS,CAAC;AACxCC,aAAAA,UAAU,MAAM;AACd,eAAW,CAAC;AACZ,QAAI,CAAC,OAAQ;AACb,UAAM,YAAY,KAAK,IAAA;AACvB,UAAM,QAAQ,YAAY,MAAM;AAC9B,iBAAW,KAAK,OAAO,KAAK,QAAQ,aAAa,GAAI,CAAC;AAAA,IACxD,GAAG,GAAI;AACP,WAAO,MAAM,cAAc,KAAK;AAAA,EAClC,GAAG,CAAC,MAAM,CAAC;AACX,SAAO,SAAS,UAAU;AAC5B;AAGO,SAAS,cAAc,SAAgC;AAC5D,SAAO,WAAW,gCAAgC,GAAG,OAAO,MAAM;AACpE;;;;"}

package/dist/tools/write-todos-tool-ui.cjs

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
-const react = require("react");
+const require$$0 = require("react");
 const lucideReact = require("lucide-react");
 const todoPlanStore = require("./todo-plan-store.cjs");
 const cnfast = require("cnfast");
@@ -120,12 +120,12 @@ function PlanBadge({
 }
 function usePlanCardRegistration(plan, isWriting) {
   const scope = todoPlanStore.usePlanScope();
-  const [seq] = react.useState(todoPlanStore.allocatePlanSeq);
-  react.useEffect(() => {
+  const [seq] = require$$0.useState(todoPlanStore.allocatePlanSeq);
+  require$$0.useEffect(() => {
     todoPlanStore.registerPlanCard(scope, seq, plan, isWriting);
     return () => todoPlanStore.unregisterPlanCard(scope, seq);
   }, [scope, seq]);
-  react.useEffect(() => {
+  require$$0.useEffect(() => {
     todoPlanStore.updatePlanCard(scope, seq, plan, isWriting);
   }, [scope, seq, plan, isWriting]);
   return todoPlanStore.useIsLatestPlanCard(scope, seq);
@@ -136,14 +136,14 @@ const HiddenWriteTodosToolUIImpl = ({
   result,
   status
 }) => {
-  const plan = react.useMemo(
+  const plan = require$$0.useMemo(
     () => parseTodoPlan({ args, argsText, result }),
     [args, argsText, result]
   );
   usePlanCardRegistration(plan, (status == null ? void 0 : status.type) === "running");
   return null;
 };
-const HiddenWriteTodosToolUI = react.memo(
+const HiddenWriteTodosToolUI = require$$0.memo(
   HiddenWriteTodosToolUIImpl
 );
 HiddenWriteTodosToolUI.displayName = "HiddenWriteTodosToolUI";
@@ -153,12 +153,12 @@ const WriteTodosToolUIImpl = ({
   result,
   status
 }) => {
-  const plan = react.useMemo(
+  const plan = require$$0.useMemo(
     () => parseTodoPlan({ args, argsText, result }),
     [args, argsText, result]
   );
   const { steps, changeDescription } = plan;
-  const [collapsed, setCollapsed] = react.useState(false);
+  const [collapsed, setCollapsed] = require$$0.useState(false);
   const isWriting = (status == null ? void 0 : status.type) === "running";
   const isLatest = usePlanCardRegistration(plan, isWriting);
   if (!isLatest) return null;
@@ -260,7 +260,7 @@ const WriteTodosToolUIImpl = ({
     )) })
   ] });
 };
-const WriteTodosToolUI = react.memo(
+const WriteTodosToolUI = require$$0.memo(
   WriteTodosToolUIImpl
 );
 WriteTodosToolUI.displayName = "WriteTodosToolUI";

package/dist/tools/write-todos-tool-ui.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"write-todos-tool-ui.cjs","sources":["../../src/tools/write-todos-tool-ui.tsx"],"sourcesContent":["\"use client\";\n\nimport { memo, useEffect, useMemo, useState } from \"react\";\nimport type { ToolCallMessagePartComponent } from \"@assistant-ui/react\";\nimport {\n  CheckIcon,\n  ChevronDownIcon,\n  ListChecksIcon,\n  LoaderIcon,\n  XIcon,\n} from \"lucide-react\";\nimport { cn } from \"../lib/utils\";\nimport {\n  allocatePlanSeq,\n  registerPlanCard,\n  unregisterPlanCard,\n  updatePlanCard,\n  useIsLatestPlanCard,\n  usePlanScope,\n} from \"./todo-plan-store\";\n\n// ─── Types ───────────────────────────────────────────────────────────\n\nexport type PlanStepStatus =\n  | \"pending\"\n  | \"in_progress\"\n  | \"completed\"\n  | \"cancelled\"\n  | \"failed\";\n\nexport type PlanStep = {\n  id?: string;\n  content: string;\n  status: PlanStepStatus;\n};\n\nexport type TodoPlan = {\n  steps: PlanStep[];\n  changeDescription?: string;\n};\n\nconst STEP_STATUSES: readonly PlanStepStatus[] = [\n  \"pending\",\n  \"in_progress\",\n  \"completed\",\n  \"cancelled\",\n  \"failed\",\n];\n\n// ─── Parsing ─────────────────────────────────────────────────────────\n\nfunction asRecord(value: unknown): Record<string, unknown> | null {\n  return typeof value === \"object\" && value !== null\n    ? (value as Record<string, unknown>)\n    : null;\n}\n\nfunction asStatus(value: unknown): PlanStepStatus {\n  return typeof value === \"string\" &&\n    (STEP_STATUSES as readonly string[]).includes(value)\n    ? (value as PlanStepStatus)\n    : \"pending\";\n}\n\nfunction parseSteps(value: unknown): PlanStep[] {\n  if (!Array.isArray(value)) return [];\n  const steps: PlanStep[] = [];\n  for (const raw of value) {\n    const record = asRecord(raw);\n    if (!record) continue;\n    const content = record.content ?? record.task ?? record.title;\n    if (typeof content !== \"string\" || content.trim() === \"\") continue;\n    steps.push({\n      id: typeof record.id === \"string\" ? record.id : undefined,\n      content: content.trim(),\n      status: asStatus(record.status),\n    });\n  }\n  return steps;\n}\n\nfunction asDescription(value: unknown): string | undefined {\n  return typeof value === \"string\" && value.trim() !== \"\"\n    ? value.trim()\n    : undefined;\n}\n\nfunction parsePartialSteps(argsText: string | undefined): PlanStep[] {\n  if (!argsText) return [];\n  const steps: PlanStep[] = [];\n  const objectPattern = /\\{(?:[^{}\\\\\"]|\"(?:[^\"\\\\]|\\\\.)*\")*\\}?/g;\n  for (const [chunk] of argsText.matchAll(objectPattern)) {\n    const contentMatch = /\"(?:content|task|title)\"\\s*:\\s*\"((?:[^\"\\\\]|\\\\.)*)\"/.exec(\n      chunk,\n    );\n    if (!contentMatch) continue;\n    let content: string;\n    try {\n      content = JSON.parse(`\"${contentMatch[1]}\"`) as string;\n    } catch {\n      content = contentMatch[1];\n    }\n    if (content.trim() === \"\") continue;\n    const statusMatch = /\"status\"\\s*:\\s*\"([a-z_]+)\"/.exec(chunk);\n    steps.push({\n      content: content.trim(),\n      status: asStatus(statusMatch?.[1]),\n    });\n  }\n  return steps;\n}\n\nexport function parseTodoPlan({\n  args,\n  argsText,\n  result,\n}: {\n  args?: unknown;\n  argsText?: string;\n  result?: unknown;\n}): TodoPlan {\n  const argsRecord = asRecord(args);\n  const argSteps = parseSteps(argsRecord?.todos);\n\n  let resultRecord = asRecord(result);\n  if (!resultRecord && typeof result === \"string\") {\n    try {\n      resultRecord = asRecord(JSON.parse(result));\n    } catch {\n      resultRecord = null;\n    }\n  }\n\n  const hasResultTodos = Array.isArray(resultRecord?.todos);\n  const steps = hasResultTodos\n    ? parseSteps(resultRecord?.todos)\n    : argSteps.length > 0\n      ? argSteps\n      : parsePartialSteps(argsText);\n\n  return {\n    steps,\n    changeDescription:\n      asDescription(resultRecord?.description) ??\n      asDescription(resultRecord?.todoChangeDescription),\n  };\n}\n\n// ─── Presentation ────────────────────────────────────────────────────\n\n/** A plan step's status glyph (its number while pending) — shared with the workbench's Tasks pane. */\nexport function PlanStepMarker({\n  status,\n  index,\n}: {\n  status: PlanStepStatus;\n  index: number;\n}) {\n  if (status === \"completed\") {\n    return (\n      <span className=\"flex size-[18px] shrink-0 items-center justify-center rounded-full bg-emerald-500 text-white\">\n        <CheckIcon className=\"size-3\" strokeWidth={3} />\n      </span>\n    );\n  }\n  if (status === \"in_progress\") {\n    return (\n      <span className=\"flex size-[18px] shrink-0 items-center justify-center rounded-full bg-primary/10 text-primary\">\n        <LoaderIcon className=\"size-3 animate-spin\" strokeWidth={3} />\n      </span>\n    );\n  }\n  if (status === \"failed\") {\n    return (\n      <span className=\"flex size-[18px] shrink-0 items-center justify-center rounded-full bg-destructive/10 text-destructive\">\n        <XIcon className=\"size-3\" strokeWidth={3} />\n      </span>\n    );\n  }\n  if (status === \"cancelled\") {\n    return (\n      <span className=\"flex size-[18px] shrink-0 items-center justify-center rounded-full border border-border text-muted-foreground\">\n        <XIcon className=\"size-3\" strokeWidth={3} />\n      </span>\n    );\n  }\n  return (\n    <span className=\"flex size-[18px] shrink-0 items-center justify-center rounded-full border border-dashed border-border text-[9px] font-medium text-muted-foreground\">\n      {index + 1}\n    </span>\n  );\n}\n\nfunction PlanBadge({\n  resolved,\n  total,\n}: {\n  resolved: number;\n  total: number;\n}) {\n  const isDone = total > 0 && resolved === total;\n\n  return (\n    <span\n      className={cn(\n        \"flex size-8 shrink-0 items-center justify-center rounded-lg\",\n        isDone && \"bg-emerald-50 text-emerald-600\",\n        !isDone && \"bg-primary/10 text-primary\",\n      )}\n    >\n      {isDone ? (\n        <CheckIcon className=\"size-4\" strokeWidth={3} />\n      ) : (\n        <ListChecksIcon className=\"size-4\" />\n      )}\n    </span>\n  );\n}\n\n/**\n * Register this card in its chat's plan registry and report whether it is the\n * newest mounted one. Shared by the visible card (which hides superseded\n * instances) and {@link HiddenWriteTodosToolUI} (which renders nothing but\n * keeps the registry — and so `useLatestTodoPlan` — fed).\n */\nfunction usePlanCardRegistration(plan: TodoPlan, isWriting: boolean): boolean {\n  const scope = usePlanScope();\n  const [seq] = useState(allocatePlanSeq);\n  useEffect(() => {\n    registerPlanCard(scope, seq, plan, isWriting);\n    return () => unregisterPlanCard(scope, seq);\n    // Registration is keyed to this instance's lifetime (and its chat's\n    // scope); content updates ride the effect below.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [scope, seq]);\n  useEffect(() => {\n    updatePlanCard(scope, seq, plan, isWriting);\n  }, [scope, seq, plan, isWriting]);\n  return useIsLatestPlanCard(scope, seq);\n}\n\n/**\n * Inline-invisible `write_todos` for hosts that pin the plan elsewhere:\n * feeds the plan registry exactly like the visible card, renders nothing.\n * Register it via `toolUIs={{ write_todos: HiddenWriteTodosToolUI }}` and\n * read the plan with `useLatestTodoPlan()` — a bare `() => null` override\n * would leave the registry (and the hook) permanently empty.\n */\nconst HiddenWriteTodosToolUIImpl: ToolCallMessagePartComponent = ({\n  args,\n  argsText,\n  result,\n  status,\n}) => {\n  const plan = useMemo(\n    () => parseTodoPlan({ args, argsText, result }),\n    [args, argsText, result],\n  );\n  usePlanCardRegistration(plan, status?.type === \"running\");\n  return null;\n};\n\nexport const HiddenWriteTodosToolUI = memo(\n  HiddenWriteTodosToolUIImpl,\n) as unknown as ToolCallMessagePartComponent;\nHiddenWriteTodosToolUI.displayName = \"HiddenWriteTodosToolUI\";\n\nconst WriteTodosToolUIImpl: ToolCallMessagePartComponent = ({\n  args,\n  argsText,\n  result,\n  status,\n}) => {\n  const plan = useMemo(\n    () => parseTodoPlan({ args, argsText, result }),\n    [args, argsText, result],\n  );\n  const { steps, changeDescription } = plan;\n  const [collapsed, setCollapsed] = useState(false);\n\n  // Newest-plan dedupe: a run updates its plan by calling write_todos again,\n  // so a conversation stacks cards that all describe the same plan. Only the\n  // newest mounted card in this chat's scope renders (see todo-plan-store.ts).\n  const isWriting = status?.type === \"running\";\n  const isLatest = usePlanCardRegistration(plan, isWriting);\n  if (!isLatest) return null;\n\n  const completed = steps.filter((s) => s.status === \"completed\").length;\n  const stopped = steps.filter(\n    (s) => s.status === \"cancelled\" || s.status === \"failed\",\n  ).length;\n  const current = steps.find((s) => s.status === \"in_progress\");\n  const total = steps.length;\n  const resolved = completed + stopped;\n  const isDone = total > 0 && resolved === total;\n\n  if (total === 0) {\n    return isWriting ? (\n      <div className=\"my-3 flex w-full items-center gap-2 rounded-xl border border-border/60 bg-background px-4 py-3 shadow-sm\">\n        <LoaderIcon className=\"size-3.5 animate-spin text-primary\" />\n        <span className=\"text-[13px] font-medium text-foreground\">\n          Planning...\n        </span>\n      </div>\n    ) : null;\n  }\n\n  const heading = isWriting\n    ? \"Updating plan\"\n    : isDone\n      ? \"Plan complete\"\n      : completed === 0 && !current\n        ? \"Plan\"\n        : \"Plan in progress\";\n\n  const subtitle =\n    changeDescription ?? (current ? current.content : undefined);\n\n  return (\n    <div className=\"my-3 w-full rounded-xl border border-border/60 bg-background shadow-sm\">\n      <div className=\"sticky top-0 z-20 overflow-hidden rounded-t-xl bg-background\">\n        <button\n          type=\"button\"\n          onClick={() => setCollapsed((prev) => !prev)}\n          className=\"flex w-full items-center gap-3 px-4 py-3 text-left transition-colors hover:bg-muted/30\"\n          aria-expanded={!collapsed}\n        >\n          <PlanBadge resolved={resolved} total={total} />\n          <span className=\"min-w-0 flex-1\">\n            <span className=\"flex items-baseline gap-2\">\n              <span className=\"text-[13px] font-medium text-foreground\">\n                {heading}\n              </span>\n              <span className=\"text-[11px] tabular-nums text-muted-foreground\">\n                {resolved}/{total} steps\n              </span>\n            </span>\n            {subtitle && (\n              <span className=\"block truncate text-[12px] text-muted-foreground\">\n                {subtitle}\n              </span>\n            )}\n          </span>\n          <ChevronDownIcon\n            className={cn(\n              \"size-4 shrink-0 text-muted-foreground transition-transform duration-200\",\n              collapsed && \"-rotate-90\",\n            )}\n          />\n        </button>\n\n        <div className=\"h-0.5 w-full bg-muted\">\n          <div\n            className={cn(\n              \"h-full transition-all duration-500\",\n              isDone ? \"bg-emerald-500\" : \"bg-primary\",\n            )}\n            style={{ width: `${total > 0 ? (resolved / total) * 100 : 0}%` }}\n          />\n        </div>\n      </div>\n\n      {!collapsed && (\n        <ol className=\"flex max-h-72 flex-col overflow-y-auto rounded-b-xl border-t border-border/40 py-1\">\n          {steps.map((step, index) => (\n            <li\n              key={step.id ?? `${index}-${step.content}`}\n              className={cn(\n                \"relative flex items-start gap-2.5 px-4 py-1.5\",\n                step.status === \"in_progress\" && \"bg-primary/5\",\n              )}\n            >\n              {index < steps.length - 1 && (\n                <span\n                  aria-hidden\n                  className=\"absolute left-[calc(1rem+8px)] top-[26px] h-[calc(100%-18px)] w-px bg-border/60\"\n                />\n              )}\n              <span className=\"relative z-10 mt-[3px]\">\n                <PlanStepMarker status={step.status} index={index} />\n              </span>\n              <span\n                className={cn(\n                  \"text-[12.5px] leading-relaxed text-foreground\",\n                  step.status === \"completed\" &&\n                    \"text-muted-foreground line-through decoration-muted-foreground/40\",\n                  step.status === \"cancelled\" &&\n                    \"text-muted-foreground/70 line-through decoration-muted-foreground/40\",\n                  step.status === \"failed\" && \"text-destructive\",\n                  step.status === \"in_progress\" && \"font-medium text-primary\",\n                  step.status === \"pending\" && \"text-muted-foreground\",\n                )}\n              >\n                {step.content}\n              </span>\n            </li>\n          ))}\n        </ol>\n      )}\n    </div>\n  );\n};\n\nexport const WriteTodosToolUI = memo(\n  WriteTodosToolUIImpl,\n) as unknown as ToolCallMessagePartComponent;\nWriteTodosToolUI.displayName = \"WriteTodosToolUI\";\n"],"names":["jsx","CheckIcon","LoaderIcon","XIcon","cn","ListChecksIcon","usePlanScope","useState","allocatePlanSeq","useEffect","registerPlanCard","unregisterPlanCard","updatePlanCard","useIsLatestPlanCard","useMemo","memo","jsxs","ChevronDownIcon"],"mappings":"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"}
+{"version":3,"file":"write-todos-tool-ui.cjs","sources":["../../src/tools/write-todos-tool-ui.tsx"],"sourcesContent":["\"use client\";\n\nimport { memo, useEffect, useMemo, useState } from \"react\";\nimport type { ToolCallMessagePartComponent } from \"@assistant-ui/react\";\nimport {\n  CheckIcon,\n  ChevronDownIcon,\n  ListChecksIcon,\n  LoaderIcon,\n  XIcon,\n} from \"lucide-react\";\nimport { cn } from \"../lib/utils\";\nimport {\n  allocatePlanSeq,\n  registerPlanCard,\n  unregisterPlanCard,\n  updatePlanCard,\n  useIsLatestPlanCard,\n  usePlanScope,\n} from \"./todo-plan-store\";\n\n// ─── Types ───────────────────────────────────────────────────────────\n\nexport type PlanStepStatus =\n  | \"pending\"\n  | \"in_progress\"\n  | \"completed\"\n  | \"cancelled\"\n  | \"failed\";\n\nexport type PlanStep = {\n  id?: string;\n  content: string;\n  status: PlanStepStatus;\n};\n\nexport type TodoPlan = {\n  steps: PlanStep[];\n  changeDescription?: string;\n};\n\nconst STEP_STATUSES: readonly PlanStepStatus[] = [\n  \"pending\",\n  \"in_progress\",\n  \"completed\",\n  \"cancelled\",\n  \"failed\",\n];\n\n// ─── Parsing ─────────────────────────────────────────────────────────\n\nfunction asRecord(value: unknown): Record<string, unknown> | null {\n  return typeof value === \"object\" && value !== null\n    ? (value as Record<string, unknown>)\n    : null;\n}\n\nfunction asStatus(value: unknown): PlanStepStatus {\n  return typeof value === \"string\" &&\n    (STEP_STATUSES as readonly string[]).includes(value)\n    ? (value as PlanStepStatus)\n    : \"pending\";\n}\n\nfunction parseSteps(value: unknown): PlanStep[] {\n  if (!Array.isArray(value)) return [];\n  const steps: PlanStep[] = [];\n  for (const raw of value) {\n    const record = asRecord(raw);\n    if (!record) continue;\n    const content = record.content ?? record.task ?? record.title;\n    if (typeof content !== \"string\" || content.trim() === \"\") continue;\n    steps.push({\n      id: typeof record.id === \"string\" ? record.id : undefined,\n      content: content.trim(),\n      status: asStatus(record.status),\n    });\n  }\n  return steps;\n}\n\nfunction asDescription(value: unknown): string | undefined {\n  return typeof value === \"string\" && value.trim() !== \"\"\n    ? value.trim()\n    : undefined;\n}\n\nfunction parsePartialSteps(argsText: string | undefined): PlanStep[] {\n  if (!argsText) return [];\n  const steps: PlanStep[] = [];\n  const objectPattern = /\\{(?:[^{}\\\\\"]|\"(?:[^\"\\\\]|\\\\.)*\")*\\}?/g;\n  for (const [chunk] of argsText.matchAll(objectPattern)) {\n    const contentMatch = /\"(?:content|task|title)\"\\s*:\\s*\"((?:[^\"\\\\]|\\\\.)*)\"/.exec(\n      chunk,\n    );\n    if (!contentMatch) continue;\n    let content: string;\n    try {\n      content = JSON.parse(`\"${contentMatch[1]}\"`) as string;\n    } catch {\n      content = contentMatch[1];\n    }\n    if (content.trim() === \"\") continue;\n    const statusMatch = /\"status\"\\s*:\\s*\"([a-z_]+)\"/.exec(chunk);\n    steps.push({\n      content: content.trim(),\n      status: asStatus(statusMatch?.[1]),\n    });\n  }\n  return steps;\n}\n\nexport function parseTodoPlan({\n  args,\n  argsText,\n  result,\n}: {\n  args?: unknown;\n  argsText?: string;\n  result?: unknown;\n}): TodoPlan {\n  const argsRecord = asRecord(args);\n  const argSteps = parseSteps(argsRecord?.todos);\n\n  let resultRecord = asRecord(result);\n  if (!resultRecord && typeof result === \"string\") {\n    try {\n      resultRecord = asRecord(JSON.parse(result));\n    } catch {\n      resultRecord = null;\n    }\n  }\n\n  const hasResultTodos = Array.isArray(resultRecord?.todos);\n  const steps = hasResultTodos\n    ? parseSteps(resultRecord?.todos)\n    : argSteps.length > 0\n      ? argSteps\n      : parsePartialSteps(argsText);\n\n  return {\n    steps,\n    changeDescription:\n      asDescription(resultRecord?.description) ??\n      asDescription(resultRecord?.todoChangeDescription),\n  };\n}\n\n// ─── Presentation ────────────────────────────────────────────────────\n\n/** A plan step's status glyph (its number while pending) — shared with the workbench's Tasks pane. */\nexport function PlanStepMarker({\n  status,\n  index,\n}: {\n  status: PlanStepStatus;\n  index: number;\n}) {\n  if (status === \"completed\") {\n    return (\n      <span className=\"flex size-[18px] shrink-0 items-center justify-center rounded-full bg-emerald-500 text-white\">\n        <CheckIcon className=\"size-3\" strokeWidth={3} />\n      </span>\n    );\n  }\n  if (status === \"in_progress\") {\n    return (\n      <span className=\"flex size-[18px] shrink-0 items-center justify-center rounded-full bg-primary/10 text-primary\">\n        <LoaderIcon className=\"size-3 animate-spin\" strokeWidth={3} />\n      </span>\n    );\n  }\n  if (status === \"failed\") {\n    return (\n      <span className=\"flex size-[18px] shrink-0 items-center justify-center rounded-full bg-destructive/10 text-destructive\">\n        <XIcon className=\"size-3\" strokeWidth={3} />\n      </span>\n    );\n  }\n  if (status === \"cancelled\") {\n    return (\n      <span className=\"flex size-[18px] shrink-0 items-center justify-center rounded-full border border-border text-muted-foreground\">\n        <XIcon className=\"size-3\" strokeWidth={3} />\n      </span>\n    );\n  }\n  return (\n    <span className=\"flex size-[18px] shrink-0 items-center justify-center rounded-full border border-dashed border-border text-[9px] font-medium text-muted-foreground\">\n      {index + 1}\n    </span>\n  );\n}\n\nfunction PlanBadge({\n  resolved,\n  total,\n}: {\n  resolved: number;\n  total: number;\n}) {\n  const isDone = total > 0 && resolved === total;\n\n  return (\n    <span\n      className={cn(\n        \"flex size-8 shrink-0 items-center justify-center rounded-lg\",\n        isDone && \"bg-emerald-50 text-emerald-600\",\n        !isDone && \"bg-primary/10 text-primary\",\n      )}\n    >\n      {isDone ? (\n        <CheckIcon className=\"size-4\" strokeWidth={3} />\n      ) : (\n        <ListChecksIcon className=\"size-4\" />\n      )}\n    </span>\n  );\n}\n\n/**\n * Register this card in its chat's plan registry and report whether it is the\n * newest mounted one. Shared by the visible card (which hides superseded\n * instances) and {@link HiddenWriteTodosToolUI} (which renders nothing but\n * keeps the registry — and so `useLatestTodoPlan` — fed).\n */\nfunction usePlanCardRegistration(plan: TodoPlan, isWriting: boolean): boolean {\n  const scope = usePlanScope();\n  const [seq] = useState(allocatePlanSeq);\n  useEffect(() => {\n    registerPlanCard(scope, seq, plan, isWriting);\n    return () => unregisterPlanCard(scope, seq);\n    // Registration is keyed to this instance's lifetime (and its chat's\n    // scope); content updates ride the effect below.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [scope, seq]);\n  useEffect(() => {\n    updatePlanCard(scope, seq, plan, isWriting);\n  }, [scope, seq, plan, isWriting]);\n  return useIsLatestPlanCard(scope, seq);\n}\n\n/**\n * Inline-invisible `write_todos` for hosts that pin the plan elsewhere:\n * feeds the plan registry exactly like the visible card, renders nothing.\n * Register it via `toolUIs={{ write_todos: HiddenWriteTodosToolUI }}` and\n * read the plan with `useLatestTodoPlan()` — a bare `() => null` override\n * would leave the registry (and the hook) permanently empty.\n */\nconst HiddenWriteTodosToolUIImpl: ToolCallMessagePartComponent = ({\n  args,\n  argsText,\n  result,\n  status,\n}) => {\n  const plan = useMemo(\n    () => parseTodoPlan({ args, argsText, result }),\n    [args, argsText, result],\n  );\n  usePlanCardRegistration(plan, status?.type === \"running\");\n  return null;\n};\n\nexport const HiddenWriteTodosToolUI = memo(\n  HiddenWriteTodosToolUIImpl,\n) as unknown as ToolCallMessagePartComponent;\nHiddenWriteTodosToolUI.displayName = \"HiddenWriteTodosToolUI\";\n\nconst WriteTodosToolUIImpl: ToolCallMessagePartComponent = ({\n  args,\n  argsText,\n  result,\n  status,\n}) => {\n  const plan = useMemo(\n    () => parseTodoPlan({ args, argsText, result }),\n    [args, argsText, result],\n  );\n  const { steps, changeDescription } = plan;\n  const [collapsed, setCollapsed] = useState(false);\n\n  // Newest-plan dedupe: a run updates its plan by calling write_todos again,\n  // so a conversation stacks cards that all describe the same plan. Only the\n  // newest mounted card in this chat's scope renders (see todo-plan-store.ts).\n  const isWriting = status?.type === \"running\";\n  const isLatest = usePlanCardRegistration(plan, isWriting);\n  if (!isLatest) return null;\n\n  const completed = steps.filter((s) => s.status === \"completed\").length;\n  const stopped = steps.filter(\n    (s) => s.status === \"cancelled\" || s.status === \"failed\",\n  ).length;\n  const current = steps.find((s) => s.status === \"in_progress\");\n  const total = steps.length;\n  const resolved = completed + stopped;\n  const isDone = total > 0 && resolved === total;\n\n  if (total === 0) {\n    return isWriting ? (\n      <div className=\"my-3 flex w-full items-center gap-2 rounded-xl border border-border/60 bg-background px-4 py-3 shadow-sm\">\n        <LoaderIcon className=\"size-3.5 animate-spin text-primary\" />\n        <span className=\"text-[13px] font-medium text-foreground\">\n          Planning...\n        </span>\n      </div>\n    ) : null;\n  }\n\n  const heading = isWriting\n    ? \"Updating plan\"\n    : isDone\n      ? \"Plan complete\"\n      : completed === 0 && !current\n        ? \"Plan\"\n        : \"Plan in progress\";\n\n  const subtitle =\n    changeDescription ?? (current ? current.content : undefined);\n\n  return (\n    <div className=\"my-3 w-full rounded-xl border border-border/60 bg-background shadow-sm\">\n      <div className=\"sticky top-0 z-20 overflow-hidden rounded-t-xl bg-background\">\n        <button\n          type=\"button\"\n          onClick={() => setCollapsed((prev) => !prev)}\n          className=\"flex w-full items-center gap-3 px-4 py-3 text-left transition-colors hover:bg-muted/30\"\n          aria-expanded={!collapsed}\n        >\n          <PlanBadge resolved={resolved} total={total} />\n          <span className=\"min-w-0 flex-1\">\n            <span className=\"flex items-baseline gap-2\">\n              <span className=\"text-[13px] font-medium text-foreground\">\n                {heading}\n              </span>\n              <span className=\"text-[11px] tabular-nums text-muted-foreground\">\n                {resolved}/{total} steps\n              </span>\n            </span>\n            {subtitle && (\n              <span className=\"block truncate text-[12px] text-muted-foreground\">\n                {subtitle}\n              </span>\n            )}\n          </span>\n          <ChevronDownIcon\n            className={cn(\n              \"size-4 shrink-0 text-muted-foreground transition-transform duration-200\",\n              collapsed && \"-rotate-90\",\n            )}\n          />\n        </button>\n\n        <div className=\"h-0.5 w-full bg-muted\">\n          <div\n            className={cn(\n              \"h-full transition-all duration-500\",\n              isDone ? \"bg-emerald-500\" : \"bg-primary\",\n            )}\n            style={{ width: `${total > 0 ? (resolved / total) * 100 : 0}%` }}\n          />\n        </div>\n      </div>\n\n      {!collapsed && (\n        <ol className=\"flex max-h-72 flex-col overflow-y-auto rounded-b-xl border-t border-border/40 py-1\">\n          {steps.map((step, index) => (\n            <li\n              key={step.id ?? `${index}-${step.content}`}\n              className={cn(\n                \"relative flex items-start gap-2.5 px-4 py-1.5\",\n                step.status === \"in_progress\" && \"bg-primary/5\",\n              )}\n            >\n              {index < steps.length - 1 && (\n                <span\n                  aria-hidden\n                  className=\"absolute left-[calc(1rem+8px)] top-[26px] h-[calc(100%-18px)] w-px bg-border/60\"\n                />\n              )}\n              <span className=\"relative z-10 mt-[3px]\">\n                <PlanStepMarker status={step.status} index={index} />\n              </span>\n              <span\n                className={cn(\n                  \"text-[12.5px] leading-relaxed text-foreground\",\n                  step.status === \"completed\" &&\n                    \"text-muted-foreground line-through decoration-muted-foreground/40\",\n                  step.status === \"cancelled\" &&\n                    \"text-muted-foreground/70 line-through decoration-muted-foreground/40\",\n                  step.status === \"failed\" && \"text-destructive\",\n                  step.status === \"in_progress\" && \"font-medium text-primary\",\n                  step.status === \"pending\" && \"text-muted-foreground\",\n                )}\n              >\n                {step.content}\n              </span>\n            </li>\n          ))}\n        </ol>\n      )}\n    </div>\n  );\n};\n\nexport const WriteTodosToolUI = memo(\n  WriteTodosToolUIImpl,\n) as unknown as ToolCallMessagePartComponent;\nWriteTodosToolUI.displayName = \"WriteTodosToolUI\";\n"],"names":["jsx","CheckIcon","LoaderIcon","XIcon","cn","ListChecksIcon","usePlanScope","useState","allocatePlanSeq","useEffect","registerPlanCard","unregisterPlanCard","updatePlanCard","useIsLatestPlanCard","useMemo","memo","jsxs","ChevronDownIcon"],"mappings":"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"}

package/dist/ui/image-viewer.cjs

@@ -0,0 +1,382 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const lucideReact = require("lucide-react");
+const require$$0 = require("react");
+const reactDom = require("react-dom");
+const lib_ownerDocument = require("../lib/owner-document.cjs");
+const cnfast = require("cnfast");
+const IMAGE_VIEWER_ZOOM_STEPS = [
+  0.1,
+  0.25,
+  0.33,
+  0.5,
+  0.67,
+  0.75,
+  0.9,
+  1,
+  1.25,
+  1.5,
+  2,
+  3,
+  4
+];
+const FIT_MARGIN_X_PX = 48;
+const FIT_MARGIN_Y_PX = 120;
+function fitScaleOf({ natural, window }) {
+  if (!natural || !window || natural.width <= 0 || natural.height <= 0) return 1;
+  const byWidth = (window.width - FIT_MARGIN_X_PX) / natural.width;
+  const byHeight = (window.height - FIT_MARGIN_Y_PX) / natural.height;
+  return Math.max(0.01, Math.min(1, byWidth, byHeight));
+}
+function nextImageViewerZoom({ scale, direction }) {
+  const epsilon = 5e-3;
+  if (direction === 1) return IMAGE_VIEWER_ZOOM_STEPS.find((step) => step > scale + epsilon) ?? scale;
+  return [...IMAGE_VIEWER_ZOOM_STEPS].reverse().find((step) => step < scale - epsilon) ?? scale;
+}
+function displayName({ image, index, count }) {
+  var _a;
+  const name = (_a = image.name) == null ? void 0 : _a.trim();
+  if (name) return name;
+  return count > 1 ? `Image ${index + 1}` : "Image";
+}
+function downloadName({ image, index }) {
+  var _a;
+  return ((_a = image.name) == null ? void 0 : _a.trim()) || `image-${index + 1}`;
+}
+function imageViewerNeedsFetchedDownload({ src, pageOrigin }) {
+  let url;
+  try {
+    url = new URL(src, pageOrigin);
+  } catch {
+    return false;
+  }
+  return (url.protocol === "http:" || url.protocol === "https:") && url.origin !== pageOrigin;
+}
+function saveBlob({ blob, name, doc }) {
+  const url = URL.createObjectURL(blob);
+  const link = doc.createElement("a");
+  link.href = url;
+  link.download = name;
+  doc.body.appendChild(link);
+  link.click();
+  link.remove();
+  setTimeout(() => URL.revokeObjectURL(url), 0);
+}
+const FOCUSABLE_SELECTOR = 'button:not([disabled]), a[href], [tabindex]:not([tabindex="-1"])';
+const TOOLBAR_BUTTON_CLASS = "inline-flex size-8 shrink-0 items-center justify-center rounded-lg text-white/85 transition-colors hover:bg-white/10 hover:text-white focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/70 disabled:pointer-events-none disabled:opacity-35";
+const BACKDROP_STYLE = {
+  position: "fixed",
+  inset: 0,
+  zIndex: 1e3,
+  backgroundColor: "rgba(0, 0, 0, 0.82)",
+  cursor: "default"
+};
+const VIEWER_STYLE = {
+  position: "fixed",
+  left: "50%",
+  top: "50%",
+  transform: "translate(-50%, -50%)",
+  zIndex: 1e3,
+  display: "flex",
+  flexDirection: "column",
+  alignItems: "center",
+  gap: 12,
+  maxWidth: "100vw",
+  maxHeight: "100vh",
+  padding: 24
+};
+const stopPropagation = (event) => event.stopPropagation();
+function ImageViewer({ images, index, onIndexChange }) {
+  const ownerDocument = lib_ownerDocument.useOwnerDocument();
+  const open = index !== null && index >= 0 && index < images.length;
+  const current = open ? images[index] : void 0;
+  const count = images.length;
+  const [zoom, setZoom] = require$$0.useState("fit");
+  const [natural, setNatural] = require$$0.useState(null);
+  const [windowSize, setWindowSize] = require$$0.useState(null);
+  const shownSrc = require$$0.useRef(null);
+  const imageRef = require$$0.useRef(null);
+  const viewerRef = require$$0.useRef(null);
+  const handleKeyRef = require$$0.useRef(() => void 0);
+  const src = (current == null ? void 0 : current.src) ?? null;
+  require$$0.useEffect(() => {
+    if (shownSrc.current === src) return;
+    shownSrc.current = src;
+    setZoom("fit");
+    setNatural(null);
+  }, [src]);
+  require$$0.useEffect(() => {
+    const image = imageRef.current;
+    if (!src || !image) return void 0;
+    const read = () => {
+      if (image.naturalWidth > 0) setNatural({ width: image.naturalWidth, height: image.naturalHeight });
+    };
+    if (image.complete) read();
+    image.addEventListener("load", read);
+    return () => image.removeEventListener("load", read);
+  }, [src]);
+  require$$0.useLayoutEffect(() => {
+    const view = ownerDocument == null ? void 0 : ownerDocument.defaultView;
+    if (!src || !view) return void 0;
+    const measure = () => setWindowSize({ width: view.innerWidth, height: view.innerHeight });
+    measure();
+    view.addEventListener("resize", measure);
+    return () => view.removeEventListener("resize", measure);
+  }, [ownerDocument, src]);
+  require$$0.useEffect(() => {
+    var _a, _b;
+    if (!open || !ownerDocument) return void 0;
+    const previouslyFocused = ownerDocument.activeElement;
+    const body = ownerDocument.body;
+    const previousOverflow = body.style.overflow;
+    body.style.overflow = "hidden";
+    (_b = (_a = viewerRef.current) == null ? void 0 : _a.querySelector('[data-slot="image-viewer-close"]')) == null ? void 0 : _b.focus();
+    const onKeyDown = (event) => handleKeyRef.current(event);
+    ownerDocument.addEventListener("keydown", onKeyDown, true);
+    return () => {
+      ownerDocument.removeEventListener("keydown", onKeyDown, true);
+      body.style.overflow = previousOverflow;
+      if (previouslyFocused instanceof HTMLElement && previouslyFocused.isConnected) previouslyFocused.focus();
+    };
+  }, [open, ownerDocument]);
+  const fitScale = fitScaleOf({ natural, window: windowSize });
+  const scale = zoom === "fit" ? fitScale : zoom;
+  const close = () => onIndexChange(null);
+  const show = (next) => {
+    if (next >= 0 && next < count) onIndexChange(next);
+  };
+  const zoomBy = (direction) => setZoom(nextImageViewerZoom({ scale, direction }));
+  require$$0.useLayoutEffect(() => {
+    handleKeyRef.current = (event) => {
+      var _a, _b;
+      if (index === null) return;
+      const handled = () => {
+        event.preventDefault();
+        event.stopPropagation();
+      };
+      if (event.key === "Escape") {
+        handled();
+        close();
+        return;
+      }
+      if (event.key === "Tab") {
+        const focusable = Array.from(((_a = viewerRef.current) == null ? void 0 : _a.querySelectorAll(FOCUSABLE_SELECTOR)) ?? []);
+        const first = focusable[0];
+        const last = focusable.at(-1);
+        if (!first || !last) return;
+        const active = ownerDocument == null ? void 0 : ownerDocument.activeElement;
+        const inside = active instanceof Node && ((_b = viewerRef.current) == null ? void 0 : _b.contains(active)) === true;
+        if (!inside || event.shiftKey && active === first || !event.shiftKey && active === last) {
+          handled();
+          (event.shiftKey ? last : first).focus();
+        }
+        return;
+      }
+      if (event.metaKey || event.ctrlKey || event.altKey) return;
+      if (event.key === "ArrowLeft") show(index - 1);
+      else if (event.key === "ArrowRight") show(index + 1);
+      else if (event.key === "+" || event.key === "=") zoomBy(1);
+      else if (event.key === "-" || event.key === "_") zoomBy(-1);
+      else if (event.key === "0") setZoom("fit");
+      else return;
+      handled();
+    };
+  });
+  if (!open || current === void 0 || !ownerDocument) return null;
+  const percent = `${Math.round(scale * 100)}%`;
+  const name = displayName({ image: current, index, count });
+  const fileName = downloadName({ image: current, index });
+  const hasPrevious = index > 0;
+  const hasNext = index < count - 1;
+  const handleDownload = (event) => {
+    var _a;
+    const pageOrigin = ((_a = ownerDocument.defaultView) == null ? void 0 : _a.location.origin) ?? "";
+    if (!imageViewerNeedsFetchedDownload({ src: current.src, pageOrigin })) return;
+    event.preventDefault();
+    const view = ownerDocument.defaultView;
+    void fetch(current.src).then((response) => {
+      if (!response.ok) throw new Error(`HTTP ${response.status}`);
+      return response.blob();
+    }).then((blob) => saveBlob({ blob, name: fileName, doc: ownerDocument })).catch(() => {
+      view == null ? void 0 : view.open(current.src, "_blank", "noopener,noreferrer");
+    });
+  };
+  const imageStyle = zoom !== "fit" && natural ? { width: natural.width * zoom, height: natural.height * zoom, maxWidth: "none", maxHeight: "none" } : void 0;
+  return reactDom.createPortal(
+    // The SDK's scope classes bring its scoped reset to the portaled tree;
+    // `display: contents` leaves the layout to the fixed layers below.
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "athena-sdk athena-sdk-chrome", "data-slot": "image-viewer", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          tabIndex: -1,
+          "aria-label": "Close the image viewer",
+          onClick: close,
+          className: "animate-in fade-in-0 duration-150 motion-reduce:animate-none",
+          style: BACKDROP_STYLE,
+          "data-slot": "image-viewer-backdrop"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          ref: viewerRef,
+          role: "dialog",
+          "aria-modal": "true",
+          "aria-label": name,
+          style: VIEWER_STYLE,
+          onClick: stopPropagation,
+          onPointerDown: stopPropagation,
+          onKeyDown: stopPropagation,
+          onFocus: stopPropagation,
+          onBlur: stopPropagation,
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                "data-slot": "image-viewer-stage",
+                className: "max-h-[calc(100vh-7.5rem)] max-w-[calc(100vw-3rem)] overflow-auto rounded-sm shadow-2xl",
+                children: /* @__PURE__ */ jsxRuntime.jsx(
+                  "img",
+                  {
+                    ref: imageRef,
+                    src: current.src,
+                    alt: name,
+                    draggable: false,
+                    "data-slot": "image-viewer-image",
+                    style: imageStyle,
+                    className: cnfast.cn(
+                      "block select-none",
+                      zoom === "fit" && "max-h-[calc(100vh-7.5rem)] max-w-[calc(100vw-3rem)] object-contain"
+                    )
+                  },
+                  current.src
+                )
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex max-w-full shrink-0 justify-center", children: /* @__PURE__ */ jsxRuntime.jsxs(
+              "div",
+              {
+                role: "toolbar",
+                "aria-label": "Image viewer",
+                className: "flex max-w-full items-center gap-0.5 rounded-xl bg-neutral-900/95 p-1 text-sm text-white shadow-lg ring-1 ring-white/10",
+                children: [
+                  count > 1 ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "button",
+                      {
+                        type: "button",
+                        className: TOOLBAR_BUTTON_CLASS,
+                        onClick: () => show(index - 1),
+                        disabled: !hasPrevious,
+                        "aria-label": "Previous image",
+                        title: "Previous (←)",
+                        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeftIcon, { className: "size-4" })
+                      }
+                    ),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "button",
+                      {
+                        type: "button",
+                        className: TOOLBAR_BUTTON_CLASS,
+                        onClick: () => show(index + 1),
+                        disabled: !hasNext,
+                        "aria-label": "Next image",
+                        title: "Next (→)",
+                        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRightIcon, { className: "size-4" })
+                      }
+                    )
+                  ] }) : null,
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "span",
+                    {
+                      className: "min-w-0 max-w-[40vw] truncate px-2 font-medium text-white/90",
+                      title: name,
+                      "data-slot": "image-viewer-name",
+                      children: name
+                    }
+                  ),
+                  count > 1 ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "shrink-0 pr-2 text-white/50 tabular-nums", "data-slot": "image-viewer-position", children: [
+                    index + 1,
+                    " / ",
+                    count
+                  ] }) : null,
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: "mx-1 h-5 w-px shrink-0 bg-white/15" }),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "button",
+                    {
+                      type: "button",
+                      className: TOOLBAR_BUTTON_CLASS,
+                      onClick: () => zoomBy(-1),
+                      disabled: scale <= (IMAGE_VIEWER_ZOOM_STEPS[0] ?? 0) + 5e-3,
+                      "aria-label": "Zoom out",
+                      title: "Zoom out (−)",
+                      children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MinusIcon, { className: "size-4" })
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "button",
+                    {
+                      type: "button",
+                      className: cnfast.cn(TOOLBAR_BUTTON_CLASS, "w-auto min-w-12 px-1.5 text-xs tabular-nums"),
+                      onClick: () => setZoom("fit"),
+                      "aria-label": `Zoom ${percent}, fit to window`,
+                      title: "Fit to window (0)",
+                      "data-slot": "image-viewer-zoom",
+                      children: percent
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "button",
+                    {
+                      type: "button",
+                      className: TOOLBAR_BUTTON_CLASS,
+                      onClick: () => zoomBy(1),
+                      disabled: scale >= (IMAGE_VIEWER_ZOOM_STEPS.at(-1) ?? 4) - 5e-3,
+                      "aria-label": "Zoom in",
+                      title: "Zoom in (+)",
+                      children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.PlusIcon, { className: "size-4" })
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: "mx-1 h-5 w-px shrink-0 bg-white/15" }),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "a",
+                    {
+                      href: current.src,
+                      download: fileName,
+                      onClick: handleDownload,
+                      className: TOOLBAR_BUTTON_CLASS,
+                      "aria-label": "Download",
+                      title: "Download",
+                      children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.DownloadIcon, { className: "size-4" })
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "button",
+                    {
+                      type: "button",
+                      className: TOOLBAR_BUTTON_CLASS,
+                      onClick: close,
+                      "aria-label": "Close",
+                      title: "Close (Esc)",
+                      "data-slot": "image-viewer-close",
+                      children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.XIcon, { className: "size-4" })
+                    }
+                  )
+                ]
+              }
+            ) })
+          ]
+        }
+      )
+    ] }),
+    ownerDocument.body
+  );
+}
+exports.IMAGE_VIEWER_ZOOM_STEPS = IMAGE_VIEWER_ZOOM_STEPS;
+exports.ImageViewer = ImageViewer;
+exports.imageViewerNeedsFetchedDownload = imageViewerNeedsFetchedDownload;
+exports.nextImageViewerZoom = nextImageViewerZoom;
+//# sourceMappingURL=image-viewer.cjs.map

package/dist/ui/image-viewer.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"image-viewer.cjs","sources":["../../src/ui/image-viewer.tsx"],"sourcesContent":["\"use client\"\n\nimport {\n  ChevronLeftIcon,\n  ChevronRightIcon,\n  DownloadIcon,\n  MinusIcon,\n  PlusIcon,\n  XIcon,\n} from \"lucide-react\"\nimport type { CSSProperties, MouseEvent, ReactNode, SyntheticEvent } from \"react\"\nimport { useEffect, useLayoutEffect, useRef, useState } from \"react\"\nimport { createPortal } from \"react-dom\"\nimport { useOwnerDocument } from \"../lib/owner-document\"\nimport { cn } from \"../lib/utils\"\n\n/** One picture the viewer can show. */\nexport interface ImageViewerImage {\n  /** What the image loads: an http(s), `blob:` or `data:` URL. */\n  src: string\n  /** Its file name: the toolbar's label and the download's name. */\n  name?: string\n}\n\nexport interface ImageViewerProps {\n  /** The pictures the viewer pages through, in order. */\n  images: readonly ImageViewerImage[]\n  /** The picture on screen, or `null` while the viewer is closed. */\n  index: number | null\n  /** Called with the picture to show next, or `null` to close the viewer. */\n  onIndexChange: (index: number | null) => void\n}\n\n/** The scale factors the zoom buttons step between. */\nexport const IMAGE_VIEWER_ZOOM_STEPS: readonly number[] = [\n  0.1, 0.25, 0.33, 0.5, 0.67, 0.75, 0.9, 1, 1.25, 1.5, 2, 3, 4,\n]\n\n/** The room a fitted picture leaves in the window: the viewer's padding, and the toolbar below it. */\nconst FIT_MARGIN_X_PX = 48\nconst FIT_MARGIN_Y_PX = 120\n\ntype Zoom = \"fit\" | number\n\ninterface NaturalSize {\n  width: number\n  height: number\n}\n\n/** The scale that fits `natural` in the `window`, never above 100%. */\nfunction fitScaleOf({ natural, window }: { natural: NaturalSize | null; window: NaturalSize | null }): number {\n  if (!natural || !window || natural.width <= 0 || natural.height <= 0) return 1\n  const byWidth = (window.width - FIT_MARGIN_X_PX) / natural.width\n  const byHeight = (window.height - FIT_MARGIN_Y_PX) / natural.height\n  return Math.max(0.01, Math.min(1, byWidth, byHeight))\n}\n\n/** The next zoom step past `scale`, in `direction`; `scale` itself at either end. */\nexport function nextImageViewerZoom({ scale, direction }: { scale: number; direction: 1 | -1 }): number {\n  const epsilon = 0.005\n  if (direction === 1) return IMAGE_VIEWER_ZOOM_STEPS.find((step) => step > scale + epsilon) ?? scale\n  return [...IMAGE_VIEWER_ZOOM_STEPS].reverse().find((step) => step < scale - epsilon) ?? scale\n}\n\n/** A picture's name for people: its file name, else its place in the set. */\nfunction displayName({ image, index, count }: { image: ImageViewerImage; index: number; count: number }): string {\n  const name = image.name?.trim()\n  if (name) return name\n  return count > 1 ? `Image ${index + 1}` : \"Image\"\n}\n\n/** What a download saves the picture as. */\nfunction downloadName({ image, index }: { image: ImageViewerImage; index: number }): string {\n  return image.name?.trim() || `image-${index + 1}`\n}\n\n/**\n * Whether the browser would ignore a link's `download` for `src`: an http(s)\n * address on another origin, which it opens instead of saving unless the\n * server sends it as an attachment. `data:`, `blob:` and same-origin pictures\n * download as they are.\n */\nexport function imageViewerNeedsFetchedDownload({ src, pageOrigin }: { src: string; pageOrigin: string }): boolean {\n  let url: URL\n  try {\n    url = new URL(src, pageOrigin)\n  } catch {\n    return false\n  }\n  return (url.protocol === \"http:\" || url.protocol === \"https:\") && url.origin !== pageOrigin\n}\n\n/** Saves `blob` as `name` through a link in `doc`, then frees it. */\nfunction saveBlob({ blob, name, doc }: { blob: Blob; name: string; doc: Document }): void {\n  const url = URL.createObjectURL(blob)\n  const link = doc.createElement(\"a\")\n  link.href = url\n  link.download = name\n  doc.body.appendChild(link)\n  link.click()\n  link.remove()\n  // The click has started the download by the time the next task runs.\n  setTimeout(() => URL.revokeObjectURL(url), 0)\n}\n\nconst FOCUSABLE_SELECTOR = 'button:not([disabled]), a[href], [tabindex]:not([tabindex=\"-1\"])'\n\nconst TOOLBAR_BUTTON_CLASS =\n  \"inline-flex size-8 shrink-0 items-center justify-center rounded-lg text-white/85 transition-colors hover:bg-white/10 hover:text-white focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/70 disabled:pointer-events-none disabled:opacity-35\"\n\n// The backdrop and the viewer carry their box inline: no host stylesheet can\n// take a full-screen viewer's position away (see lib/portal-surface.ts).\nconst BACKDROP_STYLE: CSSProperties = {\n  position: \"fixed\",\n  inset: 0,\n  zIndex: 1000,\n  backgroundColor: \"rgba(0, 0, 0, 0.82)\",\n  cursor: \"default\",\n}\nconst VIEWER_STYLE: CSSProperties = {\n  position: \"fixed\",\n  left: \"50%\",\n  top: \"50%\",\n  transform: \"translate(-50%, -50%)\",\n  zIndex: 1000,\n  display: \"flex\",\n  flexDirection: \"column\",\n  alignItems: \"center\",\n  gap: 12,\n  maxWidth: \"100vw\",\n  maxHeight: \"100vh\",\n  padding: 24,\n}\n\nconst stopPropagation = (event: SyntheticEvent) => event.stopPropagation()\n\n/**\n * A full-screen look at a picture, as Devin opens an attached image: the page\n * dims, the picture fits the window, and a toolbar below it pages through the\n * set, names the file, zooms, downloads and closes.\n *\n * Keys: ← and → page through the set, + and − zoom, 0 fits the window again,\n * Esc closes; Tab stays inside the viewer. A click on the dimmed backdrop\n * (outside the picture and its toolbar) closes too.\n *\n * A modal dialog of its own, not Radix's: it is the SDK's only dialog, and the\n * Office add-in's bundle budget has no room for Radix's focus scope and scroll\n * lock. It portals into the document its host renders in (popouts included),\n * focuses its close button, locks the page's scroll and gives focus back when\n * it closes, and keeps its events to itself so a click or a focus in it never\n * reaches the composer or the message it was opened from.\n */\nexport function ImageViewer({ images, index, onIndexChange }: ImageViewerProps): ReactNode {\n  const ownerDocument = useOwnerDocument()\n  const open = index !== null && index >= 0 && index < images.length\n  const current = open ? images[index] : undefined\n  const count = images.length\n\n  const [zoom, setZoom] = useState<Zoom>(\"fit\")\n  const [natural, setNatural] = useState<NaturalSize | null>(null)\n  const [windowSize, setWindowSize] = useState<NaturalSize | null>(null)\n  const shownSrc = useRef<string | null>(null)\n  const imageRef = useRef<HTMLImageElement | null>(null)\n  const viewerRef = useRef<HTMLDivElement | null>(null)\n  const handleKeyRef = useRef<(event: KeyboardEvent) => void>(() => undefined)\n\n  // Each picture opens fitted, measured afresh once it loads.\n  const src = current?.src ?? null\n  useEffect(() => {\n    if (shownSrc.current === src) return\n    shownSrc.current = src\n    setZoom(\"fit\")\n    setNatural(null)\n  }, [src])\n\n  // The picture's own size, once it has loaded, for the scale the toolbar shows.\n  useEffect(() => {\n    const image = imageRef.current\n    if (!src || !image) return undefined\n    const read = () => {\n      if (image.naturalWidth > 0) setNatural({ width: image.naturalWidth, height: image.naturalHeight })\n    }\n    if (image.complete) read()\n    image.addEventListener(\"load\", read)\n    return () => image.removeEventListener(\"load\", read)\n  }, [src])\n\n  // The window the viewer fills, for the fitted scale it reports.\n  useLayoutEffect(() => {\n    const view = ownerDocument?.defaultView\n    if (!src || !view) return undefined\n    const measure = () => setWindowSize({ width: view.innerWidth, height: view.innerHeight })\n    measure()\n    view.addEventListener(\"resize\", measure)\n    return () => view.removeEventListener(\"resize\", measure)\n  }, [ownerDocument, src])\n\n  // Opening takes the keyboard and the page's scroll; closing gives both back,\n  // with focus on whatever had it before (the thumbnail that opened it).\n  useEffect(() => {\n    if (!open || !ownerDocument) return undefined\n    const previouslyFocused = ownerDocument.activeElement\n    const body = ownerDocument.body\n    const previousOverflow = body.style.overflow\n    body.style.overflow = \"hidden\"\n    viewerRef.current?.querySelector<HTMLElement>('[data-slot=\"image-viewer-close\"]')?.focus()\n    const onKeyDown = (event: KeyboardEvent) => handleKeyRef.current(event)\n    ownerDocument.addEventListener(\"keydown\", onKeyDown, true)\n    return () => {\n      ownerDocument.removeEventListener(\"keydown\", onKeyDown, true)\n      body.style.overflow = previousOverflow\n      if (previouslyFocused instanceof HTMLElement && previouslyFocused.isConnected) previouslyFocused.focus()\n    }\n  }, [open, ownerDocument])\n\n  const fitScale = fitScaleOf({ natural, window: windowSize })\n  const scale = zoom === \"fit\" ? fitScale : zoom\n  const close = () => onIndexChange(null)\n  const show = (next: number) => {\n    if (next >= 0 && next < count) onIndexChange(next)\n  }\n  const zoomBy = (direction: 1 | -1) => setZoom(nextImageViewerZoom({ scale, direction }))\n\n  // Read at key time from the latest render (the listener above is bound once per opening).\n  useLayoutEffect(() => {\n    handleKeyRef.current = (event) => {\n      if (index === null) return\n      const handled = () => {\n        event.preventDefault()\n        event.stopPropagation()\n      }\n      if (event.key === \"Escape\") {\n        handled()\n        close()\n        return\n      }\n      if (event.key === \"Tab\") {\n        const focusable = Array.from(viewerRef.current?.querySelectorAll<HTMLElement>(FOCUSABLE_SELECTOR) ?? [])\n        const first = focusable[0]\n        const last = focusable.at(-1)\n        if (!first || !last) return\n        const active = ownerDocument?.activeElement\n        const inside = active instanceof Node && viewerRef.current?.contains(active) === true\n        if (!inside || (event.shiftKey && active === first) || (!event.shiftKey && active === last)) {\n          handled()\n          ;(event.shiftKey ? last : first).focus()\n        }\n        return\n      }\n      if (event.metaKey || event.ctrlKey || event.altKey) return\n      if (event.key === \"ArrowLeft\") show(index - 1)\n      else if (event.key === \"ArrowRight\") show(index + 1)\n      else if (event.key === \"+\" || event.key === \"=\") zoomBy(1)\n      else if (event.key === \"-\" || event.key === \"_\") zoomBy(-1)\n      else if (event.key === \"0\") setZoom(\"fit\")\n      else return\n      handled()\n    }\n  })\n\n  if (!open || current === undefined || !ownerDocument) return null\n\n  const percent = `${Math.round(scale * 100)}%`\n  const name = displayName({ image: current, index, count })\n  const fileName = downloadName({ image: current, index })\n  const hasPrevious = index > 0\n  const hasNext = index < count - 1\n\n  // A picture from another origin downloads through a fetched copy: the\n  // browser would open it in a tab instead of saving it.\n  const handleDownload = (event: MouseEvent<HTMLAnchorElement>) => {\n    const pageOrigin = ownerDocument.defaultView?.location.origin ?? \"\"\n    if (!imageViewerNeedsFetchedDownload({ src: current.src, pageOrigin })) return\n    event.preventDefault()\n    const view = ownerDocument.defaultView\n    void fetch(current.src)\n      .then((response) => {\n        if (!response.ok) throw new Error(`HTTP ${response.status}`)\n        return response.blob()\n      })\n      .then((blob) => saveBlob({ blob, name: fileName, doc: ownerDocument }))\n      .catch(() => {\n        // Unreadable here (no CORS): the browser's own view of it is the fallback.\n        view?.open(current.src, \"_blank\", \"noopener,noreferrer\")\n      })\n  }\n\n  const imageStyle: CSSProperties | undefined =\n    zoom !== \"fit\" && natural\n      ? { width: natural.width * zoom, height: natural.height * zoom, maxWidth: \"none\", maxHeight: \"none\" }\n      : undefined\n\n  return createPortal(\n    // The SDK's scope classes bring its scoped reset to the portaled tree;\n    // `display: contents` leaves the layout to the fixed layers below.\n    <div className=\"athena-sdk athena-sdk-chrome\" data-slot=\"image-viewer\">\n      <button\n        type=\"button\"\n        tabIndex={-1}\n        aria-label=\"Close the image viewer\"\n        onClick={close}\n        className=\"animate-in fade-in-0 duration-150 motion-reduce:animate-none\"\n        style={BACKDROP_STYLE}\n        data-slot=\"image-viewer-backdrop\"\n      />\n      {/* The event boundary: a click, a focus or a key in the viewer bubbles\n          through React to the component that opened it (a portal keeps its\n          React parent), so it stops here. */}\n      {/* biome-ignore lint/a11y/noNoninteractiveElementInteractions: an event boundary for the portaled dialog, not a control */}\n      <div\n        ref={viewerRef}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        aria-label={name}\n        style={VIEWER_STYLE}\n        onClick={stopPropagation}\n        onPointerDown={stopPropagation}\n        onKeyDown={stopPropagation}\n        onFocus={stopPropagation}\n        onBlur={stopPropagation}\n      >\n        {/* Fitted, the picture fills the window but the toolbar's room;\n            zoomed past it, the picture scrolls inside that same box. */}\n        <div\n          data-slot=\"image-viewer-stage\"\n          className=\"max-h-[calc(100vh-7.5rem)] max-w-[calc(100vw-3rem)] overflow-auto rounded-sm shadow-2xl\"\n        >\n          <img\n            key={current.src}\n            ref={imageRef}\n            src={current.src}\n            alt={name}\n            draggable={false}\n            data-slot=\"image-viewer-image\"\n            style={imageStyle}\n            className={cn(\n              \"block select-none\",\n              zoom === \"fit\" && \"max-h-[calc(100vh-7.5rem)] max-w-[calc(100vw-3rem)] object-contain\",\n            )}\n          />\n        </div>\n        <div className=\"flex max-w-full shrink-0 justify-center\">\n          <div\n            role=\"toolbar\"\n            aria-label=\"Image viewer\"\n            className=\"flex max-w-full items-center gap-0.5 rounded-xl bg-neutral-900/95 p-1 text-sm text-white shadow-lg ring-1 ring-white/10\"\n          >\n            {count > 1 ? (\n              <>\n                <button\n                  type=\"button\"\n                  className={TOOLBAR_BUTTON_CLASS}\n                  onClick={() => show(index - 1)}\n                  disabled={!hasPrevious}\n                  aria-label=\"Previous image\"\n                  title=\"Previous (←)\"\n                >\n                  <ChevronLeftIcon className=\"size-4\" />\n                </button>\n                <button\n                  type=\"button\"\n                  className={TOOLBAR_BUTTON_CLASS}\n                  onClick={() => show(index + 1)}\n                  disabled={!hasNext}\n                  aria-label=\"Next image\"\n                  title=\"Next (→)\"\n                >\n                  <ChevronRightIcon className=\"size-4\" />\n                </button>\n              </>\n            ) : null}\n            <span\n              className=\"min-w-0 max-w-[40vw] truncate px-2 font-medium text-white/90\"\n              title={name}\n              data-slot=\"image-viewer-name\"\n            >\n              {name}\n            </span>\n            {count > 1 ? (\n              <span className=\"shrink-0 pr-2 text-white/50 tabular-nums\" data-slot=\"image-viewer-position\">\n                {index + 1} / {count}\n              </span>\n            ) : null}\n            <span aria-hidden=\"true\" className=\"mx-1 h-5 w-px shrink-0 bg-white/15\" />\n            <button\n              type=\"button\"\n              className={TOOLBAR_BUTTON_CLASS}\n              onClick={() => zoomBy(-1)}\n              disabled={scale <= (IMAGE_VIEWER_ZOOM_STEPS[0] ?? 0) + 0.005}\n              aria-label=\"Zoom out\"\n              title=\"Zoom out (−)\"\n            >\n              <MinusIcon className=\"size-4\" />\n            </button>\n            <button\n              type=\"button\"\n              className={cn(TOOLBAR_BUTTON_CLASS, \"w-auto min-w-12 px-1.5 text-xs tabular-nums\")}\n              onClick={() => setZoom(\"fit\")}\n              aria-label={`Zoom ${percent}, fit to window`}\n              title=\"Fit to window (0)\"\n              data-slot=\"image-viewer-zoom\"\n            >\n              {percent}\n            </button>\n            <button\n              type=\"button\"\n              className={TOOLBAR_BUTTON_CLASS}\n              onClick={() => zoomBy(1)}\n              disabled={scale >= (IMAGE_VIEWER_ZOOM_STEPS.at(-1) ?? 4) - 0.005}\n              aria-label=\"Zoom in\"\n              title=\"Zoom in (+)\"\n            >\n              <PlusIcon className=\"size-4\" />\n            </button>\n            <span aria-hidden=\"true\" className=\"mx-1 h-5 w-px shrink-0 bg-white/15\" />\n            <a\n              href={current.src}\n              download={fileName}\n              onClick={handleDownload}\n              className={TOOLBAR_BUTTON_CLASS}\n              aria-label=\"Download\"\n              title=\"Download\"\n            >\n              <DownloadIcon className=\"size-4\" />\n            </a>\n            <button\n              type=\"button\"\n              className={TOOLBAR_BUTTON_CLASS}\n              onClick={close}\n              aria-label=\"Close\"\n              title=\"Close (Esc)\"\n              data-slot=\"image-viewer-close\"\n            >\n              <XIcon className=\"size-4\" />\n            </button>\n          </div>\n        </div>\n      </div>\n    </div>,\n    ownerDocument.body,\n  )\n}\n"],"names":["useOwnerDocument","useState","useRef","useEffect","useLayoutEffect","createPortal","jsxs","jsx","cn","Fragment","ChevronLeftIcon","ChevronRightIcon","MinusIcon","PlusIcon","DownloadIcon","XIcon"],"mappings":"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"}