mixdog 1.2.0 → 1.2.2

package/src/tui/app/transcript-row-estimate.mjs

@@ -20,6 +20,7 @@ import {
 import { isShellTool } from '../../runtime/shared/tool-card-model/shell-surface.mjs';
 import { stripLeadingStatusMarkerFromText } from '../../runtime/shared/tool-card-model/terminal-status.mjs';
 import { readRowsForDisplay } from '../../runtime/shared/read-row-numbers.mjs';
+import { appliedSkillsLine } from '../components/user-message-skills.mjs';
 import { aggregateRawResultForDisplay } from '../session/tool-result-status.mjs';
 import { formatExpandedResult, wrapExpandedResultLines } from '../components/tool-output-format.mjs';
 import {
@@ -100,7 +101,9 @@ function toolDisplayedResultTextForRows(item) {
   const backgroundError = String(bgArgs.error || '');
   const normalizedName = String(normalizeToolName(item?.name) || '').toLowerCase();
   const errorOnlyResult =
-    Boolean(rt) && hasBackgroundMetaForRows(normalizedName, bgArgs, rt) && isBackgroundErrorOnlyBody(rt, backgroundError);
+    Boolean(rt) &&
+    hasBackgroundMetaForRows(normalizedName, bgArgs, rt) &&
+    isBackgroundErrorOnlyBody(rt, backgroundError);
   if (!toolItemPendingForRows(item) && isBackgroundTaskTool(normalizedName)) {
     const meta = parseBackgroundTaskResultForRows(rt);
     if (meta?.hasResponse && String(meta.body || '').trim()) {
@@ -213,8 +216,13 @@ function estimateToolRenderedResultRows(value, { pathArg = '', isShell = false,
 export function estimateTranscriptItemRows(item, columns, toolOutputExpanded, attachedTool = false) {
   if (!item) return 1;
   switch (item.kind) {
-    case 'user':
-      return 1 + estimateWrappedRows(item.text, columns, 4);
+    case 'user': {
+      // UserMessage: marginTop + wrapped text + the applied-skills line.
+      const skillsLine = appliedSkillsLine(item.appliedSkills);
+      return (
+        1 + estimateWrappedRows(item.text, columns, 4) + (skillsLine ? estimateWrappedRows(skillsLine, columns, 4) : 0)
+      );
+    }
     case 'assistant':
       // marginTop={1} (AssistantMessage <Box>) + rendered body height.
       return (

package/src/tui/app/use-prompt-draft-flow.mjs

@@ -9,6 +9,7 @@
 import { useCallback } from 'react';
 import { slashCommandTokenForPaletteAccept } from './slash-commands.mjs';
 import { withPickerEnterLatch } from './picker-enter-latch.mjs';
+import { completeSkillMention } from './skill-mention-palette.mjs';
 import { applyPromptDraftChange } from './use-prompt-draft-flow/draft-change.mjs';
 import { cancelProviderPromptFlow, cancelSettingsPromptFlow } from './use-prompt-draft-flow/prompt-cancels.mjs';
 
@@ -85,9 +86,12 @@ export function usePromptDraftFlow({
   );
 
   const acceptSlashPalette = useCallback(
-    (draftValue = '') => {
+    (draftValue = '', caret) => {
       const command = slashCommands[slashIndex];
       if (!command) return false;
+      // A skill row completes the `$name` mention at the caret (the returned
+      // { value, cursor } replaces the draft) instead of running anything.
+      if (command.kind === 'skill') return completeSkillMention(draftValue, command.name, caret) ?? false;
       return withPickerEnterLatch(pickerOpenedFromEnterRef, pickerOpenedFromEnterTimerRef, () =>
         runSlashCommand(slashCommandTokenForPaletteAccept(command, draftValue), '')
       );
@@ -96,9 +100,10 @@ export function usePromptDraftFlow({
   );
 
   const completeSlashPalette = useCallback(
-    (draftValue = '') => {
+    (draftValue = '', caret) => {
       const command = slashCommands[slashIndex];
       if (!command) return undefined;
+      if (command.kind === 'skill') return completeSkillMention(draftValue, command.name, caret);
       const token = slashCommandTokenForPaletteAccept(command, draftValue);
       return token ? `/${token} ` : undefined;
     },

package/src/tui/app/use-prompt-state.mjs

@@ -7,6 +7,9 @@ import { useRef, useState } from 'react';
 export function usePromptState() {
   const [promptDraft, setPromptDraft] = useState('');
   const [promptDraftOverride, setPromptDraftOverride] = useState(null);
+  // The prompt caret offset as reported by PromptInput (null = end of draft);
+  // the `$name` skill palette reads the mention before it.
+  const [promptCaret, setPromptCaret] = useState(null);
   const promptLayoutValueRef = useRef('');
   const [, setPromptLayoutRows] = useState(1);
   const [textEntryLayoutRows, setTextEntryLayoutRows] = useState(1);
@@ -26,6 +29,8 @@ export function usePromptState() {
     setPromptDraft,
     promptDraftOverride,
     setPromptDraftOverride,
+    promptCaret,
+    setPromptCaret,
     promptLayoutValueRef,
     setPromptLayoutRows,
     textEntryLayoutRows,

package/src/tui/components/Message.jsx

@@ -17,6 +17,7 @@ import { Box, Text } from 'ink';
 import { theme, TURN_MARKER } from '../theme.mjs';
 import { StreamingMarkdown, resetStreamingMarkdownStablePrefix, windowPlainStreamingText } from './Markdown.jsx';
 import { assistantBodyWidth } from '../markdown/table-layout.mjs';
+import { appliedSkillsLine, userTextSegments } from './user-message-skills.mjs';
 
 // `themeEpoch` is a memo-busting prop (threaded from App): the active theme
 // mutates `theme` in-place, so a /theme switch must re-render this memoized row
@@ -66,6 +67,7 @@ export const UserMessage = React.memo(function UserMessage({
   text,
   attached = false,
   columns,
+  appliedSkills,
   themeEpoch: _themeEpoch = 0,
 }) {
   // `attached` = the previous transcript row is also a user message (consecutive
@@ -79,6 +81,10 @@ export const UserMessage = React.memo(function UserMessage({
   // makes Windows Terminal/conhost auto-wrap, which drifts the alt-screen frame
   // and stacks stale gray bands on re-render. One narrower cell is invisible.
   const bandColumns = Math.max(1, columns - 1);
+  // `$name` tokens of the skills this turn applied are marked; the applied
+  // skills are listed on their own line (user-message-skills.mjs).
+  const skillsLine = appliedSkillsLine(appliedSkills);
+  const segments = userTextSegments(text, appliedSkills);
   return (
     <Box
       flexDirection="column"
@@ -89,8 +95,23 @@ export const UserMessage = React.memo(function UserMessage({
       paddingRight={1}
     >
       <Text color={theme.mixdogIvory} wrap="wrap">
-        {text}
+        {segments.length === 1 && !segments[0].mention
+          ? text
+          : segments.map((segment, index) =>
+              segment.mention ? (
+                <Text key={index} color={theme.panelTitle} bold>
+                  {segment.text}
+                </Text>
+              ) : (
+                segment.text
+              )
+            )}
       </Text>
+      {skillsLine ? (
+        <Text color={theme.subtle} wrap="wrap">
+          {skillsLine}
+        </Text>
+      ) : null}
     </Box>
   );
 });

package/src/tui/components/PromptInput.jsx

@@ -24,7 +24,7 @@ import { createVerticalMover } from './prompt-input/edit-chords.mjs';
 import { cancelPromptImmediateFlush, schedulePromptImmediateFlush } from './prompt-input/immediate-render.mjs';
 import { renderSelectedText } from './prompt-input/selected-text.jsx';
 import { IME_LEFT_GUARD_COLUMNS, createCursorAnchor } from './prompt-input/cursor-anchor.mjs';
-import { createPromptKeyHandler } from './prompt-input/key-handler.mjs';
+import { createPromptKeyHandler, paletteResultDraft } from './prompt-input/key-handler.mjs';
 import { createPromptMouseSelection } from './prompt-input/mouse-selection.mjs';
 import { createUndoStack } from './prompt-input/undo-stack.mjs';
 
@@ -37,6 +37,8 @@ export function PromptInput({
   commandPaletteActive = false,
   commandPaletteOpen = commandPaletteActive,
   commandPaletteOptionCount = commandPaletteActive ? 2 : 0,
+  commandPaletteMovesCaret = false,
+  onCaretChange,
   mask = false,
   hint = '',
   hintTone = 'info',
@@ -66,6 +68,7 @@ export function PromptInput({
   const [, bumpCursorAnchorEpoch] = useState(0);
   const draftRef = useRef(draft);
   const lastReportedValueRef = useRef(draft.value);
+  const lastReportedCursorRef = useRef(null);
   // Bumped on every submit/draftOverride replace/unmount so an async paste
   // (clipboard read or onPasteText promise) that resolves after the draft
   // moved on can detect staleness and drop its result instead of mutating
@@ -171,9 +174,20 @@ export function PromptInput({
       lastReportedValueRef.current = next.value;
       onDraftChange?.(next.value);
     }
+    reportCaret(next.cursor);
     if (valueRef) valueRef.current = next.value;
   };
 
+  // The caret offset for caret-aware completion (`$name` skill mentions).
+  function reportCaret(nextCursor) {
+    if (nextCursor === lastReportedCursorRef.current) return;
+    lastReportedCursorRef.current = nextCursor;
+    onCaretChange?.(nextCursor);
+  }
+  // A (re)mounted input starts at the end of its initial value.
+  // biome-ignore lint/correctness/useExhaustiveDependencies: mount-only report
+  useEffect(() => reportCaret(draftRef.current.cursor), []);
+
   const installCursorAnchor = () => {
     if (!boxRef.current || boxRef.current.internal_cursorAnchor) return false;
     // The anchor function itself (box-rect publish + caret math) lives in
@@ -327,8 +341,11 @@ export function PromptInput({
     const current = draftRef.current;
     const next = prefix ? insertText(current, prefix) : current;
     if (commandPaletteActive) {
-      const accepted = onCommandPaletteAccept?.(next.value);
-      if (accepted !== false) {
+      const accepted = onCommandPaletteAccept?.(next.value, next.cursor);
+      const replacement = paletteResultDraft(accepted);
+      if (replacement) {
+        commitDraft(replacement);
+      } else if (accepted !== false) {
         commitDraft({ value: '', cursor: 0, selectionAnchor: null });
       } else if (next !== current) {
         commitDraft(next);
@@ -361,6 +378,7 @@ export function PromptInput({
     commandPaletteActive,
     commandPaletteOpen,
     commandPaletteOptionCount,
+    commandPaletteMovesCaret,
     onCommandPaletteNavigate,
     onCommandPaletteAccept,
     onCommandPaletteCancel,

package/src/tui/components/SlashCommandPalette.jsx

@@ -28,6 +28,7 @@ function queryMatchesAlias(command, query) {
 }
 
 function commandDisplayLabel(command, query) {
+  if (command?.label) return command.label;
   const usage = String(command?.usage || command?.name || '').replace(/^\/+/, '');
   const aliasText =
     command?.showAliasUsage !== false &&
@@ -41,7 +42,15 @@ function commandDisplayLabel(command, query) {
   return `${label}${aliasText}`;
 }
 
-export function SlashCommandPalette({ commands, selectedIndex = 0, title = 'Commands', columns = 80, query = '' }) {
+export function SlashCommandPalette({
+  commands,
+  selectedIndex = 0,
+  title = 'Commands',
+  columns = 80,
+  query = '',
+  description: descriptionText = SLASH_DESCRIPTION,
+  help: helpText = SLASH_HELP,
+}) {
   const total = commands.length;
   const half = Math.floor(MAX_VISIBLE / 2);
   let start = Math.max(0, selectedIndex - half);
@@ -58,9 +67,9 @@ export function SlashCommandPalette({ commands, selectedIndex = 0, title = 'Comm
   const labelWidth = Math.min(COMMAND_LABEL_WIDTH, Math.max(12, Math.floor(columns * 0.45)));
   const descriptionWidth = Math.max(0, columns - labelWidth - 12);
   // Standard panel rhythm: title row, blank, description/hint row, blank, content.
-  const description = truncateText(SLASH_DESCRIPTION, Math.max(0, columns - 4));
+  const description = truncateText(descriptionText, Math.max(0, columns - 4));
   const titleWidth = stringWidth(String(title || ''));
-  const help = truncateText(SLASH_HELP, Math.max(0, columns - titleWidth - 7));
+  const help = truncateText(helpText, Math.max(0, columns - titleWidth - 7));
 
   return (
     <Box flexDirection="column" flexShrink={0} width="100%">

package/src/tui/components/StatusLine.jsx

@@ -19,6 +19,7 @@ function StatusLineView({
   model,
   effort,
   fast,
+  ultra = false,
   cwd,
   stats,
   contextWindow,
@@ -42,6 +43,7 @@ function StatusLineView({
     model,
     effort,
     fast,
+    ultra,
     cwd,
     stats,
     contextWindow,

package/src/tui/components/TranscriptItem.jsx

@@ -80,7 +80,15 @@ export const Item = React.memo(function Item({
   let node = null;
   switch (item.kind) {
     case 'user':
-      node = <UserMessage text={item.text} attached={prevKind === 'user'} columns={columns} themeEpoch={themeEpoch} />;
+      node = (
+        <UserMessage
+          text={item.text}
+          attached={prevKind === 'user'}
+          columns={columns}
+          appliedSkills={item.appliedSkills}
+          themeEpoch={themeEpoch}
+        />
+      );
       break;
     case 'assistant':
       node = (

package/src/tui/components/prompt-input/key-handler.mjs

@@ -42,6 +42,14 @@ function gridSelectionActive(suppressShiftNavRef) {
   return Boolean(suppressShiftNavRef?.current);
 }
 
+// A palette accept/complete may hand back the next draft: a string (caret at
+// its end) or { value, cursor } (a `$name` skill mention completed at the caret).
+export function paletteResultDraft(result) {
+  if (typeof result === 'string') return { value: result, cursor: result.length, selectionAnchor: null };
+  if (typeof result?.value === 'string') return { value: result.value, cursor: result.cursor, selectionAnchor: null };
+  return null;
+}
+
 export function createPromptKeyHandler(ctx) {
   const {
     disabled,
@@ -55,6 +63,7 @@ export function createPromptKeyHandler(ctx) {
     submitDraft,
     commandPaletteActive,
     commandPaletteOptionCount,
+    commandPaletteMovesCaret,
     onCommandPaletteNavigate,
     onCommandPaletteAccept,
     onCommandPaletteComplete,
@@ -177,8 +186,12 @@ export function createPromptKeyHandler(ctx) {
       }
 
       if (commandPaletteActive) {
-        const accepted = onCommandPaletteAccept?.(draftRef.current.value);
-        if (accepted !== false) {
+        const accepted = onCommandPaletteAccept?.(draftRef.current.value, draftRef.current.cursor);
+        // A draft-shaped accept (skill mention completion) replaces the draft.
+        const replacement = paletteResultDraft(accepted);
+        if (replacement) {
+          commitDraft(replacement);
+        } else if (accepted !== false) {
           commitDraft({ value: '', cursor: 0, selectionAnchor: null });
         }
         return;
@@ -276,10 +289,10 @@ export function createPromptKeyHandler(ctx) {
 
     if (key.tab) {
       if (commandPaletteActive) {
-        const completed = onCommandPaletteComplete?.(draftRef.current.value);
-        if (typeof completed === 'string') {
-          commitDraft({ value: completed, cursor: completed.length, selectionAnchor: null });
-        }
+        const completed = paletteResultDraft(
+          onCommandPaletteComplete?.(draftRef.current.value, draftRef.current.cursor)
+        );
+        if (completed) commitDraft(completed);
         return;
       }
       if (onTab?.(draftRef.current.value) === true) return;
@@ -291,7 +304,7 @@ export function createPromptKeyHandler(ctx) {
     }
 
     if (key.leftArrow || rawShiftLeft) {
-      if (commandPaletteActive) {
+      if (commandPaletteActive && !commandPaletteMovesCaret) {
         onCommandPaletteNavigate?.('left');
         return;
       }
@@ -301,7 +314,7 @@ export function createPromptKeyHandler(ctx) {
       return;
     }
     if (key.rightArrow || rawShiftRight) {
-      if (commandPaletteActive) {
+      if (commandPaletteActive && !commandPaletteMovesCaret) {
         onCommandPaletteNavigate?.('right');
         return;
       }

package/src/tui/components/status-line/local-line.mjs

@@ -4,7 +4,7 @@
  */
 import { rgbSgr } from '../../../runtime/shared/statusline/ansi.mjs';
 import { measuredContextUsage, contextMeasurementLabel } from '../../../runtime/shared/context-measurement.mjs';
-import { displayModelName, shortenModelName } from '../../../runtime/shared/model-display.mjs';
+import { displayModelName, effortDisplayLabel, shortenModelName } from '../../../runtime/shared/model-display.mjs';
 import { theme } from '../../theme.mjs';
 import { normalizeStatuslineAnsi } from '../../statusline-ansi-bridge.mjs';
 // Cache-only synchronous read (never touches fs on the render path), so the
@@ -160,6 +160,7 @@ export function localBootStatusLine(args = {}) {
     model = '',
     effort = '',
     fast = false,
+    ultra = false,
     stats = null,
     contextWindow = 0,
     displayContextWindow = 0,
@@ -168,7 +169,9 @@ export function localBootStatusLine(args = {}) {
   const raw = String(model || '').trim();
   const { STATUS, SUBTLE } = statusColors();
   const display = shortenModelName(displayModelName(raw, provider, ''), terminalColumns());
-  const flags = [effort ? String(effort).toUpperCase() : '', fast === true ? 'FAST' : ''].filter(Boolean);
+  let speedLabel = '';
+  if (fast === true) speedLabel = ultra === true ? 'Ultrafast' : 'Fast';
+  const flags = [effort ? effortDisplayLabel(effort) : '', speedLabel].filter(Boolean);
   const modelBits = [display, ...flags].join(` ${SUBTLE}·${RESET} `);
   const ctxPct = measuredContextUsage({
     stats,

package/src/tui/components/status-line/use-statusline-text.mjs

@@ -29,6 +29,7 @@ export function useStatusLineText({
   model,
   effort,
   fast,
+  ultra,
   cwd,
   stats,
   contextWindow,
@@ -52,6 +53,7 @@ export function useStatusLineText({
           model,
           effort,
           fast,
+          ultra,
           stats,
           contextWindow,
           displayContextWindow,
@@ -83,6 +85,7 @@ export function useStatusLineText({
     model,
     effort,
     fast,
+    ultra,
     cwd,
     stats,
     contextWindow,
@@ -180,7 +183,8 @@ export function useStatusLineText({
       prevImmediate.provider !== args.provider ||
       prevImmediate.model !== args.model ||
       prevImmediate.effort !== args.effort ||
-      prevImmediate.fast !== args.fast;
+      prevImmediate.fast !== args.fast ||
+      prevImmediate.ultra !== args.ultra;
     // A theme switch must re-tone the footer immediately: the stored `line`
     // holds already-normalized ANSI with the OLD palette, so re-running
     // normalizeStatusLine on it is a no-op. Force a fresh local rebuild (new
@@ -218,6 +222,7 @@ export function useStatusLineText({
       model: args.model,
       effort: args.effort,
       fast: args.fast,
+      ultra: args.ultra,
       contextWindow: args.contextWindow,
       displayContextWindow: args.displayContextWindow,
       rawContextWindow: args.rawContextWindow,
@@ -299,6 +304,7 @@ export function useStatusLineText({
     model,
     effort,
     fast,
+    ultra,
     cwd,
     statsSignature,
     contextWindow,

package/src/tui/components/user-message-skills.mjs

@@ -0,0 +1,38 @@
+/*
+ * components/user-message-skills.mjs — the skills a user row applied.
+ *
+ * A user transcript row carries `appliedSkills` (the runtime's record of the
+ * skills that turn actually loaded, live or restored). The row marks the
+ * `$name` tokens of exactly those skills — found by the shared mention parser
+ * the runtime and desktop use — and adds one applied-skills line under the
+ * text. The row-height estimate counts that same line.
+ */
+import { skillMentions } from '../../runtime/shared/skill-mentions.mjs';
+
+/** The applied skill names of a row value: non-empty strings only. */
+export function appliedSkillNames(value) {
+  return (Array.isArray(value) ? value : []).filter((name) => typeof name === 'string' && name);
+}
+
+/** The line rendered under a user row, or '' when it applied no skill. */
+export function appliedSkillsLine(value) {
+  const names = appliedSkillNames(value);
+  return names.length ? `Skills applied: ${names.join(', ')}` : '';
+}
+
+/** `text` split into plain and marked spans; only `$name` tokens of applied
+ *  skills are marked, so unknown names, `$HOME` and `$300` stay plain. */
+export function userTextSegments(text, value) {
+  const source = String(text ?? '');
+  const applied = new Set(appliedSkillNames(value));
+  if (!applied.size) return [{ text: source, mention: false }];
+  const segments = [];
+  let at = 0;
+  for (const mention of skillMentions(source, (name) => applied.has(name))) {
+    if (mention.start > at) segments.push({ text: source.slice(at, mention.start), mention: false });
+    segments.push({ text: source.slice(mention.start, mention.end), mention: true });
+    at = mention.end;
+  }
+  if (at < source.length || !segments.length) segments.push({ text: source.slice(at), mention: false });
+  return segments;
+}