Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

feat: add slash-command autocomplete and multi-line editor mode to TUI input

Closed
  • Is something wrong?
#1,356 1 comment 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

A pull request for this has already been merged.

  • #1368 by @avoidwork — merged

Assessment

Difficulty
4/5
Estimated time
3-5 days
Newbie friendliness
25/100
Issue type
Feature
Clarity
Mostly clear
Activity status
Active
Tech stack
javascript
Domain
cli

Research direction

Start in src/tui/filePicker.js (deriveFilter, shouldOpenPicker) and src/tui/inputArea.js, which gates the picker, then check how src/tui/app.js renders InputArea. The body still contains an unfilled ${CURRENT_BODY} placeholder, so the original request is missing and the scope should be confirmed first. Done means / opens a command picker that Tab completes, and a multi-line editor mode is reachable from the input.

Written by the indexing model from the issue text.

Description

feature

${CURRENT_BODY}

Audit Findings (for Issue #1356)

  • src/tui/commandParser.js — CommandParser holds the dispatch table in a private #dispatch Map, populated in the constructor via #register(). Exposes listCommands() (returns registered command names, excluding internal _-prefixed keys) and hasCommand(name). This is the source for slash-command autocomplete. Note: parse() also routes skill invocations via context._skillList, so autocomplete should include skills as well as registered commands.
  • src/tui/filePicker.js — The @ file-path autocomplete pattern to mirror. Exports deriveFilter(value, cursor), shouldOpenPicker(value), replaceToken(value, tokenStart, tokenEnd, path), sortFiles(files), and the FilePicker component. The deriveFilter word-boundary logic is the template for a /-prefix command filter.
  • src/tui/inputPanel.js — Thin wrapper over ink-text-input's TextInput (single-line input). Multi-line editor mode would need a mode toggle here or in inputArea.js.
  • src/tui/inputArea.js — Owns inputText state and the pickerOpen gate (via shouldOpenPicker). Renders either InputPanel or FilePicker based on pickerOpen. This is the integration point for both features. The command list would need to be passed in as a prop (e.g., commandList) since InputArea does not currently receive the CommandParser instance.
  • src/tui/app.js:75 and src/tui/conversationArea.js:109 — Both instantiate new CommandParser(). app.js is where InputArea is rendered; the command list from parser.listCommands() would need to be threaded down to InputArea.

Fix Steps

  1. Expose command list to InputArea — In app.js, pass commandList={parser.listCommands()} (and optionally the skill list) to InputArea. Add a commandList prop to InputArea.
  2. Add a command filter helper — Add a deriveCommandFilter(value, cursor) (or similar) mirroring deriveFilter in filePicker.js, but triggering on / instead of @. Export shouldOpenCommandPicker(value).
  3. Create a CommandPicker component — Mirror FilePicker with a CommandPicker that filters commandList by prefix and renders suggestions. Wire Tab-completion to accept a suggestion.
  4. Wire the gate in InputArea — Add a commandPickerOpen state and a useEffect gate mirroring the pickerOpen logic, rendering CommandPicker when a / trigger token is present.
  5. Add multi-line editor mode — Add a mode toggle (e.g., Ctrl+E) that spawns $EDITOR via child_process.spawn, reads the saved content, and calls handleSubmit. Handle $EDITOR unset and non-zero exit.
  6. Write tests — Add unit tests for the command filter and editor-mode spawn logic; add integration coverage for the picker gate.
  7. Verify — Run npm run test, npm run lint, and npm run coverage to confirm everything passes.
Dominant language
JavaScript
Stars
2
Forks
0
Avg merge
1h 15m
Merged PRs (30d)
237

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from avoidwork/madz

All issues in avoidwork/madz

Similar issues

More JavaScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.