fix: show file picker empty message below the input line

src/tui/filePicker.js の FilePicker コンポーネントの最後の return ブロックから始めてください。ここでは入力の Text と空メッセージが、1列の Box の中で兄弟要素になっています。src/tui/inputArea.js の pickerOpen 分岐の周辺を確認し、ピッカーが入力パネルをどのように置き換えているかを見てください。TUI で @ と一致しない名前を入力して再現します。入力した内容の下に " No matching files." の行が表示され、tests/unit/tui/filePicker.test.js のテストでその順序が確認できれば完了です。

Summary

When the file picker's @ autocomplete filter matches no files, the "No matching files." empty message is displayed in a way that obscures the input line, so the user cannot see what they typed when they make a typo. The empty message should be positioned below the line the user types on.

Environment

• OS: Linux 7.0.14-19-pve
• Node.js: v25.8.1
• madz version: 1.113.1
• LLM provider: Unknown — user to confirm

Reproduction

Steps to reproduce the behavior:

1. Start the madz TUI.
2. Type @ followed by a typo (e.g., @src/confg where confg does not exist).
3. Observe the file picker shows "No matching files." but the user cannot see what they typed.

Expected Behavior

The "No matching files." empty message is shown below the line the user types on, so the typed input remains visible.

Actual Behavior

The empty message is displayed in a way that obscures the input line — the user cannot see what they typed when there is a typo.

Additional Context

The FilePicker component in src/tui/filePicker.js renders the input line and the empty message in a single column Box. The empty message positioning needs adjustment so it renders below the input line without obscuring the typed text.

Audit Findings (for Issue #1412)

• File: src/tui/filePicker.js — The FilePicker renders its own input line (a Text with before/at/after cursor segments) and the empty message as siblings in a single column Box (flexDirection: "column"). The empty message (" No matching files.") is the second child, so it should stack below the input line. The render block is the return React.createElement(Box, { flexDirection: "column", ... }, <input Text>, <empty message or file list>) near the end of the component.
• File: src/tui/inputArea.js — When pickerOpen is true, the InputPanel is hidden and the FilePicker is rendered in its place (lines ~278). The FilePicker owns the input line while open, so the empty message positioning is entirely within filePicker.js.
• Likely culprit: The empty message is rendered as a sibling of the input Text in the column. If the message is appearing on the same visual line as the input (or the input line is being obscured), the fix is to ensure the empty message is a distinct child rendered below the input line — e.g., wrap the input Text in its own Box row and place the message in a separate row, or add explicit spacing so the message never overlaps the typed text.
• Related: src/tui/commandPicker.js has the same pattern ( No matching commands.) — consider matching its behavior for consistency.

Fix Steps

1. Locate the render — Open src/tui/filePicker.js and find the return React.createElement(Box, { flexDirection: "column", ... }) block near the end of the FilePicker component.
2. Separate the input line — Wrap the input Text (the before/at/after cursor rendering) in its own Box row so it occupies a distinct line.
3. Render the empty message below — Ensure the " No matching files." message is a separate child rendered below the input line, so the typed text remains visible when the filter matches nothing.
4. Add a test — Add a test case in tests/unit/tui/filePicker.test.js (or a render test) that verifies the empty message renders below the input line when the filter has no matches.
5. Verify — Run npm run test and npm run coverage to confirm no regressions.