@adecore/agents-react 0.31.12 → 0.33.0

package/dist/providers/AccountVariables.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Lock, LockOpen, Plus, X } from 'lucide-react';
@@ -12,34 +11,142 @@ import { Button, FormError, Icon, IconButton, Input, Tooltip } from '@adecore/ui
  * The environment of one account, edited as a whole and saved with one button: a half-typed name or a
  * secret that still has to be retyped would otherwise reach the machine one keystroke at a time.
  */
-export function AccountVariables({ id, account, secretsAvailable }) {
-    const { t } = useTranslation('agent-providers');
-    const scope = useChatScope();
-    const host = useChatHost();
-    const [drafts, setDrafts] = useState(() => draftsOf(account.env));
-    const [saving, setSaving] = useState(false);
-    const changed = variablesChanged(drafts, account.env);
-    const problem = changed ? variablesProblem(drafts) : null;
-    const update = (key, patch) => {
-        setDrafts((current) => current.map((draft) => (draft.key === key ? { ...draft, ...patch } : draft)));
-    };
-    const save = async () => {
-        const env = variablesOf(drafts);
-        const { env: _env, ...rest } = account;
-        setSaving(true);
-        try {
-            await saveAccount(scope, host, id, env.length === 0 ? rest : { ...rest, env });
-        }
-        finally {
-            setSaving(false);
-        }
-    };
-    return (_jsxs(SettingsSection, { title: t('account.variables.title'), description: t('account.variables.description'), action: _jsxs(Button, { variant: "secondary", size: "sm", onClick: () => setDrafts((current) => [...current, emptyDraft(false)]), children: [_jsx(Icon, { icon: Plus, size: 14 }), t('account.variables.add')] }), footer: secretsAvailable ? undefined : t('account.variables.noKeychain'), children: [drafts.length === 0 && _jsx(SettingsRow, { muted: true, label: t('account.variables.none') }), drafts.map((draft, index) => {
-                const name = draft.name.trim() || String(index + 1);
-                const kept = draft.value === '' && draft.sensitive && draft.kept === draft.name.trim();
-                const lockLabel = draft.sensitive ? t('account.variables.unlock', { name }) : t('account.variables.lock', { name });
-                // Off a keychain a value can only be made plain, never secret.
-                const lockDisabled = !secretsAvailable && !draft.sensitive;
-                return (_jsxs("div", { className: "flex min-w-0 items-center gap-2 px-3.5 py-3 font-mono text-code", children: [_jsx(Input, { mono: true, className: "h-7.5 w-47.5 shrink-0 max-[640px]:w-32", value: draft.name, spellCheck: false, autoComplete: "off", "aria-label": t('account.variables.name', { index: index + 1 }), placeholder: "NAME", onChange: (event) => update(draft.key, { name: event.target.value }) }), _jsx("span", { className: "text-text-faint", children: "=" }), _jsx(Input, { mono: true, className: "h-7.5 min-w-0 grow", type: draft.sensitive ? 'password' : 'text', value: draft.value, spellCheck: false, autoComplete: "off", "aria-label": t('account.variables.value', { name }), placeholder: kept ? t('account.variables.kept') : undefined, onChange: (event) => update(draft.key, { value: event.target.value }) }), _jsx(Tooltip, { label: lockDisabled ? t('account.variables.noKeychain') : lockLabel, children: _jsx("span", { className: "inline-flex", children: _jsx(IconButton, { icon: draft.sensitive ? Lock : LockOpen, size: "sm", label: lockLabel, tooltip: false, className: draft.sensitive ? 'text-text' : undefined, "aria-pressed": draft.sensitive, disabled: lockDisabled, onClick: () => update(draft.key, { sensitive: !draft.sensitive }) }) }) }), _jsx(IconButton, { icon: X, size: "sm", label: t('account.variables.remove', { name }), onClick: () => setDrafts((current) => current.filter((other) => other.key !== draft.key)) })] }, draft.key));
-            }), changed && (_jsxs("div", { className: "flex min-w-0 flex-wrap items-center justify-end gap-2 px-4.5 py-3", children: [problem !== null && (_jsx(FormError, { render: _jsx("span", {}), className: "mr-auto", children: problem })), _jsx(Button, { onClick: () => setDrafts(draftsOf(account.env)), children: t('account.variables.discard') }), _jsx(Button, { variant: "primary", disabled: problem !== null || saving, onClick: () => void save(), children: t('common.save') })] }))] }));
-}
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function AccountVariables({
+  id,
+  account,
+  secretsAvailable
+}) {
+  const {
+    t
+  } = useTranslation('agent-providers');
+  const scope = useChatScope();
+  const host = useChatHost();
+  const [drafts, setDrafts] = useState(() => draftsOf(account.env));
+  const [saving, setSaving] = useState(false);
+  const changed = variablesChanged(drafts, account.env);
+  const problem = changed ? variablesProblem(drafts) : null;
+  const update = (key, patch) => {
+    setDrafts(current => current.map(draft => draft.key === key ? {
+      ...draft,
+      ...patch
+    } : draft));
+  };
+  const save = async () => {
+    const env = variablesOf(drafts);
+    const {
+      env: _env,
+      ...rest
+    } = account;
+    setSaving(true);
+    try {
+      await saveAccount(scope, host, id, env.length === 0 ? rest : {
+        ...rest,
+        env
+      });
+    } finally {
+      setSaving(false);
+    }
+  };
+  return /*#__PURE__*/_jsxs(SettingsSection, {
+    title: t('account.variables.title'),
+    description: t('account.variables.description'),
+    action: /*#__PURE__*/_jsxs(Button, {
+      variant: "secondary",
+      size: "sm",
+      onClick: () => setDrafts(current_0 => [...current_0, emptyDraft(false)]),
+      children: [/*#__PURE__*/_jsx(Icon, {
+        icon: Plus,
+        size: 14
+      }), t('account.variables.add')]
+    }),
+    footer: secretsAvailable ? undefined : t('account.variables.noKeychain'),
+    children: [drafts.length === 0 && /*#__PURE__*/_jsx(SettingsRow, {
+      muted: true,
+      label: t('account.variables.none')
+    }), drafts.map((draft_0, index) => {
+      const name = draft_0.name.trim() || String(index + 1);
+      const kept = draft_0.value === '' && draft_0.sensitive && draft_0.kept === draft_0.name.trim();
+      const lockLabel = draft_0.sensitive ? t('account.variables.unlock', {
+        name
+      }) : t('account.variables.lock', {
+        name
+      });
+      // Off a keychain a value can only be made plain, never secret.
+      const lockDisabled = !secretsAvailable && !draft_0.sensitive;
+      return /*#__PURE__*/_jsxs("div", {
+        className: "flex min-w-0 items-center gap-2 px-3.5 py-3 font-mono text-code",
+        children: [/*#__PURE__*/_jsx(Input, {
+          mono: true,
+          className: "h-7.5 w-47.5 shrink-0 max-[640px]:w-32",
+          value: draft_0.name,
+          spellCheck: false,
+          autoComplete: "off",
+          "aria-label": t('account.variables.name', {
+            index: index + 1
+          }),
+          placeholder: "NAME",
+          onChange: event => update(draft_0.key, {
+            name: event.target.value
+          })
+        }), /*#__PURE__*/_jsx("span", {
+          className: "text-text-faint",
+          children: "="
+        }), /*#__PURE__*/_jsx(Input, {
+          mono: true,
+          className: "h-7.5 min-w-0 grow",
+          type: draft_0.sensitive ? 'password' : 'text',
+          value: draft_0.value,
+          spellCheck: false,
+          autoComplete: "off",
+          "aria-label": t('account.variables.value', {
+            name
+          }),
+          placeholder: kept ? t('account.variables.kept') : undefined,
+          onChange: event_0 => update(draft_0.key, {
+            value: event_0.target.value
+          })
+        }), /*#__PURE__*/_jsx(Tooltip, {
+          label: lockDisabled ? t('account.variables.noKeychain') : lockLabel,
+          children: /*#__PURE__*/_jsx("span", {
+            className: "inline-flex",
+            children: /*#__PURE__*/_jsx(IconButton, {
+              icon: draft_0.sensitive ? Lock : LockOpen,
+              size: "sm",
+              label: lockLabel,
+              tooltip: false,
+              className: draft_0.sensitive ? 'text-text' : undefined,
+              "aria-pressed": draft_0.sensitive,
+              disabled: lockDisabled,
+              onClick: () => update(draft_0.key, {
+                sensitive: !draft_0.sensitive
+              })
+            })
+          })
+        }), /*#__PURE__*/_jsx(IconButton, {
+          icon: X,
+          size: "sm",
+          label: t('account.variables.remove', {
+            name
+          }),
+          onClick: () => setDrafts(current_1 => current_1.filter(other => other.key !== draft_0.key))
+        })]
+      }, draft_0.key);
+    }), changed && /*#__PURE__*/_jsxs("div", {
+      className: "flex min-w-0 flex-wrap items-center justify-end gap-2 px-4.5 py-3",
+      children: [problem !== null && /*#__PURE__*/_jsx(FormError, {
+        render: /*#__PURE__*/_jsx("span", {}),
+        className: "mr-auto",
+        children: problem
+      }), /*#__PURE__*/_jsx(Button, {
+        onClick: () => setDrafts(draftsOf(account.env)),
+        children: t('account.variables.discard')
+      }), /*#__PURE__*/_jsx(Button, {
+        variant: "primary",
+        disabled: problem !== null || saving,
+        onClick: () => void save(),
+        children: t('common.save')
+      })]
+    })]
+  });
+}

package/dist/providers/AddAccountForm.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
 import clsx from 'clsx';
 import { useTranslation } from 'react-i18next';
@@ -16,40 +15,128 @@ import { providerAccountsOf } from '../state/provider-accounts.js';
  * A name and a color, asked before anything exists, so the account is made once with both. By default
  * the machine makes the folder; under Advanced a person points at a folder of their own instead.
  */
-export function AddAccountForm({ provider, entries, login, onCancel, onAdded }) {
-    const { t } = useTranslation('agent-providers');
-    const scope = useChatScope();
-    const { accents } = useChatHost();
-    const [name, setName] = useState('');
-    const [color, setColor] = useState(() => freeAccountColor(entries, accents, accents.current()));
-    const [advanced, setAdvanced] = useState(false);
-    const [folder, setFolder] = useState('');
-    const [busy, setBusy] = useState(false);
-    const [error, setError] = useState(null);
-    const label = name.trim();
-    const linking = advanced && folder.trim() !== '';
-    const submit = async (event) => {
-        event.preventDefault();
-        if (label === '' || busy) {
-            return;
-        }
-        setBusy(true);
-        setError(null);
-        try {
-            if (linking) {
-                const taken = new Set(Object.keys(providerAccountsOf(scope.id).accounts?.accounts ?? {}));
-                const id = mintAccountId(provider.kind, label, taken);
-                await linkAccount(scope, id, { kind: provider.kind, label, color, home: folder.trim() });
-                onAdded(id, label, false);
-            }
-            else {
-                onAdded(await createAccount(scope, provider.kind, label, color), label, true);
-            }
-        }
-        catch (e) {
-            setError(e instanceof Error ? e.message : String(e));
-            setBusy(false);
-        }
-    };
-    return (_jsxs("form", { className: "contents", onSubmit: (event) => void submit(event), children: [_jsx(DetailHeader, { mark: _jsx(CliTile, { kind: provider.kind }), title: t('add.title', { provider: provider.name }), subtitle: login === 'chat' ? t('add.chatDescription') : t('add.description') }), _jsxs(SettingsSection, { children: [_jsx(SettingsRow, { label: t('add.name'), control: _jsx(Input, { className: "w-55 max-w-full", value: name, maxLength: 80, autoFocus: true, placeholder: t('add.namePlaceholder'), "aria-label": t('add.name'), onChange: (event) => setName(event.target.value) }) }), _jsx(SettingsRow, { label: t('add.color'), control: _jsx(AccountColors, { value: color, label: t('add.color'), onChange: setColor }) })] }), _jsxs("div", { className: "flex min-w-0 flex-col gap-2.5", children: [_jsxs("button", { type: "button", "aria-expanded": advanced, className: "flex items-center gap-1.5 self-start text-sm font-medium text-text-muted hover:text-text", onClick: () => setAdvanced((open) => !open), children: [_jsx(Icon, { icon: ChevronRight, size: 14, className: clsx('transition-transform', advanced && 'rotate-90') }), t('add.advanced')] }), advanced && (_jsx(SettingsSection, { children: _jsx(SettingsRow, { label: t('add.link.label'), description: t('add.link.description'), children: _jsx(Input, { mono: true, value: folder, spellCheck: false, autoComplete: "off", placeholder: t('add.link.placeholder'), "aria-label": t('add.link.label'), onChange: (event) => setFolder(event.target.value) }) }) }))] }), _jsxs("div", { className: "flex min-w-0 flex-wrap items-center justify-end gap-2", children: [error !== null && (_jsx(FormError, { render: _jsx("span", {}), className: "mr-auto break-words", children: error || t('add.failed') })), _jsx(Button, { onClick: onCancel, children: t('common.cancel') }), _jsx(Button, { type: "submit", variant: "primary", disabled: label === '' || busy, children: linking ? t('add.linkButton') : t('add.create') })] })] }));
-}
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function AddAccountForm({
+  provider,
+  entries,
+  login,
+  onCancel,
+  onAdded
+}) {
+  const {
+    t
+  } = useTranslation('agent-providers');
+  const scope = useChatScope();
+  const {
+    accents
+  } = useChatHost();
+  const [name, setName] = useState('');
+  const [color, setColor] = useState(() => freeAccountColor(entries, accents, accents.current()));
+  const [advanced, setAdvanced] = useState(false);
+  const [folder, setFolder] = useState('');
+  const [busy, setBusy] = useState(false);
+  const [error, setError] = useState(null);
+  const label = name.trim();
+  const linking = advanced && folder.trim() !== '';
+  const submit = async event => {
+    event.preventDefault();
+    if (label === '' || busy) {
+      return;
+    }
+    setBusy(true);
+    setError(null);
+    try {
+      if (linking) {
+        const taken = new Set(Object.keys(providerAccountsOf(scope.id).accounts?.accounts ?? {}));
+        const id = mintAccountId(provider.kind, label, taken);
+        await linkAccount(scope, id, {
+          kind: provider.kind,
+          label,
+          color,
+          home: folder.trim()
+        });
+        onAdded(id, label, false);
+      } else {
+        onAdded(await createAccount(scope, provider.kind, label, color), label, true);
+      }
+    } catch (e) {
+      setError(e instanceof Error ? e.message : String(e));
+      setBusy(false);
+    }
+  };
+  return /*#__PURE__*/_jsxs("form", {
+    className: "contents",
+    onSubmit: event_0 => void submit(event_0),
+    children: [/*#__PURE__*/_jsx(DetailHeader, {
+      mark: /*#__PURE__*/_jsx(CliTile, {
+        kind: provider.kind
+      }),
+      title: t('add.title', {
+        provider: provider.name
+      }),
+      subtitle: login === 'chat' ? t('add.chatDescription') : t('add.description')
+    }), /*#__PURE__*/_jsxs(SettingsSection, {
+      children: [/*#__PURE__*/_jsx(SettingsRow, {
+        label: t('add.name'),
+        control: /*#__PURE__*/_jsx(Input, {
+          className: "w-55 max-w-full",
+          value: name,
+          maxLength: 80,
+          autoFocus: true,
+          placeholder: t('add.namePlaceholder'),
+          "aria-label": t('add.name'),
+          onChange: event_1 => setName(event_1.target.value)
+        })
+      }), /*#__PURE__*/_jsx(SettingsRow, {
+        label: t('add.color'),
+        control: /*#__PURE__*/_jsx(AccountColors, {
+          value: color,
+          label: t('add.color'),
+          onChange: setColor
+        })
+      })]
+    }), /*#__PURE__*/_jsxs("div", {
+      className: "flex min-w-0 flex-col gap-2.5",
+      children: [/*#__PURE__*/_jsxs("button", {
+        type: "button",
+        "aria-expanded": advanced,
+        className: "flex items-center gap-1.5 self-start text-sm font-medium text-text-muted hover:text-text",
+        onClick: () => setAdvanced(open => !open),
+        children: [/*#__PURE__*/_jsx(Icon, {
+          icon: ChevronRight,
+          size: 14,
+          className: clsx('transition-transform', advanced && 'rotate-90')
+        }), t('add.advanced')]
+      }), advanced && /*#__PURE__*/_jsx(SettingsSection, {
+        children: /*#__PURE__*/_jsx(SettingsRow, {
+          label: t('add.link.label'),
+          description: t('add.link.description'),
+          children: /*#__PURE__*/_jsx(Input, {
+            mono: true,
+            value: folder,
+            spellCheck: false,
+            autoComplete: "off",
+            placeholder: t('add.link.placeholder'),
+            "aria-label": t('add.link.label'),
+            onChange: event_2 => setFolder(event_2.target.value)
+          })
+        })
+      })]
+    }), /*#__PURE__*/_jsxs("div", {
+      className: "flex min-w-0 flex-wrap items-center justify-end gap-2",
+      children: [error !== null && /*#__PURE__*/_jsx(FormError, {
+        render: /*#__PURE__*/_jsx("span", {}),
+        className: "mr-auto break-words",
+        children: error || t('add.failed')
+      }), /*#__PURE__*/_jsx(Button, {
+        onClick: onCancel,
+        children: t('common.cancel')
+      }), /*#__PURE__*/_jsx(Button, {
+        type: "submit",
+        variant: "primary",
+        disabled: label === '' || busy,
+        children: linking ? t('add.linkButton') : t('add.create')
+      })]
+    })]
+  });
+}