mepcli 1.1.0 → 1.3.0

package/dist/prompts/map.js

@@ -15,6 +15,7 @@ class MapPrompt extends base_1.Prompt {
         this.scrollTop = 0;
         this.pageSize = 7;
         this.errorMsg = '';
+        this.ghost = '';
         if (options.initial) {
             this.items = Object.entries(options.initial).map(([key, value]) => ({ key, value }));
         }
@@ -29,7 +30,11 @@ class MapPrompt extends base_1.Prompt {
         output += `${icon} ${ansi_1.ANSI.BOLD}${theme_1.theme.title}${this.options.message}${ansi_1.ANSI.RESET}\n`;
         // Layout Calculation
         const maxKeyWidth = Math.max(5, // Minimum width
-        ...this.items.map(item => (0, utils_1.stringWidth)(item.key))) + 2; // Padding
+        ...this.items.map((item, idx) => {
+            // Include ghost length in calculation if it's the active row
+            const ghostLen = (idx === this.rowIndex && this.colIndex === 0) ? (0, utils_1.stringWidth)(this.ghost) : 0;
+            return (0, utils_1.stringWidth)(item.key) + ghostLen;
+        })) + 2; // Padding
         // Scrolling Logic
         if (this.rowIndex < this.scrollTop) {
             this.scrollTop = this.rowIndex;
@@ -53,11 +58,16 @@ class MapPrompt extends base_1.Prompt {
             const pointer = isRowActive ? `${theme_1.theme.main}${symbols_1.symbols.pointer}${ansi_1.ANSI.RESET} ` : '  ';
             // Render Key
             let keyStr = item.key;
+            let ghostStr = '';
             if (isRowActive && this.colIndex === 0) {
-                keyStr = `${theme_1.theme.main}${ansi_1.ANSI.UNDERLINE}${keyStr}${ansi_1.ANSI.RESET}`;
+                if (this.ghost) {
+                    ghostStr = `${theme_1.theme.muted}${this.ghost}${ansi_1.ANSI.RESET}`;
+                }
+                keyStr = `${theme_1.theme.main}${ansi_1.ANSI.UNDERLINE}${keyStr}${ansi_1.ANSI.RESET}${ghostStr}`;
             }
-            // Adjust padding manually because ANSI codes mess up simple padEnd
-            const keyVisualWidth = (0, utils_1.stringWidth)(item.key);
+            // Adjust padding manually
+            // We need visual width of key + ghost (if active)
+            const keyVisualWidth = (0, utils_1.stringWidth)(item.key) + (isRowActive && this.colIndex === 0 ? (0, utils_1.stringWidth)(this.ghost) : 0);
             const padding = ' '.repeat(Math.max(0, maxKeyWidth - keyVisualWidth));
             // Render Value
             let valStr = item.value;
@@ -79,12 +89,41 @@ class MapPrompt extends base_1.Prompt {
             return str;
         return str + ' '.repeat(width - len);
     }
+    updateGhost() {
+        this.ghost = '';
+        if (this.colIndex !== 0 || !this.options.suggestions)
+            return;
+        const currentKey = this.items[this.rowIndex].key;
+        if (!currentKey)
+            return;
+        const lowerKey = currentKey.toLowerCase();
+        // Find first match
+        const match = this.options.suggestions.find(s => s.toLowerCase().startsWith(lowerKey) && s.length > currentKey.length);
+        if (match) {
+            this.ghost = match.slice(currentKey.length);
+        }
+    }
     handleInput(char) {
         this.errorMsg = '';
+        // Tab (Accept Suggestion) or Toggle Column
+        if (char === '\t') {
+            if (this.colIndex === 0 && this.ghost) {
+                this.items[this.rowIndex].key += this.ghost;
+                this.ghost = '';
+                this.render(false);
+                return;
+            }
+            // Standard Tab behavior (toggle column)
+            this.colIndex = this.colIndex === 0 ? 1 : 0;
+            this.ghost = ''; // Clear ghost when changing columns
+            this.render(false);
+            return;
+        }
         // Navigation
         if (this.isUp(char)) {
             if (this.rowIndex > 0)
                 this.rowIndex--;
+            this.ghost = '';
             this.render(false);
             return;
         }
@@ -96,28 +135,28 @@ class MapPrompt extends base_1.Prompt {
                 // Down at last row adds new row
                 this.items.push({ key: '', value: '' });
                 this.rowIndex++;
-                this.colIndex = 0; // Optional: Reset to Key col when creating new row
+                this.colIndex = 0;
             }
+            this.ghost = '';
             this.render(false);
             return;
         }
-        if (char === '\t' || this.isRight(char) || this.isLeft(char)) {
-            // Toggle column
+        if (this.isRight(char) || this.isLeft(char)) {
             this.colIndex = this.colIndex === 0 ? 1 : 0;
+            this.ghost = '';
             this.render(false);
             return;
         }
         // CRUD
-        // Ctrl+N (Standard ASCII for Ctrl+N is \x0e)
-        if (char === '\x0e') {
+        if (char === '\x0e') { // Ctrl+N
             this.items.push({ key: '', value: '' });
             this.rowIndex = this.items.length - 1;
             this.colIndex = 0;
+            this.ghost = '';
             this.render(false);
             return;
         }
-        // Ctrl+D (Standard ASCII for Ctrl+D is \x04)
-        if (char === '\x04') {
+        if (char === '\x04') { // Ctrl+D
             if (this.items.length > 1) {
                 this.items.splice(this.rowIndex, 1);
                 if (this.rowIndex >= this.items.length) {
@@ -125,9 +164,9 @@ class MapPrompt extends base_1.Prompt {
                 }
             }
             else {
-                // Clear the last remaining item instead of deleting it
                 this.items[0] = { key: '', value: '' };
             }
+            this.ghost = '';
             this.render(false);
             return;
         }
@@ -157,8 +196,13 @@ class MapPrompt extends base_1.Prompt {
         if (char === '\u0008' || char === '\x7f') {
             const item = this.items[this.rowIndex];
             if (this.colIndex === 0) {
-                if (item.key.length > 0)
+                if (item.key.length > 0) {
                     item.key = item.key.slice(0, -1);
+                    this.updateGhost();
+                }
+                else {
+                    this.ghost = '';
+                }
             }
             else {
                 if (item.value.length > 0)
@@ -172,6 +216,7 @@ class MapPrompt extends base_1.Prompt {
             const item = this.items[this.rowIndex];
             if (this.colIndex === 0) {
                 item.key += char;
+                this.updateGhost();
             }
             else {
                 item.value += char;
@@ -184,12 +229,14 @@ class MapPrompt extends base_1.Prompt {
             if (event.scroll === 'up') {
                 if (this.rowIndex > 0) {
                     this.rowIndex--;
+                    this.ghost = '';
                     this.render(false);
                 }
             }
             else if (event.scroll === 'down') {
                 if (this.rowIndex < this.items.length - 1) {
                     this.rowIndex++;
+                    this.ghost = '';
                     this.render(false);
                 }
             }

package/dist/types.d.ts

@@ -236,6 +236,7 @@ export interface CalendarOptions extends BaseOptions {
 }
 export interface MapOptions extends BaseOptions {
     initial?: Record<string, string>;
+    suggestions?: string[];
 }
 export interface SemVerOptions extends BaseOptions {
     currentVersion: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mepcli",
-  "version": "1.1.0",
+  "version": "1.3.0",
   "description": "Zero-dependency, interactive CLI prompt",
   "repository": {
     "type": "git",