# @rezamonangg/pi-code-preview

> **Pi** extension that renders the last assistant response as a compact, theme-aware markdown and code preview widget above the editor.

[Pi](https://pi.earendil.works) is a terminal UI (TUI) coding agent. When you install this extension, every assistant turn is followed by a clean, syntax-highlighted preview panel so you can read code and formatted output without wading through raw markdown fences.

## Install

From the repository root:

```bash
pi install .
```

For worktree testing (install the package directory, not the repository root):

```bash
pi install ~/Projects/Code/Personal/monang/pi-code-preview/.worktree/fix/border-alignment-and-readme
```

Then reload Pi:

```text
/reload
```

## What it does

- Shows a preview widget **above the editor** after each assistant turn.
- Hides raw markdown code fences in the preview widget.
- Renders fenced code blocks with Pi's native `highlightCode()` using your active theme colors.
- Styles headings, lists, blockquotes, horizontal rules, links, inline code, and bold text.
- Avoids external ANSI renderers (e.g. `glow`) so tmux/widget rendering stays reliable.
- Clears the preview at the start of the next turn.

## Usage

No command required. Once installed and reloaded, send any prompt that returns markdown or a fenced code block. The transcript stays unchanged, while the preview widget renders a cleaner version above the editor.

Example response content:

````markdown
## Example

```ts
function greet(name: string): string {
  return `Hello, ${name}`;
}
```
````

## Known limits

- Original assistant message remains in the transcript; Pi core does not let an extension hide already-streamed markdown fences there.
- Preview is line-limited to keep the editor usable.
- Tables are shown as wrapped text, not full table layout.
- Very long code lines are truncated to fit the widget width.