@opengeni/react 3.8.0-canary.0 → 3.8.0-canary.1

package/README.md

@@ -844,3 +844,9 @@ thinking labels through `messages`, and override payment descriptions through
 Subscription descriptions appear once per provider group. Free models carry a
 Free badge. Pass `hasImageAttachments` for the current draft to show an image
 compatibility warning only when the selected model cannot view those images.
+
+`MessageTimeline.renderMessageActions(item)` places host-owned controls beside
+Copy and the timestamp for user messages and completed assistant messages.
+The host owns feedback, fork authorization, and mutations; streaming assistant
+messages omit this slot. Use the `group/copy` hover/focus state and preserve
+visible touch targets when styling actions.

package/dist/chat.js

@@ -1,7 +1,7 @@
 import {
   HumanInputForm,
   Markdown
-} from "./chunk-F2CFHN3Y.js";
+} from "./chunk-YAIPFO5D.js";
 import "./chunk-JVYQRRC4.js";
 import "./chunk-HQV2I5HV.js";
 import "./chunk-VZTQ73XT.js";

package/dist/chunk-5M6VTFJ5.js

@@ -0,0 +1,171 @@
+import {
+  annotationNoteNeedsDisclosure
+} from "./chunk-ZYRGEKWS.js";
+import {
+  annotationSourceLabel,
+  revealLoadedAnnotationSource,
+  truncateAnnotationQuote
+} from "./chunk-NOSYBS2D.js";
+import {
+  cn
+} from "./chunk-22KP6LR5.js";
+
+// src/components/timeline-annotation-chrome.tsx
+import { useLayoutEffect, useRef, useState } from "react";
+
+// src/components/timeline-annotation-reveal-context.ts
+import { createContext, useContext } from "react";
+var TimelineAnnotationSourceRootContext = createContext(null);
+function useTimelineAnnotationSourceRoot() {
+  return useContext(TimelineAnnotationSourceRootContext);
+}
+
+// src/components/timeline-annotation-chrome.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var NOTE_MAX_HEIGHT_PX = 160;
+function autosizeNote(textarea) {
+  if (!textarea) return;
+  textarea.style.height = "auto";
+  textarea.style.height = `${Math.min(Math.max(textarea.scrollHeight, 32), NOTE_MAX_HEIGHT_PX)}px`;
+}
+function quotePreview(quote) {
+  const trimmed = quote.trim();
+  const multiline = trimmed.includes("\n");
+  return {
+    text: multiline ? trimmed : trimmed.replace(/\s+/g, " "),
+    multiline
+  };
+}
+function AnnotationQuoteSourceButton({
+  annotation,
+  lines = 2,
+  onRevealSource,
+  onUnavailable
+}) {
+  const preview = quotePreview(annotation.quote);
+  const sourceLabel = annotationSourceLabel(annotation.source);
+  const sourceRoot = useTimelineAnnotationSourceRoot();
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      title: annotation.quote,
+      "aria-label": `View ${sourceLabel} source: ${truncateAnnotationQuote(annotation.quote, 88)}`,
+      className: "block w-full min-w-0 rounded-sm border-0 bg-transparent text-left text-og-sm leading-5 text-og-fg-muted outline-hidden transition-colors hover:text-og-fg focus-visible:ring-2 focus-visible:ring-og-accent pointer-coarse:min-h-[44px]",
+      onClick: () => {
+        const revealed = onRevealSource?.(annotation.source) ?? (sourceRoot ? revealLoadedAnnotationSource(annotation.source, sourceRoot.current) : revealLoadedAnnotationSource(annotation.source));
+        onUnavailable(revealed ? null : annotation.id);
+      },
+      children: [
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: cn(
+              "block min-w-0 max-w-full break-words",
+              preview.multiline ? "whitespace-pre-wrap" : "whitespace-normal",
+              lines === 3 ? "line-clamp-3" : "line-clamp-2"
+            ),
+            children: preview.text
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: "sr-only", children: " view source" })
+      ]
+    }
+  );
+}
+function AnnotationAccentRow({
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex gap-2.5", className), children: [
+    /* @__PURE__ */ jsx("div", { "aria-hidden": "true", className: "w-0.5 shrink-0 rounded-full bg-og-accent/55" }),
+    /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1", children })
+  ] });
+}
+function AnnotationNotePreview({
+  note,
+  annotationId,
+  ordinal,
+  className
+}) {
+  const [expanded, setExpanded] = useState(false);
+  if (!note) return null;
+  const collapsible = annotationNoteNeedsDisclosure(note);
+  const contentId = `og-annotation-note-${annotationId}`;
+  return /* @__PURE__ */ jsxs("div", { className, children: [
+    /* @__PURE__ */ jsx(
+      "p",
+      {
+        id: contentId,
+        "data-og-annotation-note": "",
+        "data-og-annotation-note-expanded": expanded ? "true" : "false",
+        className: cn(
+          "mt-0.5 break-words whitespace-pre-wrap text-og-sm leading-5 text-og-fg",
+          !expanded && "line-clamp-4"
+        ),
+        children: note
+      }
+    ),
+    collapsible ? /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "mt-0.5 inline-flex min-h-7 items-center rounded-og-sm px-1 text-og-xs font-medium text-og-fg-muted outline-hidden hover:text-og-fg focus-visible:ring-2 focus-visible:ring-og-accent pointer-coarse:min-h-11",
+        "aria-expanded": expanded,
+        "aria-controls": contentId,
+        "aria-label": expanded ? `Show less annotation ${ordinal}` : `Show more annotation ${ordinal}`,
+        onClick: () => setExpanded((current) => !current),
+        children: expanded ? "Show less" : "Show more"
+      }
+    ) : null
+  ] });
+}
+function AnnotationNoteField({
+  annotation,
+  inputRef,
+  onUpdate,
+  onCommit
+}) {
+  const localRef = useRef(null);
+  const setRef = (node) => {
+    localRef.current = node;
+    inputRef?.(node);
+    autosizeNote(node);
+  };
+  useLayoutEffect(() => {
+    autosizeNote(localRef.current);
+  }, [annotation.note]);
+  return /* @__PURE__ */ jsx(
+    "textarea",
+    {
+      ref: setRef,
+      value: annotation.note,
+      rows: 1,
+      maxLength: 2048,
+      placeholder: "Add a note\u2026",
+      "aria-label": "Note",
+      className: "mt-0.5 max-h-40 min-h-8 w-full resize-none overflow-y-auto break-words border-0 bg-transparent px-0 py-1 text-og-sm leading-5 text-og-fg outline-hidden placeholder:text-og-fg-subtle focus-visible:ring-0",
+      onInput: (event) => {
+        autosizeNote(event.currentTarget);
+        onUpdate(annotation.id, event.currentTarget.value);
+      },
+      onKeyDown: (event) => {
+        if (event.key !== "Enter" || event.shiftKey || event.nativeEvent.isComposing) return;
+        event.preventDefault();
+        event.stopPropagation();
+        if (event.currentTarget.value.trim().length === 0) return;
+        onCommit?.();
+      }
+    }
+  );
+}
+
+export {
+  TimelineAnnotationSourceRootContext,
+  useTimelineAnnotationSourceRoot,
+  AnnotationQuoteSourceButton,
+  AnnotationAccentRow,
+  AnnotationNotePreview,
+  AnnotationNoteField
+};
+//# sourceMappingURL=chunk-5M6VTFJ5.js.map

package/dist/chunk-5M6VTFJ5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/timeline-annotation-chrome.tsx","../src/components/timeline-annotation-reveal-context.ts"],"sourcesContent":["import type {\n  DraftTimelineAnnotation,\n  TimelineAnnotation,\n  TimelineAnnotationSource,\n} from \"@opengeni/sdk\";\nimport { useLayoutEffect, useRef, useState, type ReactNode } from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { annotationNoteNeedsDisclosure } from \"./timeline-annotation-layout\";\nimport { useTimelineAnnotationSourceRoot } from \"./timeline-annotation-reveal-context\";\nimport {\n  annotationSourceLabel,\n  revealLoadedAnnotationSource,\n  truncateAnnotationQuote,\n} from \"./timeline-annotation-shared\";\n\nexport type TimelineAnnotationLike = DraftTimelineAnnotation | TimelineAnnotation;\n\nconst NOTE_MAX_HEIGHT_PX = 160;\n\nfunction autosizeNote(textarea: HTMLTextAreaElement | null): void {\n  if (!textarea) return;\n  textarea.style.height = \"auto\";\n  textarea.style.height = `${Math.min(Math.max(textarea.scrollHeight, 32), NOTE_MAX_HEIGHT_PX)}px`;\n}\n\nfunction quotePreview(quote: string): { text: string; multiline: boolean } {\n  const trimmed = quote.trim();\n  const multiline = trimmed.includes(\"\\n\");\n  return {\n    text: multiline ? trimmed : trimmed.replace(/\\s+/g, \" \"),\n    multiline,\n  };\n}\n\nexport function AnnotationQuoteSourceButton({\n  annotation,\n  lines = 2,\n  onRevealSource,\n  onUnavailable,\n}: {\n  annotation: TimelineAnnotationLike;\n  lines?: 2 | 3;\n  onRevealSource?: ((source: TimelineAnnotationSource) => boolean) | undefined;\n  onUnavailable: (id: string | null) => void;\n}) {\n  const preview = quotePreview(annotation.quote);\n  const sourceLabel = annotationSourceLabel(annotation.source);\n  const sourceRoot = useTimelineAnnotationSourceRoot();\n  return (\n    <button\n      type=\"button\"\n      title={annotation.quote}\n      aria-label={`View ${sourceLabel} source: ${truncateAnnotationQuote(annotation.quote, 88)}`}\n      className=\"block w-full min-w-0 rounded-sm border-0 bg-transparent text-left text-og-sm leading-5 text-og-fg-muted outline-hidden transition-colors hover:text-og-fg focus-visible:ring-2 focus-visible:ring-og-accent pointer-coarse:min-h-[44px]\"\n      onClick={() => {\n        const revealed =\n          onRevealSource?.(annotation.source) ??\n          (sourceRoot\n            ? revealLoadedAnnotationSource(annotation.source, sourceRoot.current)\n            : revealLoadedAnnotationSource(annotation.source));\n        onUnavailable(revealed ? null : annotation.id);\n      }}\n    >\n      <span\n        className={cn(\n          \"block min-w-0 max-w-full break-words\",\n          preview.multiline ? \"whitespace-pre-wrap\" : \"whitespace-normal\",\n          lines === 3 ? \"line-clamp-3\" : \"line-clamp-2\",\n        )}\n      >\n        {preview.text}\n      </span>\n      <span className=\"sr-only\"> view source</span>\n    </button>\n  );\n}\n\nexport function AnnotationAccentRow({\n  children,\n  className,\n}: {\n  children: ReactNode;\n  className?: string | undefined;\n}) {\n  return (\n    <div className={cn(\"flex gap-2.5\", className)}>\n      <div aria-hidden=\"true\" className=\"w-0.5 shrink-0 rounded-full bg-og-accent/55\" />\n      <div className=\"min-w-0 flex-1\">{children}</div>\n    </div>\n  );\n}\n\nexport function AnnotationNotePreview({\n  note,\n  annotationId,\n  ordinal,\n  className,\n}: {\n  note: string;\n  annotationId: string;\n  ordinal: number;\n  className?: string | undefined;\n}) {\n  const [expanded, setExpanded] = useState(false);\n  if (!note) return null;\n  const collapsible = annotationNoteNeedsDisclosure(note);\n  const contentId = `og-annotation-note-${annotationId}`;\n  return (\n    <div className={className}>\n      <p\n        id={contentId}\n        data-og-annotation-note=\"\"\n        data-og-annotation-note-expanded={expanded ? \"true\" : \"false\"}\n        className={cn(\n          \"mt-0.5 break-words whitespace-pre-wrap text-og-sm leading-5 text-og-fg\",\n          !expanded && \"line-clamp-4\",\n        )}\n      >\n        {note}\n      </p>\n      {collapsible ? (\n        <button\n          type=\"button\"\n          className=\"mt-0.5 inline-flex min-h-7 items-center rounded-og-sm px-1 text-og-xs font-medium text-og-fg-muted outline-hidden hover:text-og-fg focus-visible:ring-2 focus-visible:ring-og-accent pointer-coarse:min-h-11\"\n          aria-expanded={expanded}\n          aria-controls={contentId}\n          aria-label={\n            expanded ? `Show less annotation ${ordinal}` : `Show more annotation ${ordinal}`\n          }\n          onClick={() => setExpanded((current) => !current)}\n        >\n          {expanded ? \"Show less\" : \"Show more\"}\n        </button>\n      ) : null}\n    </div>\n  );\n}\n\nexport function AnnotationNoteField({\n  annotation,\n  inputRef,\n  onUpdate,\n  onCommit,\n}: {\n  annotation: TimelineAnnotationLike;\n  inputRef?: ((node: HTMLTextAreaElement | null) => void) | undefined;\n  onUpdate: (id: string, note: string) => void;\n  onCommit?: (() => void) | undefined;\n}) {\n  const localRef = useRef<HTMLTextAreaElement | null>(null);\n  const setRef = (node: HTMLTextAreaElement | null) => {\n    localRef.current = node;\n    inputRef?.(node);\n    autosizeNote(node);\n  };\n\n  useLayoutEffect(() => {\n    autosizeNote(localRef.current);\n  }, [annotation.note]);\n\n  return (\n    <textarea\n      ref={setRef}\n      value={annotation.note}\n      rows={1}\n      maxLength={2048}\n      placeholder=\"Add a note…\"\n      aria-label=\"Note\"\n      className=\"mt-0.5 max-h-40 min-h-8 w-full resize-none overflow-y-auto break-words border-0 bg-transparent px-0 py-1 text-og-sm leading-5 text-og-fg outline-hidden placeholder:text-og-fg-subtle focus-visible:ring-0\"\n      onInput={(event) => {\n        autosizeNote(event.currentTarget);\n        onUpdate(annotation.id, event.currentTarget.value);\n      }}\n      onKeyDown={(event) => {\n        if (event.key !== \"Enter\" || event.shiftKey || event.nativeEvent.isComposing) return;\n        event.preventDefault();\n        event.stopPropagation();\n        if (event.currentTarget.value.trim().length === 0) return;\n        onCommit?.();\n      }}\n    />\n  );\n}\n","import { createContext, useContext, type RefObject } from \"react\";\n\n/** Owning timeline scroller for quote-source navigation. */\nexport const TimelineAnnotationSourceRootContext =\n  createContext<RefObject<HTMLElement | null> | null>(null);\n\nexport function useTimelineAnnotationSourceRoot(): RefObject<HTMLElement | null> | null {\n  return useContext(TimelineAnnotationSourceRootContext);\n}\n"],"mappings":"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","names":[]}

package/dist/{chunk-IOLVN74D.js → chunk-6J56T3MG.js}

@@ -1794,6 +1794,19 @@ function useComposer(sessionId, options = {}) {
   const clearAnnotationReviewTarget = useCallback(() => {
     setAnnotationReviewTargetId(null);
   }, []);
+  const requestAnnotationReview = useCallback((id) => {
+    const current = annotationsRef.current;
+    if (current.length === 0) {
+      setAnnotationReviewTargetId(null);
+      return;
+    }
+    if (id && current.some((annotation) => annotation.id === id)) {
+      setAnnotationReviewTargetId(id);
+      return;
+    }
+    const incomplete = current.find((annotation) => annotation.note.trim().length === 0);
+    setAnnotationReviewTargetId(incomplete?.id ?? current[0].id);
+  }, []);
   const updatePolicy = useCallback(
     (next) => {
       if (targetKeyRef.current !== targetKey) return;
@@ -1941,6 +1954,7 @@ function useComposer(sessionId, options = {}) {
     removeAnnotation,
     annotationReviewTargetId: identityMatches ? annotationReviewTargetId : null,
     clearAnnotationReviewTarget,
+    requestAnnotationReview,
     hasDraftContent,
     send,
     optimisticMessages: visibleOptimisticMessages,
@@ -2073,4 +2087,4 @@ export {
   shouldSubmitOnKey,
   shouldSteerOnKey
 };
-//# sourceMappingURL=chunk-IOLVN74D.js.map
+//# sourceMappingURL=chunk-6J56T3MG.js.map