📦 console-viewer

A lightweight React console log viewer with optional open/close control.
It shows real-time logs (console.log, console.error, etc.) inside a floating side panel.

🚀 Installation

npm install react-console-viewer-lite

⚙️ Usage

// App.tsx
import ConsoleViewer from 'react-console-viewer-lite';

export default function App() {
  return (
    <>
      <h1>My App</h1>
      <ConsoleViewer />
    </>
  );
}

The package automatically overrides native console methods like console.log, console.error, etc., and displays them in a floating viewer panel.

💡 Features

• Real-time logging UI
• Supports: log, info, warn, error, debug, table
• Filter and clear logs
• Open/close toggle button
• Minimal setup (just import it)

🛠️ Props

interface ConsoleViewerProps {
  isOpen?: boolean;                   // default: true
  setIsOpen?: (val: boolean) => void; // optional controlled toggle
}

You can use these to control the panel visibility from your app.

📤 License

MIT © Noman