@humanspeak/svelte-markdown
Version:
A powerful, customizable markdown renderer for Svelte with TypeScript support
60 lines (59 loc) • 2.66 kB
TypeScript
/**
* @component Parser
*
* Recursive markdown token parser that transforms tokens into Svelte components.
* This component is the core rendering engine of the markdown system, handling
* the transformation of parsed markdown tokens into their corresponding Svelte components.
*
* @example
* ```svelte
* <Parser
* tokens={parsedTokens}
* renderers={customRenderers}
* type="paragraph"
* />
* ```
*
* Features:
* - Recursive token parsing
* - Custom renderer support
* - Special handling for tables, lists, and HTML content
* - Type-safe component rendering
*
* @typedef {Object} Props
* @property {string} [type] - Token type for direct component rendering
* @property {Token[] | TokensList} [tokens] - Markdown tokens to be rendered
* @property {Tokens.TableCell[]} [header] - Table header cells for table rendering
* @property {Tokens.TableCell[][]} [rows] - Table row cells for table rendering
* @property {boolean} [ordered=false] - Whether the list is ordered (for list rendering)
* @property {Renderers} renderers - Component mapping for markdown elements
*
* Implementation Notes:
* - Uses recursive rendering for nested tokens
* - Implements special logic for tables, lists, and HTML content
* - Handles component prop spreading carefully to avoid conflicts
* - Maintains type safety through TypeScript interfaces
* - HTML token handling in table cells uses type assertions for better type safety
* - Table cell HTML content is processed with proper token nesting and attribute preservation
* - Improved HTML component rendering with proper type checking for tag properties
* - Added support for nested markdown within HTML table cells (see test at lines 311-343 in SvelteMarkdown.test.ts)
* - Token cleanup utilities handle complex nested structures (see lines 105-127 in token-cleanup.test.ts)
* - HTML parsing maintains proper structure for both simple and complex nested elements
*
*/
import Parser from './Parser.svelte';
import type { Renderers, Token, TokensList, Tokens } from './utils/markdown-parser.js';
interface Props<T extends Renderers = Renderers> {
type?: string;
tokens?: Token[] | TokensList;
header?: Tokens.TableCell[];
rows?: Tokens.TableCell[][];
ordered?: boolean;
renderers: T;
}
type $$ComponentProps = Props & {
[key: string]: unknown;
};
declare const Parser: import("svelte").Component<$$ComponentProps, {}, "">;
type Parser = ReturnType<typeof Parser>;
export default Parser;