@invana/assistant 0.0.34 → 0.0.35

package/dist/index.cjs

@@ -1,6 +1,6 @@
 'use strict';
 
-var React6 = require('react');
+var React7 = require('react');
 var blocks = require('@invana/blocks');
 var ui = require('@invana/ui');
 var jsxRuntime = require('react/jsx-runtime');
@@ -24,7 +24,7 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React6__namespace = /*#__PURE__*/_interopNamespace(React6);
+var React7__namespace = /*#__PURE__*/_interopNamespace(React7);
 
 // src/styles/chat-session.tsx
 function answerToPage(turn) {
@@ -69,7 +69,7 @@ function subscribe(listener) {
   return () => listeners.delete(listener);
 }
 function useCiteFocus(turn, initial) {
-  const pointed = React6__namespace.useSyncExternalStore(
+  const pointed = React7__namespace.useSyncExternalStore(
     subscribe,
     () => focus.get(turn),
     () => void 0
@@ -390,9 +390,9 @@ function stopPatches(spec, now = Date.now()) {
   }
   return patches;
 }
-var ChatSessionContext = React6__namespace.createContext(null);
+var ChatSessionContext = React7__namespace.createContext(null);
 function useChatSessionContext() {
-  const value = React6__namespace.useContext(ChatSessionContext);
+  const value = React7__namespace.useContext(ChatSessionContext);
   if (!value) throw new Error("A ChatSession part was rendered outside <ChatSession>.");
   return value;
 }
@@ -408,32 +408,32 @@ var DEFAULT_ICONS = {
   rateDown: "\u22121"
 };
 function useViewState() {
-  const [steps, setSteps] = React6__namespace.useState({});
-  const [records, setRecords] = React6__namespace.useState({});
-  const [ratings, setRatings] = React6__namespace.useState({});
-  const stepsOpen = React6__namespace.useCallback((turnId, live) => steps[turnId] ?? live, [steps]);
-  const toggleSteps = React6__namespace.useCallback(
+  const [steps, setSteps] = React7__namespace.useState({});
+  const [records, setRecords] = React7__namespace.useState({});
+  const [ratings, setRatings] = React7__namespace.useState({});
+  const stepsOpen = React7__namespace.useCallback((turnId, live) => steps[turnId] ?? live, [steps]);
+  const toggleSteps = React7__namespace.useCallback(
     (turnId, open) => setSteps((prev) => ({ ...prev, [turnId]: open ?? !(prev[turnId] ?? false) })),
     []
   );
-  const recordOpen = React6__namespace.useCallback(
+  const recordOpen = React7__namespace.useCallback(
     (turnId, stepId) => !!records[`${turnId}/${stepId}`],
     [records]
   );
-  const toggleRecord = React6__namespace.useCallback((turnId, stepId, open) => {
+  const toggleRecord = React7__namespace.useCallback((turnId, stepId, open) => {
     const key = `${turnId}/${stepId}`;
     setRecords((prev) => ({ ...prev, [key]: open ?? !prev[key] }));
   }, []);
-  const rating = React6__namespace.useCallback((turnId) => ratings[turnId], [ratings]);
-  const setRating = React6__namespace.useCallback(
+  const rating = React7__namespace.useCallback((turnId) => ratings[turnId], [ratings]);
+  const setRating = React7__namespace.useCallback(
     (turnId, value) => setRatings((prev) => ({ ...prev, [turnId]: value })),
     []
   );
   return { stepsOpen, toggleSteps, recordOpen, toggleRecord, rating, setRating };
 }
 function useClock(fixed, live, every = 250) {
-  const [now, setNow] = React6__namespace.useState(() => fixed ?? Date.now());
-  React6__namespace.useEffect(() => {
+  const [now, setNow] = React7__namespace.useState(() => fixed ?? Date.now());
+  React7__namespace.useEffect(() => {
     if (fixed !== void 0 || !live) return;
     const timer = setInterval(() => setNow(Date.now()), every);
     return () => clearInterval(timer);
@@ -656,7 +656,7 @@ function KeyHints({ running }) {
   ] });
 }
 function useStopKey(running, stop) {
-  React6__namespace.useEffect(() => {
+  React7__namespace.useEffect(() => {
     if (!running) return;
     const onKey = (e) => {
       if (e.key !== "Escape" || e.defaultPrevented) return;
@@ -667,7 +667,175 @@ function useStopKey(running, stop) {
     return () => document.removeEventListener("keydown", onKey);
   }, [running, stop]);
 }
-var ClarifyCard = ui.ClarifyCard;
+function Answered(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      "aria-hidden": "true",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 2.5,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20 6 9 17l-5-5" })
+    }
+  );
+}
+var ClarifyCardGroup = React7__namespace.forwardRef(
+  ({
+    state = "pending",
+    kind = "questions",
+    step,
+    questions,
+    answers: given,
+    onSubmit,
+    typePlaceholder = "Or type your own",
+    collapsible = true,
+    defaultOpen = false,
+    className,
+    ...props
+  }, ref) => {
+    const settled = state !== "pending";
+    const [answers, setAnswers] = React7__namespace.useState(given ?? {});
+    const isAnswered = (q) => !!answers[q.name]?.trim();
+    const [active, setActive] = React7__namespace.useState(
+      () => (questions.find((q) => !given?.[q.name]) ?? questions[0])?.name ?? ""
+    );
+    if (settled) {
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        ui.ClarifyCard,
+        {
+          ref,
+          variant: "inline",
+          state,
+          kind,
+          step,
+          collapsible,
+          defaultOpen,
+          className,
+          questions: questions.map((q) => {
+            const a = given?.[q.name];
+            const picked = q.options?.some((o) => o.value === a);
+            return { ...q, value: picked ? a : void 0, answer: picked ? void 0 : a };
+          }),
+          ...props
+        }
+      );
+    }
+    const index = Math.max(
+      0,
+      questions.findIndex((q) => q.name === active)
+    );
+    const current = questions[index];
+    const answeredCount = questions.filter(isAnswered).length;
+    const ready = questions.every((q) => q.required === false || isAnswered(q));
+    const last = index === questions.length - 1;
+    const answer = (name, value, advance) => {
+      const next = { ...answers, [name]: value };
+      setAnswers(next);
+      if (!advance) return;
+      const after = [...questions.slice(index + 1), ...questions.slice(0, index)];
+      const open = after.find((q) => !next[q.name]?.trim());
+      if (open) setActive(open.name);
+    };
+    const tabs = questions.map((q, i) => ({
+      key: q.name,
+      name: typeof q.title === "string" ? q.title : `Question ${i + 1}`,
+      label: q.title ?? `Q${i + 1}`,
+      icon: isAnswered(q) ? Answered : void 0,
+      iconClassName: "size-3 text-primary"
+    }));
+    const typed = current ? !current.options?.some((o) => o.value === answers[current.name]) : false;
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        "data-state": state,
+        className: ui.cn("flex min-w-0 flex-col gap-2", className),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 items-center gap-1.5", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 font-medium first-letter:uppercase", children: kind }),
+            /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "min-w-0 truncate text-muted-foreground first-letter:uppercase", children: [
+              step != null ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                step,
+                " \xB7 "
+              ] }) : null,
+              answeredCount,
+              " of ",
+              questions.length,
+              " answered"
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ui.NavItems,
+            {
+              items: tabs,
+              selectionMode: "tabs",
+              variant: "underline",
+              overflow: true,
+              activeKey: current?.name,
+              onActiveChange: setActive,
+              className: "border-b border-border"
+            }
+          ),
+          current ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
+            current.question != null ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-medium", children: current.question }) : null,
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Questionnaire, { onSubmit: (e) => e.preventDefault(), children: /* @__PURE__ */ jsxRuntime.jsxs(ui.QuestionnaireItem, { name: current.name, children: [
+              current.options?.length ? /* @__PURE__ */ jsxRuntime.jsx(ui.QuestionnaireChoices, { children: current.options.map((o) => {
+                const checked = answers[current.name] === o.value;
+                return /* @__PURE__ */ jsxRuntime.jsxs(
+                  ui.QuestionnaireChoice,
+                  {
+                    value: o.value,
+                    detail: o.detail,
+                    disabled: o.disabled,
+                    checked,
+                    onChange: () => answer(current.name, o.value, true),
+                    className: "border-transparent",
+                    children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(ui.QuestionnaireChoiceTitle, { children: o.label }),
+                      o.description != null ? /* @__PURE__ */ jsxRuntime.jsx(ui.QuestionnaireChoiceDescription, { children: o.description }) : null
+                    ]
+                  },
+                  o.value
+                );
+              }) }) : null,
+              /* @__PURE__ */ jsxRuntime.jsx(
+                ui.QuestionnaireInput,
+                {
+                  "aria-label": `${typeof current.title === "string" ? current.title : "Answer"} \u2014 your own words`,
+                  placeholder: current.options?.length ? typePlaceholder : "Type your answer",
+                  value: typed ? answers[current.name] ?? "" : "",
+                  onChange: (e) => answer(current.name, e.currentTarget.value, false)
+                }
+              )
+            ] }) })
+          ] }) : null,
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Button,
+              {
+                size: "xs",
+                variant: "ghost",
+                disabled: index === 0,
+                onClick: () => setActive(questions[index - 1]?.name ?? active),
+                children: "Back"
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1" }),
+            !last ? /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "xs", variant: "outline", onClick: () => setActive(questions[index + 1]?.name ?? active), children: "Next" }) : null,
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "xs", disabled: !ready, onClick: () => onSubmit?.(answers), children: "Submit" })
+          ] })
+        ]
+      }
+    );
+  }
+);
+ClarifyCardGroup.displayName = "ClarifyCardGroup";
+var ClarifyCard2 = ui.ClarifyCard;
 var ClarifyFootnote = ui.ClarifyFootnote;
 var ClarifyActions = ui.ClarifyActions;
 
@@ -815,7 +983,7 @@ function AskView({ turn, registry, onEvent, now }) {
   }
   const time = turn.state === "answered" && turn.answeredAt ? relativeTime(turn.answeredAt, now) : void 0;
   return /* @__PURE__ */ jsxRuntime.jsx(
-    ClarifyCard,
+    ClarifyCard2,
     {
       state: turn.state,
       kind: traits.kind,
@@ -1021,15 +1189,15 @@ function ComposerBar({ isRunning: isRunning2, onStop }) {
   const { spec, emit, icons, setComposer } = useChatSessionContext();
   const composer = spec.composer;
   const controls = composer?.controls ?? [];
-  const [draft, setDraft] = React6__namespace.useState("");
-  const [files, setFiles] = React6__namespace.useState([]);
-  const [picks, setPicks] = React6__namespace.useState({});
+  const [draft, setDraft] = React7__namespace.useState("");
+  const [files, setFiles] = React7__namespace.useState([]);
+  const [picks, setPicks] = React7__namespace.useState({});
   const settings = initialSettings(composer);
   for (const c of controls) {
     const pick = picks[c.id];
     if (pick !== void 0 && c.options.some((o) => o.value === pick)) settings[c.id] = pick;
   }
-  const fileInput = React6__namespace.useRef(null);
+  const fileInput = React7__namespace.useRef(null);
   const picked = controls.map((c) => c.options.find((o) => o.value === settings[c.id])).filter(Boolean);
   const placeholder = picked.find((o) => o?.placeholder)?.placeholder ?? composer?.placeholder;
   const mono = picked.some((o) => o?.mono);
@@ -1410,7 +1578,7 @@ function CliSession({ running, onStop, header, onClose, emptyState, className })
 
 // src/styles/types.ts
 var DEFAULT_ANSWER_ACTIONS = ["retry", "copy", "steps", "rate"];
-var TurnLabel = React6__namespace.forwardRef(
+var TurnLabel = React7__namespace.forwardRef(
   ({ align = "start", className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -1543,7 +1711,7 @@ function WebSession({ running, onStop, header, onClose, emptyState, className })
   ] });
 }
 var handlerName = (type) => `on${type.replace(/(^|-)([a-z])/g, (_, __, c) => c.toUpperCase())}`;
-var ChatSession = React6__namespace.forwardRef(function ChatSession2(props, ref) {
+var ChatSession = React7__namespace.forwardRef(function ChatSession2(props, ref) {
   const {
     spec,
     variant = "web",
@@ -1568,49 +1736,49 @@ var ChatSession = React6__namespace.forwardRef(function ChatSession2(props, ref)
   });
   const running = live.turns.some((t) => isAnswer(t) && runOutcome(t) === "live");
   const now = useClock(fixedNow, running);
-  const resolved = React6__namespace.useMemo(() => resolveRegistry(registry), [registry]);
-  const resolvedIcons = React6__namespace.useMemo(() => ({ ...DEFAULT_ICONS, ...icons }), [icons]);
+  const resolved = React7__namespace.useMemo(() => resolveRegistry(registry), [registry]);
+  const resolvedIcons = React7__namespace.useMemo(() => ({ ...DEFAULT_ICONS, ...icons }), [icons]);
   const viewState = useViewState();
-  const [uncontrolledView, setUncontrolledView] = React6__namespace.useState(defaultView);
+  const [uncontrolledView, setUncontrolledView] = React7__namespace.useState(defaultView);
   const view = controlledView ?? uncontrolledView;
-  const root = React6__namespace.useRef(null);
-  const composer = React6__namespace.useRef(null);
-  const setComposer = React6__namespace.useCallback((element) => {
+  const root = React7__namespace.useRef(null);
+  const composer = React7__namespace.useRef(null);
+  const setComposer = React7__namespace.useCallback((element) => {
     composer.current = element;
   }, []);
-  const latest = React6__namespace.useRef(props);
-  const liveRef = React6__namespace.useRef(live);
-  React6__namespace.useLayoutEffect(() => {
+  const latest = React7__namespace.useRef(props);
+  const liveRef = React7__namespace.useRef(live);
+  React7__namespace.useLayoutEffect(() => {
     latest.current = props;
     liveRef.current = live;
   });
-  const emit = React6__namespace.useCallback((event) => {
+  const emit = React7__namespace.useCallback((event) => {
     const handler = latest.current[handlerName(event.type)];
     if (typeof handler === "function") handler(event);
     latest.current.onEvent?.(event);
   }, []);
-  const stop = React6__namespace.useCallback(() => {
+  const stop = React7__namespace.useCallback(() => {
     stopStream();
     emit({ type: "stop" });
   }, [stopStream, emit]);
   useStopKey(running, stop);
-  const setView = React6__namespace.useCallback(
+  const setView = React7__namespace.useCallback(
     (next) => {
       if (latest.current.view === void 0) setUncontrolledView(next);
       latest.current.onViewChange?.(next);
     },
     []
   );
-  const scrollToTurn = React6__namespace.useCallback((turnId) => {
+  const scrollToTurn = React7__namespace.useCallback((turnId) => {
     setTimeout(() => {
       const id = turnDomId(liveRef.current, turnId);
       root.current?.querySelector(`[id="${CSS.escape(id)}"]`)?.scrollIntoView({ block: "start", behavior: "smooth" });
     }, 80);
   }, []);
-  const focusComposer = React6__namespace.useCallback(() => {
+  const focusComposer = React7__namespace.useCallback(() => {
     composer.current?.querySelector("textarea")?.focus();
   }, []);
-  React6__namespace.useImperativeHandle(
+  React7__namespace.useImperativeHandle(
     ref,
     () => ({
       scrollToTurn,
@@ -1660,19 +1828,19 @@ var ChatSession = React6__namespace.forwardRef(function ChatSession2(props, ref)
   return /* @__PURE__ */ jsxRuntime.jsx(ChatSessionContext.Provider, { value: context, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref: root, "data-variant": variant, className: "contents", children: variant === "cli" ? /* @__PURE__ */ jsxRuntime.jsx(CliSession, { ...shared }) : /* @__PURE__ */ jsxRuntime.jsx(WebSession, { ...shared }) }) });
 });
 function useChatSession(initial) {
-  const [spec, setSpec] = React6__namespace.useState(initial);
-  const current = React6__namespace.useRef(spec);
-  const controllers = React6__namespace.useRef(/* @__PURE__ */ new Set());
-  const [streams, setStreams] = React6__namespace.useState(0);
-  const set2 = React6__namespace.useCallback((next) => {
+  const [spec, setSpec] = React7__namespace.useState(initial);
+  const current = React7__namespace.useRef(spec);
+  const controllers = React7__namespace.useRef(/* @__PURE__ */ new Set());
+  const [streams, setStreams] = React7__namespace.useState(0);
+  const set2 = React7__namespace.useCallback((next) => {
     current.current = next;
     setSpec(next);
   }, []);
-  const apply = React6__namespace.useCallback(
+  const apply = React7__namespace.useCallback(
     (patch) => set2(applyPatches(current.current, Array.isArray(patch) ? patch : [patch])),
     [set2]
   );
-  const run = React6__namespace.useCallback(
+  const run = React7__namespace.useCallback(
     async (open) => {
       const controller = new AbortController();
       controllers.current.add(controller);
@@ -1690,8 +1858,8 @@ function useChatSession(initial) {
     },
     [set2]
   );
-  const stream = React6__namespace.useCallback((source) => run(() => source), [run]);
-  const play = React6__namespace.useCallback(
+  const stream = React7__namespace.useCallback((source) => run(() => source), [run]);
+  const play = React7__namespace.useCallback(
     (script, options) => run((signal) => playScript(script, { ...options, signal })),
     [run]
   );
@@ -1699,25 +1867,25 @@ function useChatSession(initial) {
     for (const c of controllers.current) c.abort();
     controllers.current.clear();
   };
-  const stop = React6__namespace.useCallback(() => {
+  const stop = React7__namespace.useCallback(() => {
     abortAll();
     set2(applyPatches(current.current, stopPatches(current.current)));
   }, [set2]);
-  const reset = React6__namespace.useCallback(
+  const reset = React7__namespace.useCallback(
     (next) => {
       abortAll();
       set2(next);
     },
     [set2]
   );
-  React6__namespace.useEffect(() => () => abortAll(), []);
+  React7__namespace.useEffect(() => () => abortAll(), []);
   return { spec, apply, stream, play, stop, reset, streaming: streams > 0, running: isRunning(spec) };
 }
 function ChatSessionTurn({ turn, onEvent, registry, now }) {
-  const resolved = React6__namespace.useMemo(() => resolveRegistry(registry), [registry]);
+  const resolved = React7__namespace.useMemo(() => resolveRegistry(registry), [registry]);
   const view = useViewState();
-  const [clock] = React6__namespace.useState(() => now ?? Date.now());
-  const emit = React6__namespace.useCallback((event) => onEvent?.(event), [onEvent]);
+  const [clock] = React7__namespace.useState(() => now ?? Date.now());
+  const emit = React7__namespace.useCallback((event) => onEvent?.(event), [onEvent]);
   const context = {
     spec: { id: `turn-${turn.id}`, turns: [turn] },
     registry: resolved,
@@ -1964,7 +2132,8 @@ exports.ChatSessionTaskRow = ChatSessionTaskRow;
 exports.ChatSessionTurn = ChatSessionTurn;
 exports.CitationMarker = CitationMarker;
 exports.ClarifyActions = ClarifyActions;
-exports.ClarifyCard = ClarifyCard;
+exports.ClarifyCard = ClarifyCard2;
+exports.ClarifyCardGroup = ClarifyCardGroup;
 exports.ClarifyFootnote = ClarifyFootnote;
 exports.DEFAULT_ANSWER_ACTIONS = DEFAULT_ANSWER_ACTIONS;
 exports.EVENT_TYPES = EVENT_TYPES;