esp32tool 1.6.4 → 1.6.5

package/dist/console.d.ts

@@ -4,10 +4,14 @@ export declare class ESP32ToolConsole {
     private cancelConnection?;
     private containerElement;
     private allowInput;
+    private commandHistory;
+    private historyIndex;
+    private currentInput;
     constructor(port: SerialPort, containerElement: HTMLElement, allowInput?: boolean);
     logs(): string;
     init(): Promise<void>;
     private _connect;
+    private _navigateHistory;
     private _sendCommand;
     clear(): void;
     reset(): Promise<void>;

package/dist/console.js

@@ -1,7 +1,12 @@
 import { ColoredConsole, coloredConsoleStyles } from "./util/console-color.js";
 import { LineBreakTransformer } from "./util/line-break-transformer.js";
+import { TimestampTransformer } from "./util/timestamp-transformer.js";
 export class ESP32ToolConsole {
     constructor(port, containerElement, allowInput = true) {
+        // Command history buffer
+        this.commandHistory = [];
+        this.historyIndex = -1;
+        this.currentInput = "";
         this.port = port;
         this.containerElement = containerElement;
         this.allowInput = allowInput;
@@ -137,6 +142,20 @@ export class ESP32ToolConsole {
                     ev.stopPropagation();
                     this._sendCommand();
                 }
+                else if (ev.key === "ArrowUp") {
+                    ev.preventDefault();
+                    this._navigateHistory(1, input);
+                }
+                else if (ev.key === "ArrowDown") {
+                    ev.preventDefault();
+                    this._navigateHistory(-1, input);
+                }
+                else {
+                    // User is editing — reset history navigation to live input
+                    if (this.historyIndex !== -1) {
+                        this.historyIndex = -1;
+                    }
+                }
             });
         }
         // Start connection
@@ -174,10 +193,10 @@ export class ESP32ToolConsole {
                 signal: abortSignal,
             })
                 .pipeThrough(new TransformStream(new LineBreakTransformer()))
+                .pipeThrough(new TransformStream(new TimestampTransformer()))
                 .pipeTo(new WritableStream({
                 write: (chunk) => {
-                    const cleaned = chunk.replace(/\r\n$/, "\n");
-                    this.console.addLine(cleaned);
+                    this.console.addLine(chunk);
                 },
             }));
             if (!abortSignal.aborted) {
@@ -196,9 +215,42 @@ export class ESP32ToolConsole {
             console.log("Finished console read loop");
         }
     }
+    _navigateHistory(direction, input) {
+        if (this.commandHistory.length === 0)
+            return;
+        // Save current unsent input before navigating away
+        if (this.historyIndex === -1) {
+            this.currentInput = input.value;
+        }
+        const nextIndex = this.historyIndex + direction;
+        if (nextIndex < 0) {
+            // Back to unsent draft
+            this.historyIndex = -1;
+            input.value = this.currentInput;
+        }
+        else if (nextIndex < this.commandHistory.length) {
+            this.historyIndex = nextIndex;
+            input.value = this.commandHistory[this.historyIndex];
+        }
+        // Move cursor to end
+        const len = input.value.length;
+        input.setSelectionRange(len, len);
+    }
     async _sendCommand() {
         const input = this.containerElement.querySelector(".esp32tool-console-input");
         const command = input.value;
+        if (command.trim() !== "") {
+            // Avoid consecutive duplicates, cap at 100
+            if (this.commandHistory[0] !== command) {
+                this.commandHistory.unshift(command);
+                if (this.commandHistory.length > 100) {
+                    this.commandHistory.pop();
+                }
+            }
+        }
+        // Reset history navigation state
+        this.historyIndex = -1;
+        this.currentInput = "";
         if (!this.port.writable) {
             this.console.addLine("Terminal disconnected: port not writable");
             return;

package/dist/util/console-color.d.ts

@@ -6,14 +6,19 @@ interface ConsoleState {
     foregroundColor: string | null;
     backgroundColor: string | null;
     carriageReturn: boolean;
+    lines: string[];
     secret: boolean;
+    blink: boolean;
+    rapidBlink: boolean;
 }
 export declare class ColoredConsole {
     targetElement: HTMLElement;
     state: ConsoleState;
     constructor(targetElement: HTMLElement);
     logs(): string;
+    processLine(line: string): Element;
+    processLines(): void;
     addLine(line: string): void;
 }
-export declare const coloredConsoleStyles = "\n  .log {\n    flex: 1;\n    background-color: #1c1c1c;\n    font-family: \"SFMono-Regular\", Consolas, \"Liberation Mono\", Menlo, Courier,\n      monospace;\n    font-size: 12px;\n    padding: 16px;\n    overflow: auto;\n    line-height: 1.45;\n    border-radius: 3px;\n    white-space: pre-wrap;\n    overflow-wrap: break-word;\n    color: #ddd;\n  }\n\n  .log-bold {\n    font-weight: bold;\n  }\n  .log-italic {\n    font-style: italic;\n  }\n  .log-underline {\n    text-decoration: underline;\n  }\n  .log-strikethrough {\n    text-decoration: line-through;\n  }\n  .log-underline.log-strikethrough {\n    text-decoration: underline line-through;\n  }\n  .log-secret {\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    -ms-user-select: none;\n    user-select: none;\n  }\n  .log-secret-redacted {\n    opacity: 0;\n    width: 1px;\n    font-size: 1px;\n  }\n  .log-fg-black {\n    color: rgb(128, 128, 128);\n  }\n  .log-fg-red {\n    color: rgb(255, 0, 0);\n  }\n  .log-fg-green {\n    color: rgb(0, 255, 0);\n  }\n  .log-fg-yellow {\n    color: rgb(255, 255, 0);\n  }\n  .log-fg-blue {\n    color: rgb(0, 0, 255);\n  }\n  .log-fg-magenta {\n    color: rgb(255, 0, 255);\n  }\n  .log-fg-cyan {\n    color: rgb(0, 255, 255);\n  }\n  .log-fg-white {\n    color: rgb(187, 187, 187);\n  }\n  .log-bg-black {\n    background-color: rgb(0, 0, 0);\n  }\n  .log-bg-red {\n    background-color: rgb(255, 0, 0);\n  }\n  .log-bg-green {\n    background-color: rgb(0, 255, 0);\n  }\n  .log-bg-yellow {\n    background-color: rgb(255, 255, 0);\n  }\n  .log-bg-blue {\n    background-color: rgb(0, 0, 255);\n  }\n  .log-bg-magenta {\n    background-color: rgb(255, 0, 255);\n  }\n  .log-bg-cyan {\n    background-color: rgb(0, 255, 255);\n  }\n  .log-bg-white {\n    background-color: rgb(255, 255, 255);\n  }\n";
+export declare const coloredConsoleStyles = "\n  .log {\n    flex: 1;\n    background-color: #1c1c1c;\n    font-family: \"SFMono-Regular\", Consolas, \"Liberation Mono\", Menlo, Courier,\n      monospace;\n    font-size: 12px;\n    padding: 16px;\n    overflow: auto;\n    line-height: 1.45;\n    border-radius: 3px;\n    white-space: pre-wrap;\n    overflow-wrap: break-word;\n    color: #ddd;\n  }\n\n  .log-bold {\n    font-weight: bold;\n  }\n  .log-italic {\n    font-style: italic;\n  }\n  .log-underline {\n    text-decoration: underline;\n  }\n  .log-strikethrough {\n    text-decoration: line-through;\n  }\n  .log-underline.log-strikethrough {\n    text-decoration: underline line-through;\n  }\n  .log-blink {\n    animation: blink 1s step-end infinite;\n  }\n  .log-rapid-blink {\n    animation: blink 0.4s step-end infinite;\n  }\n  @keyframes blink {\n    50% {\n      opacity: 0;\n    }\n  }\n  .log-secret {\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    -ms-user-select: none;\n    user-select: none;\n  }\n  .log-secret-redacted {\n    opacity: 0;\n    width: 1px;\n    font-size: 1px;\n  }\n  .log-fg-black {\n    color: rgb(128, 128, 128);\n  }\n  .log-fg-red {\n    color: rgb(255, 0, 0);\n  }\n  .log-fg-green {\n    color: rgb(0, 255, 0);\n  }\n  .log-fg-yellow {\n    color: rgb(255, 255, 0);\n  }\n  .log-fg-blue {\n    color: rgb(0, 0, 255);\n  }\n  .log-fg-magenta {\n    color: rgb(255, 0, 255);\n  }\n  .log-fg-cyan {\n    color: rgb(0, 255, 255);\n  }\n  .log-fg-white {\n    color: rgb(187, 187, 187);\n  }\n  .log-bg-black {\n    background-color: rgb(0, 0, 0);\n  }\n  .log-bg-red {\n    background-color: rgb(255, 0, 0);\n  }\n  .log-bg-green {\n    background-color: rgb(0, 255, 0);\n  }\n  .log-bg-yellow {\n    background-color: rgb(255, 255, 0);\n  }\n  .log-bg-blue {\n    background-color: rgb(0, 0, 255);\n  }\n  .log-bg-magenta {\n    background-color: rgb(255, 0, 255);\n  }\n  .log-bg-cyan {\n    background-color: rgb(0, 255, 255);\n  }\n  .log-bg-white {\n    background-color: rgb(255, 255, 255);\n  }\n";
 export {};

package/dist/util/console-color.js

@@ -9,33 +9,25 @@ export class ColoredConsole {
             foregroundColor: null,
             backgroundColor: null,
             carriageReturn: false,
+            lines: [],
             secret: false,
+            blink: false,
+            rapidBlink: false,
         };
     }
     logs() {
+        if (this.state.lines.length > 0) {
+            this.processLines();
+        }
         return this.targetElement.innerText;
     }
-    addLine(line) {
+    processLine(line) {
         // biome-ignore lint/suspicious/noControlCharactersInRegex: ANSI escape sequences
         // eslint-disable-next-line no-control-regex
         const re = /(?:\x1B|\\x1B)(?:\[(.*?)[@-~]|\].*?(?:\x07|\x1B\\))/g;
         let i = 0;
-        if (this.state.carriageReturn) {
-            if (line !== "\n") {
-                // don't remove if \r\n
-                if (this.targetElement.lastChild) {
-                    this.targetElement.removeChild(this.targetElement.lastChild);
-                }
-            }
-            this.state.carriageReturn = false;
-        }
-        const hasBareCR = line.endsWith("\r") && !line.endsWith("\r\n");
-        if (hasBareCR) {
-            this.state.carriageReturn = true;
-        }
         const lineSpan = document.createElement("span");
         lineSpan.classList.add("line");
-        this.targetElement.appendChild(lineSpan);
         const addSpan = (content) => {
             if (content === "")
                 return;
@@ -50,6 +42,10 @@ export class ColoredConsole {
                 span.classList.add("log-strikethrough");
             if (this.state.secret)
                 span.classList.add("log-secret");
+            if (this.state.blink)
+                span.classList.add("log-blink");
+            if (this.state.rapidBlink)
+                span.classList.add("log-rapid-blink");
             if (this.state.foregroundColor !== null)
                 span.classList.add(`log-fg-${this.state.foregroundColor}`);
             if (this.state.backgroundColor !== null)
@@ -83,6 +79,8 @@ export class ColoredConsole {
                         this.state.foregroundColor = null;
                         this.state.backgroundColor = null;
                         this.state.secret = false;
+                        this.state.blink = false;
+                        this.state.rapidBlink = false;
                         break;
                     case 1:
                         this.state.bold = true;
@@ -94,10 +92,15 @@ export class ColoredConsole {
                         this.state.underline = true;
                         break;
                     case 5:
-                        this.state.secret = true;
+                        this.state.blink = true;
+                        this.state.rapidBlink = false;
                         break;
                     case 6:
-                        this.state.secret = false;
+                        this.state.rapidBlink = true;
+                        this.state.blink = false;
+                        break;
+                    case 8:
+                        this.state.secret = true;
                         break;
                     case 9:
                         this.state.strikethrough = true;
@@ -111,6 +114,13 @@ export class ColoredConsole {
                     case 24:
                         this.state.underline = false;
                         break;
+                    case 25:
+                        this.state.blink = false;
+                        this.state.rapidBlink = false;
+                        break;
+                    case 28:
+                        this.state.secret = false;
+                        break;
                     case 29:
                         this.state.strikethrough = false;
                         break;
@@ -141,6 +151,9 @@ export class ColoredConsole {
                     case 39:
                         this.state.foregroundColor = null;
                         break;
+                    case 40:
+                        this.state.backgroundColor = "black";
+                        break;
                     case 41:
                         this.state.backgroundColor = "red";
                         break;
@@ -162,23 +175,60 @@ export class ColoredConsole {
                     case 47:
                         this.state.backgroundColor = "white";
                         break;
-                    case 40:
-                        this.state.backgroundColor = "black";
-                        break;
                     case 49:
                         this.state.backgroundColor = null;
                         break;
                 }
             }
         }
+        addSpan(line.substring(i));
+        return lineSpan;
+    }
+    processLines() {
         const atBottom = this.targetElement.scrollTop >
             this.targetElement.scrollHeight - this.targetElement.offsetHeight - 50;
-        addSpan(line.substring(i));
+        const prevCarriageReturn = this.state.carriageReturn;
+        const fragment = document.createDocumentFragment();
+        if (this.state.lines.length === 0) {
+            return;
+        }
+        for (const line of this.state.lines) {
+            // A lone \r is a pure carriage-return signal — update state but don't
+            // create a DOM node for it (it has no renderable content).
+            if (line === "\r") {
+                this.state.carriageReturn = true;
+                continue;
+            }
+            if (this.state.carriageReturn && line !== "\n") {
+                if (fragment.childElementCount) {
+                    fragment.removeChild(fragment.lastChild);
+                }
+            }
+            const hadCarriageReturn = line.endsWith("\r");
+            fragment.appendChild(this.processLine(line.replace(/\r/g, "")));
+            this.state.carriageReturn = hadCarriageReturn;
+        }
+        if (prevCarriageReturn &&
+            fragment.childElementCount > 0 &&
+            this.targetElement.lastChild) {
+            this.targetElement.replaceChild(fragment, this.targetElement.lastChild);
+        }
+        else {
+            this.targetElement.appendChild(fragment);
+        }
+        this.state.lines = [];
         // Keep scroll at bottom
         if (atBottom) {
             this.targetElement.scrollTop = this.targetElement.scrollHeight;
         }
     }
+    addLine(line) {
+        // Processing of lines is deferred for performance reasons
+        if (this.state.lines.length === 0) {
+            setTimeout(() => this.processLines(), 0);
+        }
+        this.state.lines.push(line);
+    }
 }
 export const coloredConsoleStyles = `
   .log {
@@ -211,6 +261,17 @@ export const coloredConsoleStyles = `
   .log-underline.log-strikethrough {
     text-decoration: underline line-through;
   }
+  .log-blink {
+    animation: blink 1s step-end infinite;
+  }
+  .log-rapid-blink {
+    animation: blink 0.4s step-end infinite;
+  }
+  @keyframes blink {
+    50% {
+      opacity: 0;
+    }
+  }
   .log-secret {
     -webkit-user-select: none;
     -moz-user-select: none;

package/dist/util/line-break-transformer.js

@@ -5,10 +5,24 @@ export class LineBreakTransformer {
     transform(chunk, controller) {
         // Append new chunks to existing chunks.
         this.chunks += chunk;
-        // For each line breaks in chunks, send the parsed lines out.
-        const lines = this.chunks.split("\r\n");
-        this.chunks = lines.pop();
-        lines.forEach((line) => controller.enqueue(line + "\r\n"));
+        // Split on \r\n, lone \r, or lone \n — capturing the separator so we can
+        // distinguish a lone \r (overwrite intent) from a normal newline.
+        const re = /\r\n|\r|\n/g;
+        let lastIndex = 0;
+        let match;
+        while ((match = re.exec(this.chunks)) !== null) {
+            // If this is a lone \r at the very end of the buffer, leave it so it can
+            // be combined with a possible following \n in the next chunk.
+            if (match[0] === "\r" && match.index === this.chunks.length - 1) {
+                break;
+            }
+            const line = this.chunks.substring(lastIndex, match.index);
+            // Emit with \r suffix only for lone \r (overwrite), \n for everything else.
+            const suffix = match[0] === "\r" ? "\r" : "\n";
+            controller.enqueue(line + suffix);
+            lastIndex = re.lastIndex;
+        }
+        this.chunks = this.chunks.substring(lastIndex);
     }
     flush(controller) {
         // When the stream is closed, flush any remaining chunks out.

package/dist/util/timestamp-transformer.d.ts

@@ -0,0 +1,5 @@
+export declare class TimestampTransformer implements Transformer<string, string> {
+    private deviceHasTimestamps;
+    transform(chunk: string, controller: TransformStreamDefaultController<string>): void;
+    reset(): void;
+}

package/dist/util/timestamp-transformer.js

@@ -0,0 +1,39 @@
+// Matches lines that already carry a wall-clock or tick timestamp so we don't
+// add a redundant one.  Intentionally does NOT match bare log-level prefixes
+// like ESPHome's [I][tag:line]: — those have no time information.
+//
+// Covered formats:
+//   (123456)          FreeRTOS ms-tick  e.g. "(12345) "
+//   [HH:MM:SS]        wall-clock bracket
+//   [HH:MM:SS.mmm]    wall-clock bracket with millis
+//   I (1234) tag:     ESP-IDF log level + tick  e.g. "I (1234) wifi: ..."
+//   HH:MM:SS.mmm      plain wall-clock
+const DEVICE_TIMESTAMP_RE = /^\s*(?:\(\d+\)\s|\[\d{2}:\d{2}:\d{2}(?:\.\d+)?\]|[DIWEACV] \(\d+\) \w|(?:\d{2}:){2}\d{2}\.\d)/;
+export class TimestampTransformer {
+    constructor() {
+        this.deviceHasTimestamps = false;
+    }
+    transform(chunk, controller) {
+        // Pass through pure newline / empty sentinel unchanged so that
+        // carriage-return overwrite logic in console-color.ts still works.
+        if (chunk === "" || chunk === "\n" || chunk === "\r") {
+            controller.enqueue(chunk);
+            return;
+        }
+        if (!this.deviceHasTimestamps && DEVICE_TIMESTAMP_RE.test(chunk)) {
+            this.deviceHasTimestamps = true;
+        }
+        if (this.deviceHasTimestamps) {
+            controller.enqueue(chunk);
+            return;
+        }
+        const date = new Date();
+        const h = date.getHours().toString().padStart(2, "0");
+        const m = date.getMinutes().toString().padStart(2, "0");
+        const s = date.getSeconds().toString().padStart(2, "0");
+        controller.enqueue(`[${h}:${m}:${s}] ${chunk}`);
+    }
+    reset() {
+        this.deviceHasTimestamps = false;
+    }
+}

package/js/console.js

@@ -1,5 +1,6 @@
 import { ColoredConsole, coloredConsoleStyles } from "./util/console-color.js";
 import { LineBreakTransformer } from "./util/line-break-transformer.js";
+import { TimestampTransformer } from "./util/timestamp-transformer.js";
 import { ImprovDialog } from "./improv.js";
 
 export class ESP32ToolConsole {
@@ -16,6 +17,11 @@ export class ESP32ToolConsole {
     this.allowInput = allowInput;
     this.console = null;
     this.cancelConnection = null;
+    // Command history buffer — keep in sync with src/console.ts
+    // (history logic is duplicated there; update both files together)
+    this.commandHistory = [];
+    this.historyIndex = -1;
+    this.currentInput = "";
   }
 
   logs() {
@@ -180,6 +186,16 @@ export class ESP32ToolConsole {
           ev.preventDefault();
           ev.stopPropagation();
           this._sendCommand();
+        } else if (ev.key === "ArrowUp") {
+          ev.preventDefault();
+          this._navigateHistory(1, input);
+        } else if (ev.key === "ArrowDown") {
+          ev.preventDefault();
+          this._navigateHistory(-1, input);
+        } else {
+          if (this.historyIndex !== -1) {
+            this.historyIndex = -1;
+          }
         }
       });
     }
@@ -220,16 +236,16 @@ export class ESP32ToolConsole {
           signal: abortSignal,
         })
         .pipeThrough(new TransformStream(new LineBreakTransformer()))
+        .pipeThrough(new TransformStream(new TimestampTransformer()))
         .pipeTo(
           new WritableStream({
             write: (chunk) => {
-              const cleaned = chunk.replace(/\r\n$/, "\n");
-              this.console.addLine(cleaned);
+              this.console.addLine(chunk);
 
               if (!bootloaderDetected && lineCount < 30) {
                 lineCount++;
                 for (const pat of BOOTLOADER_PATTERNS) {
-                  if (pat.test(cleaned)) {
+                  if (pat.test(chunk)) {
                     bootloaderDetected = true;
                     this.containerElement.dispatchEvent(
                       new CustomEvent("console-bootloader", { bubbles: true })
@@ -259,9 +275,42 @@ export class ESP32ToolConsole {
     }
   }
 
+  _navigateHistory(direction, input) {
+    if (this.commandHistory.length === 0) return;
+
+    if (this.historyIndex === -1) {
+      this.currentInput = input.value;
+    }
+
+    const nextIndex = this.historyIndex + direction;
+
+    if (nextIndex < 0) {
+      this.historyIndex = -1;
+      input.value = this.currentInput;
+    } else if (nextIndex < this.commandHistory.length) {
+      this.historyIndex = nextIndex;
+      input.value = this.commandHistory[this.historyIndex];
+    }
+
+    const len = input.value.length;
+    input.setSelectionRange(len, len);
+  }
+
   async _sendCommand() {
     const input = this.containerElement.querySelector(".esp32tool-console-input");
     const command = input.value;
+
+    if (command.trim() !== "") {
+      if (this.commandHistory[0] !== command) {
+        this.commandHistory.unshift(command);
+        if (this.commandHistory.length > 100) {
+          this.commandHistory.pop();
+        }
+      }
+    }
+    this.historyIndex = -1;
+    this.currentInput = "";
+
     if (!this.port.writable) {
       this.console.addLine("Terminal disconnected: port not writable");
       return;