@poetora/cli 0.1.4 → 0.1.6

package/.turbo/turbo-build.log

@@ -1,4 +1,4 @@
 
-> @poetora/cli@0.1.3 build /home/runner/work/poetora/poetora/packages/cli
+> @poetora/cli@0.1.5 build /home/runner/work/poetora/poetora/packages/cli
 > tsc --project tsconfig.build.json
 

package/bin/cli-builder.js

@@ -1,6 +1,8 @@
+import chalk from 'chalk';
 import yargs from 'yargs';
 import { hideBin } from 'yargs/helpers';
 import { CheckCommand, DevCommand, InitCommand, LinkCommand, UpdateCommand, } from './commands/index.js';
+import { checkNodeVersion, suppressConsoleWarnings } from './middlewares.js';
 import { AccessibilityCheckService, LinkService, OpenApiCheckService, PortService, TemplateService, UpdateService, VersionService, } from './services/index.js';
 import { ConsoleLogger } from './utils/index.js';
 export class CliBuilder {
@@ -25,6 +27,9 @@ export class CliBuilder {
         const updateCommand = new UpdateCommand(this.logger, updateService, this.packageName);
         return (yargs(hideBin(process.argv))
             .scriptName(this.packageName)
+            .version()
+            .middleware(checkNodeVersion)
+            .middleware(suppressConsoleWarnings)
             .command('dev', 'initialize a local preview environment', (yargs) => yargs
             .option('port', {
             type: 'number',
@@ -163,8 +168,8 @@ export class CliBuilder {
         })
             .command(['version', 'v'], 'display the current version of the CLI and client', () => undefined, async () => {
             const versions = versionService.getVersions();
-            this.logger.log(`cli version: ${versions.cli}`);
-            this.logger.log(`client version: ${versions.client}`);
+            console.log(`${chalk.bold.green('cli version')} ${versions.cli}`);
+            console.log(`${chalk.bold.green('client version')} ${versions.client}`);
             process.exit(0);
         })
             .strictCommands()

package/bin/cli.js

@@ -1,6 +1,10 @@
 #!/usr/bin/env node
+import { Logs } from '@poetora/previewing';
+import { render } from 'ink';
+import React from 'react';
 import { CliBuilder } from './cli-builder.js';
 export const cli = (options) => {
+    render(React.createElement(Logs));
     const builder = new CliBuilder(options.packageName);
     builder.run().catch((error) => {
         console.error('Fatal error:', error);

package/bin/commands/base.command.js

@@ -26,12 +26,12 @@ export class BaseCommand {
         else if (error instanceof Error) {
             this.logger.error(error.message);
             if (process.env.DEBUG === 'true') {
-                console.error(error.stack);
+                this.logger.logColor(error.stack ?? '', 'gray');
             }
         }
         else {
             this.logger.error('An unexpected error occurred');
-            console.error(error);
+            this.logger.logColor(String(error), 'gray');
         }
     }
     exit(code) {

package/bin/mdxAccessibility.js

@@ -1,7 +1,7 @@
-import fs from 'fs';
-import path from 'path';
 import { categorizeFilePaths, getPoetIgnore } from '@poetora/prebuild';
 import { coreRemark } from '@poetora/shared';
+import fs from 'fs';
+import path from 'path';
 import { visit } from 'unist-util-visit';
 const checkAltAttributes = (filePath, content) => {
     const issues = [];

package/bin/middlewares.d.ts

@@ -0,0 +1,2 @@
+export declare const checkNodeVersion: () => Promise<void>;
+export declare const suppressConsoleWarnings: () => void;

package/bin/middlewares.js

@@ -0,0 +1,47 @@
+import { addLog, ErrorLog } from '@poetora/previewing';
+import React from 'react';
+export const checkNodeVersion = async () => {
+    let nodeVersionString = process.version;
+    if (nodeVersionString.charAt(0) === 'v') {
+        nodeVersionString = nodeVersionString.slice(1);
+    }
+    const versionArr = nodeVersionString.split('.');
+    const versionStr = versionArr[0];
+    if (!versionStr) {
+        addLog(React.createElement(ErrorLog, {
+            message: `Unable to determine Node.js version (got "${process.version}"). Please ensure you are running Node.js >= 18.0.0.`,
+        }));
+        process.exit(1);
+    }
+    const majorVersion = parseInt(versionStr, 10);
+    if (majorVersion < 18) {
+        addLog(React.createElement(ErrorLog, {
+            message: `poetora requires Node.js >= 18.0.0 (current version ${nodeVersionString}). Please upgrade Node.js and try again.`,
+        }));
+        process.exit(1);
+    }
+};
+export const suppressConsoleWarnings = () => {
+    const ignoredMessages = [
+        'No utility classes were detected',
+        'https://tailwindcss.com/docs/content-configuration',
+        'DeprecationWarning',
+        'punycode',
+    ];
+    const originalConsoleError = console.error;
+    console.error = (...args) => {
+        const message = args.join(' ');
+        if (ignoredMessages.some((ignoredMessage) => message.includes(ignoredMessage))) {
+            return;
+        }
+        originalConsoleError.apply(console, args);
+    };
+    const originalConsoleWarn = console.warn;
+    console.warn = (...args) => {
+        const message = args.join(' ');
+        if (ignoredMessages.some((ignoredMessage) => message.includes(ignoredMessage))) {
+            return;
+        }
+        originalConsoleWarn.apply(console, args);
+    };
+};

package/bin/services/accessibility-check.service.js

@@ -1,6 +1,6 @@
-import path from 'path';
 import { getConfigObj, getConfigPath } from '@poetora/prebuild';
 import { getBackgroundColors } from '@poetora/shared';
+import path from 'path';
 import { checkDocsColors, } from '../accessibility.js';
 import { CMD_EXEC_PATH } from '../constants.js';
 import { checkMdxAccessibility } from '../mdxAccessibility.js';

package/bin/services/link.service.js

@@ -1,5 +1,5 @@
-import * as path from 'path';
 import { getBrokenInternalLinks, renameFilesAndUpdateLinksInContent, } from '@poetora/link-rot';
+import * as path from 'path';
 export class LinkService {
     logger;
     constructor(logger) {
@@ -26,7 +26,7 @@ export class LinkService {
         this.logger.log(`found ${this.logger.highlight?.(brokenLinks.length.toString()) ?? brokenLinks.length} broken link${brokenLinks.length === 1 ? '' : 's'} in ${this.logger.highlight?.(fileCount.toString()) ?? fileCount} file${fileCount === 1 ? '' : 's'}`);
         this.logger.logNewLine();
         for (const [filename, links] of Object.entries(brokenLinksByFile)) {
-            console.log(`\x1b[4m${filename}\x1b[0m`);
+            this.logger.logColor(filename, 'cyan');
             links.forEach((link) => {
                 this.logger.logColor(` ⎿  ${link}`, 'gray');
             });

package/bin/services/openapi-check.service.js

@@ -1,5 +1,5 @@
-import * as fs from 'fs';
 import { getOpenApiDocumentFromUrl, isAllowedLocalSchemaUrl, validate } from '@poetora/shared';
+import * as fs from 'fs';
 import * as yaml from 'js-yaml';
 import { FileSystemError, ValidationError } from '../errors/index.js';
 export class OpenApiCheckService {

package/bin/services/template.service.js

@@ -1,8 +1,8 @@
-import * as fs from 'fs';
-import * as path from 'path';
 import { docsConfigSchema } from '@poetora/validation';
 import AdmZip from 'adm-zip';
+import * as fs from 'fs';
 import * as fse from 'fs-extra';
+import * as path from 'path';
 import { ExternalServiceError, FileSystemError } from '../errors/index.js';
 export class TemplateService {
     TEMPLATE_URL = 'https://github.com/poetora/starter/archive/refs/heads/main.zip';

package/bin/services/version.service.js

@@ -1,5 +1,5 @@
-import { execSync } from 'child_process';
 import { getClientVersion, LOCAL_LINKED_CLI_VERSION } from '@poetora/previewing';
+import { execSync } from 'child_process';
 import yargs from 'yargs';
 import { InvalidEnvironmentError } from '../errors/index.js';
 import { CLI_CONSTANTS } from '../types/index.js';
@@ -55,15 +55,15 @@ export class VersionService {
         };
     }
     getCliVersion() {
-        if (process.env.CLI_TEST_MODE === 'true') {
-            return 'test-cli';
-        }
         const y = yargs();
         let version;
         y.showVersion((v) => {
             version = v;
             return false;
         });
+        if (process.env.CLI_TEST_MODE === 'true') {
+            return 'test-cli';
+        }
         if (version === 'unknown') {
             version = LOCAL_LINKED_CLI_VERSION;
         }

package/bin/utils/console-logger.js

@@ -1,65 +1,61 @@
+import { addLog, EmptyLineLog, ErrorLog, InfoLog, SpinnerLog, SuccessLog, WarningLog, } from '@poetora/previewing';
 import chalk from 'chalk';
-import ora from 'ora';
+import { Text } from 'ink';
+import React from 'react';
 export class ConsoleLogger {
     info(message) {
-        console.log(chalk.blue(`ℹ ${message}`));
+        addLog(React.createElement(InfoLog, { message }));
     }
     success(message) {
-        console.log(chalk.green(`✓ ${message}`));
+        addLog(React.createElement(SuccessLog, { message }));
     }
     error(message) {
-        console.error(chalk.red(`✗ ${message}`));
+        addLog(React.createElement(ErrorLog, { message }));
     }
     warn(message) {
-        console.warn(chalk.yellow(`⚠ ${message}`));
+        addLog(React.createElement(WarningLog, { message }));
     }
     spinner(message) {
-        return new ConsoleSpinner(message);
+        addLog(React.createElement(SpinnerLog, { message }));
+        return new InkSpinner();
     }
     log(message) {
-        console.log(message);
+        addLog(React.createElement(Text, {}, message));
     }
     logColor(message, color) {
-        console.log(chalk[color](message));
+        addLog(React.createElement(Text, { color }, message));
     }
     logBold(message, color) {
-        if (color) {
-            console.log(chalk[color].bold(message));
-        }
-        else {
-            console.log(chalk.bold(message));
-        }
+        addLog(React.createElement(Text, { bold: true, color }, message));
     }
     logSeparator() {
-        console.log(chalk.gray('─'.repeat(50)));
+        addLog(React.createElement(Text, { color: 'gray' }, '─'.repeat(50)));
     }
     logNewLine() {
-        console.log();
+        addLog(React.createElement(EmptyLineLog));
     }
     logHeader(message) {
-        console.log();
-        console.log(chalk.bold.cyan(message));
-        console.log();
+        this.logNewLine();
+        addLog(React.createElement(Text, { bold: true, color: 'cyan' }, message));
+        this.logNewLine();
     }
     highlight(text) {
         return chalk.yellow(text);
     }
 }
-class ConsoleSpinner {
-    spinner;
-    constructor(message) {
-        this.spinner = ora(message);
-    }
+class InkSpinner {
     start() {
-        this.spinner.start();
     }
     stop() {
-        this.spinner.stop();
     }
     succeed(message) {
-        this.spinner.succeed(message);
+        if (message) {
+            addLog(React.createElement(SuccessLog, { message }));
+        }
     }
     fail(message) {
-        this.spinner.fail(message);
+        if (message) {
+            addLog(React.createElement(ErrorLog, { message }));
+        }
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@poetora/cli",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "description": "The CLI for Poetora documentation Engine",
   "engines": {
     "node": ">=18.0.0"
@@ -32,20 +32,20 @@
     "color": "4.2.3",
     "detect-port": "1.5.1",
     "front-matter": "4.0.2",
-    "fs-extra": "11.2.0",
+    "fs-extra": "11.1.0",
+    "ink": "6.3.0",
     "inquirer": "12.3.0",
     "js-yaml": "4.1.0",
     "mdast-util-mdx-jsx": "3.2.0",
-    "ora": "^8.1.1",
-    "react": "^19.0.1",
+    "react": "19.2.3",
     "semver": "7.7.2",
     "unist-util-visit": "5.0.0",
     "yargs": "17.7.1",
-    "@poetora/link-rot": "0.0.6",
-    "@poetora/prebuild": "0.1.5",
-    "@poetora/previewing": "0.1.5",
-    "@poetora/shared": "0.1.5",
-    "@poetora/validation": "0.1.5"
+    "@poetora/link-rot": "0.0.7",
+    "@poetora/prebuild": "0.1.6",
+    "@poetora/previewing": "0.1.7",
+    "@poetora/shared": "0.1.6",
+    "@poetora/validation": "0.1.6"
   },
   "devDependencies": {
     "@tsconfig/recommended": "1.0.2",
@@ -53,9 +53,10 @@
     "@types/color": "^3.0.3",
     "@types/detect-port": "1.3.2",
     "@types/fs-extra": "^9.0.13",
-    "@types/js-yaml": "^4.0.9",
+    "@types/js-yaml": "4.0.9",
     "@types/mdast": "4.0.4",
     "@types/node": "22.19.2",
+    "@types/react": "19.2.7",
     "@types/yargs": "17.0.22",
     "@typescript-eslint/eslint-plugin": "8.49.0",
     "@typescript-eslint/parser": "8.49.0",

package/src/cli-builder.ts

@@ -1,7 +1,7 @@
+import chalk from 'chalk';
 import type { Argv } from 'yargs';
 import yargs from 'yargs';
 import { hideBin } from 'yargs/helpers';
-
 import {
   CheckCommand,
   DevCommand,
@@ -9,6 +9,7 @@ import {
   LinkCommand,
   UpdateCommand,
 } from './commands/index.js';
+import { checkNodeVersion, suppressConsoleWarnings } from './middlewares.js';
 import {
   AccessibilityCheckService,
   LinkService,
@@ -60,6 +61,9 @@ export class CliBuilder {
     return (
       yargs(hideBin(process.argv))
         .scriptName(this.packageName)
+        .version()
+        .middleware(checkNodeVersion) // Check Node.js version before any command
+        .middleware(suppressConsoleWarnings) // Suppress known console warnings
         // Dev command
         .command(
           'dev',
@@ -245,14 +249,17 @@ export class CliBuilder {
           () => undefined,
           async () => {
             const versions = versionService.getVersions();
-            this.logger.log(`cli version: ${versions.cli}`);
-            this.logger.log(`client version: ${versions.client}`);
+            // Use chalk for consistent formatting
+            console.log(`${chalk.bold.green('cli version')} ${versions.cli}`);
+            console.log(`${chalk.bold.green('client version')} ${versions.client}`);
             process.exit(0);
           }
         )
         // Error handling
         .strictCommands()
         .demandCommand(1, 'unknown command. see above for the list of supported commands.')
+
+        // Alias option flags --help = -h, default --version = -v
         .alias('h', 'help')
         .alias('v', 'version')
     );

package/src/cli.ts

@@ -1,4 +1,8 @@
 #!/usr/bin/env node
+import { Logs } from '@poetora/previewing';
+import { render } from 'ink';
+import React from 'react';
+
 import { CliBuilder } from './cli-builder.js';
 
 export interface CliOptions {
@@ -6,6 +10,9 @@ export interface CliOptions {
 }
 
 export const cli = (options: CliOptions): void => {
+  // Initialize ink rendering for logs
+  render(React.createElement(Logs));
+
   const builder = new CliBuilder(options.packageName);
 
   builder.run().catch((error) => {

package/src/commands/__tests__/base.command.test.ts

@@ -104,14 +104,11 @@ describe('BaseCommand', () => {
       (command as unknown as { execute: typeof command.execute }).execute = vi
         .fn()
         .mockRejectedValue('string error');
-      const consoleErrorSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
 
       await expect(command.run({ value: 'test' })).rejects.toBe('string error');
 
       expect(mockLogger.error).toHaveBeenCalledWith('An unexpected error occurred');
-      expect(consoleErrorSpy).toHaveBeenCalledWith('string error');
-
-      consoleErrorSpy.mockRestore();
+      expect(mockLogger.logColor).toHaveBeenCalledWith('string error', 'gray');
     });
 
     it('should show stack trace in debug mode', async () => {
@@ -122,13 +119,10 @@ describe('BaseCommand', () => {
       (command as unknown as { execute: typeof command.execute }).execute = vi
         .fn()
         .mockRejectedValue(error);
-      const consoleErrorSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
 
       await expect(command.run({ value: 'test' })).rejects.toThrow(error);
 
-      expect(consoleErrorSpy).toHaveBeenCalledWith(error.stack);
-
-      consoleErrorSpy.mockRestore();
+      expect(mockLogger.logColor).toHaveBeenCalledWith(error.stack ?? '', 'gray');
       process.env.DEBUG = originalDebug;
     });
   });

package/src/commands/base.command.ts

@@ -78,12 +78,12 @@ export abstract class BaseCommand<TOptions = unknown, TResult = void> {
 
       // In debug mode, show stack trace
       if (process.env.DEBUG === 'true') {
-        console.error(error.stack);
+        this.logger.logColor(error.stack ?? '', 'gray');
       }
     } else {
       // Unknown error types
       this.logger.error('An unexpected error occurred');
-      console.error(error);
+      this.logger.logColor(String(error), 'gray');
     }
   }
 

package/src/mdxAccessibility.ts

@@ -1,9 +1,9 @@
-import fs from 'fs';
-import path from 'path';
 import { categorizeFilePaths, getPoetIgnore } from '@poetora/prebuild';
 import { coreRemark } from '@poetora/shared';
+import fs from 'fs';
 import type { Node, Root, Text } from 'mdast';
 import type { MdxJsxFlowElement } from 'mdast-util-mdx-jsx';
+import path from 'path';
 import { visit } from 'unist-util-visit';
 
 export interface AccessibilityFixAttribute {

package/src/middlewares.ts

@@ -0,0 +1,73 @@
+import { addLog, ErrorLog } from '@poetora/previewing';
+import React from 'react';
+
+/**
+ * Yargs middleware functions
+ * These run before command execution
+ */
+
+/**
+ * Check if Node.js version is supported
+ * Middleware that validates Node version before any command runs
+ *
+ * Minimum requirement: Node.js >= 18.0.0
+ * Note: Individual commands may have stricter requirements (e.g., dev command)
+ */
+export const checkNodeVersion = async (): Promise<void> => {
+  let nodeVersionString = process.version;
+  if (nodeVersionString.charAt(0) === 'v') {
+    nodeVersionString = nodeVersionString.slice(1);
+  }
+  const versionArr = nodeVersionString.split('.');
+  const versionStr = versionArr[0];
+  if (!versionStr) {
+    addLog(
+      React.createElement(ErrorLog, {
+        message: `Unable to determine Node.js version (got "${process.version}"). Please ensure you are running Node.js >= 18.0.0.`,
+      })
+    );
+    process.exit(1);
+  }
+  const majorVersion = parseInt(versionStr, 10);
+
+  if (majorVersion < 18) {
+    addLog(
+      React.createElement(ErrorLog, {
+        message: `poetora requires Node.js >= 18.0.0 (current version ${nodeVersionString}). Please upgrade Node.js and try again.`,
+      })
+    );
+    process.exit(1);
+  }
+};
+
+/**
+ * Suppress common console warnings that don't affect functionality
+ * Filters out known noise from dependencies
+ */
+export const suppressConsoleWarnings = (): void => {
+  // Ignore tailwind warnings and punycode deprecation warning
+  const ignoredMessages = [
+    'No utility classes were detected',
+    'https://tailwindcss.com/docs/content-configuration',
+    'DeprecationWarning',
+    'punycode',
+  ];
+
+  const originalConsoleError = console.error;
+  console.error = (...args) => {
+    const message = args.join(' ');
+    if (ignoredMessages.some((ignoredMessage) => message.includes(ignoredMessage))) {
+      return;
+    }
+    originalConsoleError.apply(console, args);
+  };
+
+  const originalConsoleWarn = console.warn;
+  console.warn = (...args) => {
+    const message = args.join(' ');
+    if (ignoredMessages.some((ignoredMessage) => message.includes(ignoredMessage))) {
+      return;
+    }
+    originalConsoleWarn.apply(console, args);
+  };
+};

package/src/services/__tests__/template.service.test.ts

@@ -1,5 +1,5 @@
-import * as fs from 'fs';
 import AdmZip from 'adm-zip';
+import * as fs from 'fs';
 import * as fse from 'fs-extra';
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 import { ExternalServiceError, FileSystemError } from '../../errors/index.js';

package/src/services/accessibility-check.service.ts

@@ -1,6 +1,6 @@
-import path from 'path';
 import { getConfigObj, getConfigPath } from '@poetora/prebuild';
 import { getBackgroundColors } from '@poetora/shared';
+import path from 'path';
 import {
   type AccessibilityCheckResult,
   type ContrastResult,

package/src/services/link.service.ts

@@ -1,9 +1,9 @@
-import * as path from 'path';
 import {
   getBrokenInternalLinks,
   type MdxPath,
   renameFilesAndUpdateLinksInContent,
 } from '@poetora/link-rot';
+import * as path from 'path';
 
 import type { ILogger } from '../utils/index.js';
 
@@ -46,7 +46,7 @@ export class LinkService {
 
     for (const [filename, links] of Object.entries(brokenLinksByFile)) {
       // Underline filename for better visibility
-      console.log(`\x1b[4m${filename}\x1b[0m`);
+      this.logger.logColor(filename, 'cyan');
       links.forEach((link) => {
         this.logger.logColor(` ⎿  ${link}`, 'gray');
       });

package/src/services/openapi-check.service.ts

@@ -1,5 +1,5 @@
-import * as fs from 'fs';
 import { getOpenApiDocumentFromUrl, isAllowedLocalSchemaUrl, validate } from '@poetora/shared';
+import * as fs from 'fs';
 import * as yaml from 'js-yaml';
 
 import { FileSystemError, ValidationError } from '../errors/index.js';

package/src/services/template.service.ts

@@ -1,8 +1,8 @@
-import * as fs from 'fs';
-import * as path from 'path';
 import { docsConfigSchema } from '@poetora/validation';
 import AdmZip from 'adm-zip';
+import * as fs from 'fs';
 import * as fse from 'fs-extra';
+import * as path from 'path';
 
 import { ExternalServiceError, FileSystemError } from '../errors/index.js';
 

package/src/services/version.service.ts

@@ -1,5 +1,5 @@
-import { execSync } from 'child_process';
 import { getClientVersion, LOCAL_LINKED_CLI_VERSION } from '@poetora/previewing';
+import { execSync } from 'child_process';
 import yargs from 'yargs';
 
 import { InvalidEnvironmentError } from '../errors/index.js';
@@ -83,10 +83,6 @@ export class VersionService {
    * Get CLI version from package.json
    */
   getCliVersion(): string | undefined {
-    if (process.env.CLI_TEST_MODE === 'true') {
-      return 'test-cli';
-    }
-
     const y = yargs();
     let version: string | undefined;
 
@@ -95,7 +91,11 @@ export class VersionService {
       return false;
     });
 
-    // Handle npm link case where version is 'unknown'
+    if (process.env.CLI_TEST_MODE === 'true') {
+      return 'test-cli';
+    }
+
+    // When running npm link or pnpm link, the version is 'unknown'
     if (version === 'unknown') {
       version = LOCAL_LINKED_CLI_VERSION;
     }

package/src/utils/console-logger.ts

@@ -1,37 +1,49 @@
+import {
+  addLog,
+  EmptyLineLog,
+  ErrorLog,
+  InfoLog,
+  SpinnerLog,
+  SuccessLog,
+  WarningLog,
+} from '@poetora/previewing';
 import chalk from 'chalk';
-import ora, { type Ora } from 'ora';
+import { Text } from 'ink';
+import React from 'react';
 
 import type { LoggerSpinner } from '../types/index.js';
 
 import type { ILogger } from './logger.interface.js';
 
 /**
- * Console-based logger implementation using chalk for colors
- * Provides rich colored output similar to ink but with simpler console-based approach
+ * Logger implementation using ink and addLog from @poetora/previewing
+ * Provides consistent output with the preview server's logging system
  */
 export class ConsoleLogger implements ILogger {
   info(message: string): void {
-    console.log(chalk.blue(`ℹ ${message}`));
+    addLog(React.createElement(InfoLog, { message }));
   }
 
   success(message: string): void {
-    console.log(chalk.green(`✓ ${message}`));
+    addLog(React.createElement(SuccessLog, { message }));
   }
 
   error(message: string): void {
-    console.error(chalk.red(`✗ ${message}`));
+    addLog(React.createElement(ErrorLog, { message }));
   }
 
   warn(message: string): void {
-    console.warn(chalk.yellow(`⚠ ${message}`));
+    addLog(React.createElement(WarningLog, { message }));
   }
 
   spinner(message: string): LoggerSpinner {
-    return new ConsoleSpinner(message);
+    // Immediately add spinner log
+    addLog(React.createElement(SpinnerLog, { message }));
+    return new InkSpinner();
   }
 
   log(message: string): void {
-    console.log(message);
+    addLog(React.createElement(Text, {}, message));
   }
 
   /**
@@ -41,45 +53,42 @@ export class ConsoleLogger implements ILogger {
     message: string,
     color: 'green' | 'red' | 'yellow' | 'blue' | 'cyan' | 'magenta' | 'gray'
   ): void {
-    console.log(chalk[color](message));
+    addLog(React.createElement(Text, { color }, message));
   }
 
   /**
    * Log bold text
    */
   logBold(message: string, color?: 'green' | 'red' | 'yellow' | 'blue' | 'cyan' | 'magenta'): void {
-    if (color) {
-      console.log(chalk[color].bold(message));
-    } else {
-      console.log(chalk.bold(message));
-    }
+    addLog(React.createElement(Text, { bold: true, color }, message));
   }
 
   /**
    * Log a separator line
    */
   logSeparator(): void {
-    console.log(chalk.gray('─'.repeat(50)));
+    addLog(React.createElement(Text, { color: 'gray' }, '─'.repeat(50)));
   }
 
   /**
    * Log an empty line
    */
   logNewLine(): void {
-    console.log();
+    addLog(React.createElement(EmptyLineLog));
   }
 
   /**
    * Log a section header
    */
   logHeader(message: string): void {
-    console.log();
-    console.log(chalk.bold.cyan(message));
-    console.log();
+    this.logNewLine();
+    addLog(React.createElement(Text, { bold: true, color: 'cyan' }, message));
+    this.logNewLine();
   }
 
   /**
    * Highlight text (typically numbers) with yellow color
+   * Note: Returns styled text string for embedding in messages
    */
   highlight(text: string): string {
     return chalk.yellow(text);
@@ -87,28 +96,28 @@ export class ConsoleLogger implements ILogger {
 }
 
 /**
- * Console spinner implementation using ora
+ * Spinner implementation for ink-based logging
+ * Note: In ink/React rendering model, spinners are added as logs
+ * and don't need explicit start/stop/succeed/fail methods
  */
-class ConsoleSpinner implements LoggerSpinner {
-  private spinner: Ora;
-
-  constructor(message: string) {
-    this.spinner = ora(message);
-  }
-
+class InkSpinner implements LoggerSpinner {
   start(): void {
-    this.spinner.start();
+    // No-op: spinner already added to log stream
   }
 
   stop(): void {
-    this.spinner.stop();
+    // No-op: will be replaced by next log
   }
 
   succeed(message?: string): void {
-    this.spinner.succeed(message);
+    if (message) {
+      addLog(React.createElement(SuccessLog, { message }));
+    }
   }
 
   fail(message?: string): void {
-    this.spinner.fail(message);
+    if (message) {
+      addLog(React.createElement(ErrorLog, { message }));
+    }
   }
 }