quasar-ui-danx 0.4.99 → 0.5.1

package/src/helpers/formats/markdown/parseInline.ts

@@ -0,0 +1,124 @@
+/**
+ * Inline markdown element parser
+ * Handles: bold, italic, strikethrough, highlight, superscript, subscript,
+ * links, images, reference-style links, footnotes, autolinks, code
+ */
+
+import { escapeHtml } from "./escapeHtml";
+import { applyEscapes, revertEscapes } from "./escapeSequences";
+import { getLinkRefs, getFootnotes } from "./state";
+
+/**
+ * Parse inline markdown elements within text
+ * Order matters: more specific patterns first
+ */
+export function parseInline(text: string, sanitize: boolean = true): string {
+	if (!text) return "";
+
+	const currentLinkRefs = getLinkRefs();
+	const currentFootnotes = getFootnotes();
+
+	// Escape HTML if sanitizing (before applying markdown)
+	let result = sanitize ? escapeHtml(text) : text;
+
+	// 1. ESCAPE SEQUENCES - Pre-process backslash escapes to placeholders
+	// Must be first so escaped characters aren't treated as markdown
+	result = applyEscapes(result);
+
+	// 2. HARD LINE BREAKS - Two trailing spaces + newline becomes <br />
+	result = result.replace(/ {2,}\n/g, "<br />\n");
+
+	// 3. AUTOLINKS - Must be before regular link parsing
+	// URL autolinks: <https://example.com>
+	result = result.replace(/&lt;(https?:\/\/[^&]+)&gt;/g, '<a href="$1">$1</a>');
+	// Email autolinks: <user@example.com>
+	result = result.replace(/&lt;([a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,})&gt;/g, '<a href="mailto:$1">$1</a>');
+
+	// 4. FOOTNOTE REFERENCES: [^id]
+	// Must be before regular link/image parsing to avoid conflicts
+	result = result.replace(/\[\^([^\]]+)\]/g, (match, fnId) => {
+		const fn = currentFootnotes[fnId];
+		if (fn) {
+			return `<sup class="footnote-ref"><a href="#fn-${fnId}" id="fnref-${fnId}">[${fn.index}]</a></sup>`;
+		}
+		return match; // Keep original if footnote not defined
+	});
+
+	// 5. IMAGES: ![alt](url) - must be before links
+	result = result.replace(
+		/!\[([^\]]*)\]\(([^)]+)\)/g,
+		'<img src="$2" alt="$1" />'
+	);
+
+	// 6. INLINE LINKS: [text](url)
+	result = result.replace(
+		/\[([^\]]+)\]\(([^)]+)\)/g,
+		'<a href="$2">$1</a>'
+	);
+
+	// 7. REFERENCE-STYLE LINKS - Process after regular links
+	// Full reference: [text][ref-id]
+	result = result.replace(/\[([^\]]+)\]\[([^\]]+)\]/g, (match, text, refId) => {
+		const ref = currentLinkRefs[refId.toLowerCase()];
+		if (ref) {
+			const title = ref.title ? ` title="${escapeHtml(ref.title)}"` : "";
+			return `<a href="${ref.url}"${title}>${text}</a>`;
+		}
+		return match; // Keep original if ref not found
+	});
+
+	// Collapsed reference: [text][]
+	result = result.replace(/\[([^\]]+)\]\[\]/g, (match, text) => {
+		const ref = currentLinkRefs[text.toLowerCase()];
+		if (ref) {
+			const title = ref.title ? ` title="${escapeHtml(ref.title)}"` : "";
+			return `<a href="${ref.url}"${title}>${text}</a>`;
+		}
+		return match;
+	});
+
+	// Shortcut reference: [ref] alone (must not match [text](url) or [text][ref])
+	// Only match [word] not followed by ( or [
+	result = result.replace(/\[([^\]]+)\](?!\(|\[)/g, (match, text) => {
+		const ref = currentLinkRefs[text.toLowerCase()];
+		if (ref) {
+			const title = ref.title ? ` title="${escapeHtml(ref.title)}"` : "";
+			return `<a href="${ref.url}"${title}>${text}</a>`;
+		}
+		return match;
+	});
+
+	// 8. INLINE CODE: `code`
+	result = result.replace(/`([^`]+)`/g, "<code>$1</code>");
+
+	// 9. STRIKETHROUGH: ~~text~~ - Must be before subscript (single tilde)
+	result = result.replace(/~~([^~]+)~~/g, "<del>$1</del>");
+
+	// 10. HIGHLIGHT: ==text==
+	result = result.replace(/==([^=]+)==/g, "<mark>$1</mark>");
+
+	// 11. SUPERSCRIPT: X^2^ - Must be before subscript
+	result = result.replace(/\^([^\^]+)\^/g, "<sup>$1</sup>");
+
+	// 12. SUBSCRIPT: H~2~O - Single tilde, use negative lookbehind/lookahead to avoid ~~
+	result = result.replace(/(?<!~)~([^~]+)~(?!~)/g, "<sub>$1</sub>");
+
+	// 13. BOLD + ITALIC: ***text*** or ___text___
+	result = result.replace(/\*\*\*([^*]+)\*\*\*/g, "<strong><em>$1</em></strong>");
+	result = result.replace(/___([^_]+)___/g, "<strong><em>$1</em></strong>");
+
+	// 14. BOLD: **text** or __text__
+	result = result.replace(/\*\*([^*]+)\*\*/g, "<strong>$1</strong>");
+	result = result.replace(/__([^_]+)__/g, "<strong>$1</strong>");
+
+	// 15. ITALIC: *text* or _text_ (but not inside words for underscores)
+	// For asterisks, match any single asterisk pairs
+	result = result.replace(/\*([^*]+)\*/g, "<em>$1</em>");
+	// For underscores, only match at word boundaries
+	result = result.replace(/(^|[^a-zA-Z0-9])_([^_]+)_([^a-zA-Z0-9]|$)/g, "$1<em>$2</em>$3");
+
+	// LAST: Restore escaped characters from placeholders to literals
+	result = revertEscapes(result);
+
+	return result;
+}

package/src/helpers/formats/markdown/render/index.ts

@@ -0,0 +1,92 @@
+/**
+ * Token renderer orchestrator
+ * Renders block tokens to HTML
+ */
+
+import type { BlockToken } from "../types";
+import { parseInline } from "../parseInline";
+import { escapeHtml } from "../escapeHtml";
+import { tokenizeBlocks } from "../tokenize";
+import { renderUnorderedList, renderOrderedList, renderTaskList } from "./renderList";
+import { renderTable } from "./renderTable";
+
+/**
+ * Render tokens to HTML
+ */
+export function renderTokens(tokens: BlockToken[], sanitize: boolean): string {
+	const htmlParts: string[] = [];
+
+	for (const token of tokens) {
+		switch (token.type) {
+			case "heading": {
+				const content = parseInline(token.content, sanitize);
+				htmlParts.push(`<h${token.level}>${content}</h${token.level}>`);
+				break;
+			}
+
+			case "code_block": {
+				// Always escape code block content for safety
+				const escapedContent = escapeHtml(token.content);
+				const langAttr = token.language ? ` class="language-${escapeHtml(token.language)}"` : "";
+				htmlParts.push(`<pre><code${langAttr}>${escapedContent}</code></pre>`);
+				break;
+			}
+
+			case "blockquote": {
+				// Recursively parse blockquote content
+				const innerTokens = tokenizeBlocks(token.content);
+				const innerHtml = renderTokens(innerTokens, sanitize);
+				htmlParts.push(`<blockquote>${innerHtml}</blockquote>`);
+				break;
+			}
+
+			case "ul": {
+				htmlParts.push(renderUnorderedList(token, sanitize, renderTokens));
+				break;
+			}
+
+			case "ol": {
+				htmlParts.push(renderOrderedList(token, sanitize, renderTokens));
+				break;
+			}
+
+			case "task_list": {
+				htmlParts.push(renderTaskList(token, sanitize));
+				break;
+			}
+
+			case "table": {
+				htmlParts.push(renderTable(token, sanitize));
+				break;
+			}
+
+			case "dl": {
+				let dlHtml = "<dl>";
+				for (const item of token.items) {
+					dlHtml += `<dt>${parseInline(item.term, sanitize)}</dt>`;
+					for (const def of item.definitions) {
+						dlHtml += `<dd>${parseInline(def, sanitize)}</dd>`;
+					}
+				}
+				dlHtml += "</dl>";
+				htmlParts.push(dlHtml);
+				break;
+			}
+
+			case "hr": {
+				htmlParts.push("<hr />");
+				break;
+			}
+
+			case "paragraph": {
+				const content = parseInline(token.content, sanitize);
+				// Convert single newlines to <br> within paragraphs
+				const withBreaks = content.replace(/\n/g, "<br />");
+				htmlParts.push(`<p>${withBreaks}</p>`);
+				break;
+			}
+		}
+	}
+
+	return htmlParts.join("\n");
+}

package/src/helpers/formats/markdown/render/renderFootnotes.ts

@@ -0,0 +1,30 @@
+/**
+ * Footnotes section renderer
+ * Renders the footnotes section at the end of the document
+ */
+
+import type { FootnoteDefinition } from "../types";
+import { parseInline } from "../parseInline";
+
+/**
+ * Render the footnotes section
+ */
+export function renderFootnotesSection(
+	footnotes: Record<string, FootnoteDefinition>,
+	sanitize: boolean
+): string {
+	const footnoteEntries = Object.entries(footnotes)
+		.sort((a, b) => a[1].index - b[1].index);
+
+	let html = "<section class=\"footnotes\"><hr /><ol class=\"footnote-list\">";
+
+	for (const [fnId, fn] of footnoteEntries) {
+		html += `<li id="fn-${fnId}" class="footnote-item">`;
+		html += parseInline(fn.content, sanitize);
+		html += ` <a href="#fnref-${fnId}" class="footnote-backref">\u21a9</a>`;
+		html += "</li>";
+	}
+
+	html += "</ol></section>";
+	return html;
+}

package/src/helpers/formats/markdown/render/renderList.ts

@@ -0,0 +1,69 @@
+/**
+ * Unified list renderer for ordered and unordered lists
+ * DRY implementation handling both list types
+ */
+
+import type { BlockToken, ListItem } from "../types";
+import { parseInline } from "../parseInline";
+
+/**
+ * Render list items recursively
+ */
+function renderListItems(
+	items: ListItem[],
+	sanitize: boolean,
+	renderTokensFn: (tokens: BlockToken[], sanitize: boolean) => string
+): string {
+	return items
+		.map((item) => {
+			let content = parseInline(item.content, sanitize);
+			if (item.children && item.children.length > 0) {
+				content += renderTokensFn(item.children, sanitize);
+			}
+			return `<li>${content}</li>`;
+		})
+		.join("");
+}
+
+/**
+ * Render an unordered list token
+ */
+export function renderUnorderedList(
+	token: Extract<BlockToken, { type: "ul" }>,
+	sanitize: boolean,
+	renderTokensFn: (tokens: BlockToken[], sanitize: boolean) => string
+): string {
+	const items = renderListItems(token.items, sanitize, renderTokensFn);
+	return `<ul>${items}</ul>`;
+}
+
+/**
+ * Render an ordered list token
+ */
+export function renderOrderedList(
+	token: Extract<BlockToken, { type: "ol" }>,
+	sanitize: boolean,
+	renderTokensFn: (tokens: BlockToken[], sanitize: boolean) => string
+): string {
+	const items = renderListItems(token.items, sanitize, renderTokensFn);
+	const startAttr = token.start !== 1 ? ` start="${token.start}"` : "";
+	return `<ol${startAttr}>${items}</ol>`;
+}
+
+/**
+ * Render a task list token
+ */
+export function renderTaskList(
+	token: Extract<BlockToken, { type: "task_list" }>,
+	sanitize: boolean
+): string {
+	const items = token.items
+		.map((item) => {
+			const checkbox = item.checked
+				? "<input type=\"checkbox\" checked disabled />"
+				: "<input type=\"checkbox\" disabled />";
+			return `<li class="task-list-item">${checkbox} ${parseInline(item.content, sanitize)}</li>`;
+		})
+		.join("");
+	return `<ul class="task-list">${items}</ul>`;
+}

package/src/helpers/formats/markdown/render/renderTable.ts

@@ -0,0 +1,38 @@
+/**
+ * Table renderer
+ * Handles alignment styles and cell rendering
+ */
+
+import type { BlockToken, TableAlignment } from "../types";
+import { parseInline } from "../parseInline";
+
+/**
+ * Generate style attribute for alignment
+ */
+function alignStyle(align: TableAlignment): string {
+	if (!align) return "";
+	return ` style="text-align: ${align}"`;
+}
+
+/**
+ * Render a table token
+ */
+export function renderTable(
+	token: Extract<BlockToken, { type: "table" }>,
+	sanitize: boolean
+): string {
+	const headerCells = token.headers
+		.map((h, idx) => `<th${alignStyle(token.alignments[idx])}>${parseInline(h, sanitize)}</th>`)
+		.join("");
+
+	const bodyRows = token.rows
+		.map(row => {
+			const cells = row
+				.map((cell, idx) => `<td${alignStyle(token.alignments[idx])}>${parseInline(cell, sanitize)}</td>`)
+				.join("");
+			return `<tr>${cells}</tr>`;
+		})
+		.join("");
+
+	return `<table><thead><tr>${headerCells}</tr></thead><tbody>${bodyRows}</tbody></table>`;
+}

package/src/helpers/formats/markdown/state.ts

@@ -0,0 +1,58 @@
+/**
+ * Parser state management for markdown rendering
+ * Handles link references and footnotes across tokenization and rendering phases
+ */
+
+import type { LinkReference, FootnoteDefinition } from "./types";
+
+/**
+ * Module-level storage for link references extracted during tokenization
+ * Used to share link definitions between tokenizeBlocks and parseInline
+ */
+let currentLinkRefs: Record<string, LinkReference> = {};
+
+/**
+ * Module-level storage for footnotes extracted during tokenization
+ * Used to share footnote definitions between tokenizeBlocks and renderMarkdown
+ */
+let currentFootnotes: Record<string, FootnoteDefinition> = {};
+let footnoteCounter = 0;
+
+/**
+ * Get the current footnotes (useful for Vue component rendering)
+ */
+export function getFootnotes(): Record<string, FootnoteDefinition> {
+	return currentFootnotes;
+}
+
+/**
+ * Get the current link references
+ */
+export function getLinkRefs(): Record<string, LinkReference> {
+	return currentLinkRefs;
+}
+
+/**
+ * Set a link reference
+ */
+export function setLinkRef(id: string, ref: LinkReference): void {
+	currentLinkRefs[id] = ref;
+}
+
+/**
+ * Set a footnote definition
+ */
+export function setFootnote(id: string, content: string): void {
+	footnoteCounter++;
+	currentFootnotes[id] = { content, index: footnoteCounter };
+}
+
+/**
+ * Reset the parser state (link refs and footnotes)
+ * Call this before starting a new document parse
+ */
+export function resetParserState(): void {
+	currentLinkRefs = {};
+	currentFootnotes = {};
+	footnoteCounter = 0;
+}

package/src/helpers/formats/markdown/tokenize/extractDefinitions.ts

@@ -0,0 +1,39 @@
+/**
+ * Definition extraction for link references and footnotes
+ * First-pass processing to collect definitions before tokenization
+ */
+
+import { setLinkRef, setFootnote } from "../state";
+
+/**
+ * Extract link reference and footnote definitions from lines
+ * Returns the filtered lines with definitions removed
+ */
+export function extractDefinitions(rawLines: string[]): string[] {
+	const lines: string[] = [];
+
+	for (const line of rawLines) {
+		// Match footnote definition: [^id]: content
+		const footnoteDefMatch = line.match(/^\s*\[\^([^\]]+)\]:\s+(.+)$/);
+		if (footnoteDefMatch) {
+			const [, fnId, content] = footnoteDefMatch;
+			setFootnote(fnId, content);
+			// Don't add this line to filtered output (remove from rendered content)
+			continue;
+		}
+
+		// Match link definition: [ref-id]: URL "optional title"
+		// URL can optionally be wrapped in angle brackets
+		const refMatch = line.match(/^\s*\[([^\]]+)\]:\s+<?([^>\s]+)>?(?:\s+["']([^"']+)["'])?\s*$/);
+
+		if (refMatch) {
+			const [, refId, url, title] = refMatch;
+			setLinkRef(refId.toLowerCase(), { url, title });
+			// Don't add this line to filtered output (remove from rendered content)
+		} else {
+			lines.push(line);
+		}
+	}
+
+	return lines;
+}

package/src/helpers/formats/markdown/tokenize/index.ts

@@ -0,0 +1,139 @@
+/**
+ * Block tokenizer orchestrator
+ * Coordinates all block-level parsers to tokenize markdown
+ */
+
+import type { BlockToken } from "../types";
+import { extractDefinitions } from "./extractDefinitions";
+import { parseFencedCodeBlock, parseIndentedCodeBlock } from "./parseCodeBlock";
+import { parseAtxHeading, parseSetextHeading } from "./parseHeading";
+import { parseList } from "./parseList";
+import { parseTable } from "./parseTable";
+import { parseBlockquote } from "./parseBlockquote";
+import { parseTaskList } from "./parseTaskList";
+import { parseDefinitionList } from "./parseDefinitionList";
+import { parseHorizontalRule } from "./parseHorizontalRule";
+import { parseParagraph } from "./parseParagraph";
+import { getIndent } from "./utils";
+
+/**
+ * Tokenize markdown into block-level elements
+ */
+export function tokenizeBlocks(markdown: string): BlockToken[] {
+	const tokens: BlockToken[] = [];
+	const rawLines = markdown.split("\n");
+
+	// First pass: Extract link reference and footnote definitions
+	const lines = extractDefinitions(rawLines);
+
+	let i = 0;
+
+	while (i < lines.length) {
+		const line = lines[i];
+		const trimmedLine = line.trim();
+
+		// Skip empty lines between blocks
+		if (!trimmedLine) {
+			i++;
+			continue;
+		}
+
+		// Try parsers in priority order
+		let result;
+
+		// 1. Fenced code blocks: ```language ... ```
+		result = parseFencedCodeBlock(lines, i);
+		if (result) {
+			tokens.push(result.token);
+			i = result.endIndex;
+			continue;
+		}
+
+		// 2. ATX-style headings: # through ######
+		result = parseAtxHeading(line, i);
+		if (result) {
+			tokens.push(result.token);
+			i = result.endIndex;
+			continue;
+		}
+
+		// 3. Setext-style headings: text followed by === or ---
+		// Must check BEFORE hr detection since --- could be either
+		result = parseSetextHeading(lines, i);
+		if (result) {
+			tokens.push(result.token);
+			i = result.endIndex;
+			continue;
+		}
+
+		// 4. Horizontal rules: ---, ***, ___
+		result = parseHorizontalRule(line, i);
+		if (result) {
+			tokens.push(result.token);
+			i = result.endIndex;
+			continue;
+		}
+
+		// 5. Blockquotes: > text
+		result = parseBlockquote(lines, i);
+		if (result) {
+			tokens.push(result.token);
+			i = result.endIndex;
+			continue;
+		}
+
+		// 6. Task lists: - [ ] or - [x]
+		// Must be before regular unordered list detection
+		result = parseTaskList(lines, i);
+		if (result) {
+			tokens.push(result.token);
+			i = result.endIndex;
+			continue;
+		}
+
+		// 7. Lists: unordered (-, *, +) and ordered (1., 2., etc.)
+		if (/^[-*+]\s+/.test(trimmedLine) || /^\d+\.\s+/.test(trimmedLine)) {
+			const listResult = parseList(lines, i, getIndent(line));
+			tokens.push(...listResult.tokens);
+			i = listResult.endIndex;
+			continue;
+		}
+
+		// 8. Indented code blocks: 4+ spaces or tab at start
+		result = parseIndentedCodeBlock(lines, i);
+		if (result) {
+			tokens.push(result.token);
+			i = result.endIndex;
+			continue;
+		}
+
+		// 9. Tables: | col | col |
+		result = parseTable(lines, i);
+		if (result) {
+			tokens.push(result.token);
+			i = result.endIndex;
+			continue;
+		}
+
+		// 10. Definition lists: Term\n: Definition
+		result = parseDefinitionList(lines, i);
+		if (result) {
+			tokens.push(result.token);
+			i = result.endIndex;
+			continue;
+		}
+
+		// 11. Paragraphs (fallback): collect consecutive non-empty lines
+		result = parseParagraph(lines, i);
+		if (result) {
+			tokens.push(result.token);
+			i = result.endIndex;
+			continue;
+		}
+
+		// Should never reach here, but advance to prevent infinite loop
+		i++;
+	}
+
+	return tokens;
+}

package/src/helpers/formats/markdown/tokenize/parseBlockquote.ts

@@ -0,0 +1,34 @@
+/**
+ * Blockquote parser
+ * Handles > prefixed content
+ */
+
+import type { ParseResult } from "../types";
+
+/**
+ * Parse a blockquote section
+ */
+export function parseBlockquote(lines: string[], index: number): ParseResult | null {
+	const trimmedLine = lines[index].trim();
+
+	if (!trimmedLine.startsWith(">")) {
+		return null;
+	}
+
+	const quoteLines: string[] = [];
+	let i = index;
+
+	while (i < lines.length && lines[i].trim().startsWith(">")) {
+		// Remove the leading > and optional space
+		quoteLines.push(lines[i].trim().replace(/^>\s?/, ""));
+		i++;
+	}
+
+	return {
+		token: {
+			type: "blockquote",
+			content: quoteLines.join("\n")
+		},
+		endIndex: i
+	};
+}