quikdown 1.0.4 → 1.1.0

package/dist/quikdown.cjs

@@ -1,6 +1,6 @@
 /**
  * quikdown - Lightweight Markdown Parser
- * @version 1.0.4
+ * @version 1.1.0
  * @license BSD-2-Clause
  * @copyright DeftIO 2025
  */
@@ -14,11 +14,13 @@
  * @param {Function} options.fence_plugin - Custom renderer for fenced code blocks
  *                   (content, fence_string) => html string
  * @param {boolean} options.inline_styles - If true, uses inline styles instead of classes
+ * @param {boolean} options.bidirectional - If true, adds data-qd attributes for source tracking
+ * @param {boolean} options.lazy_linefeeds - If true, single newlines become <br> tags
  * @returns {string} - The rendered HTML
  */
 
 // Version will be injected at build time  
-const quikdownVersion = '1.0.4';
+const quikdownVersion = '1.1.0';
 
 // Constants for reuse
 const CLASS_PREFIX = 'quikdown-';
@@ -60,12 +62,25 @@ const QUIKDOWN_STYLES = {
 function createGetAttr(inline_styles, styles) {
     return function(tag, additionalStyle = '') {
         if (inline_styles) {
-            const style = styles[tag];
+            let style = styles[tag];
             if (!style && !additionalStyle) return '';
-            const fullStyle = additionalStyle ? (style ? `${style};${additionalStyle}` : additionalStyle) : style;
+            
+            // Remove default text-align if we're adding a different alignment
+            if (additionalStyle && additionalStyle.includes('text-align') && style && style.includes('text-align')) {
+                style = style.replace(/text-align:[^;]+;?/, '').trim();
+                if (style && !style.endsWith(';')) style += ';';
+            }
+            
+            /* istanbul ignore next - defensive: additionalStyle without style doesn't occur with current tags */
+            const fullStyle = additionalStyle ? (style ? `${style}${additionalStyle}` : additionalStyle) : style;
             return ` style="${fullStyle}"`;
         } else {
-            return ` class="${CLASS_PREFIX}${tag}"`;
+            const classAttr = ` class="${CLASS_PREFIX}${tag}"`;
+            // Apply inline styles for alignment even when using CSS classes
+            if (additionalStyle) {
+                return `${classAttr} style="${additionalStyle}"`;
+            }
+            return classAttr;
         }
     };
 }
@@ -75,7 +90,7 @@ function quikdown(markdown, options = {}) {
         return '';
     }
     
-    const { fence_plugin, inline_styles = false } = options;
+    const { fence_plugin, inline_styles = false, bidirectional = false, lazy_linefeeds = false } = options;
     const styles = QUIKDOWN_STYLES; // Use module-level styles
     const getAttr = createGetAttr(inline_styles, styles); // Create getAttr once
 
@@ -84,8 +99,12 @@ function quikdown(markdown, options = {}) {
         return text.replace(/[&<>"']/g, m => ESC_MAP[m]);
     }
     
+    // Helper to add data-qd attributes for bidirectional support
+    const dataQd = bidirectional ? (marker) => ` data-qd="${escapeHtml(marker)}"` : () => '';
+    
     // Sanitize URLs to prevent XSS attacks
     function sanitizeUrl(url, allowUnsafe = false) {
+        /* istanbul ignore next - defensive programming, regex ensures url is never empty */
         if (!url) return '';
         
         // If unsafe URLs are explicitly allowed, return as-is
@@ -127,18 +146,21 @@ function quikdown(markdown, options = {}) {
         // Trim the language specification
         const langTrimmed = lang ? lang.trim() : '';
         
-        // If custom fence plugin is provided, use it
-        if (fence_plugin && typeof fence_plugin === 'function') {
+        // If custom fence plugin is provided, use it (v1.1.0: object format required)
+        if (fence_plugin && fence_plugin.render && typeof fence_plugin.render === 'function') {
             codeBlocks.push({
                 lang: langTrimmed,
                 code: code.trimEnd(),
-                custom: true
+                custom: true,
+                fence: fence,
+                hasReverse: !!fence_plugin.reverse
             });
         } else {
             codeBlocks.push({
                 lang: langTrimmed,
                 code: escapeHtml(code.trimEnd()),
-                custom: false
+                custom: false,
+                fence: fence
             });
         }
         return placeholder;
@@ -162,7 +184,7 @@ function quikdown(markdown, options = {}) {
     // Process headings (supports optional trailing #'s)
     html = html.replace(/^(#{1,6})\s+(.+?)\s*#*$/gm, (match, hashes, content) => {
         const level = hashes.length;
-        return `<h${level}${getAttr('h' + level)}>${content}</h${level}>`;
+        return `<h${level}${getAttr('h' + level)}${dataQd(hashes)}>${content}</h${level}>`;
     });
     
     // Process blockquotes (must handle escaped > since we already escaped HTML)
@@ -170,18 +192,20 @@ function quikdown(markdown, options = {}) {
     // Merge consecutive blockquotes
     html = html.replace(/<\/blockquote>\n<blockquote>/g, '\n');
     
-    // Process horizontal rules
-    html = html.replace(/^---+$/gm, `<hr${getAttr('hr')}>`);
+    // Process horizontal rules (allow trailing spaces)
+    html = html.replace(/^---+\s*$/gm, `<hr${getAttr('hr')}>`);
     
     // Process lists
-    html = processLists(html, getAttr, inline_styles);
+    html = processLists(html, getAttr, inline_styles, bidirectional);
     
     // Phase 3: Process inline elements
     
     // Images (must come before links, with URL sanitization)
     html = html.replace(/!\[([^\]]*)\]\(([^)]+)\)/g, (match, alt, src) => {
         const sanitizedSrc = sanitizeUrl(src, options.allow_unsafe_urls);
-        return `<img${getAttr('img')} src="${sanitizedSrc}" alt="${alt}">`;
+        const altAttr = bidirectional && alt ? ` data-qd-alt="${escapeHtml(alt)}"` : '';
+        const srcAttr = bidirectional ? ` data-qd-src="${escapeHtml(src)}"` : '';
+        return `<img${getAttr('img')} src="${sanitizedSrc}" alt="${alt}"${altAttr}${srcAttr}${dataQd('!')}>`;
     });
     
     // Links (with URL sanitization)
@@ -190,7 +214,8 @@ function quikdown(markdown, options = {}) {
         const sanitizedHref = sanitizeUrl(href, options.allow_unsafe_urls);
         const isExternal = /^https?:\/\//i.test(sanitizedHref);
         const rel = isExternal ? ' rel="noopener noreferrer"' : '';
-        return `<a${getAttr('a')} href="${sanitizedHref}"${rel}>${text}</a>`;
+        const textAttr = bidirectional ? ` data-qd-text="${escapeHtml(text)}"` : '';
+        return `<a${getAttr('a')} href="${sanitizedHref}"${rel}${textAttr}${dataQd('[')}>${text}</a>`;
     });
     
     // Autolinks - convert bare URLs to clickable links
@@ -201,23 +226,64 @@ function quikdown(markdown, options = {}) {
     
     // Process inline formatting (bold, italic, strikethrough)
     const inlinePatterns = [
-        [/\*\*(.+?)\*\*/g, 'strong'],
-        [/__(.+?)__/g, 'strong'],
-        [/(?<!\*)\*(?!\*)(.+?)(?<!\*)\*(?!\*)/g, 'em'],
-        [/(?<!_)_(?!_)(.+?)(?<!_)_(?!_)/g, 'em'],
-        [/~~(.+?)~~/g, 'del']
+        [/\*\*(.+?)\*\*/g, 'strong', '**'],
+        [/__(.+?)__/g, 'strong', '__'],
+        [/(?<!\*)\*(?!\*)(.+?)(?<!\*)\*(?!\*)/g, 'em', '*'],
+        [/(?<!_)_(?!_)(.+?)(?<!_)_(?!_)/g, 'em', '_'],
+        [/~~(.+?)~~/g, 'del', '~~']
     ];
     
-    inlinePatterns.forEach(([pattern, tag]) => {
-        html = html.replace(pattern, `<${tag}${getAttr(tag)}>$1</${tag}>`);
+    inlinePatterns.forEach(([pattern, tag, marker]) => {
+        html = html.replace(pattern, `<${tag}${getAttr(tag)}${dataQd(marker)}>$1</${tag}>`);
     });
     
-    // Line breaks (two spaces at end of line)
-    html = html.replace(/  $/gm, `<br${getAttr('br')}>`);
-    
-    // Paragraphs (double newlines)
-    html = html.replace(/\n\n+/g, '</p><p>');
-    html = '<p>' + html + '</p>';
+    // Line breaks
+    if (lazy_linefeeds) {
+        // Lazy linefeeds: single newline becomes <br> (except between paragraphs and after/before block elements)
+        const blocks = [];
+        let bi = 0;
+        
+        // Protect tables and lists  
+        html = html.replace(/<(table|[uo]l)[^>]*>[\s\S]*?<\/\1>/g, m => {
+            blocks[bi] = m;
+            return `§B${bi++}§`;
+        });
+        
+        // Handle paragraphs and block elements
+        html = html.replace(/\n\n+/g, '§P§')
+            // After block elements
+            .replace(/(<\/(?:h[1-6]|blockquote|pre)>)\n/g, '$1§N§')
+            .replace(/(<(?:h[1-6]|blockquote|pre|hr)[^>]*>)\n/g, '$1§N§')
+            // Before block elements  
+            .replace(/\n(<(?:h[1-6]|blockquote|pre|hr)[^>]*>)/g, '§N§$1')
+            .replace(/\n(§B\d+§)/g, '§N§$1')
+            .replace(/(§B\d+§)\n/g, '$1§N§')
+            // Convert remaining newlines
+            .replace(/\n/g, `<br${getAttr('br')}>`)
+            // Restore
+            .replace(/§N§/g, '\n')
+            .replace(/§P§/g, '</p><p>');
+        
+        // Restore protected blocks
+        blocks.forEach((b, i) => html = html.replace(`§B${i}§`, b));
+        
+        html = '<p>' + html + '</p>';
+    } else {
+        // Standard: two spaces at end of line for line breaks
+        html = html.replace(/  $/gm, `<br${getAttr('br')}>`);
+        
+        // Paragraphs (double newlines)
+        // Don't add </p> after block elements (they're not in paragraphs)
+        html = html.replace(/\n\n+/g, (match, offset) => {
+            // Check if we're after a block element closing tag
+            const before = html.substring(0, offset);
+            if (before.match(/<\/(h[1-6]|blockquote|ul|ol|table|pre|hr)>$/)) {
+                return '<p>';  // Just open a new paragraph
+            }
+            return '</p><p>';  // Normal paragraph break
+        });
+        html = '<p>' + html + '</p>';
+    }
     
     // Clean up empty paragraphs and unwrap block elements
     const cleanupPatterns = [
@@ -240,26 +306,39 @@ function quikdown(markdown, options = {}) {
         html = html.replace(pattern, replacement);
     });
     
+    // Fix orphaned closing </p> tags after block elements
+    // When a paragraph follows a block element, ensure it has opening <p>
+    html = html.replace(/(<\/(?:h[1-6]|blockquote|ul|ol|table|pre|hr)>)\n([^<])/g, '$1\n<p>$2');
+    
     // Phase 4: Restore code blocks and inline code
     
     // Restore code blocks
     codeBlocks.forEach((block, i) => {
         let replacement;
         
-        if (block.custom && fence_plugin) {
-            // Use custom fence plugin
-            replacement = fence_plugin(block.code, block.lang);
+        if (block.custom && fence_plugin && fence_plugin.render) {
+            // Use custom fence plugin (v1.1.0: object format with render function)
+            replacement = fence_plugin.render(block.code, block.lang);
+            
             // If plugin returns undefined, fall back to default rendering
             if (replacement === undefined) {
                 const langClass = !inline_styles && block.lang ? ` class="language-${block.lang}"` : '';
                 const codeAttr = inline_styles ? getAttr('code') : langClass;
-                replacement = `<pre${getAttr('pre')}><code${codeAttr}>${escapeHtml(block.code)}</code></pre>`;
+                const langAttr = bidirectional && block.lang ? ` data-qd-lang="${escapeHtml(block.lang)}"` : '';
+                const fenceAttr = bidirectional ? ` data-qd-fence="${escapeHtml(block.fence)}"` : '';
+                replacement = `<pre${getAttr('pre')}${fenceAttr}${langAttr}><code${codeAttr}>${escapeHtml(block.code)}</code></pre>`;
+            } else if (bidirectional) {
+                // If bidirectional and plugin provided HTML, add data attributes for roundtrip
+                replacement = replacement.replace(/^<(\w+)/, 
+                    `<$1 data-qd-fence="${escapeHtml(block.fence)}" data-qd-lang="${escapeHtml(block.lang)}" data-qd-source="${escapeHtml(block.code)}"`);
             }
         } else {
             // Default rendering
             const langClass = !inline_styles && block.lang ? ` class="language-${block.lang}"` : '';
             const codeAttr = inline_styles ? getAttr('code') : langClass;
-            replacement = `<pre${getAttr('pre')}><code${codeAttr}>${block.code}</code></pre>`;
+            const langAttr = bidirectional && block.lang ? ` data-qd-lang="${escapeHtml(block.lang)}"` : '';
+            const fenceAttr = bidirectional ? ` data-qd-fence="${escapeHtml(block.fence)}"` : '';
+            replacement = `<pre${getAttr('pre')}${fenceAttr}${langAttr}><code${codeAttr}>${block.code}</code></pre>`;
         }
         
         const placeholder = `${PLACEHOLDER_CB}${i}§`;
@@ -269,7 +348,7 @@ function quikdown(markdown, options = {}) {
     // Restore inline code
     inlineCodes.forEach((code, i) => {
         const placeholder = `${PLACEHOLDER_IC}${i}§`;
-        html = html.replace(placeholder, `<code${getAttr('code')}>${code}</code>`);
+        html = html.replace(placeholder, `<code${getAttr('code')}${dataQd('`')}>${code}</code>`);
     });
     
     return html.trim();
@@ -383,9 +462,9 @@ function buildTable(lines, getAttr) {
     let html = `<table${getAttr('table')}>\n`;
     
     // Build header
-    if (headerLines.length > 0) {
-        html += `<thead${getAttr('thead')}>\n`;
-        headerLines.forEach(line => {
+    // Note: headerLines will always have length > 0 since separatorIndex starts from 1
+    html += `<thead${getAttr('thead')}>\n`;
+    headerLines.forEach(line => {
             html += `<tr${getAttr('tr')}>\n`;
             // Handle pipes at start/end or not
             const cells = line.trim().replace(/^\|/, '').replace(/\|$/, '').split('|');
@@ -395,9 +474,8 @@ function buildTable(lines, getAttr) {
                 html += `<th${getAttr('th', alignStyle)}>${processedCell}</th>\n`;
             });
             html += '</tr>\n';
-        });
-        html += '</thead>\n';
-    }
+    });
+    html += '</thead>\n';
     
     // Build body
     if (bodyLines.length > 0) {
@@ -423,12 +501,16 @@ function buildTable(lines, getAttr) {
 /**
  * Process markdown lists (ordered and unordered)
  */
-function processLists(text, getAttr, inline_styles) {
+function processLists(text, getAttr, inline_styles, bidirectional) {
     
     const lines = text.split('\n');
     const result = [];
     let listStack = []; // Track nested lists
     
+    // Helper to escape HTML for data-qd attributes
+    const escapeHtml = (text) => text.replace(/[&<>"']/g, m => ({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'})[m]);
+    const dataQd = bidirectional ? (marker) => ` data-qd="${escapeHtml(marker)}"` : () => '';
+    
     for (let i = 0; i < lines.length; i++) {
         const line = lines[i];
         const match = line.match(/^(\s*)([*\-+]|\d+\.)\s+(.+)$/);
@@ -476,7 +558,7 @@ function processLists(text, getAttr, inline_styles) {
             }
             
             const liAttr = taskListClass || getAttr('li');
-            result.push(`<li${liAttr}>${listItemContent}</li>`);
+            result.push(`<li${liAttr}${dataQd(marker)}>${listItemContent}</li>`);
         } else {
             // Not a list item, close all lists
             while (listStack.length > 0) {
@@ -522,8 +604,7 @@ quikdown.emitStyles = function(prefix = 'quikdown-', theme = 'light') {
     
     let css = '';
     for (const [tag, style] of Object.entries(styles)) {
-        if (style) {
-            let themedStyle = style;
+        let themedStyle = style;
             
             // Apply theme overrides if dark theme
             if (theme === 'dark' && themeOverrides.dark) {
@@ -546,9 +627,8 @@ quikdown.emitStyles = function(prefix = 'quikdown-', theme = 'light') {
                     themedStyle += `;color:${themeOverrides.light._textColor}`;
                 }
             }
-            
-            css += `.${prefix}${tag} { ${themedStyle} }\n`;
-        }
+        
+        css += `.${prefix}${tag} { ${themedStyle} }\n`;
     }
     
     return css;
@@ -571,11 +651,13 @@ quikdown.configure = function(options) {
 quikdown.version = quikdownVersion;
 
 // Export for both CommonJS and ES6
+/* istanbul ignore next */
 if (typeof module !== 'undefined' && module.exports) {
     module.exports = quikdown;
 }
 
 // For browser global
+/* istanbul ignore next */
 if (typeof window !== 'undefined') {
     window.quikdown = quikdown;
 }

package/dist/quikdown.d.ts

@@ -5,17 +5,38 @@
 
 declare module 'quikdown' {
   /**
-   * Options for configuring the quikdown parser
+   * Fence plugin for custom code block rendering (v1.1.0+)
    */
-  export interface QuikdownOptions {
+  export interface FencePlugin {
     /**
-     * Custom renderer for fenced code blocks.
-     * Return undefined to use default rendering.
+     * Render markdown fence to HTML
      * @param content - The code block content (unescaped)
      * @param language - The language identifier (or empty string)
      * @returns HTML string or undefined for default rendering
      */
-    fence_plugin?: (content: string, language: string) => string | undefined;
+    render: (content: string, language: string) => string | undefined;
+    
+    /**
+     * Convert HTML element back to markdown fence (optional)
+     * @param element - The HTML element to convert
+     * @returns Fence details or null to use default
+     */
+    reverse?: (element: HTMLElement) => {
+      fence: string;
+      lang: string;
+      content: string;
+    } | null;
+  }
+  
+  /**
+   * Options for configuring the quikdown parser
+   */
+  export interface QuikdownOptions {
+    /**
+     * Custom renderer for fenced code blocks (v1.1.0: object format required)
+     * @since 1.1.0 - Must be an object with render function
+     */
+    fence_plugin?: FencePlugin;
     
     /**
      * If true, uses inline styles instead of CSS classes.
@@ -30,6 +51,20 @@ declare module 'quikdown' {
      * @default false
      */
     allow_unsafe_urls?: boolean;
+    
+    /**
+     * If true, adds data-qd attributes for bidirectional conversion.
+     * Enables HTML to Markdown conversion.
+     * @default false
+     */
+    bidirectional?: boolean;
+    
+    /**
+     * If true, single newlines become <br> tags.
+     * Useful for chat/LLM applications where Enter should create a line break.
+     * @default false
+     */
+    lazy_linefeeds?: boolean;
   }
 
   /**

package/dist/quikdown.dark.css

@@ -5,7 +5,7 @@
  * Theme with container-based scoping.
  * Usage: <div class="quikdown-dark">...content...</div>
  * 
- * @generated 2025-08-18T00:32:14.951Z
+ * @version 1.1.0
  * @source tools/generateThemeCSS.js
  */