jaitus 0.3.24 → 0.3.26

package/src/tui-ink.js

@@ -36,6 +36,7 @@ import { readClipboardText, readClipboardImage, shrinkImageFile } from './tui/cl
 import { onSettingsChange } from './config.js';
 import { MASCOT_ROWS, startupTip } from './brand.js';
 import { badgeText, badgeTop, turnShareText } from './planView.js';
+import { createAdSlots, adLineParts } from './adSlots.js';
 
 const h = React.createElement;
 const clamp = (value, min, max) => Math.max(min, Math.min(max, value));
@@ -646,6 +647,23 @@ function WorkBar({ state, width }) {
 
 const truncatePlain = (text, width) => (stringWidth(text) <= width ? text : `${String(text).slice(0, Math.max(1, width - 1))}…`);
 
+/**
+ * The sponsored line, directly above the prompt. Always labelled, always in the quiet
+ * chrome colours, never in the transcript: an ad that could be mistaken for the
+ * assistant, an error or a notice is a disguised advertisement, which is banned (CCPA
+ * Dark Patterns Guidelines, 2023). The domain is underlined and clickable.
+ */
+function AdLine({ ad, width }) {
+  const p = palette();
+  const parts = adLineParts(ad, width - 2);
+  return h(Box, { flexDirection: 'row', paddingX: 1, width },
+    h(Text, { color: p.faint, backgroundColor: p.raised }, ` ${parts.label} `),
+    h(Text, { color: p.muted, wrap: 'truncate-end' }, parts.text ? `  ${parts.text}` : ''),
+    h(Text, { color: p.faint }, `  ${g('·', '-')} `),
+    h(Text, { color: p.faint, underline: true }, parts.domain),
+  );
+}
+
 function Menu({ state, width }) {
   const p = palette();
   if (!state.menu.length) return null;
@@ -940,16 +958,38 @@ function StatusBar({ state, width }) {
  * in order. Guessing it — which is what a constant like `6 + options` was — puts the
  * overlay a few rows off centre and the error grows with the content.
  */
-function dialogHeight(questionRows, previewRows, optionCount) {
+function dialogHeight(questionRows, previewRows, optionCount, detailRows = 0) {
   return 2            // border top + bottom
     + 2               // paddingY
     + 1               // title
     + 1 + questionRows
     + (previewRows ? 1 + previewRows : 0)
     + 1 + optionCount
+    + (detailRows ? 1 + detailRows : 0)
     + 1 + 1;          // gap + hint
 }
 
+/**
+ * The description area under a question's options: the highlighted option's description,
+ * wrapped. Its height is the tallest description's (capped), so the box does not jump as
+ * the highlight moves.
+ */
+function typedTail(text, room) {
+  const chars = [...String(text || '')];
+  const fit = Math.max(6, room);
+  return chars.length <= fit ? chars.join('') : `${g('…', '~')}${chars.slice(-(fit - 1)).join('')}`;
+}
+
+function detailLayout(dialog, inner) {
+  const described = dialog.options.filter((o) => o.description);
+  if (!described.length) return { rows: 0, lines: [] };
+  const rowsFor = (o) => (o.description ? wrapRow([{ t: o.description }], inner).length : 0);
+  const rows = Math.min(4, Math.max(...dialog.options.map(rowsFor)));
+  const current = dialog.options[dialog.index];
+  const lines = current?.description ? wrapRow([{ t: current.description }], inner).slice(0, rows) : [];
+  return { rows, lines };
+}
+
 function Dialog({ state, width, height, hits }) {
   const p = palette();
   const dialog = state.dialog;
@@ -971,11 +1011,20 @@ function Dialog({ state, width, height, hits }) {
   }
   // More options than fit: a window that follows the selection (a picker of 20 sessions
   // or models no longer has to be cut to the 9 that have a number key).
-  const roomForOptions = Math.max(3, height - questionRows - previewRows.length - 12);
+  const detail = detailLayout(dialog, boxWidth - 6);
+  const roomForOptions = Math.max(3, height - questionRows - previewRows.length - (detail.rows ? detail.rows + 1 : 0) - 12);
   const optionCount = Math.min(dialog.options.length, roomForOptions);
   const firstOption = Math.max(0, Math.min(dialog.index - Math.floor(optionCount / 2), dialog.options.length - optionCount));
   const visibleOptions = dialog.options.slice(firstOption, firstOption + optionCount);
-  const rows = dialogHeight(questionRows, previewRows.length, optionCount);
+  const rows = dialogHeight(questionRows, previewRows.length, optionCount, detail.rows);
+  const box = (option) => (dialog.multi && !option.text ? `${dialog.checked?.has(option.value) ? g('☑', '[x]') : g('☐', '[ ]')} ` : '');
+  const hint = dialog.editing
+    ? `enter send  ·  esc back to the options`
+    : dialog.multi
+      ? `${g('↑↓', 'up/dn')} choose  ·  space select  ·  enter confirm  ·  esc close`
+      : `${g('↑↓', 'up/dn')} choose  ·  1-9 jump  ·  enter confirm  ·  esc ${dialog.kind === 'question' ? 'close' : dialog.hideComment ? 'cancel' : 'deny'}`;
+  // Beside the text field only while it leaves room to type; a narrow box keeps it all.
+  const editHint = boxWidth - 6 - 3 - hint.length - 1 >= 20;
   const accent = dialog.tone === 'danger' ? p.red : p.brand;
 
   const top = Math.max(0, Math.round((height - rows) / 2));
@@ -1024,11 +1073,23 @@ function Dialog({ state, width, height, hits }) {
               : (i === visibleOptions.length - 1 && firstOption + optionCount < dialog.options.length) ? ` ${g('↓', 'v')}${dialog.options.length - firstOption - optionCount} more` : '';
             return h(Box, { key: `${option.value}-${index}`, backgroundColor: selected ? p.raised : undefined, flexDirection: 'row' },
               h(Text, { color: selected ? accent : p.muted, bold: selected, wrap: 'truncate-end' },
-                `${selected ? g(' ▸ ', ' > ') : '   '}${index < 9 ? `${index + 1}.` : '  '} ${plain(option.label)}`),
+                `${selected ? g(' ▸ ', ' > ') : '   '}${index < 9 ? `${index + 1}.` : '  '} ${box(option)}${plain(option.label)}`),
               more ? h(Text, { color: p.faint }, more) : null);
           })),
-        h(Box, { marginTop: 1 },
-          h(Text, { color: p.faint }, `${g('↑↓', 'up/dn')} choose  ·  1-9 jump  ·  enter confirm  ·  esc ${dialog.hideComment ? 'cancel' : 'deny'}`)),
+        detail.rows
+          ? h(Box, { marginTop: 1, flexDirection: 'column', height: detail.rows },
+            detail.lines.map((row, index) => h(Row, { key: index, spans: row.map((s) => ({ ...s, color: p.muted })) })))
+          : null,
+        dialog.editing
+          // One row whatever the length: the END of what is being typed is what matters,
+          // so a long answer scrolls left instead of growing the box.
+          ? h(Box, { marginTop: 1, flexDirection: 'row' },
+            h(Text, { color: accent, bold: true }, `${g('›', '>')} `),
+            h(Text, { color: p.text }, `${typedTail(dialog.text, boxWidth - 6 - 3 - (editHint ? hint.length + 1 : 0))}${g('▏', '_')}`),
+            h(Spacer),
+            editHint ? h(Text, { color: p.faint }, ` ${hint}`) : null)
+          : h(Box, { marginTop: 1 },
+            h(Text, { color: p.faint }, hint)),
       ),
     ),
   );
@@ -1077,7 +1138,7 @@ function meterRows(sections, inner, p) {
     }
     rows.push([
       { t: String(s.label || '').padEnd(labelW), color: p.text },
-      { t: String(s.value ?? ''), color: s.tone === 'good' ? p.green : s.tone === 'warn' ? p.yellow : s.tone === 'bad' ? p.red : p.muted },
+      { t: String(s.value ?? ''), color: s.tone === 'good' ? p.green : s.tone === 'warn' ? p.yellow : s.tone === 'bad' ? p.red : s.tone === 'faint' ? p.faint : p.muted },
     ]);
   }
   return rows;
@@ -1238,11 +1299,16 @@ function App({ controller }) {
     + (state.queued.length ? 2 : 0)
     + (liveAttachments(state).length ? 2 : 0);
   const workRows = state.busy || state.status ? 1 : 0;
+  // The sponsored line: only for the work bar / waiting slots, only with room for it, and
+  // never while a dialog or panel covers the screen (it is then not counted as seen).
+  const adSlot = state.adLine && state.adLine.placement !== 'usage' ? state.adLine : null;
+  const adRows = adSlot && !state.dialog && !state.panel && width >= 50 && height >= 16 ? 1 : 0;
+  state._adDrawn = Boolean(adRows);
   // A single pinned line showing what was last asked, while the transcript is scrolled
   // away from it. Scrolling back through a long answer and losing track of the question
   // it was answering is the specific thing this fixes.
   const stickyRows = state.viewingTranscript ? 1 : 0;
-  const transcriptHeight = Math.max(3, height - CHROME.header - CHROME.status - composerRows - workRows - CHROME.gapAboveComposer - stickyRows);
+  const transcriptHeight = Math.max(3, height - CHROME.header - CHROME.status - composerRows - workRows - adRows - CHROME.gapAboveComposer - stickyRows);
   state._transcriptHeight = transcriptHeight;
   state._width = width;
 
@@ -1280,6 +1346,11 @@ function App({ controller }) {
     state._composer = { textTop, textLeft: 6, starts: geo.starts, lens: geo.lens };
     hits.add({ x1: 2, x2: width - 1, y1: textTop, y2: textTop + geo.lines.length - 1, action: { type: 'composer' } });
   }
+  if (adRows) {
+    // The row right above the composer's top border; the domain opens the ad's link.
+    const y = height - CHROME.status - composerRows;
+    hits.add({ x1: 1, x2: width, y1: y, y2: y, action: { type: 'adLink', url: adSlot.ad.url, domain: adSlot.ad.domain } });
+  }
   if (state.menu.length) {
     const menuTop = height - CHROME.status - composerRows + 1;       // inside the composer border
     state.menu.forEach((_item, index) => {
@@ -1298,6 +1369,7 @@ function App({ controller }) {
       : h(Transcript, { state, width, height: transcriptHeight, layout }),
     h(Box, { height: CHROME.gapAboveComposer, flexShrink: 0 }),
     fixed(h(WorkBar, { state, width })),
+    adRows ? fixed(h(AdLine, { ad: adSlot.ad, width })) : null,
     h(Box, { paddingX: 1, flexShrink: 0 }, h(Composer, { state, width: width - 2 })),
     fixed(h(StatusBar, { state, width })),
     h(Panel, { state, width, height, hits }),
@@ -1359,7 +1431,7 @@ function registerHeaderHits(state, width, hits) {
 
 // ─── Controller ─────────────────────────────────────────────────────────────────
 
-export function createTui({ slashCommands = [], fileProvider = null, meta = {}, onModeCycle = null, settings = null } = {}) {
+export function createTui({ slashCommands = [], fileProvider = null, meta = {}, onModeCycle = null, settings = null, ads = null } = {}) {
   publishSettings(settings);
   // Settings changed during the session apply now, not at the next start.
   onSettingsChange((next) => {
@@ -1399,8 +1471,29 @@ export function createTui({ slashCommands = [], fileProvider = null, meta = {},
     plan: null,
     spent: { turns: 0, input: 0, cached: 0, output: 0, credits: 0 },
     meta: { model: 'loading…', mode: 'default', ctx: '0 tok', ctxUsed: 0, ctxMax: 1, intent: 'build', ...meta },
+    // The sponsored line now on screen (adSlots), and whether the last frame drew it.
+    adLine: null,
+    _adDrawn: false,
   };
 
+  // Sponsored lines (adSlots.js). A slot counts as visible only while the last frame drew
+  // it — above the prompt, or inside the /usage panel — with nothing covering it.
+  const adSlots = ads ? createAdSlots({
+    source: ads,
+    isVisible: (slot) => state.active && (slot.placement === 'usage'
+      ? Boolean(state.panel?.adSlot && !state.dialog)
+      : state._adDrawn),
+    onChange: () => {
+      const slot = adSlots?.current() || null;
+      state.adLine = slot;
+      if (slot?.placement === 'usage' && state.panel?.adSlot) {
+        state.panel.meters = [...state.panel.adBase, { gap: true }, { label: 'Sponsored', value: `${slot.ad.text} · ${slot.ad.domain}`, tone: 'faint' }];
+      }
+      notify();
+    },
+  }) : null;
+
+  let adBusyTimer = null;
   let inkInstance = null;
   let update = () => {};
   let pending = null;
@@ -1560,6 +1653,14 @@ export function createTui({ slashCommands = [], fileProvider = null, meta = {},
    * hidden the conversation you were pasting INTO.
    */
   function handlePaste(text) {
+    // A question's answer field is open: the paste is the answer, not composer text
+    // hidden behind the dialog.
+    if (state.dialog?.editing) {
+      const d = state.dialog;
+      d.text = `${d.text}${String(text ?? '').replace(/[\r\n\t]+/g, ' ').replace(/[\x00-\x1f\x7f]/g, '')}`.slice(0, 2000);
+      notifyNow();
+      return;
+    }
     const value = String(text ?? '').replace(/\r\n?/g, '\n');
     // An empty paste is what a terminal sends for its paste key when the clipboard holds
     // only an image — it has no text to give. The image is right there: fetch it.
@@ -1746,6 +1847,35 @@ export function createTui({ slashCommands = [], fileProvider = null, meta = {},
     return match ? state.cursor + match[0].length : state.input.length;
   }
 
+  /** What a dialog resolves with: the option, or for several picks the ticked values. */
+  function dialogAnswer(d, extra = {}) {
+    const option = d.options[d.index];
+    if (!d.multi) return { ...option, comment: d.comment || '', ...extra };
+    const values = d.options.filter((o) => !o.text && d.checked.has(o.value)).map((o) => o.value);
+    return { value: values[0], values, comment: '', ...extra };
+  }
+
+  function toggleDialogOption(d, index) {
+    const option = d.options[index];
+    if (!option || option.text) return;
+    if (d.checked.has(option.value)) d.checked.delete(option.value); else d.checked.add(option.value);
+  }
+
+  /**
+   * An option was picked (number, click, or Enter when `confirm`). The text option opens
+   * the field; with several picks allowed a number or click ticks a box and Enter
+   * confirms — the highlighted one counts when nothing is ticked yet.
+   */
+  function chooseDialogOption(d, index, { confirm = false } = {}) {
+    const option = d.options[index];
+    if (!option) return undefined;
+    if (option.text) { d.editing = true; return notifyNow(); }
+    if (!d.multi) return resolveDialog(dialogAnswer(d));
+    if (!confirm) { toggleDialogOption(d, index); return notifyNow(); }
+    if (!d.checked.size) d.checked.add(option.value);
+    return resolveDialog(dialogAnswer(d));
+  }
+
   function resolveDialog(value) {
     const dialog = state.dialog;
     if (!dialog) return;
@@ -1760,6 +1890,7 @@ export function createTui({ slashCommands = [], fileProvider = null, meta = {},
     if (!panel) return;
     state.panel = null;
     refreshMenu();
+    if (panel.adSlot) adSlots?.want(state.busy ? 'thinking' : 'idle');
     panel.resolve?.();
     notifyNow();
   }
@@ -2052,7 +2183,8 @@ export function createTui({ slashCommands = [], fileProvider = null, meta = {},
         const d = state.dialog;
         if (!d) return;
         d.index = clamp(region.action.index, 0, d.options.length - 1);
-        return resolveDialog({ ...d.options[d.index], comment: d.comment || '' });
+        if (d.editing) { d.editing = false; return notifyNow(); }
+        return chooseDialogOption(d, d.index);
       }
       case 'paletteRow': {
         const panel = state.panel;
@@ -2078,6 +2210,11 @@ export function createTui({ slashCommands = [], fileProvider = null, meta = {},
         return void state.onCommand?.('/model');
       case 'context':
         return void state.onCommand?.('/context');
+      case 'adLink':
+        // Through Jaitus's own link (counted, then sent on); named by the advertiser's
+        // domain, which is what the line showed.
+        if (openUrl(region.action.url)) flash(`Opened ${region.action.domain}`, 'info', 1600);
+        return;
       case 'link':
         // Only http(s) reaches here — see openUrl. A terminal will happily render
         // `file:///` or `javascript:` in text that came from a model or a fetched page,
@@ -2272,16 +2409,35 @@ export function createTui({ slashCommands = [], fileProvider = null, meta = {},
     // ── dialog has the keyboard ──
     if (state.dialog) {
       const d = state.dialog;
+      if (d.editing) {
+        // Esc goes back to the options, not out of the question: closing it would throw
+        // the typed answer away with one key.
+        if (key.escape) { d.editing = false; return notifyNow(); }
+        if (key.return || key.enter) {
+          if (!d.text.trim()) return;
+          return resolveDialog(dialogAnswer(d, { text: d.text.trim() }));
+        }
+        if (key.backspace || key.delete) { d.text = [...d.text].slice(0, -1).join(''); return notifyNow(); }
+        if (input && !key.ctrl && !key.meta) {
+          // A pasted block arrives as one chunk: its line breaks become spaces, and other
+          // control characters (a stray escape sequence) are dropped.
+          d.text = `${d.text}${String(input).replace(/[\r\n\t]+/g, ' ').replace(/[\x00-\x1f\x7f]/g, '')}`.slice(0, 2000);
+          return notifyNow();
+        }
+        return;
+      }
       if (key.escape) return resolveDialog(undefined);
       if (key.upArrow || key.up) { d.index = clamp(d.index - 1, 0, d.options.length - 1); return notifyNow(); }
       if (key.downArrow || key.down) { d.index = clamp(d.index + 1, 0, d.options.length - 1); return notifyNow(); }
-      if (key.return || key.enter) return resolveDialog({ ...d.options[d.index], comment: d.comment || '' });
+      if (d.multi && input === ' ') { toggleDialogOption(d, d.index); return notifyNow(); }
+      if (key.return || key.enter) return chooseDialogOption(d, d.index, { confirm: true });
       if (/^[1-9]$/.test(input)) {
         const index = clamp(Number(input) - 1, 0, d.options.length - 1);
         d.index = index;
         // A number is a decision, not a cursor move: waiting for Enter after it is the
-        // most common reason a permission prompt feels unresponsive.
-        return resolveDialog({ ...d.options[index], comment: d.comment || '' });
+        // most common reason a permission prompt feels unresponsive. With several picks
+        // allowed it ticks the box instead — Enter confirms the set.
+        return chooseDialogOption(d, index);
       }
       return;
     }
@@ -2691,6 +2847,8 @@ export function createTui({ slashCommands = [], fileProvider = null, meta = {},
       state.historyIndex = state.history.length;
       state.active = true;
       seedBanner();
+      // The waiting-line ad, once the first screen has settled — never in the way of it.
+      if (adSlots) { const t = setTimeout(() => { if (state.active && !state.busy) adSlots.want('idle'); }, 1500); t.unref?.(); }
       // `alternateScreen` is not a cosmetic preference — three separate defects came
       // from not passing it.
       //
@@ -2736,6 +2894,8 @@ export function createTui({ slashCommands = [], fileProvider = null, meta = {},
     stop() {
       state.active = false;
       exited = true;
+      clearTimeout(adBusyTimer);
+      adSlots?.stop();
       if (pending) { clearTimeout(pending); pending = null; }
       // Before unmount: the terminal keeps reporting after the process is gone
       // otherwise, and every click in the shell afterwards prints escape codes.
@@ -2870,6 +3030,19 @@ export function createTui({ slashCommands = [], fileProvider = null, meta = {},
       state.busy = !!value;
       if (value) { state.turnStartedAt = Date.now(); state.turnTokens = 0; state.turnCredits = 0; }
       else { state.status = ''; state.turnStartedAt = null; }
+      if (adSlots) {
+        clearTimeout(adBusyTimer);
+        if (value) {
+          // Only work that lasts gets a "thinking" line: an instant command (/help,
+          // /usage) would otherwise fetch one just to throw it away.
+          adBusyTimer = setTimeout(() => { if (state.busy && !state.panel?.adSlot) adSlots.want('thinking'); }, 800);
+          adBusyTimer.unref?.();
+        } else {
+          // /usage runs as a command: its panel is still open when the command ends, and
+          // it keeps its own slot until it is closed.
+          adSlots.want(state.panel?.adSlot ? 'usage' : 'idle');
+        }
+      }
       notifyNow();
     },
     setStatus(value) { state.status = plain(value); notify(); },
@@ -2898,6 +3071,8 @@ export function createTui({ slashCommands = [], fileProvider = null, meta = {},
     addAttachment(attachment) { return attachImage(attachment); },
     /** Attach image files by path, shrinking any that are too big. */
     addImageFiles(files) { return attachImageFiles(files); },
+    /** askDialog shows option descriptions, several picks and a text field itself. */
+    richDialog: true,
     /**
      * The images to send with `line`: only those whose chip is still in it, in the order
      * the chips appear. A chip deleted, cleared with Ctrl+U or never sent is dropped —
@@ -2928,7 +3103,7 @@ export function createTui({ slashCommands = [], fileProvider = null, meta = {},
         state.dialog = {
           question: plain(question),
           options: options.map((option) => (option && typeof option === 'object'
-            ? { label: plain(option.label ?? option.value), value: option.value }
+            ? { label: plain(option.label ?? option.value), value: option.value, description: option.description ? plain(option.description) : '', text: !!option.text }
             : { label: plain(option), value: option })),
           preview: preview.map(plain),
           index: 0,
@@ -2937,6 +3112,12 @@ export function createTui({ slashCommands = [], fileProvider = null, meta = {},
           tone: opts.tone,
           hideComment: opts.hideComment,
           comment: '',
+          // A question (ask_user): several picks, and an option that opens a text field.
+          kind: opts.kind,
+          multi: !!opts.multi,
+          checked: new Set(),
+          editing: false,
+          text: '',
         };
         state.menu = [];
         notifyNow();
@@ -2961,10 +3142,14 @@ export function createTui({ slashCommands = [], fileProvider = null, meta = {},
      * the conversation and Esc closes it: none of it is written into the transcript,
      * where a usage table used to stay for good between the messages.
      */
-    showMeters(title, sections) {
+    showMeters(title, sections, opts = {}) {
       return new Promise((resolve) => {
         if (state.panel?.resolve) { const prev = state.panel.resolve; state.panel = null; prev(null); }
-        state.panel = { title: plain(title), lines: [], meters: sections, rows: null, resolve };
+        // /usage carries the 'usage' sponsored line, appended under the meters when it
+        // arrives (adSlots onChange) and counted only while this panel is open.
+        const adSlot = Boolean(opts.ad === 'usage' && adSlots);
+        state.panel = { title: plain(title), lines: [], meters: sections, rows: null, resolve, adSlot, adBase: sections };
+        if (adSlot) adSlots.want('usage');
         notifyNow();
       });
     },

package/src/tui.js

@@ -2132,6 +2132,10 @@ export function createTui({ slashCommands = [], fileProvider = null, meta = {},
     if (state.dialog) {
       const dialog = state.dialog;
       if (dialog.editing) {
+        // A text question (askText) is answered by Enter and closed by Esc; a decision
+        // comment just stops being edited.
+        if (dialog.textOnly && (name === 'escape' || (key.ctrl && name === 'c'))) { dialog.comment = ''; finishDialog(null); return; }
+        if (dialog.textOnly && (name === 'return' || name === 'enter')) { if ((dialog.comment || '').trim()) finishDialog('send'); return; }
         if (name === 'escape' || (key.ctrl && name === 'c')) { dialog.editing = false; draw(); return; }
         if (name === 'return' || name === 'enter') { dialog.editing = false; draw(); return; }
         if (name === 'backspace') { dialog.comment = (dialog.comment || '').slice(0, -1); draw(); return; }
@@ -2536,6 +2540,18 @@ export function createTui({ slashCommands = [], fileProvider = null, meta = {},
         };
         draw();
       });
+    },
+    /** One line of free text (ask_user's "own words"). Resolves the text, or null. */
+    askText(question, opts = {}) {
+      return new Promise((resolve) => {
+        state.dialog = {
+          question, options: [{ label: 'Send', value: 'send' }], preview: [], index: 0,
+          resolve: (answer) => resolve(answer?.value === 'send' ? answer.comment : null),
+          comment: '', editing: true, textOnly: true,
+          title: opts.title || null, hideComment: false, icon: null, pills: false,
+        };
+        draw();
+      });
     }, redraw: draw,
     setHome(on) { state.home = !!on; draw(); },
     showPanel(title, lines) { return new Promise((resolve) => { state.panel = { title, lines: Array.isArray(lines) ? lines : String(lines).split('\n'), offset: 0, resolve }; draw(); }); },