@kolisachint/hoocode-tui 0.5.66 → 0.5.68

package/dist/components/editor.js

@@ -3,7 +3,8 @@ import { decodePrintableKey, matchesKey } from "../keys.js";
 import { KillRing } from "../kill-ring.js";
 import { CURSOR_MARKER } from "../tui.js";
 import { UndoStack } from "../undo-stack.js";
-import { getSegmenter, isPunctuationChar, isWhitespaceChar, truncateToWidth, visibleWidth } from "../utils.js";
+import { getSegmenter, isPunctuationChar, isWhitespaceChar, visibleWidth } from "../utils.js";
+import { DEFAULT_FRAME_BORDER_CHARS, renderFrameEdge, } from "./frame.js";
 import { SelectList } from "./select-list.js";
 const baseSegmenter = getSegmenter();
 /** Regex matching paste markers like `[paste #1 +123 lines]` or `[paste #2 1234 chars]`. */
@@ -170,23 +171,7 @@ export function wordWrapLine(line, maxWidth, preSegmented) {
     }
     return chunks;
 }
-export const DEFAULT_EDITOR_BORDER_CHARS = {
-    horizontal: "─",
-    vertical: "│",
-    topLeft: "┌",
-    topRight: "┐",
-    bottomLeft: "└",
-    bottomRight: "┘",
-};
-/** Border cells kept between the label and the top-right corner, so it reads as inset rather than jammed. */
-const LABEL_RIGHT_INSET = 2;
-/**
- * Border cells required to the *left* of the label. Below this the label is
- * dropped rather than drawn: a label butting straight up against the scroll
- * indicator reads as one run-on string, and a border with no run of border in it
- * has stopped looking like a border.
- */
-const MIN_LABEL_LEAD_IN = 4;
+export const DEFAULT_EDITOR_BORDER_CHARS = DEFAULT_FRAME_BORDER_CHARS;
 const SLASH_COMMAND_SELECT_LIST_LAYOUT = {
     minPrimaryColumnWidth: 12,
     maxPrimaryColumnWidth: 32,
@@ -385,45 +370,23 @@ export class Editor {
      * @param box - Whether to draw corners
      */
     renderBorder(edge, hidden, barWidth, box) {
-        const chars = this.borderChars;
-        let indicator = "";
-        if (hidden > 0) {
-            const arrow = edge === "top" ? "↑" : "↓";
-            indicator = `${chars.horizontal.repeat(3)} ${arrow} ${hidden} more `;
-        }
-        const indicatorWidth = visibleWidth(indicator);
-        // The label rides on the top border only, and yields to the scroll
-        // indicator: the indicator says the text is longer than the box, which the
-        // reader needs *now*, while the label says which session this is, which
-        // they can also read in the footer.
-        const label = edge === "top" ? this.topBorderLabel : undefined;
-        const leadIn = label ? barWidth - indicatorWidth - visibleWidth(label.plain) - LABEL_RIGHT_INSET : -1;
-        let bar;
-        if (label && leadIn >= MIN_LABEL_LEAD_IN) {
-            bar =
-                this.borderColor(indicator + chars.horizontal.repeat(leadIn)) +
-                    label.styled +
-                    this.borderColor(chars.horizontal.repeat(LABEL_RIGHT_INSET));
-        }
-        else if (indicatorWidth > 0) {
-            const remaining = barWidth - indicatorWidth;
-            bar = this.borderColor(remaining >= 0 ? indicator + chars.horizontal.repeat(remaining) : truncateToWidth(indicator, barWidth));
-        }
-        else {
-            bar = this.borderColor(chars.horizontal.repeat(barWidth));
-        }
-        if (!box)
-            return bar;
-        // Corners must stay aligned, so pad back any width lost to truncation.
-        bar += this.borderColor(chars.horizontal.repeat(Math.max(0, barWidth - visibleWidth(bar))));
-        const left = edge === "top" ? chars.topLeft : chars.bottomLeft;
-        const right = edge === "top" ? chars.topRight : chars.bottomRight;
-        return this.borderColor(left) + bar + this.borderColor(right);
+        return renderFrameEdge({
+            edge,
+            barWidth,
+            box,
+            chars: this.borderChars,
+            color: this.borderColor,
+            label: this.topBorderLabel,
+            hidden,
+        });
     }
     render(width) {
         // Box mode needs 2 columns for the side borders plus at least 1 content
         // column; below that it degrades to rule mode rather than overflowing.
         const box = this.border === "box" && width >= 4;
+        // `none` is for an editor nested in a frame that already rules it: the
+        // rows are the same, the two horizontals are simply not drawn.
+        const bare = this.border === "none";
         const borderWidth = box ? 1 : 0;
         const innerWidth = Math.max(1, width - borderWidth * 2);
         const maxPadding = Math.max(0, Math.floor((innerWidth - 1) / 2));
@@ -466,7 +429,8 @@ export class Editor {
         const leftPadding = " ".repeat(paddingX);
         const rightPadding = leftPadding;
         // Render top border (with scroll indicator if scrolled down)
-        result.push(this.renderBorder("top", this.scrollOffset, barWidth, box));
+        if (!bare)
+            result.push(this.renderBorder("top", this.scrollOffset, barWidth, box));
         // Render each visible layout line
         // Emit hardware cursor marker only when focused and not showing autocomplete
         const emitCursorMarker = this.focused && !this.autocompleteState;
@@ -516,7 +480,8 @@ export class Editor {
         }
         // Render bottom border (with scroll indicator if more content below)
         const linesBelow = layoutLines.length - (this.scrollOffset + visibleLines.length);
-        result.push(this.renderBorder("bottom", linesBelow, barWidth, box));
+        if (!bare)
+            result.push(this.renderBorder("bottom", linesBelow, barWidth, box));
         // Add autocomplete list if active
         if (this.autocompleteState && this.autocompleteList) {
             const autocompleteResult = this.autocompleteList.render(contentWidth);
@@ -583,6 +548,10 @@ export class Editor {
             this.undo();
             return;
         }
+        if (kb.matches(data, "tui.editor.redo")) {
+            this.redo();
+            return;
+        }
         // Handle autocomplete mode
         if (this.autocompleteState && this.autocompleteList) {
             if (kb.matches(data, "tui.select.cancel")) {
@@ -1744,10 +1713,18 @@ export class Editor {
         this.undoStack.push(this.state);
     }
     undo() {
-        this.historyIndex = -1; // Exit history browsing mode
-        const snapshot = this.undoStack.pop();
+        // `undo` rather than `pop`: the stack needs the state being left in order
+        // to have somewhere to bring you back to.
+        this.applySnapshot(this.undoStack.undo(this.state));
+    }
+    redo() {
+        this.applySnapshot(this.undoStack.redo(this.state));
+    }
+    /** Shared by undo and redo: both replace the state and settle the editor. */
+    applySnapshot(snapshot) {
         if (!snapshot)
             return;
+        this.historyIndex = -1; // Exit history browsing mode
         Object.assign(this.state, snapshot);
         this.lastAction = null;
         this.preferredVisualCol = null;
@@ -1988,7 +1965,7 @@ export class Editor {
         if (bestMatchIndex >= 0) {
             this.autocompleteList.setSelectedIndex(bestMatchIndex);
         }
-        this.autocompleteState = state;
+        this.setAutocompleteState(state);
     }
     cancelAutocompleteRequest() {
         this.autocompleteStartToken += 1;
@@ -2000,14 +1977,33 @@ export class Editor {
         this.autocompleteAbort = undefined;
     }
     clearAutocompleteUi() {
-        this.autocompleteState = null;
+        this.setAutocompleteState(null);
         this.autocompleteList = undefined;
         this.autocompletePrefix = "";
     }
+    /**
+     * The one place the list's presence changes, so it is the one place that can
+     * announce it.
+     *
+     * Suggestions arrive from an async provider, which is why a caller cannot
+     * just look after handling a keystroke: on the keypress that opens the list
+     * the state is still null, and if that keypress was the last one — `/mod`
+     * then a pause — nothing ever looks again. Anyone lending the list screen
+     * space has to hear about it when it actually happens.
+     */
+    setAutocompleteState(state) {
+        const was = this.autocompleteState !== null;
+        this.autocompleteState = state;
+        const now = state !== null;
+        if (was !== now)
+            this.onAutocompleteVisibilityChange?.(now);
+    }
     cancelAutocomplete() {
         this.cancelAutocompleteRequest();
         this.clearAutocompleteUi();
     }
+    /** Called when the completion list appears or disappears. */
+    onAutocompleteVisibilityChange;
     isShowingAutocomplete() {
         return this.autocompleteState !== null;
     }