mepcli 0.2.0 → 0.2.1

package/dist/core.js

@@ -78,6 +78,7 @@ class TextPrompt extends Prompt {
         this.errorMsg = '';
         this.cursor = 0;
         this.hasTyped = false;
+        this.renderLines = 1;
         this.value = options.initial || '';
         this.cursor = this.value.length;
     }
@@ -85,58 +86,142 @@ class TextPrompt extends Prompt {
         // TextPrompt needs the cursor visible!
         this.print(ansi_1.ANSI.SHOW_CURSOR);
         if (!firstRender) {
-            this.print(ansi_1.ANSI.ERASE_LINE + ansi_1.ANSI.CURSOR_LEFT);
-            if (this.errorMsg) {
-                this.print(ansi_1.ANSI.UP + ansi_1.ANSI.ERASE_LINE + ansi_1.ANSI.CURSOR_LEFT);
+            // Clear previous lines
+            // Note: renderLines now represents visual wrapped lines
+            for (let i = 0; i < this.renderLines; i++) {
+                this.print(ansi_1.ANSI.ERASE_LINE);
+                if (i < this.renderLines - 1)
+                    this.print(ansi_1.ANSI.UP);
             }
+            this.print(ansi_1.ANSI.CURSOR_LEFT);
         }
+        let output = '';
         // 1. Render the Prompt Message
-        this.print(ansi_1.ANSI.ERASE_LINE + ansi_1.ANSI.CURSOR_LEFT);
         const icon = this.errorMsg ? `${MepCLI.theme.error}✖` : `${MepCLI.theme.success}?`;
-        this.print(`${icon} ${ansi_1.ANSI.BOLD}${MepCLI.theme.title}${this.options.message}${ansi_1.ANSI.RESET} `);
+        const multilineHint = this.options.multiline ? ` ${MepCLI.theme.muted}(Press Ctrl+D to submit)${ansi_1.ANSI.RESET}` : '';
+        output += `${icon} ${ansi_1.ANSI.BOLD}${MepCLI.theme.title}${this.options.message}${ansi_1.ANSI.RESET}${multilineHint} `;
         // 2. Render the Value or Placeholder
+        let displayValue = '';
         if (!this.value && this.options.placeholder && !this.errorMsg && !this.hasTyped) {
-            this.print(`${MepCLI.theme.muted}${this.options.placeholder}${ansi_1.ANSI.RESET}`);
-            // Move cursor back to start so typing overwrites placeholder visually
-            this.print(`\x1b[${this.options.placeholder.length}D`);
+            displayValue = `${MepCLI.theme.muted}${this.options.placeholder}${ansi_1.ANSI.RESET}`;
         }
         else {
-            const displayValue = this.options.isPassword ? '*'.repeat(this.value.length) : this.value;
-            this.print(`${MepCLI.theme.main}${displayValue}${ansi_1.ANSI.RESET}`);
+            displayValue = this.options.isPassword ? '*'.repeat(this.value.length) : this.value;
+            displayValue = `${MepCLI.theme.main}${displayValue}${ansi_1.ANSI.RESET}`;
         }
+        output += displayValue;
         // 3. Handle Error Message
         if (this.errorMsg) {
-            this.print(`\n${ansi_1.ANSI.ERASE_LINE}${MepCLI.theme.error}>> ${this.errorMsg}${ansi_1.ANSI.RESET}`);
-            this.print(ansi_1.ANSI.UP); // Go back to input line
-            // Re-calculate position to end of input
-            const promptLen = this.options.message.length + 3; // Icon + 2 spaces
-            const valLen = this.value.length;
-            // Move to absolute start of line, then move right to end of string
-            this.print(`\x1b[1000D\x1b[${promptLen + valLen}C`);
+            output += `\n${MepCLI.theme.error}>> ${this.errorMsg}${ansi_1.ANSI.RESET}`;
         }
-        // 4. Position Cursor Logic
-        // At this point, the physical cursor is at the END of the value string.
-        // We need to move it LEFT by (length - cursor_index)
-        const diff = this.value.length - this.cursor;
-        if (diff > 0) {
-            this.print(`\x1b[${diff}D`);
+        this.print(output);
+        // 4. Calculate Visual Metrics for Wrapping
+        const cols = process.stdout.columns || 80;
+        const stripAnsi = (str) => str.replace(/\x1b\[[0-9;]*m/g, '');
+        // Prompt String (visual part before value)
+        const promptStr = `${icon} ${MepCLI.theme.title}${this.options.message} ${multilineHint} `;
+        const promptVisualLen = stripAnsi(promptStr).length;
+        // Value String (visual part)
+        const rawValue = (!this.value && this.options.placeholder && !this.errorMsg && !this.hasTyped)
+            ? this.options.placeholder || ''
+            : (this.options.isPassword ? '*'.repeat(this.value.length) : this.value);
+        // Error String (visual part)
+        const errorVisualLines = this.errorMsg ? Math.ceil((3 + this.errorMsg.length) / cols) : 0;
+        // Calculate Total Lines and Cursor Position
+        // We simulate printing the prompt + value + error
+        let currentVisualLine = 0;
+        let currentCol = 0;
+        // State tracking for cursor
+        let cursorRow = 0;
+        let cursorCol = 0;
+        // Add Prompt
+        currentCol += promptVisualLen;
+        while (currentCol >= cols) {
+            currentVisualLine++;
+            currentCol -= cols;
+        }
+        // Add Value (Character by character to handle wrapping and cursor tracking accurately)
+        // Note: This doesn't handle multi-width chars perfectly, but handles wrapping better than before
+        const valueLen = rawValue.length;
+        // If placeholder, we treat it as value for render height, but cursor is at 0
+        const isPlaceholder = (!this.value && this.options.placeholder && !this.errorMsg && !this.hasTyped);
+        for (let i = 0; i < valueLen; i++) {
+            // Check if we are at cursor position
+            if (!isPlaceholder && i === this.cursor) {
+                cursorRow = currentVisualLine;
+                cursorCol = currentCol;
+            }
+            const char = rawValue[i];
+            if (char === '\n') {
+                currentVisualLine++;
+                currentCol = 0;
+            }
+            else {
+                currentCol++;
+                if (currentCol >= cols) {
+                    currentVisualLine++;
+                    currentCol = 0;
+                }
+            }
+        }
+        // If cursor is at the very end
+        if (!isPlaceholder && this.cursor === valueLen) {
+            cursorRow = currentVisualLine;
+            cursorCol = currentCol;
+        }
+        // If placeholder, cursor is at start of value
+        if (isPlaceholder) {
+            // Re-calc cursor position as if it's at index 0 of value
+            // Which is effectively where prompt ends
+            // We already updated currentCol/Line for prompt above, but loop continued for placeholder
+            // So we need to recalculate or store prompt end state
+            // Let's just use prompt end state:
+            let pCol = promptVisualLen;
+            let pRow = 0;
+            while (pCol >= cols) {
+                pRow++;
+                pCol -= cols;
+            }
+            cursorRow = pRow;
+            cursorCol = pCol;
+        }
+        // Final height
+        // If we are at col 0 of a new line (e.g. just wrapped or \n), we count that line
+        // currentVisualLine is 0-indexed index of the line we are on.
+        // Total lines = currentVisualLine + 1 + errorLines
+        // Special case: if input ends with \n, we are on a new empty line
+        const totalValueRows = currentVisualLine + 1;
+        this.renderLines = totalValueRows + errorVisualLines;
+        // 5. Position Cursor Logic
+        // We are currently at the end of output.
+        // End row relative to start: this.renderLines - 1
+        const endRow = this.renderLines - 1;
+        // Move up to cursor row
+        const linesUp = endRow - cursorRow;
+        if (linesUp > 0) {
+            this.print(`\x1b[${linesUp}A`);
+        }
+        // Move to cursor col
+        this.print(ansi_1.ANSI.CURSOR_LEFT); // Go to col 0
+        if (cursorCol > 0) {
+            this.print(`\x1b[${cursorCol}C`);
         }
     }
     handleInput(char) {
         // Enter
         if (char === '\r' || char === '\n') {
-            if (this.options.validate) {
-                const validationResult = this.options.validate(this.value);
-                if (typeof validationResult === 'string' && validationResult.length > 0) {
-                    this.errorMsg = validationResult;
-                    this.render(false);
-                    return;
-                }
-            }
-            if (this.errorMsg) {
-                this.print(`\n${ansi_1.ANSI.ERASE_LINE}${ansi_1.ANSI.UP}`);
+            if (this.options.multiline) {
+                this.value = this.value.slice(0, this.cursor) + '\n' + this.value.slice(this.cursor);
+                this.cursor++;
+                this.render(false);
+                return;
             }
-            this.submit(this.value);
+            this.validateAndSubmit();
+            return;
+        }
+        // Ctrl+D (EOF) or Ctrl+S for Submit in Multiline
+        if (this.options.multiline && (char === '\u0004' || char === '\u0013')) {
+            this.validateAndSubmit();
             return;
         }
         // Backspace
@@ -176,15 +261,66 @@ class TextPrompt extends Prompt {
             }
             return;
         }
-        // Regular Typing
-        if (char.length === 1 && !/^[\x00-\x1F]/.test(char)) {
+        // Regular Typing & Paste
+        if (!/^[\x00-\x1F]/.test(char) && !char.startsWith('\x1b')) {
             this.hasTyped = true;
             this.value = this.value.slice(0, this.cursor) + char + this.value.slice(this.cursor);
-            this.cursor++;
+            this.cursor += char.length;
             this.errorMsg = '';
             this.render(false);
         }
     }
+    validateAndSubmit() {
+        if (this.options.validate) {
+            const result = this.options.validate(this.value);
+            // Handle Promise validation
+            if (result instanceof Promise) {
+                // Show loading state
+                this.print(`\n${ansi_1.ANSI.ERASE_LINE}${MepCLI.theme.main}Validating...${ansi_1.ANSI.RESET}`);
+                this.print(ansi_1.ANSI.UP);
+                result.then(valid => {
+                    // Clear loading message
+                    this.print(`\n${ansi_1.ANSI.ERASE_LINE}`);
+                    this.print(ansi_1.ANSI.UP);
+                    if (typeof valid === 'string' && valid.length > 0) {
+                        this.errorMsg = valid;
+                        this.render(false);
+                    }
+                    else if (valid === false) {
+                        this.errorMsg = 'Invalid input';
+                        this.render(false);
+                    }
+                    else {
+                        if (this.errorMsg) {
+                            this.print(`\n${ansi_1.ANSI.ERASE_LINE}${ansi_1.ANSI.UP}`);
+                        }
+                        this.submit(this.value);
+                    }
+                }).catch(err => {
+                    this.print(`\n${ansi_1.ANSI.ERASE_LINE}`);
+                    this.print(ansi_1.ANSI.UP);
+                    this.errorMsg = err.message || 'Validation failed';
+                    this.render(false);
+                });
+                return;
+            }
+            // Handle Sync validation
+            if (typeof result === 'string' && result.length > 0) {
+                this.errorMsg = result;
+                this.render(false);
+                return;
+            }
+            if (result === false) {
+                this.errorMsg = 'Invalid input';
+                this.render(false);
+                return;
+            }
+        }
+        if (this.errorMsg) {
+            this.print(`\n${ansi_1.ANSI.ERASE_LINE}${ansi_1.ANSI.UP}`);
+        }
+        this.submit(this.value);
+    }
 }
 // --- Implementation: Select Prompt ---
 class SelectPrompt extends Prompt {
@@ -192,6 +328,8 @@ class SelectPrompt extends Prompt {
         super(options);
         this.selectedIndex = 0;
         this.searchBuffer = '';
+        this.scrollTop = 0;
+        this.pageSize = 7;
         // Custom render to handle variable height clearing
         this.lastRenderHeight = 0;
         // Find first non-separator index
@@ -237,6 +375,17 @@ class SelectPrompt extends Prompt {
         }
         let output = '';
         const choices = this.getFilteredChoices();
+        // Adjust Scroll Top
+        if (this.selectedIndex < this.scrollTop) {
+            this.scrollTop = this.selectedIndex;
+        }
+        else if (this.selectedIndex >= this.scrollTop + this.pageSize) {
+            this.scrollTop = this.selectedIndex - this.pageSize + 1;
+        }
+        // Handle Filtering Edge Case: if list shrinks, scrollTop might be too high
+        if (this.scrollTop > choices.length - 1) {
+            this.scrollTop = Math.max(0, choices.length - this.pageSize);
+        }
         // Header
         const searchStr = this.searchBuffer ? ` ${MepCLI.theme.muted}(Filter: ${this.searchBuffer})${ansi_1.ANSI.RESET}` : '';
         output += `${ansi_1.ANSI.ERASE_LINE}${ansi_1.ANSI.CURSOR_LEFT}${MepCLI.theme.success}?${ansi_1.ANSI.RESET} ${ansi_1.ANSI.BOLD}${MepCLI.theme.title}${this.options.message}${ansi_1.ANSI.RESET}${searchStr}\n`;
@@ -244,13 +393,15 @@ class SelectPrompt extends Prompt {
             output += `${ansi_1.ANSI.ERASE_LINE}${ansi_1.ANSI.CURSOR_LEFT}  ${MepCLI.theme.muted}No results found${ansi_1.ANSI.RESET}\n`;
         }
         else {
-            choices.forEach((choice, index) => {
+            const visibleChoices = choices.slice(this.scrollTop, this.scrollTop + this.pageSize);
+            visibleChoices.forEach((choice, index) => {
+                const actualIndex = this.scrollTop + index;
                 output += `${ansi_1.ANSI.ERASE_LINE}${ansi_1.ANSI.CURSOR_LEFT}`;
                 if (this.isSeparator(choice)) {
                     output += `  ${ansi_1.ANSI.DIM}${choice.text || '────────'}${ansi_1.ANSI.RESET}\n`;
                 }
                 else {
-                    if (index === this.selectedIndex) {
+                    if (actualIndex === this.selectedIndex) {
                         output += `${MepCLI.theme.main}❯ ${choice.title}${ansi_1.ANSI.RESET}\n`;
                     }
                     else {
@@ -261,7 +412,8 @@ class SelectPrompt extends Prompt {
         }
         this.print(output);
         // Clear remaining lines if list shrunk
-        const currentHeight = choices.length + 1 + (choices.length === 0 ? 1 : 0);
+        const visibleCount = Math.min(choices.length, this.pageSize);
+        const currentHeight = visibleCount + 1 + (choices.length === 0 ? 1 : 0);
         const linesToClear = this.lastRenderHeight - currentHeight;
         if (linesToClear > 0) {
             for (let i = 0; i < linesToClear; i++) {
@@ -595,13 +747,17 @@ class NumberPrompt extends Prompt {
             return;
         }
         // Numeric Input (and . and -)
-        if (/^[0-9.\-]$/.test(char)) {
-            if (char === '-' && (this.cursor !== 0 || this.stringValue.includes('-')))
-                return;
-            if (char === '.' && this.stringValue.includes('.'))
-                return;
+        // Simple paste support for numbers is also good
+        if (/^[0-9.\-]+$/.test(char)) {
+            // Basic validation for pasted content
+            if (char.includes('-') && (this.cursor !== 0 || this.stringValue.includes('-') || char.lastIndexOf('-') > 0)) {
+                // If complex paste fails simple checks, ignore or let user correct
+                // For now, strict check on single char logic is preserved if we want, 
+                // but let's allow pasting valid number strings
+            }
+            // Allow if it looks like a number part
             this.stringValue = this.stringValue.slice(0, this.cursor) + char + this.stringValue.slice(this.cursor);
-            this.cursor++;
+            this.cursor += char.length;
             this.errorMsg = '';
             this.render(false);
         }

package/dist/types.d.ts

@@ -14,8 +14,9 @@ export interface BaseOptions {
 export interface TextOptions extends BaseOptions {
     placeholder?: string;
     initial?: string;
-    validate?: (value: string) => string | boolean;
+    validate?: (value: string) => string | boolean | Promise<string | boolean>;
     isPassword?: boolean;
+    multiline?: boolean;
 }
 export interface Separator {
     separator: true;

package/example.ts

@@ -1,77 +1,97 @@
-import { MepCLI } from './src'; // Or mepcli if installed via NPM
+import { MepCLI } from './src'; // Or 'mepcli' if installed via NPM
 
 /**
- * Runs a comprehensive set of tests for all MepCLI prompt types.
+ * Runs a comprehensive demo showcasing all MepCLI prompt types and utilities.
+ * This demonstrates all core functionalities including Text, Password, Select,
+ * Checkbox, Number, Toggle, Confirm, and the Spin utility.
  */
-async function runAllTests() {
+async function runComprehensiveDemo() {
     console.clear();
-    console.log("--- MepCLI Comprehensive Test Suite (Neutralized) ---\n");
+    console.log("--- MepCLI Comprehensive Demo (All 7 Prompts + Spin Utility) ---\n");
 
     try {
-        // --- 1. Text Prompt Test (with Validation) ---
+        // --- 1. Text Prompt (Input with Validation and initial value) ---
         const projectName = await MepCLI.text({
             message: "Enter the name for your new project:",
             placeholder: "e.g., minimalist-cli-app",
             initial: "MepProject",
             validate: (value) => {
-                if (value.length < 3) {
-                    return "Project name must be at least 3 characters long.";
-                }
-                if (value.includes('&')) {
-                    return "Project name cannot contain '&' symbol.";
-                }
+                if (value.length < 3) return "Project name must be at least 3 characters long.";
                 return true;
             }
         });
         console.log(`\n✅ Text Result: Project name set to '${projectName}'`);
 
-        // --- 2. Password Prompt Test ---
+        // --- 2. Password Prompt (Hidden input) ---
         const apiKey = await MepCLI.password({
             message: "Enter the project's external API key:",
             placeholder: "Input will be hidden..."
         });
-        // Note: Do not log the actual key in a real app.
         console.log(`\n✅ Password Result: API key entered (length: ${apiKey.length})`);
 
-
-        // --- 3. Select Prompt Test (Single Choice) ---
+        // --- 3. Select Prompt (Single choice, supports filtering/searching by typing) ---
         const theme = await MepCLI.select({
             message: "Choose your preferred editor color theme:",
             choices: [
                 { title: "Dark Mode (Default)", value: "dark" },
                 { title: "Light Mode (Classic)", value: "light" },
                 { title: "High Contrast (Accessibility)", value: "contrast" },
+                // Demonstrates a separator option
+                { separator: true, text: "--- Pro Themes ---" },
                 { title: "Monokai Pro", value: "monokai" },
             ]
         });
         console.log(`\n✅ Select Result: Chosen theme is: ${theme}`);
 
-
-        // --- 4. Checkbox Prompt Test (Multi-Choice with Min/Max) ---
+        // --- 4. Checkbox Prompt (Multi-choice with Min/Max limits) ---
         const buildTools = await MepCLI.checkbox({
             message: "Select your required bundlers/build tools (Min 1, Max 2):",
             min: 1, 
             max: 2, 
             choices: [
                 { title: "Webpack", value: "webpack" },
-                { title: "Vite", value: "vite", selected: true },
+                { title: "Vite", value: "vite", selected: true }, // Default selected state
                 { title: "Rollup", value: "rollup" },
                 { title: "esbuild", value: "esbuild" }
             ]
         });
         console.log(`\n✅ Checkbox Result: Selected build tools: [${buildTools.join(', ')}]`);
 
+        // --- 5. Number Prompt (Numeric input, supports Min/Max and Up/Down arrow for Step) ---
+        const port = await MepCLI.number({
+            message: "Which port should the server run on?",
+            initial: 3000,
+            min: 1024,
+            max: 65535,
+            step: 100 // Increments/decrements by 100 with arrows
+        });
+        console.log(`\n✅ Number Result: Server port: ${port}`);
+        
+        // --- 6. Toggle Prompt (Boolean input, supports custom labels) ---
+        const isSecure = await MepCLI.toggle({
+            message: "Enable HTTPS/SSL for production?",
+            initial: false,
+            activeText: "SECURE", // Custom 'on' label
+            inactiveText: "INSECURE" // Custom 'off' label
+        });
+        console.log(`\n✅ Toggle Result: HTTPS enabled: ${isSecure}`);
 
-        // --- 5. Confirm Prompt Test ---
+        // --- 7. Confirm Prompt (Simple Yes/No) ---
         const proceed = await MepCLI.confirm({
-            message: "Do you want to continue with the installation setup?",
+            message: "Ready to deploy the project now?",
             initial: true
         });
-        console.log(`\n✅ Confirm Result: Setup decision: ${proceed ? 'Proceed' : 'Cancel'}`);
+        console.log(`\n✅ Confirm Result: Deployment decision: ${proceed ? 'Proceed' : 'Cancel'}`);
 
-        console.log("\n--- All MepCLI tests completed successfully! ---");
+        // --- 8. Spin Utility (Loading/Async Task Indicator) ---
+        await MepCLI.spin(
+            "Finalizing configuration and deploying to Teaserverse...",
+            new Promise(resolve => setTimeout(resolve, 1500)) // Simulates a 1.5 second async task
+        );
+        console.log("\n--- Deployment successful! All MepCLI features demonstrated! ---");
 
     } catch (e) {
+        // Global handler for Ctrl+C closure
         if (e instanceof Error && e.message === 'User force closed') {
              console.log("\nOperation cancelled by user (Ctrl+C).");
         } else {
@@ -80,4 +100,4 @@ async function runAllTests() {
     }
 }
 
-runAllTests();
+runComprehensiveDemo();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mepcli",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "description": "Zero-dependency, minimalist interactive CLI prompt for Node.js",
   "repository": {
     "type": "git",