@adecore/agents-react 0.31.12 → 0.32.0

package/dist/prompts/ui/QuestionBody.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { c as _c } from "react/compiler-runtime";
 import { useEffect, useRef } from 'react';
 import clsx from 'clsx';
 import { useTranslation } from 'react-i18next';
@@ -8,81 +8,277 @@ import { pickPromptChoice } from '../logic/prompts.js';
 import { Icon } from '@adecore/ui';
 import { useChatHost } from '../../host.js';
 /* One question of a request: its choices, "Something else…", or a written answer when it offers no choices. */
-export function QuestionBody({ question, answer, onAnswer, onCommit, locked }) {
-    const host = useChatHost();
-    const { t } = useTranslation('agent-prompts');
-    const AnswerField = host.dictation.Textarea;
-    // The choices, then the "Something else…" field form one list with a single tab stop.
-    const items = useRef([]);
-    const shownQuestion = useRef(question.id);
-    const count = question.choices.length + 1;
-    const chosen = question.choices.findIndex((choice) => !answer.custom && answer.choices.includes(choice.label));
-    const tabStop = chosen !== -1 ? chosen : answer.custom ? question.choices.length : 0;
-    // The focused choice of the question before is gone once the next one shows; the keyboard goes on in this one.
-    useEffect(() => {
-        if (shownQuestion.current === question.id) {
-            return;
-        }
-        shownQuestion.current = question.id;
-        if (document.activeElement === null || document.activeElement === document.body) {
-            (items.current[tabStop] ?? items.current[0])?.focus({ preventScroll: true });
-        }
-    }, [question.id, tabStop]);
-    const onChoiceKeyDown = (event, index, label) => {
-        const action = choiceKey(event.nativeEvent, {
-            multiSelect: question.multiSelect,
-            anyChosen: !answer.custom && answer.choices.length > 0
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function QuestionBody(t0) {
+  const $ = _c(43);
+  const {
+    question,
+    answer,
+    onAnswer,
+    onCommit,
+    locked
+  } = t0;
+  const host = useChatHost();
+  const {
+    t
+  } = useTranslation("agent-prompts");
+  const AnswerField = host.dictation.Textarea;
+  let t1;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t1 = [];
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  const items = useRef(t1);
+  const shownQuestion = useRef(question.id);
+  const count = question.choices.length + 1;
+  let t2;
+  if ($[1] !== answer || $[2] !== question.choices) {
+    let t3;
+    if ($[4] !== answer) {
+      t3 = choice => !answer.custom && answer.choices.includes(choice.label);
+      $[4] = answer;
+      $[5] = t3;
+    } else {
+      t3 = $[5];
+    }
+    t2 = question.choices.findIndex(t3);
+    $[1] = answer;
+    $[2] = question.choices;
+    $[3] = t2;
+  } else {
+    t2 = $[3];
+  }
+  const chosen = t2;
+  const tabStop = chosen !== -1 ? chosen : answer.custom ? question.choices.length : 0;
+  let t3;
+  let t4;
+  if ($[6] !== question.id || $[7] !== tabStop) {
+    t3 = () => {
+      if (shownQuestion.current === question.id) {
+        return;
+      }
+      shownQuestion.current = question.id;
+      if (document.activeElement === null || document.activeElement === document.body) {
+        (items.current[tabStop] ?? items.current[0])?.focus({
+          preventScroll: true
         });
-        if (action === null) {
-            return;
-        }
-        event.preventDefault();
-        if (action.kind === 'move') {
-            items.current[stepIndex(index, count, action.to)]?.focus();
-        }
-        else if (action.kind === 'commit') {
-            onCommit(answer);
-        }
-        else {
-            const next = pickPromptChoice(answer, question, label);
-            onAnswer(next);
-            if (action.kind === 'pick-and-commit') {
-                onCommit(next);
-            }
+      }
+    };
+    t4 = [question.id, tabStop];
+    $[6] = question.id;
+    $[7] = tabStop;
+    $[8] = t3;
+    $[9] = t4;
+  } else {
+    t3 = $[8];
+    t4 = $[9];
+  }
+  useEffect(t3, t4);
+  let onFieldKeyDown;
+  let t5;
+  let t6;
+  let t7;
+  if ($[10] !== AnswerField || $[11] !== answer || $[12] !== count || $[13] !== locked || $[14] !== onAnswer || $[15] !== onCommit || $[16] !== question || $[17] !== t || $[18] !== tabStop) {
+    const onChoiceKeyDown = (event, index, label) => {
+      const action = choiceKey(event.nativeEvent, {
+        multiSelect: question.multiSelect,
+        anyChosen: !answer.custom && answer.choices.length > 0
+      });
+      if (action === null) {
+        return;
+      }
+      event.preventDefault();
+      if (action.kind === "move") {
+        items.current[stepIndex(index, count, action.to)]?.focus();
+      } else {
+        if (action.kind === "commit") {
+          onCommit(answer);
+        } else {
+          const next = pickPromptChoice(answer, question, label);
+          onAnswer(next);
+          if (action.kind === "pick-and-commit") {
+            onCommit(next);
+          }
         }
+      }
     };
-    const onFieldKeyDown = (event) => {
-        const field = event.currentTarget;
-        const action = answerFieldKey(event.nativeEvent, {
-            belowChoices: question.choices.length > 0,
-            caretAtStart: field.selectionStart === 0 && field.selectionEnd === 0,
-            hasText: field.value.trim() !== ''
+    let t8;
+    if ($[23] !== answer || $[24] !== onCommit || $[25] !== question.choices.length) {
+      t8 = event_0 => {
+        const field = event_0.currentTarget;
+        const action_0 = answerFieldKey(event_0.nativeEvent, {
+          belowChoices: question.choices.length > 0,
+          caretAtStart: field.selectionStart === 0 && field.selectionEnd === 0,
+          hasText: field.value.trim() !== ""
         });
-        if (action === null) {
-            return;
-        }
-        event.preventDefault();
-        if (action.kind === 'to-last-choice') {
-            items.current[question.choices.length - 1]?.focus();
+        if (action_0 === null) {
+          return;
         }
-        else if (action.kind === 'commit') {
-            onCommit({ ...answer, custom: true });
+        event_0.preventDefault();
+        if (action_0.kind === "to-last-choice") {
+          items.current[question.choices.length - 1]?.focus();
+        } else {
+          if (action_0.kind === "commit") {
+            onCommit({
+              ...answer,
+              custom: true
+            });
+          }
         }
-    };
-    return (_jsxs("div", { className: "flex flex-col gap-2", children: [question.multiSelect && _jsx("p", { className: "text-xs text-text-muted", children: t('question.multiSelect') }), question.choices.length > 0 && (_jsxs("div", { role: question.multiSelect ? 'group' : 'radiogroup', "aria-label": question.question, className: "flex flex-col gap-2", children: [question.choices.map((choice, index) => {
-                        const selected = !answer.custom && answer.choices.includes(choice.label);
-                        return (_jsxs("button", { ref: (element) => {
-                                items.current[index] = element;
-                            }, type: "button", role: question.multiSelect ? 'checkbox' : 'radio', "aria-checked": selected, tabIndex: index === tabStop ? 0 : -1, "data-prompt-entry": index === tabStop ? '' : undefined, disabled: locked, className: clsx('flex min-h-9 items-start gap-2 rounded-lg border px-3 py-2 text-left disabled:opacity-50', selected ? 'border-accent bg-accent-soft' : 'border-border bg-surface-hover hover:bg-surface-active'), onClick: () => onAnswer(pickPromptChoice(answer, question, choice.label)), onKeyDown: (event) => onChoiceKeyDown(event, index, choice.label), children: [_jsx(Icon, { icon: selected ? CircleCheck : question.multiSelect ? Square : Circle, size: 16, className: "mt-0.5 shrink-0 text-text-muted" }), _jsxs("span", { className: "flex min-w-0 flex-wrap items-baseline gap-x-2", children: [_jsx("span", { className: "text-xs text-text", children: choice.label }), choice.description && _jsx("span", { className: "text-xs text-text-muted", children: choice.description })] })] }, choice.label));
-                    }), _jsxs("label", { className: clsx('flex min-h-9 items-start gap-2 rounded-lg border px-3 py-2 text-left text-xs text-text focus-within:outline-2 focus-within:outline-offset-1 focus-within:outline-accent', answer.custom ? 'border-accent bg-accent-soft' : 'border-border bg-surface-hover', locked && 'opacity-50'), 
-                        // A press picks the row; the keyboard only passing through on its way up or down does not.
-                        onPointerDown: () => {
-                            if (!locked && !answer.custom) {
-                                onAnswer({ ...answer, custom: true });
-                            }
-                        }, children: [_jsx(Icon, { icon: answer.custom ? CircleCheck : Circle, size: 16, className: "mt-0.5 shrink-0" }), _jsx(AnswerField, { ref: (element) => {
-                                    items.current[question.choices.length] = element;
-                                }, rows: 1, tabIndex: tabStop === question.choices.length ? 0 : -1, "data-prompt-entry": tabStop === question.choices.length ? '' : undefined, className: "max-h-40 min-w-0 flex-1 resize-none field-sizing-content bg-transparent outline-none placeholder:text-text-muted", buttonClassName: "-my-1 -mr-1.5", "aria-label": t('question.answerLabel'), placeholder: t('question.somethingElse'), value: answer.text, disabled: locked, onChange: (e) => onAnswer({ ...answer, custom: true, text: e.target.value }), onKeyDown: onFieldKeyDown })] })] })), question.choices.length === 0 && (_jsx(AnswerField, { ref: (element) => {
-                    items.current[0] = element;
-                }, className: "field min-h-20 text-sm", "aria-label": t('question.answerLabel'), placeholder: t('question.answerPlaceholder'), "data-prompt-entry": "", value: answer.text, disabled: locked, onChange: (e) => onAnswer({ ...answer, text: e.target.value }), onKeyDown: onFieldKeyDown }))] }));
-}
+      };
+      $[23] = answer;
+      $[24] = onCommit;
+      $[25] = question.choices.length;
+      $[26] = t8;
+    } else {
+      t8 = $[26];
+    }
+    onFieldKeyDown = t8;
+    t5 = "flex flex-col gap-2";
+    if ($[27] !== question.multiSelect || $[28] !== t) {
+      t6 = question.multiSelect && /*#__PURE__*/_jsx("p", {
+        className: "text-xs text-text-muted",
+        children: t("question.multiSelect")
+      });
+      $[27] = question.multiSelect;
+      $[28] = t;
+      $[29] = t6;
+    } else {
+      t6 = $[29];
+    }
+    t7 = question.choices.length > 0 && /*#__PURE__*/_jsxs("div", {
+      role: question.multiSelect ? "group" : "radiogroup",
+      "aria-label": question.question,
+      className: "flex flex-col gap-2",
+      children: [question.choices.map((choice_0, index_0) => {
+        const selected = !answer.custom && answer.choices.includes(choice_0.label);
+        return /*#__PURE__*/_jsxs("button", {
+          ref: element => {
+            items.current[index_0] = element;
+          },
+          type: "button",
+          role: question.multiSelect ? "checkbox" : "radio",
+          "aria-checked": selected,
+          tabIndex: index_0 === tabStop ? 0 : -1,
+          "data-prompt-entry": index_0 === tabStop ? "" : undefined,
+          disabled: locked,
+          className: clsx("flex min-h-9 items-start gap-2 rounded-lg border px-3 py-2 text-left disabled:opacity-50", selected ? "border-accent bg-accent-soft" : "border-border bg-surface-hover hover:bg-surface-active"),
+          onClick: () => onAnswer(pickPromptChoice(answer, question, choice_0.label)),
+          onKeyDown: event_1 => onChoiceKeyDown(event_1, index_0, choice_0.label),
+          children: [/*#__PURE__*/_jsx(Icon, {
+            icon: selected ? CircleCheck : question.multiSelect ? Square : Circle,
+            size: 16,
+            className: "mt-0.5 shrink-0 text-text-muted"
+          }), /*#__PURE__*/_jsxs("span", {
+            className: "flex min-w-0 flex-wrap items-baseline gap-x-2",
+            children: [/*#__PURE__*/_jsx("span", {
+              className: "text-xs text-text",
+              children: choice_0.label
+            }), choice_0.description && /*#__PURE__*/_jsx("span", {
+              className: "text-xs text-text-muted",
+              children: choice_0.description
+            })]
+          })]
+        }, choice_0.label);
+      }), /*#__PURE__*/_jsxs("label", {
+        className: clsx("flex min-h-9 items-start gap-2 rounded-lg border px-3 py-2 text-left text-xs text-text focus-within:outline-2 focus-within:outline-offset-1 focus-within:outline-accent", answer.custom ? "border-accent bg-accent-soft" : "border-border bg-surface-hover", locked && "opacity-50"),
+        onPointerDown: () => {
+          if (!locked && !answer.custom) {
+            onAnswer({
+              ...answer,
+              custom: true
+            });
+          }
+        },
+        children: [/*#__PURE__*/_jsx(Icon, {
+          icon: answer.custom ? CircleCheck : Circle,
+          size: 16,
+          className: "mt-0.5 shrink-0"
+        }), /*#__PURE__*/_jsx(AnswerField, {
+          ref: element_0 => {
+            items.current[question.choices.length] = element_0;
+          },
+          rows: 1,
+          tabIndex: tabStop === question.choices.length ? 0 : -1,
+          "data-prompt-entry": tabStop === question.choices.length ? "" : undefined,
+          className: "max-h-40 min-w-0 flex-1 resize-none field-sizing-content bg-transparent outline-none placeholder:text-text-muted",
+          buttonClassName: "-my-1 -mr-1.5",
+          "aria-label": t("question.answerLabel"),
+          placeholder: t("question.somethingElse"),
+          value: answer.text,
+          disabled: locked,
+          onChange: e => onAnswer({
+            ...answer,
+            custom: true,
+            text: e.target.value
+          }),
+          onKeyDown: onFieldKeyDown
+        })]
+      })]
+    });
+    $[10] = AnswerField;
+    $[11] = answer;
+    $[12] = count;
+    $[13] = locked;
+    $[14] = onAnswer;
+    $[15] = onCommit;
+    $[16] = question;
+    $[17] = t;
+    $[18] = tabStop;
+    $[19] = onFieldKeyDown;
+    $[20] = t5;
+    $[21] = t6;
+    $[22] = t7;
+  } else {
+    onFieldKeyDown = $[19];
+    t5 = $[20];
+    t6 = $[21];
+    t7 = $[22];
+  }
+  let t8;
+  if ($[30] !== AnswerField || $[31] !== answer || $[32] !== locked || $[33] !== onAnswer || $[34] !== onFieldKeyDown || $[35] !== question.choices.length || $[36] !== t) {
+    t8 = question.choices.length === 0 && /*#__PURE__*/_jsx(AnswerField, {
+      ref: element_1 => {
+        items.current[0] = element_1;
+      },
+      className: "field min-h-20 text-sm",
+      "aria-label": t("question.answerLabel"),
+      placeholder: t("question.answerPlaceholder"),
+      "data-prompt-entry": "",
+      value: answer.text,
+      disabled: locked,
+      onChange: e_0 => onAnswer({
+        ...answer,
+        text: e_0.target.value
+      }),
+      onKeyDown: onFieldKeyDown
+    });
+    $[30] = AnswerField;
+    $[31] = answer;
+    $[32] = locked;
+    $[33] = onAnswer;
+    $[34] = onFieldKeyDown;
+    $[35] = question.choices.length;
+    $[36] = t;
+    $[37] = t8;
+  } else {
+    t8 = $[37];
+  }
+  let t9;
+  if ($[38] !== t5 || $[39] !== t6 || $[40] !== t7 || $[41] !== t8) {
+    t9 = /*#__PURE__*/_jsxs("div", {
+      className: t5,
+      children: [t6, t7, t8]
+    });
+    $[38] = t5;
+    $[39] = t6;
+    $[40] = t7;
+    $[41] = t8;
+    $[42] = t9;
+  } else {
+    t9 = $[42];
+  }
+  return t9;
+}

package/dist/providers/AccountColors.js

@@ -1,8 +1,39 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { c as _c } from "react/compiler-runtime";
 import { AccentSwatches } from '@adecore/ui';
 import { useChatHost } from '../host.js';
 /* The colors an account may wear, the host's palette. */
-export function AccountColors({ value, label, onChange }) {
-    const { all, featured, label: labelOf } = useChatHost().accents;
-    return _jsx(AccentSwatches, { value: value, label: label, accents: all, featured: featured, labelOf: labelOf, onValueChange: onChange });
-}
+import { jsx as _jsx } from "react/jsx-runtime";
+export function AccountColors(t0) {
+  const $ = _c(7);
+  const {
+    value,
+    label,
+    onChange
+  } = t0;
+  const {
+    all,
+    featured,
+    label: labelOf
+  } = useChatHost().accents;
+  let t1;
+  if ($[0] !== all || $[1] !== featured || $[2] !== label || $[3] !== labelOf || $[4] !== onChange || $[5] !== value) {
+    t1 = /*#__PURE__*/_jsx(AccentSwatches, {
+      value: value,
+      label: label,
+      accents: all,
+      featured: featured,
+      labelOf: labelOf,
+      onValueChange: onChange
+    });
+    $[0] = all;
+    $[1] = featured;
+    $[2] = label;
+    $[3] = labelOf;
+    $[4] = onChange;
+    $[5] = value;
+    $[6] = t1;
+  } else {
+    t1 = $[6];
+  }
+  return t1;
+}