@opengeni/react 0.48.0 → 0.52.1

package/dist/timeline/types.d.ts

@@ -1,8 +1,13 @@
-import type { ResourceRef, SessionStatus, ToolAuthNeededPayload, ToolRef } from "@opengeni/sdk";
+import type { MediaGenerationResult, ResourceRef, SessionStatus, TimelineAnnotation, TimelineAnnotationSource, ToolAuthNeededPayload, ToolRef } from "@opengeni/sdk";
+export type TimelineAnnotationSourceDescriptor = Omit<TimelineAnnotationSource, "startOffset" | "endOffset" | "contextBefore" | "contextAfter"> & {
+    text: string;
+};
 export type UserMessageItem = {
     kind: "user-message";
     id: string;
     text: string;
+    annotations?: TimelineAnnotation[] | undefined;
+    annotationSource?: TimelineAnnotationSourceDescriptor | undefined;
     presentation?: {
         kind: "realtime_voice" | "realtime_voice_handoff";
         /** Full bounded execution context sent with this visible voice request. */
@@ -13,6 +18,13 @@ export type UserMessageItem = {
     /** Tools requested for the turn this message starts. */
     tools: ToolRef[];
     occurredAt: string;
+    /** Local-only delivery projection; absent for authoritative durable events. */
+    delivery?: {
+        state: "sending" | "queued" | "failed";
+        error?: string | undefined;
+        onRetry?: (() => void) | undefined;
+        onRemove?: (() => void) | undefined;
+    } | undefined;
 };
 export type AgentMessageItem = {
     kind: "agent-message";
@@ -22,6 +34,8 @@ export type AgentMessageItem = {
     /** Still receiving deltas (no completed/turn-end seen yet). */
     streaming: boolean;
     occurredAt: string;
+    /** Available only after the canonical completed event lands. */
+    annotationSource?: TimelineAnnotationSourceDescriptor | undefined;
 };
 export type ReasoningItem = {
     kind: "reasoning";
@@ -31,6 +45,22 @@ export type ReasoningItem = {
     streaming: boolean;
     occurredAt: string;
 };
+/**
+ * Bounded delivery metadata carried by a projected tool-output event. The
+ * canonical event remains unchanged; this fact only explains what the current
+ * timeline surface could render and whether separately retained full evidence
+ * exists.
+ */
+export type ToolCallTruncation = {
+    truncated: true;
+    surface: string;
+    reason: string;
+    omittedBytes: number | null;
+    fullEvidence: {
+        available: boolean;
+        reason: string | null;
+    };
+};
 export type ToolCallItem = {
     kind: "tool-call";
     id: string;
@@ -39,6 +69,7 @@ export type ToolCallItem = {
     name: string;
     arguments: unknown;
     output: unknown;
+    truncation?: ToolCallTruncation | null;
     /**
      * The provider-native tool item (`agent.toolCall.created.payload.raw`). Carries
      * `type` (e.g. `apply_patch_call`, `computer_call`, `hosted_tool_call`) and the
@@ -49,6 +80,8 @@ export type ToolCallItem = {
     raw: unknown;
     status: "running" | "complete" | "failed" | "cancelled";
     occurredAt: string;
+    /** Canonical textual projection of the settled tool output. */
+    annotationSource?: TimelineAnnotationSourceDescriptor | undefined;
 };
 /**
  * An orchestration call against another session — the manager spawning or
@@ -210,10 +243,11 @@ export type ContextCompactionItem = {
 };
 export type MachineInputMember = {
     id: string;
-    kind: "scheduled_occurrence" | "goal_continuation" | "agent_message" | "agent_steer_instruction" | "child_terminal_result";
+    kind: "scheduled_occurrence" | "goal_continuation" | "agent_message" | "agent_steer_instruction" | "child_terminal_result" | "media_generation_result";
     classification: "success" | "failure" | "action_required" | "info";
     sourceId: string;
     summary: string;
+    result?: MediaGenerationResult | undefined;
 };
 /**
  * One or more durable non-human inputs that joined the following agent turn.
@@ -243,7 +277,7 @@ export type AuthNeededItem = {
     /** The runtime surface that requested recovery, when the event is an MCP auth signal. */
     serverId: string | null;
     /** Durable event family that produced this notice. */
-    source?: "tool" | "credential" | undefined;
+    source?: "tool" | "credential" | "capability" | undefined;
     /** The connection's registrable domain, e.g. "linear.app". */
     providerDomain: string;
     /** The lapsed connection to reconnect, when the row survived. */
@@ -257,6 +291,8 @@ export type AuthNeededItem = {
     toolName: string | null;
     /** A pre-minted authorization URL, when the broker already produced one. */
     authorizationUrl: string | null;
+    /** Agent-selected catalog recommendation. The host still owns authorization. */
+    capability?: NonNullable<ToolAuthNeededPayload["capability"]> | null | undefined;
     occurredAt: string;
 };
 export type TurnOutcome = "complete" | "failed" | "cancelled";

package/dist/timeline-annotation-selection-3L7LHGG2.js

@@ -0,0 +1,187 @@
+// src/components/timeline-annotation-selection.tsx
+import { useEffect, useRef, useState } from "react";
+import { createPortal } from "react-dom";
+import { jsx } from "react/jsx-runtime";
+var INTERACTIVE_SELECTOR = 'a,button,input,textarea,select,summary,[role="button"],[contenteditable="true"],[tabindex]:not([tabindex="-1"])';
+var SOURCE_CONTEXT_BYTES = 160;
+var MAX_QUOTE_BYTES = 16 * 1024;
+function utf8Prefix(value, maxBytes) {
+  let output = "";
+  let bytes = 0;
+  for (const character of value) {
+    const next = new TextEncoder().encode(character).byteLength;
+    if (bytes + next > maxBytes) break;
+    output += character;
+    bytes += next;
+  }
+  return output;
+}
+function utf8Suffix(value, maxBytes) {
+  let output = "";
+  let bytes = 0;
+  for (const character of [...value].reverse()) {
+    const next = new TextEncoder().encode(character).byteLength;
+    if (bytes + next > maxBytes) break;
+    output = character + output;
+    bytes += next;
+  }
+  return output;
+}
+function selectionElement(node) {
+  return node instanceof Element ? node : node?.parentElement ?? null;
+}
+function containingSource(node) {
+  const element = selectionElement(node);
+  const source = element?.closest("[data-og-annotation-source-key]");
+  return source instanceof HTMLElement ? source : null;
+}
+function isInteractiveSelection(node, boundary) {
+  const element = selectionElement(node);
+  const interactive = element?.closest(INTERACTIVE_SELECTOR);
+  return interactive instanceof Element && boundary.contains(interactive);
+}
+function occurrenceOffsets(text, quote) {
+  const offsets = [];
+  let cursor = 0;
+  while (cursor <= text.length - quote.length) {
+    const offset = text.indexOf(quote, cursor);
+    if (offset < 0) break;
+    offsets.push(offset);
+    cursor = offset + 1;
+  }
+  return offsets;
+}
+function selectedOccurrence(boundary, range, quote) {
+  try {
+    const prefix = range.cloneRange();
+    prefix.selectNodeContents(boundary);
+    prefix.setEnd(range.startContainer, range.startOffset);
+    return occurrenceOffsets(prefix.toString(), quote).length;
+  } catch {
+    return 0;
+  }
+}
+function annotationId() {
+  if (typeof globalThis.crypto?.randomUUID === "function") {
+    return globalThis.crypto.randomUUID();
+  }
+  return `annotation-${Date.now()}-${Math.random().toString(16).slice(2)}`;
+}
+function buildCandidate(root, sources, keyboard) {
+  const selection = document.getSelection();
+  if (!selection || selection.rangeCount !== 1 || selection.isCollapsed) return null;
+  const range = selection.getRangeAt(0);
+  const startBoundary = containingSource(range.startContainer);
+  const endBoundary = containingSource(range.endContainer);
+  if (!startBoundary || startBoundary !== endBoundary || !root.contains(startBoundary)) return null;
+  if (isInteractiveSelection(range.startContainer, startBoundary) || isInteractiveSelection(range.endContainer, startBoundary)) {
+    return null;
+  }
+  const sourceKey = startBoundary.dataset.ogAnnotationSourceKey;
+  const source = sourceKey ? sources.get(sourceKey) : void 0;
+  const quote = selection.toString();
+  if (!source || quote.trim().length === 0 || new TextEncoder().encode(quote).byteLength > MAX_QUOTE_BYTES) {
+    return null;
+  }
+  const sourceOffsets = occurrenceOffsets(source.text, quote);
+  if (sourceOffsets.length === 0) return null;
+  const occurrence = selectedOccurrence(startBoundary, range, quote);
+  const startOffset = sourceOffsets[Math.min(occurrence, sourceOffsets.length - 1)];
+  const endOffset = startOffset + quote.length;
+  const rect = range.getBoundingClientRect();
+  if (rect.width === 0 && rect.height === 0) return null;
+  return {
+    annotation: {
+      id: annotationId(),
+      quote,
+      note: "",
+      source: {
+        kind: source.kind,
+        eventId: source.eventId,
+        eventType: source.eventType,
+        sequence: source.sequence,
+        turnId: source.turnId,
+        startOffset,
+        endOffset,
+        contextBefore: utf8Suffix(source.text.slice(0, startOffset), SOURCE_CONTEXT_BYTES),
+        contextAfter: utf8Prefix(source.text.slice(endOffset), SOURCE_CONTEXT_BYTES),
+        ...source.label ? { label: source.label } : {}
+      }
+    },
+    left: Math.min(Math.max(12, rect.left + rect.width / 2), window.innerWidth - 12),
+    top: rect.bottom + 48 <= window.innerHeight ? rect.bottom + 8 : Math.max(12, rect.top - 40),
+    keyboard
+  };
+}
+function TimelineAnnotationSelection({
+  rootRef,
+  sources,
+  onAnnotate
+}) {
+  const [candidate, setCandidate] = useState(null);
+  const buttonRef = useRef(null);
+  useEffect(() => {
+    const root = rootRef.current;
+    if (!root || !onAnnotate) {
+      setCandidate(null);
+      return;
+    }
+    const update = (keyboard) => {
+      setCandidate(buildCandidate(root, sources, keyboard));
+    };
+    const onPointerUp = () => window.setTimeout(() => update(false), 0);
+    const onKeyUp = (event) => {
+      if (event.key === "Escape") {
+        setCandidate(null);
+        return;
+      }
+      window.setTimeout(() => update(true), 0);
+    };
+    const onPointerDown = (event) => {
+      if (candidate && !(event.target instanceof Node && buttonRef.current?.contains(event.target))) {
+        setCandidate(null);
+      }
+    };
+    const onDocumentKeyDown = (event) => {
+      if (event.key === "Escape") setCandidate(null);
+    };
+    root.addEventListener("pointerup", onPointerUp);
+    root.addEventListener("keyup", onKeyUp);
+    document.addEventListener("pointerdown", onPointerDown);
+    document.addEventListener("keydown", onDocumentKeyDown);
+    return () => {
+      root.removeEventListener("pointerup", onPointerUp);
+      root.removeEventListener("keyup", onKeyUp);
+      document.removeEventListener("pointerdown", onPointerDown);
+      document.removeEventListener("keydown", onDocumentKeyDown);
+    };
+  }, [candidate, onAnnotate, rootRef, sources]);
+  useEffect(() => {
+    if (candidate?.keyboard) buttonRef.current?.focus();
+  }, [candidate]);
+  if (!candidate || !onAnnotate || typeof document === "undefined") return null;
+  return createPortal(
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        ref: buttonRef,
+        type: "button",
+        style: { left: candidate.left, top: candidate.top },
+        className: "og-root fixed z-[80] -translate-x-1/2 rounded-full border border-og-border bg-og-surface-1 px-3 py-1.5 text-og-sm font-medium text-og-fg shadow-lg outline-hidden transition hover:bg-og-surface-2 focus-visible:ring-2 focus-visible:ring-og-accent pointer-coarse:min-h-[44px]",
+        onClick: () => {
+          onAnnotate(candidate.annotation);
+          document.getSelection()?.removeAllRanges();
+          setCandidate(null);
+        },
+        children: "Annotate"
+      }
+    ),
+    document.body
+  );
+}
+var timeline_annotation_selection_default = TimelineAnnotationSelection;
+export {
+  TimelineAnnotationSelection,
+  timeline_annotation_selection_default as default
+};
+//# sourceMappingURL=timeline-annotation-selection-3L7LHGG2.js.map

package/dist/timeline-annotation-selection-3L7LHGG2.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/timeline-annotation-selection.tsx"],"sourcesContent":["import type { DraftTimelineAnnotation } from \"@opengeni/sdk\";\nimport { useEffect, useRef, useState, type RefObject } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport type { TimelineAnnotationSourceDescriptor } from \"../timeline\";\n\ntype SelectionCandidate = {\n  annotation: DraftTimelineAnnotation;\n  left: number;\n  top: number;\n  keyboard: boolean;\n};\n\nconst INTERACTIVE_SELECTOR =\n  'a,button,input,textarea,select,summary,[role=\"button\"],[contenteditable=\"true\"],[tabindex]:not([tabindex=\"-1\"])';\nconst SOURCE_CONTEXT_BYTES = 160;\nconst MAX_QUOTE_BYTES = 16 * 1024;\n\nfunction utf8Prefix(value: string, maxBytes: number): string {\n  let output = \"\";\n  let bytes = 0;\n  for (const character of value) {\n    const next = new TextEncoder().encode(character).byteLength;\n    if (bytes + next > maxBytes) break;\n    output += character;\n    bytes += next;\n  }\n  return output;\n}\n\nfunction utf8Suffix(value: string, maxBytes: number): string {\n  let output = \"\";\n  let bytes = 0;\n  for (const character of [...value].reverse()) {\n    const next = new TextEncoder().encode(character).byteLength;\n    if (bytes + next > maxBytes) break;\n    output = character + output;\n    bytes += next;\n  }\n  return output;\n}\n\nfunction selectionElement(node: Node | null): Element | null {\n  return node instanceof Element ? node : (node?.parentElement ?? null);\n}\n\nfunction containingSource(node: Node | null): HTMLElement | null {\n  const element = selectionElement(node);\n  const source = element?.closest(\"[data-og-annotation-source-key]\");\n  return source instanceof HTMLElement ? source : null;\n}\n\nfunction isInteractiveSelection(node: Node | null, boundary: HTMLElement): boolean {\n  const element = selectionElement(node);\n  const interactive = element?.closest(INTERACTIVE_SELECTOR);\n  return interactive instanceof Element && boundary.contains(interactive);\n}\n\nfunction occurrenceOffsets(text: string, quote: string): number[] {\n  const offsets: number[] = [];\n  let cursor = 0;\n  while (cursor <= text.length - quote.length) {\n    const offset = text.indexOf(quote, cursor);\n    if (offset < 0) break;\n    offsets.push(offset);\n    cursor = offset + 1;\n  }\n  return offsets;\n}\n\nfunction selectedOccurrence(boundary: HTMLElement, range: Range, quote: string): number {\n  try {\n    const prefix = range.cloneRange();\n    prefix.selectNodeContents(boundary);\n    prefix.setEnd(range.startContainer, range.startOffset);\n    return occurrenceOffsets(prefix.toString(), quote).length;\n  } catch {\n    return 0;\n  }\n}\n\nfunction annotationId(): string {\n  if (typeof globalThis.crypto?.randomUUID === \"function\") {\n    return globalThis.crypto.randomUUID();\n  }\n  return `annotation-${Date.now()}-${Math.random().toString(16).slice(2)}`;\n}\n\nfunction buildCandidate(\n  root: HTMLElement,\n  sources: ReadonlyMap<string, TimelineAnnotationSourceDescriptor>,\n  keyboard: boolean,\n): SelectionCandidate | null {\n  const selection = document.getSelection();\n  if (!selection || selection.rangeCount !== 1 || selection.isCollapsed) return null;\n  const range = selection.getRangeAt(0);\n  const startBoundary = containingSource(range.startContainer);\n  const endBoundary = containingSource(range.endContainer);\n  if (!startBoundary || startBoundary !== endBoundary || !root.contains(startBoundary)) return null;\n  if (\n    isInteractiveSelection(range.startContainer, startBoundary) ||\n    isInteractiveSelection(range.endContainer, startBoundary)\n  ) {\n    return null;\n  }\n  const sourceKey = startBoundary.dataset.ogAnnotationSourceKey;\n  const source = sourceKey ? sources.get(sourceKey) : undefined;\n  const quote = selection.toString();\n  if (\n    !source ||\n    quote.trim().length === 0 ||\n    new TextEncoder().encode(quote).byteLength > MAX_QUOTE_BYTES\n  ) {\n    return null;\n  }\n  const sourceOffsets = occurrenceOffsets(source.text, quote);\n  if (sourceOffsets.length === 0) return null;\n  const occurrence = selectedOccurrence(startBoundary, range, quote);\n  const startOffset = sourceOffsets[Math.min(occurrence, sourceOffsets.length - 1)]!;\n  const endOffset = startOffset + quote.length;\n  const rect = range.getBoundingClientRect();\n  if (rect.width === 0 && rect.height === 0) return null;\n  return {\n    annotation: {\n      id: annotationId(),\n      quote,\n      note: \"\",\n      source: {\n        kind: source.kind,\n        eventId: source.eventId,\n        eventType: source.eventType,\n        sequence: source.sequence,\n        turnId: source.turnId,\n        startOffset,\n        endOffset,\n        contextBefore: utf8Suffix(source.text.slice(0, startOffset), SOURCE_CONTEXT_BYTES),\n        contextAfter: utf8Prefix(source.text.slice(endOffset), SOURCE_CONTEXT_BYTES),\n        ...(source.label ? { label: source.label } : {}),\n      },\n    },\n    left: Math.min(Math.max(12, rect.left + rect.width / 2), window.innerWidth - 12),\n    top: rect.bottom + 48 <= window.innerHeight ? rect.bottom + 8 : Math.max(12, rect.top - 40),\n    keyboard,\n  };\n}\n\nexport function TimelineAnnotationSelection({\n  rootRef,\n  sources,\n  onAnnotate,\n}: {\n  rootRef: RefObject<HTMLElement | null>;\n  sources: ReadonlyMap<string, TimelineAnnotationSourceDescriptor>;\n  onAnnotate?: ((annotation: DraftTimelineAnnotation) => void) | undefined;\n}) {\n  const [candidate, setCandidate] = useState<SelectionCandidate | null>(null);\n  const buttonRef = useRef<HTMLButtonElement | null>(null);\n\n  useEffect(() => {\n    const root = rootRef.current;\n    if (!root || !onAnnotate) {\n      setCandidate(null);\n      return;\n    }\n    const update = (keyboard: boolean) => {\n      setCandidate(buildCandidate(root, sources, keyboard));\n    };\n    const onPointerUp = () => window.setTimeout(() => update(false), 0);\n    const onKeyUp = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        setCandidate(null);\n        return;\n      }\n      window.setTimeout(() => update(true), 0);\n    };\n    const onPointerDown = (event: PointerEvent) => {\n      if (\n        candidate &&\n        !(event.target instanceof Node && buttonRef.current?.contains(event.target))\n      ) {\n        setCandidate(null);\n      }\n    };\n    const onDocumentKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") setCandidate(null);\n    };\n    root.addEventListener(\"pointerup\", onPointerUp);\n    root.addEventListener(\"keyup\", onKeyUp);\n    document.addEventListener(\"pointerdown\", onPointerDown);\n    document.addEventListener(\"keydown\", onDocumentKeyDown);\n    return () => {\n      root.removeEventListener(\"pointerup\", onPointerUp);\n      root.removeEventListener(\"keyup\", onKeyUp);\n      document.removeEventListener(\"pointerdown\", onPointerDown);\n      document.removeEventListener(\"keydown\", onDocumentKeyDown);\n    };\n  }, [candidate, onAnnotate, rootRef, sources]);\n\n  useEffect(() => {\n    if (candidate?.keyboard) buttonRef.current?.focus();\n  }, [candidate]);\n\n  if (!candidate || !onAnnotate || typeof document === \"undefined\") return null;\n  return createPortal(\n    <button\n      ref={buttonRef}\n      type=\"button\"\n      style={{ left: candidate.left, top: candidate.top }}\n      className=\"og-root fixed z-[80] -translate-x-1/2 rounded-full border border-og-border bg-og-surface-1 px-3 py-1.5 text-og-sm font-medium text-og-fg shadow-lg outline-hidden transition hover:bg-og-surface-2 focus-visible:ring-2 focus-visible:ring-og-accent pointer-coarse:min-h-[44px]\"\n      onClick={() => {\n        onAnnotate(candidate.annotation);\n        document.getSelection()?.removeAllRanges();\n        setCandidate(null);\n      }}\n    >\n      Annotate\n    </button>,\n    document.body,\n  );\n}\n\nexport default TimelineAnnotationSelection;\n"],"mappings":";AACA,SAAS,WAAW,QAAQ,gBAAgC;AAC5D,SAAS,oBAAoB;AAyMzB;AA/LJ,IAAM,uBACJ;AACF,IAAM,uBAAuB;AAC7B,IAAM,kBAAkB,KAAK;AAE7B,SAAS,WAAW,OAAe,UAA0B;AAC3D,MAAI,SAAS;AACb,MAAI,QAAQ;AACZ,aAAW,aAAa,OAAO;AAC7B,UAAM,OAAO,IAAI,YAAY,EAAE,OAAO,SAAS,EAAE;AACjD,QAAI,QAAQ,OAAO,SAAU;AAC7B,cAAU;AACV,aAAS;AAAA,EACX;AACA,SAAO;AACT;AAEA,SAAS,WAAW,OAAe,UAA0B;AAC3D,MAAI,SAAS;AACb,MAAI,QAAQ;AACZ,aAAW,aAAa,CAAC,GAAG,KAAK,EAAE,QAAQ,GAAG;AAC5C,UAAM,OAAO,IAAI,YAAY,EAAE,OAAO,SAAS,EAAE;AACjD,QAAI,QAAQ,OAAO,SAAU;AAC7B,aAAS,YAAY;AACrB,aAAS;AAAA,EACX;AACA,SAAO;AACT;AAEA,SAAS,iBAAiB,MAAmC;AAC3D,SAAO,gBAAgB,UAAU,OAAQ,MAAM,iBAAiB;AAClE;AAEA,SAAS,iBAAiB,MAAuC;AAC/D,QAAM,UAAU,iBAAiB,IAAI;AACrC,QAAM,SAAS,SAAS,QAAQ,iCAAiC;AACjE,SAAO,kBAAkB,cAAc,SAAS;AAClD;AAEA,SAAS,uBAAuB,MAAmB,UAAgC;AACjF,QAAM,UAAU,iBAAiB,IAAI;AACrC,QAAM,cAAc,SAAS,QAAQ,oBAAoB;AACzD,SAAO,uBAAuB,WAAW,SAAS,SAAS,WAAW;AACxE;AAEA,SAAS,kBAAkB,MAAc,OAAyB;AAChE,QAAM,UAAoB,CAAC;AAC3B,MAAI,SAAS;AACb,SAAO,UAAU,KAAK,SAAS,MAAM,QAAQ;AAC3C,UAAM,SAAS,KAAK,QAAQ,OAAO,MAAM;AACzC,QAAI,SAAS,EAAG;AAChB,YAAQ,KAAK,MAAM;AACnB,aAAS,SAAS;AAAA,EACpB;AACA,SAAO;AACT;AAEA,SAAS,mBAAmB,UAAuB,OAAc,OAAuB;AACtF,MAAI;AACF,UAAM,SAAS,MAAM,WAAW;AAChC,WAAO,mBAAmB,QAAQ;AAClC,WAAO,OAAO,MAAM,gBAAgB,MAAM,WAAW;AACrD,WAAO,kBAAkB,OAAO,SAAS,GAAG,KAAK,EAAE;AAAA,EACrD,QAAQ;AACN,WAAO;AAAA,EACT;AACF;AAEA,SAAS,eAAuB;AAC9B,MAAI,OAAO,WAAW,QAAQ,eAAe,YAAY;AACvD,WAAO,WAAW,OAAO,WAAW;AAAA,EACtC;AACA,SAAO,cAAc,KAAK,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE,SAAS,EAAE,EAAE,MAAM,CAAC,CAAC;AACxE;AAEA,SAAS,eACP,MACA,SACA,UAC2B;AAC3B,QAAM,YAAY,SAAS,aAAa;AACxC,MAAI,CAAC,aAAa,UAAU,eAAe,KAAK,UAAU,YAAa,QAAO;AAC9E,QAAM,QAAQ,UAAU,WAAW,CAAC;AACpC,QAAM,gBAAgB,iBAAiB,MAAM,cAAc;AAC3D,QAAM,cAAc,iBAAiB,MAAM,YAAY;AACvD,MAAI,CAAC,iBAAiB,kBAAkB,eAAe,CAAC,KAAK,SAAS,aAAa,EAAG,QAAO;AAC7F,MACE,uBAAuB,MAAM,gBAAgB,aAAa,KAC1D,uBAAuB,MAAM,cAAc,aAAa,GACxD;AACA,WAAO;AAAA,EACT;AACA,QAAM,YAAY,cAAc,QAAQ;AACxC,QAAM,SAAS,YAAY,QAAQ,IAAI,SAAS,IAAI;AACpD,QAAM,QAAQ,UAAU,SAAS;AACjC,MACE,CAAC,UACD,MAAM,KAAK,EAAE,WAAW,KACxB,IAAI,YAAY,EAAE,OAAO,KAAK,EAAE,aAAa,iBAC7C;AACA,WAAO;AAAA,EACT;AACA,QAAM,gBAAgB,kBAAkB,OAAO,MAAM,KAAK;AAC1D,MAAI,cAAc,WAAW,EAAG,QAAO;AACvC,QAAM,aAAa,mBAAmB,eAAe,OAAO,KAAK;AACjE,QAAM,cAAc,cAAc,KAAK,IAAI,YAAY,cAAc,SAAS,CAAC,CAAC;AAChF,QAAM,YAAY,cAAc,MAAM;AACtC,QAAM,OAAO,MAAM,sBAAsB;AACzC,MAAI,KAAK,UAAU,KAAK,KAAK,WAAW,EAAG,QAAO;AAClD,SAAO;AAAA,IACL,YAAY;AAAA,MACV,IAAI,aAAa;AAAA,MACjB;AAAA,MACA,MAAM;AAAA,MACN,QAAQ;AAAA,QACN,MAAM,OAAO;AAAA,QACb,SAAS,OAAO;AAAA,QAChB,WAAW,OAAO;AAAA,QAClB,UAAU,OAAO;AAAA,QACjB,QAAQ,OAAO;AAAA,QACf;AAAA,QACA;AAAA,QACA,eAAe,WAAW,OAAO,KAAK,MAAM,GAAG,WAAW,GAAG,oBAAoB;AAAA,QACjF,cAAc,WAAW,OAAO,KAAK,MAAM,SAAS,GAAG,oBAAoB;AAAA,QAC3E,GAAI,OAAO,QAAQ,EAAE,OAAO,OAAO,MAAM,IAAI,CAAC;AAAA,MAChD;AAAA,IACF;AAAA,IACA,MAAM,KAAK,IAAI,KAAK,IAAI,IAAI,KAAK,OAAO,KAAK,QAAQ,CAAC,GAAG,OAAO,aAAa,EAAE;AAAA,IAC/E,KAAK,KAAK,SAAS,MAAM,OAAO,cAAc,KAAK,SAAS,IAAI,KAAK,IAAI,IAAI,KAAK,MAAM,EAAE;AAAA,IAC1F;AAAA,EACF;AACF;AAEO,SAAS,4BAA4B;AAAA,EAC1C;AAAA,EACA;AAAA,EACA;AACF,GAIG;AACD,QAAM,CAAC,WAAW,YAAY,IAAI,SAAoC,IAAI;AAC1E,QAAM,YAAY,OAAiC,IAAI;AAEvD,YAAU,MAAM;AACd,UAAM,OAAO,QAAQ;AACrB,QAAI,CAAC,QAAQ,CAAC,YAAY;AACxB,mBAAa,IAAI;AACjB;AAAA,IACF;AACA,UAAM,SAAS,CAAC,aAAsB;AACpC,mBAAa,eAAe,MAAM,SAAS,QAAQ,CAAC;AAAA,IACtD;AACA,UAAM,cAAc,MAAM,OAAO,WAAW,MAAM,OAAO,KAAK,GAAG,CAAC;AAClE,UAAM,UAAU,CAAC,UAAyB;AACxC,UAAI,MAAM,QAAQ,UAAU;AAC1B,qBAAa,IAAI;AACjB;AAAA,MACF;AACA,aAAO,WAAW,MAAM,OAAO,IAAI,GAAG,CAAC;AAAA,IACzC;AACA,UAAM,gBAAgB,CAAC,UAAwB;AAC7C,UACE,aACA,EAAE,MAAM,kBAAkB,QAAQ,UAAU,SAAS,SAAS,MAAM,MAAM,IAC1E;AACA,qBAAa,IAAI;AAAA,MACnB;AAAA,IACF;AACA,UAAM,oBAAoB,CAAC,UAAyB;AAClD,UAAI,MAAM,QAAQ,SAAU,cAAa,IAAI;AAAA,IAC/C;AACA,SAAK,iBAAiB,aAAa,WAAW;AAC9C,SAAK,iBAAiB,SAAS,OAAO;AACtC,aAAS,iBAAiB,eAAe,aAAa;AACtD,aAAS,iBAAiB,WAAW,iBAAiB;AACtD,WAAO,MAAM;AACX,WAAK,oBAAoB,aAAa,WAAW;AACjD,WAAK,oBAAoB,SAAS,OAAO;AACzC,eAAS,oBAAoB,eAAe,aAAa;AACzD,eAAS,oBAAoB,WAAW,iBAAiB;AAAA,IAC3D;AAAA,EACF,GAAG,CAAC,WAAW,YAAY,SAAS,OAAO,CAAC;AAE5C,YAAU,MAAM;AACd,QAAI,WAAW,SAAU,WAAU,SAAS,MAAM;AAAA,EACpD,GAAG,CAAC,SAAS,CAAC;AAEd,MAAI,CAAC,aAAa,CAAC,cAAc,OAAO,aAAa,YAAa,QAAO;AACzE,SAAO;AAAA,IACL;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL,MAAK;AAAA,QACL,OAAO,EAAE,MAAM,UAAU,MAAM,KAAK,UAAU,IAAI;AAAA,QAClD,WAAU;AAAA,QACV,SAAS,MAAM;AACb,qBAAW,UAAU,UAAU;AAC/B,mBAAS,aAAa,GAAG,gBAAgB;AACzC,uBAAa,IAAI;AAAA,QACnB;AAAA,QACD;AAAA;AAAA,IAED;AAAA,IACA,SAAS;AAAA,EACX;AACF;AAEA,IAAO,wCAAQ;","names":[]}

package/dist/timeline-annotations-dialog-U7EVLR75.js

@@ -0,0 +1,196 @@
+// src/components/timeline-annotations-dialog.tsx
+import { useEffect, useLayoutEffect, useRef, useState } from "react";
+import { createPortal } from "react-dom";
+import { jsx, jsxs } from "react/jsx-runtime";
+function cssEscapeAttribute(value) {
+  if (typeof CSS !== "undefined" && typeof CSS.escape === "function") return CSS.escape(value);
+  return value.replace(/\\/g, "\\\\").replace(/"/g, '\\"');
+}
+function revealLoadedSource(source) {
+  if (typeof document === "undefined") return false;
+  const element = document.querySelector(
+    `[data-og-annotation-source-key="${cssEscapeAttribute(source.eventId)}"]`
+  );
+  if (!(element instanceof HTMLElement)) return false;
+  element.scrollIntoView({ block: "center", behavior: "smooth" });
+  element.animate?.(
+    [
+      { outline: "2px solid color-mix(in srgb, currentColor 55%, transparent)" },
+      { outline: "2px solid transparent" }
+    ],
+    { duration: 1600, easing: "ease-out" }
+  );
+  return true;
+}
+function sourceLabel(annotation) {
+  if (annotation.source.label) return annotation.source.label;
+  switch (annotation.source.kind) {
+    case "user_message":
+      return "User message";
+    case "assistant_message":
+      return "Assistant message";
+    case "tool_output":
+      return "Tool output";
+  }
+}
+function TimelineAnnotationsDialog({
+  annotations,
+  editable,
+  focusAnnotationId,
+  onFocusConsumed,
+  onUpdate,
+  onRemove,
+  onRevealSource,
+  triggerRef,
+  countLabel,
+  onDismiss
+}) {
+  const [unavailableId, setUnavailableId] = useState(null);
+  const [position, setPosition] = useState({ left: 12, top: 12, above: false });
+  const panelRef = useRef(null);
+  const noteRefs = useRef(/* @__PURE__ */ new Map());
+  useLayoutEffect(() => {
+    if (!focusAnnotationId) return;
+    const note = noteRefs.current.get(focusAnnotationId);
+    note?.focus();
+    if (note && document.activeElement === note) onFocusConsumed?.();
+  }, [focusAnnotationId, onFocusConsumed]);
+  useEffect(() => {
+    const updatePosition = () => {
+      const rect = triggerRef.current?.getBoundingClientRect();
+      if (!rect) return;
+      const panelWidth = Math.min(400, window.innerWidth - 24);
+      const left = Math.min(
+        Math.max(12, rect.left),
+        Math.max(12, window.innerWidth - panelWidth - 12)
+      );
+      const above = rect.top > Math.min(360, window.innerHeight * 0.55);
+      setPosition({ left, top: above ? rect.top - 8 : rect.bottom + 8, above });
+    };
+    const onKeyDown = (event) => {
+      if (event.key === "Escape") onDismiss(true);
+    };
+    const onPointerDown = (event) => {
+      if (!(event.target instanceof Node)) return;
+      if (panelRef.current?.contains(event.target) || triggerRef.current?.contains(event.target)) {
+        return;
+      }
+      onDismiss(false);
+    };
+    updatePosition();
+    window.addEventListener("resize", updatePosition);
+    window.addEventListener("scroll", updatePosition, true);
+    document.addEventListener("keydown", onKeyDown);
+    document.addEventListener("pointerdown", onPointerDown);
+    if (!focusAnnotationId) {
+      window.setTimeout(() => {
+        if (document.activeElement === triggerRef.current) panelRef.current?.focus();
+      }, 0);
+    }
+    return () => {
+      window.removeEventListener("resize", updatePosition);
+      window.removeEventListener("scroll", updatePosition, true);
+      document.removeEventListener("keydown", onKeyDown);
+      document.removeEventListener("pointerdown", onPointerDown);
+    };
+  }, [focusAnnotationId, onDismiss, triggerRef]);
+  if (typeof document === "undefined") return null;
+  return createPortal(
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: panelRef,
+        role: "dialog",
+        tabIndex: -1,
+        style: {
+          left: position.left,
+          top: position.top,
+          transform: position.above ? "translateY(-100%)" : void 0
+        },
+        className: "og-root fixed z-[75] box-border max-h-[min(32rem,70vh)] w-[min(25rem,calc(100vw-1.5rem))] overflow-y-auto rounded-og-lg border border-og-border bg-og-surface-1 p-3 text-og-fg shadow-xl outline-hidden",
+        "aria-label": editable ? "Review timeline annotations" : "Timeline annotations",
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "mb-2 flex items-center justify-between gap-3", children: [
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("p", { className: "text-og-sm font-semibold", children: countLabel }),
+              /* @__PURE__ */ jsx("p", { className: "text-og-xs text-og-fg-subtle", children: editable ? "Add a note for each quoted source." : "Sent with this message." })
+            ] }),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                className: "rounded-md border-0 bg-transparent px-2 py-1 text-og-xs text-og-fg outline-hidden hover:bg-og-surface-2 focus-visible:ring-2 focus-visible:ring-og-accent pointer-coarse:min-h-[44px]",
+                onClick: () => onDismiss(true),
+                children: "Close"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "grid gap-2.5", children: annotations.map((annotation, index) => /* @__PURE__ */ jsxs(
+            "section",
+            {
+              className: "rounded-og-md border border-og-border bg-og-surface-2/60 p-2.5",
+              "aria-label": `Annotation ${index + 1}`,
+              children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+                  /* @__PURE__ */ jsxs(
+                    "button",
+                    {
+                      type: "button",
+                      className: "truncate rounded border-0 bg-transparent text-left text-og-xs font-medium text-og-fg-muted underline-offset-2 outline-hidden hover:text-og-fg hover:underline focus-visible:ring-2 focus-visible:ring-og-accent pointer-coarse:min-h-[44px]",
+                      onClick: () => {
+                        const revealed = onRevealSource?.(annotation.source) ?? revealLoadedSource(annotation.source);
+                        setUnavailableId(revealed ? null : annotation.id);
+                      },
+                      children: [
+                        sourceLabel(annotation),
+                        " \xB7 view source"
+                      ]
+                    }
+                  ),
+                  editable && onRemove ? /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      type: "button",
+                      className: "shrink-0 rounded border-0 bg-transparent p-1 text-og-fg-subtle outline-hidden hover:bg-og-surface-1 hover:text-og-status-failed focus-visible:ring-2 focus-visible:ring-og-accent pointer-coarse:size-[44px]",
+                      "aria-label": `Remove annotation ${index + 1}`,
+                      onClick: () => onRemove(annotation.id),
+                      children: /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "text-og-md leading-none", children: "\xD7" })
+                    }
+                  ) : null
+                ] }),
+                unavailableId === annotation.id ? /* @__PURE__ */ jsx("p", { role: "status", className: "mt-1 text-og-xs text-og-status-waiting", children: "Source is outside the loaded timeline window." }) : null,
+                /* @__PURE__ */ jsx("blockquote", { className: "mt-2 max-h-28 overflow-auto whitespace-pre-wrap border-l-2 border-og-border pl-2 text-og-sm leading-5 text-og-fg-muted", children: annotation.quote }),
+                editable && onUpdate ? /* @__PURE__ */ jsxs("label", { className: "mt-2 block text-og-xs font-medium text-og-fg-muted", children: [
+                  "Note",
+                  /* @__PURE__ */ jsx(
+                    "textarea",
+                    {
+                      ref: (node) => {
+                        if (node) noteRefs.current.set(annotation.id, node);
+                        else noteRefs.current.delete(annotation.id);
+                      },
+                      value: annotation.note,
+                      rows: 2,
+                      maxLength: 2048,
+                      placeholder: "What should the agent do with this?",
+                      className: "mt-1 w-full resize-y rounded-og-sm border border-og-border bg-og-surface-1 px-2.5 py-2 text-og-sm leading-5 text-og-fg outline-hidden placeholder:text-og-fg-subtle focus:border-og-accent focus:ring-1 focus:ring-og-accent",
+                      onInput: (event) => onUpdate(annotation.id, event.currentTarget.value)
+                    }
+                  )
+                ] }) : annotation.note ? /* @__PURE__ */ jsx("p", { className: "mt-2 whitespace-pre-wrap text-og-sm leading-5 text-og-fg", children: annotation.note }) : null
+              ]
+            },
+            annotation.id
+          )) })
+        ]
+      }
+    ),
+    document.body
+  );
+}
+var timeline_annotations_dialog_default = TimelineAnnotationsDialog;
+export {
+  TimelineAnnotationsDialog,
+  timeline_annotations_dialog_default as default
+};
+//# sourceMappingURL=timeline-annotations-dialog-U7EVLR75.js.map

package/dist/timeline-annotations-dialog-U7EVLR75.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/timeline-annotations-dialog.tsx"],"sourcesContent":["import type { TimelineAnnotationSource } from \"@opengeni/sdk\";\nimport { useEffect, useLayoutEffect, useRef, useState, type RefObject } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport type { TimelineAnnotationLike } from \"./timeline-annotations\";\n\nfunction cssEscapeAttribute(value: string): string {\n  if (typeof CSS !== \"undefined\" && typeof CSS.escape === \"function\") return CSS.escape(value);\n  return value.replace(/\\\\/g, \"\\\\\\\\\").replace(/\"/g, '\\\\\"');\n}\n\nfunction revealLoadedSource(source: TimelineAnnotationSource): boolean {\n  if (typeof document === \"undefined\") return false;\n  const element = document.querySelector(\n    `[data-og-annotation-source-key=\"${cssEscapeAttribute(source.eventId)}\"]`,\n  );\n  if (!(element instanceof HTMLElement)) return false;\n  element.scrollIntoView({ block: \"center\", behavior: \"smooth\" });\n  element.animate?.(\n    [\n      { outline: \"2px solid color-mix(in srgb, currentColor 55%, transparent)\" },\n      { outline: \"2px solid transparent\" },\n    ],\n    { duration: 1600, easing: \"ease-out\" },\n  );\n  return true;\n}\n\nfunction sourceLabel(annotation: TimelineAnnotationLike): string {\n  if (annotation.source.label) return annotation.source.label;\n  switch (annotation.source.kind) {\n    case \"user_message\":\n      return \"User message\";\n    case \"assistant_message\":\n      return \"Assistant message\";\n    case \"tool_output\":\n      return \"Tool output\";\n  }\n}\n\nexport function TimelineAnnotationsDialog({\n  annotations,\n  editable,\n  focusAnnotationId,\n  onFocusConsumed,\n  onUpdate,\n  onRemove,\n  onRevealSource,\n  triggerRef,\n  countLabel,\n  onDismiss,\n}: {\n  annotations: readonly TimelineAnnotationLike[];\n  editable: boolean;\n  focusAnnotationId?: string | null | undefined;\n  onFocusConsumed?: (() => void) | undefined;\n  onUpdate?: ((id: string, note: string) => void) | undefined;\n  onRemove?: ((id: string) => void) | undefined;\n  onRevealSource?: ((source: TimelineAnnotationSource) => boolean) | undefined;\n  triggerRef: RefObject<HTMLButtonElement | null>;\n  countLabel: string;\n  onDismiss: (restoreFocus: boolean) => void;\n}) {\n  const [unavailableId, setUnavailableId] = useState<string | null>(null);\n  const [position, setPosition] = useState({ left: 12, top: 12, above: false });\n  const panelRef = useRef<HTMLDivElement | null>(null);\n  const noteRefs = useRef(new Map<string, HTMLTextAreaElement>());\n\n  useLayoutEffect(() => {\n    if (!focusAnnotationId) return;\n    const note = noteRefs.current.get(focusAnnotationId);\n    note?.focus();\n    if (note && document.activeElement === note) onFocusConsumed?.();\n  }, [focusAnnotationId, onFocusConsumed]);\n\n  useEffect(() => {\n    const updatePosition = () => {\n      const rect = triggerRef.current?.getBoundingClientRect();\n      if (!rect) return;\n      const panelWidth = Math.min(400, window.innerWidth - 24);\n      const left = Math.min(\n        Math.max(12, rect.left),\n        Math.max(12, window.innerWidth - panelWidth - 12),\n      );\n      const above = rect.top > Math.min(360, window.innerHeight * 0.55);\n      setPosition({ left, top: above ? rect.top - 8 : rect.bottom + 8, above });\n    };\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") onDismiss(true);\n    };\n    const onPointerDown = (event: PointerEvent) => {\n      if (!(event.target instanceof Node)) return;\n      if (panelRef.current?.contains(event.target) || triggerRef.current?.contains(event.target)) {\n        return;\n      }\n      onDismiss(false);\n    };\n    updatePosition();\n    window.addEventListener(\"resize\", updatePosition);\n    window.addEventListener(\"scroll\", updatePosition, true);\n    document.addEventListener(\"keydown\", onKeyDown);\n    document.addEventListener(\"pointerdown\", onPointerDown);\n    if (!focusAnnotationId) {\n      window.setTimeout(() => {\n        if (document.activeElement === triggerRef.current) panelRef.current?.focus();\n      }, 0);\n    }\n    return () => {\n      window.removeEventListener(\"resize\", updatePosition);\n      window.removeEventListener(\"scroll\", updatePosition, true);\n      document.removeEventListener(\"keydown\", onKeyDown);\n      document.removeEventListener(\"pointerdown\", onPointerDown);\n    };\n  }, [focusAnnotationId, onDismiss, triggerRef]);\n\n  if (typeof document === \"undefined\") return null;\n  return createPortal(\n    <div\n      ref={panelRef}\n      role=\"dialog\"\n      tabIndex={-1}\n      style={{\n        left: position.left,\n        top: position.top,\n        transform: position.above ? \"translateY(-100%)\" : undefined,\n      }}\n      className=\"og-root fixed z-[75] box-border max-h-[min(32rem,70vh)] w-[min(25rem,calc(100vw-1.5rem))] overflow-y-auto rounded-og-lg border border-og-border bg-og-surface-1 p-3 text-og-fg shadow-xl outline-hidden\"\n      aria-label={editable ? \"Review timeline annotations\" : \"Timeline annotations\"}\n    >\n      <div className=\"mb-2 flex items-center justify-between gap-3\">\n        <div>\n          <p className=\"text-og-sm font-semibold\">{countLabel}</p>\n          <p className=\"text-og-xs text-og-fg-subtle\">\n            {editable ? \"Add a note for each quoted source.\" : \"Sent with this message.\"}\n          </p>\n        </div>\n        <button\n          type=\"button\"\n          className=\"rounded-md border-0 bg-transparent px-2 py-1 text-og-xs text-og-fg outline-hidden hover:bg-og-surface-2 focus-visible:ring-2 focus-visible:ring-og-accent pointer-coarse:min-h-[44px]\"\n          onClick={() => onDismiss(true)}\n        >\n          Close\n        </button>\n      </div>\n      <div className=\"grid gap-2.5\">\n        {annotations.map((annotation, index) => (\n          <section\n            key={annotation.id}\n            className=\"rounded-og-md border border-og-border bg-og-surface-2/60 p-2.5\"\n            aria-label={`Annotation ${index + 1}`}\n          >\n            <div className=\"flex items-center justify-between gap-2\">\n              <button\n                type=\"button\"\n                className=\"truncate rounded border-0 bg-transparent text-left text-og-xs font-medium text-og-fg-muted underline-offset-2 outline-hidden hover:text-og-fg hover:underline focus-visible:ring-2 focus-visible:ring-og-accent pointer-coarse:min-h-[44px]\"\n                onClick={() => {\n                  const revealed =\n                    onRevealSource?.(annotation.source) ?? revealLoadedSource(annotation.source);\n                  setUnavailableId(revealed ? null : annotation.id);\n                }}\n              >\n                {sourceLabel(annotation)} · view source\n              </button>\n              {editable && onRemove ? (\n                <button\n                  type=\"button\"\n                  className=\"shrink-0 rounded border-0 bg-transparent p-1 text-og-fg-subtle outline-hidden hover:bg-og-surface-1 hover:text-og-status-failed focus-visible:ring-2 focus-visible:ring-og-accent pointer-coarse:size-[44px]\"\n                  aria-label={`Remove annotation ${index + 1}`}\n                  onClick={() => onRemove(annotation.id)}\n                >\n                  <span aria-hidden=\"true\" className=\"text-og-md leading-none\">\n                    ×\n                  </span>\n                </button>\n              ) : null}\n            </div>\n            {unavailableId === annotation.id ? (\n              <p role=\"status\" className=\"mt-1 text-og-xs text-og-status-waiting\">\n                Source is outside the loaded timeline window.\n              </p>\n            ) : null}\n            <blockquote className=\"mt-2 max-h-28 overflow-auto whitespace-pre-wrap border-l-2 border-og-border pl-2 text-og-sm leading-5 text-og-fg-muted\">\n              {annotation.quote}\n            </blockquote>\n            {editable && onUpdate ? (\n              <label className=\"mt-2 block text-og-xs font-medium text-og-fg-muted\">\n                Note\n                <textarea\n                  ref={(node) => {\n                    if (node) noteRefs.current.set(annotation.id, node);\n                    else noteRefs.current.delete(annotation.id);\n                  }}\n                  value={annotation.note}\n                  rows={2}\n                  maxLength={2048}\n                  placeholder=\"What should the agent do with this?\"\n                  className=\"mt-1 w-full resize-y rounded-og-sm border border-og-border bg-og-surface-1 px-2.5 py-2 text-og-sm leading-5 text-og-fg outline-hidden placeholder:text-og-fg-subtle focus:border-og-accent focus:ring-1 focus:ring-og-accent\"\n                  onInput={(event) => onUpdate(annotation.id, event.currentTarget.value)}\n                />\n              </label>\n            ) : annotation.note ? (\n              <p className=\"mt-2 whitespace-pre-wrap text-og-sm leading-5 text-og-fg\">\n                {annotation.note}\n              </p>\n            ) : null}\n          </section>\n        ))}\n      </div>\n    </div>,\n    document.body,\n  );\n}\n\nexport default TimelineAnnotationsDialog;\n"],"mappings":"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","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeni/react",
-  "version": "0.48.0",
+  "version": "0.52.1",
   "description": "React hooks and styled components for OpenGeni: live session streaming, chat composer, message timeline, session status, and fleet views — token-themed (CSS variables), dark-first, built on Tailwind v4 + Radix + Motion.",
   "license": "Apache-2.0",
   "repository": {
@@ -43,31 +43,56 @@
     },
     "./model-policy": {
       "types": "./dist/model-policy.d.ts",
-      "import": "./dist/model-policy.js"
+      "import": "./dist/model-policy.js",
+      "default": "./dist/model-policy.js"
     },
     "./realtime": {
       "types": "./dist/realtime.d.ts",
       "import": "./dist/realtime.js"
     },
+    "./artifacts": {
+      "types": "./dist/artifacts.d.ts",
+      "import": "./dist/artifacts.js"
+    },
+    "./artifacts/spreadsheet": {
+      "types": "./dist/artifacts-spreadsheet.d.ts",
+      "import": "./dist/artifacts-spreadsheet.js"
+    },
+    "./artifacts/document": {
+      "types": "./dist/artifacts-document.d.ts",
+      "import": "./dist/artifacts-document.js"
+    },
+    "./artifacts/presentation": {
+      "types": "./dist/artifacts-presentation.d.ts",
+      "import": "./dist/artifacts-presentation.js"
+    },
+    "./interaction": {
+      "types": "./dist/interaction.d.ts",
+      "import": "./dist/interaction.js"
+    },
+    "./clipboard": {
+      "types": "./dist/clipboard.d.ts",
+      "import": "./dist/clipboard.js"
+    },
     "./styles.css": {
       "types": "./styles/index.d.ts",
       "style": "./styles/index.css",
-      "import": "./styles/index.css"
+      "default": "./styles/index.css"
     },
     "./compiled.css": {
       "types": "./styles/compiled.d.ts",
       "style": "./styles/compiled.css",
-      "import": "./styles/compiled.css"
+      "default": "./styles/compiled.css"
     },
     "./responsive.css": {
       "types": "./styles/responsive.d.ts",
       "style": "./styles/responsive.css",
-      "import": "./styles/responsive.css"
+      "default": "./styles/responsive.css"
     },
     "./tokens.css": {
       "types": "./styles/tokens.d.ts",
       "style": "./styles/tokens.css",
-      "import": "./styles/tokens.css"
+      "default": "./styles/tokens.css"
     }
   },
   "publishConfig": {
@@ -91,7 +116,7 @@
     "@dnd-kit/utilities": "3.2.2",
     "@fontsource-variable/noto-sans-arabic": "5.2.10",
     "@fontsource-variable/noto-sans-jp": "5.2.10",
-    "@opengeni/sdk": "^0.48.0",
+    "@opengeni/sdk": "^0.52.1",
     "clsx": "^2.1.1",
     "lucide-react": "^1.8.0",
     "motion": "^12.0.0",
@@ -110,6 +135,7 @@
     "@codemirror/lang-markdown": "^6.0.0",
     "@codemirror/lang-python": "^6.0.0",
     "@novnc/novnc": "^1.7.0",
+    "@opengeni/artifact-tool": ">=0.1.0 <0.3.0",
     "@pierre/diffs": "^1.2.11",
     "@uiw/react-codemirror": "^4.23.0",
     "@xterm/addon-fit": "^0.11.0",
@@ -141,6 +167,9 @@
     "@novnc/novnc": {
       "optional": true
     },
+    "@opengeni/artifact-tool": {
+      "optional": true
+    },
     "@pierre/diffs": {
       "optional": true
     },