mc-markdown-viewer 1.0.2 → 1.0.4

package/README.md

@@ -1,27 +1,257 @@
-# Markdown to HTML CLI 
+# Markdown to HTML CLI ✨
 
-> A CLI tool to convert Markdown files into beautifully styled HTML pages with a dark theme 
+> A powerful CLI tool to convert Markdown files into beautifully styled HTML pages with enhanced dark themes and modern UI
+
+[![npm version](https://img.shields.io/npm/v/mc-markdown-viewer.svg)](https://www.npmjs.com/package/mc-markdown-viewer)
+[![License](https://img.shields.io/npm/l/mc-markdown-viewer.svg)](https://github.com/yourusername/mc-markdown-viewer/blob/main/LICENSE)
 
 ---
 
-## Features
+![Salesforce Template](https://raw.githubusercontent.com/mchinnappan100/npmjs-images/main/md-viewer/md-view-00.png)
+
+## ✨ Features
+
+- 📝 **Markdown to HTML Conversion** - Seamlessly convert any Markdown file to styled HTML
+- 🎨 **Multiple Themes** - Choose from 4 beautiful dark theme variants
+- 📖 **Reading Mode** - Distraction-free focus mode for better readability
+- 📋 **Code Block Copy** - One-click copy for all code snippets
+- 📊 **Reading Progress** - Visual progress indicator as you scroll
+- 🔗 **Smooth Navigation** - Anchor links with smooth scrolling
+- 📱 **Responsive Design** - Looks great on all screen sizes
+- 🌐 **Auto Browser Launch** - Automatically opens HTML in your default browser
+- ⌨️ **Stdin Support** - Pipe markdown content directly from other commands
+- 💾 **Custom Output** - Save to any location you choose
 
-- Converts Markdown files to HTML 
-- Automatically open the generated HTML in the default browse
 ---
 
-## Installation
+## 📦 Installation
 
 Install globally via npm:
 
 ```bash
-npm install -g mc-markdown-viewer 
+npm install -g mc-markdown-viewer
+```
+
+Or use without installing:
+
+```bash
+npx mc-markdown-viewer -f README.md
+```
+
+---
+
+## 🚀 Usage
+
+### Basic Usage
+
+```bash
+# Convert a file
+md-viewer -f README.md
+
+# With a specific theme
+md-viewer -f README.md -t ocean
+
+# Custom output location
+md-viewer -f README.md -o ~/Desktop/output.html
+```
+
+### Stdin Input
+
+```bash
+# Pipe from cat
+cat README.md | md-viewer
+
+# Pipe from echo
+echo "# Hello World" | md-viewer -t forest
+
+# Pipe from curl
+curl https://raw.githubusercontent.com/user/repo/main/README.md | md-viewer
+
+# Using heredoc
+md-viewer -t sunset <<EOF
+# My Document
+This is **markdown** content.
+EOF
+```
+
+### Advanced Examples
+
+```bash
+# Convert multiple files with different themes
+md-viewer -f docs/intro.md -t default -o intro.html
+md-viewer -f docs/guide.md -t ocean -o guide.html
+
+# Process markdown from clipboard (macOS)
+pbpaste | md-viewer -t forest
+
+# Chain with other commands
+grep -A 50 "## Installation" README.md | md-viewer -t ocean
 ```
 
-## Usage
+---
+
+## 🎨 Available Themes
+
+| Theme | Primary Color | Best For |
+|-------|--------------|----------|
+| **default** | Blue | General documentation |
+| **ocean** | Cyan | Technical content |
+| **forest** | Green | Nature/environmental content |
+| **sunset** | Orange | Creative/warm content |
+
+Preview all themes:
+
+```bash
+md-viewer -f README.md -t default
+md-viewer -f README.md -t ocean
+md-viewer -f README.md -t forest
+md-viewer -f README.md -t sunset
+```
+
+---
+
+## 📖 Command Options
+
+```bash
+md-viewer [options]
+
+Options:
+  -V, --version          output the version number
+  -f, --file <path>      Input Markdown file
+  -t, --theme <theme>    Theme variant (default, ocean, forest, sunset) (default: "default")
+  -o, --output <path>    Output HTML file path (optional)
+  -h, --help             display help for command
+```
+
+**Note:** Either `-f` or stdin input is required.
+
+---
+
+## 🎯 Features in Detail
+
+### Enhanced Typography
+- Beautiful font pairing with Inter and JetBrains Mono
+- Optimized line heights for readability
+- Gradient headings with proper hierarchy
+
+### Interactive Elements
+- **Copy Buttons** - Click to copy any code block
+- **Focus Mode** - Toggle header/footer visibility
+- **Scroll to Top** - Quick navigation button
+- **Reading Progress** - Visual progress bar at the top
+
+### Modern Styling
+- Glassmorphism effects
+- Smooth animations and transitions
+- Responsive tables with gradients
+- Enhanced blockquotes
+- Syntax-highlighted code blocks
+
+### Accessibility
+- Semantic HTML structure
+- Reduced motion support for users who prefer it
+- Proper color contrast ratios
+- Keyboard navigation support
+
+---
+
+## 🛠️ Development
+
+### Prerequisites
+
 ```bash
+node >= 14.0.0
+npm >= 6.0.0
+```
+
 
- md-viewer --help # get help
+### Project Structure
 
- md-viewer -f README.md -t forest
 ```
+mc-markdown-viewer/
+├── index.js           # Main CLI script
+├── package.json       # NPM package configuration
+├── README.md          # This file
+└── LICENSE           # License file
+```
+
+---
+
+## 📝 Markdown Support
+
+Supports all standard Markdown features:
+
+- **Headings** (H1-H6)
+- **Text formatting** (bold, italic, strikethrough)
+- **Lists** (ordered and unordered)
+- **Links** and images
+- **Code blocks** with syntax highlighting
+- **Tables**
+- **Blockquotes**
+- **Horizontal rules**
+- **Inline code**
+
+---
+
+
+## 📄 License
+
+This project is licensed under the MIT License - see the LICENSE file for details.
+
+---
+
+## 👨‍💻 Author
+
+ - [Mohan Chinnappan](https://mohan-chinnappan-n.github.io/about/cv.html)
+
+---
+
+
+
+
+## 🔮 Roadmap
+
+- [ ] Custom theme configuration via JSON
+- [ ] Table of contents generation
+- [ ] Dark/Light mode toggle in output
+- [ ] PDF export option
+- [ ] Watch mode for live preview
+- [ ] Custom CSS injection
+- [ ] Mermaid diagram support
+- [ ] GitHub Flavored Markdown extensions
+
+---
+
+## 💡 Tips
+
+1. **Batch Processing**: Use shell scripts to convert multiple files
+   ```bash
+   for file in docs/*.md; do
+     md-viewer -f "$file" -o "html/$(basename "$file" .md).html"
+   done
+   ```
+
+2. **Integration**: Add to your npm scripts
+   ```json
+   {
+     "scripts": {
+       "docs": "md-viewer -f README.md -o docs/index.html"
+     }
+   }
+   ```
+
+3. **Git Hooks**: Auto-generate HTML on commit
+   ```bash
+   # .git/hooks/pre-commit
+   md-viewer -f README.md -o dist/README.html
+   ```
+
+---
+
+<div align="center">
+
+**[⬆ back to top](#markdown-to-html-cli-)**
+
+Made with ❤️ by [MC](https://mohan-chinnappan-n.github.io/about/cv.html)
+
+</div>

package/main.js

@@ -10,8 +10,9 @@ const marked = require('marked');
 program
   .version('1.0.0')
   .description('Convert Markdown to HTML with enhanced Tailwind CSS dark theme')
-  .requiredOption('-f, --file <path>', 'Input Markdown file')
+  .option('-f, --file <path>', 'Input Markdown file')
   .option('-t, --theme <theme>', 'Theme variant (default, ocean, forest, sunset)', 'default')
+  .option('-o, --output <path>', 'Output HTML file path (optional)')
   .parse(process.argv);
 
 const options = program.opts();
@@ -468,42 +469,64 @@ const htmlTemplate = (content, theme = 'default') => {
 `;
 };
 
-async function convertMarkdownToHtml(inputFile, theme) {
-  try {
-    // Read the markdown file
-    const markdown = await fs.readFile(inputFile, 'utf-8');
+async function readStdin() {
+  return new Promise((resolve, reject) => {
+    const chunks = [];
+    
+    process.stdin.on('data', chunk => {
+      chunks.push(chunk);
+    });
+    
+    process.stdin.on('end', () => {
+      resolve(Buffer.concat(chunks).toString('utf-8'));
+    });
     
+    process.stdin.on('error', reject);
+  });
+}
+
+async function convertMarkdownToHtml(markdown, theme, outputPath = null) {
+  try {
     // Convert markdown to HTML using marked
     const htmlContent = marked.parse(markdown);
     
     // Generate full HTML with template
     const fullHtml = htmlTemplate(htmlContent, theme);
     
-    // Create temp folder
-    const tempDir = path.join(os.tmpdir(), 'md-to-html');
-    await fs.mkdir(tempDir, { recursive: true });
-    
-    // Create output filename in temp folder
-    const outputFile = path.join(tempDir, path.basename(inputFile, path.extname(inputFile)) + '.html');
+    // Determine output file path
+    let outputFile;
+    if (outputPath) {
+      outputFile = path.resolve(outputPath);
+    } else {
+      // Create temp folder
+      const tempDir = path.join(os.tmpdir(), 'md-to-html');
+      await fs.mkdir(tempDir, { recursive: true });
+      
+      // Create output filename in temp folder
+      const timestamp = Date.now();
+      outputFile = path.join(tempDir, `markdown-${timestamp}.html`);
+    }
     
     // Write HTML to file
     await fs.writeFile(outputFile, fullHtml);
     
-    console.log(`Successfully converted ${inputFile} to ${outputFile}`);
+    console.log(`Successfully converted markdown to ${outputFile}`);
     console.log(`Theme: ${theme}`);
     
-    // Open the file in default browser (cross-platform)
-    try {
-      if (process.platform === 'darwin') {
-        execSync(`open "${outputFile}"`);
-      } else if (process.platform === 'win32') {
-        execSync(`start "${outputFile}"`);
-      } else {
-        execSync(`xdg-open "${outputFile}"`);
+    // Open the file in default browser (cross-platform) if not using custom output
+    if (!outputPath) {
+      try {
+        if (process.platform === 'darwin') {
+          execSync(`open "${outputFile}"`);
+        } else if (process.platform === 'win32') {
+          execSync(`start "${outputFile}"`);
+        } else {
+          execSync(`xdg-open "${outputFile}"`);
+        }
+      } catch (browserError) {
+        console.log(`File saved to: ${outputFile}`);
+        console.log('Please open the file manually in your browser.');
       }
-    } catch (browserError) {
-      console.log(`File saved to: ${outputFile}`);
-      console.log('Please open the file manually in your browser.');
     }
   } catch (error) {
     console.error('Error:', error.message);
@@ -511,5 +534,35 @@ async function convertMarkdownToHtml(inputFile, theme) {
   }
 }
 
-// Execute conversion
-convertMarkdownToHtml(options.file, options.theme);
+// Main execution
+async function main() {
+  let markdown;
+  
+  // Check if input is from stdin or file
+  if (!options.file && process.stdin.isTTY) {
+    console.error('Error: No input provided. Use -f <file> or pipe markdown via stdin.');
+    console.error('Examples:');
+    console.error('  md2html -f README.md');
+    console.error('  cat README.md | md2html');
+    console.error('  echo "# Hello World" | md2html -t ocean');
+    process.exit(1);
+  }
+  
+  if (options.file) {
+    // Read from file
+    try {
+      markdown = await fs.readFile(options.file, 'utf-8');
+    } catch (error) {
+      console.error(`Error reading file ${options.file}:`, error.message);
+      process.exit(1);
+    }
+  } else {
+    // Read from stdin
+    markdown = await readStdin();
+  }
+  
+  // Convert and output
+  await convertMarkdownToHtml(markdown, options.theme, options.output);
+}
+
+main();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mc-markdown-viewer",
-  "version": "1.0.2",
+  "version": "1.0.4",
    "description": "A beautiful CLI tool to convert Markdown files to HTML with multiple dark themes and modern styling",
 
   "main": "main.js",

package/pub.sh

@@ -1 +0,0 @@
-npm publish --access public