email-editor-core 0.0.4

package/dist/index.js

@@ -0,0 +1,260 @@
+/**
+ * EMAIL GENERATOR CORE - MAIN EXPORT
+ *
+ * Block-based HTML email generator with strict validation and sanitization.
+ * Rock-solid foundation for marketing email systems.
+ */
+import { OPEN_FUND_CONFIG, CLOSE_FUND_CONFIG, NEWSLETTER_CONFIG, TEMPLATE_CONFIG_REGISTRY, getTemplateConfig, BLOCK_CONSTRAINT_MESSAGES, } from "./template-config.js";
+import { blockTypeAllowedRule, blockCountConstraintRule, totalBlockCountRule, mandatoryBlocksRule, blockIdUniquenessRule, blockContentValidationRule, colorFormatRule, blockOrderRule, fixedSectionsRule, validateEmailDocument, isEmailDocumentValid, getValidationSummary, } from "./validator.js";
+import { GLOBAL_SANITIZATION_CONFIG, BLOCK_SANITIZATION_CONFIG, escapeHtml, isValidUrlProtocol, stripAllHtml, sanitizeAttributes, sanitizeHtml, sanitizeTextContent, isValidUrl, sanitizeButtonLabel, sanitizeImageAlt, sanitizeBlock, getSanitizationReport, } from "./sanitizer.js";
+import { renderEmail } from "./renderer/renderEmail.js";
+import { renderBlock } from "./renderer/renderBlock.js";
+export { OPEN_FUND_CONFIG, CLOSE_FUND_CONFIG, NEWSLETTER_CONFIG, TEMPLATE_CONFIG_REGISTRY, getTemplateConfig, BLOCK_CONSTRAINT_MESSAGES, blockTypeAllowedRule, blockCountConstraintRule, totalBlockCountRule, mandatoryBlocksRule, blockIdUniquenessRule, blockContentValidationRule, colorFormatRule, blockOrderRule, fixedSectionsRule, validateEmailDocument, isEmailDocumentValid, getValidationSummary, GLOBAL_SANITIZATION_CONFIG, BLOCK_SANITIZATION_CONFIG, escapeHtml, isValidUrlProtocol, stripAllHtml, sanitizeAttributes, sanitizeHtml, sanitizeTextContent, isValidUrl, sanitizeButtonLabel, sanitizeImageAlt, sanitizeBlock, getSanitizationReport, renderEmail, renderBlock, };
+// ============================================================================
+// CONVENIENCE FUNCTIONS
+// ============================================================================
+/**
+ * Create a new email document with default structure
+ *
+ * USAGE:
+ * ```typescript
+ * const email = createEmail('open-fund', [
+ *   { type: 'title', id: 'title-1', content: 'Welcome' },
+ *   { type: 'paragraph', id: 'para-1', content: 'This is an email' }
+ * ]);
+ * ```
+ */
+export function createEmail(templateType, blocks, personalizationVars) {
+    const config = getTemplateConfig(templateType);
+    // Sanitize all blocks
+    const sanitizedBlocks = blocks.map((block) => {
+        try {
+            return sanitizeBlock(block);
+        }
+        catch (e) {
+            console.error(`Failed to sanitize block ${block.id}:`, e);
+            return block;
+        }
+    });
+    // Create email document
+    const email = {
+        id: generateUUID(),
+        templateType: templateType,
+        version: 1,
+        createdAt: new Date(),
+        updatedAt: new Date(),
+        blocks: sanitizedBlocks,
+        body: {
+            blocks: sanitizedBlocks,
+        },
+        header: {
+            logoUrl: "https://nobi.id/icons/logo-nobi-dana-kripto-black.png",
+            logoHeight: 32,
+        },
+        helpSection: {
+            title: "Butuh Bantuan untuk Mulai?",
+            description: "Tim kami siap bantu kamu! Kalau ada pertanyaan atau kendala saat registrasi dan verifikasi, langsung aja hubungi kami via:",
+            contactItems: [
+                {
+                    type: "email",
+                    label: "Email",
+                    value: "halo@nobi.id",
+                    href: "mailto:halo@nobi.id",
+                },
+                {
+                    type: "whatsapp",
+                    label: "WhatsApp",
+                    value: "+62 811-8826-624",
+                    href: "https://wa.me/628118826624",
+                },
+            ],
+            imageUrl: "https://nobi.id/images/hubungi-kami.png",
+        },
+        complianceSection: {
+            text: "PT Dana Kripto Indonesia sebagai peserta sandbox OJK",
+            sandboxNumber: "S-196/IK.01/2025",
+        },
+        footer: {
+            logoUrl: "https://nobi.id/icons/logo-nobi-dana-kripto.png",
+            companyName: "PT. Dana Kripto Indonesia",
+            address: "The Plaza Office Tower - 7th Floor, Jakarta, Indonesia",
+            socialLinks: [
+                {
+                    platform: "email",
+                    url: "mailto:halo@nobi.id",
+                },
+                {
+                    platform: "instagram",
+                    url: "https://www.instagram.com/nobidanakripto/",
+                },
+                {
+                    platform: "whatsapp",
+                    url: "https://wa.me/628118826624?text=Halo%20tim%20NOBI%2C%20saya%20butuh%20bantuan%20mengenai...%20Mohon%20dibantu%20ya.%20Terima%20kasih.",
+                },
+            ],
+        },
+        personalizationVariables: personalizationVars,
+        isValid: false,
+        validationErrors: [],
+    };
+    // Validate
+    const summary = getValidationSummary(email, false);
+    email.isValid = summary.isValid;
+    email.validationErrors = summary.errors;
+    return email;
+}
+/**
+ * Generate a comprehensive validation report for an email
+ */
+export function generateReport(email) {
+    const summary = getValidationSummary(email, true);
+    let report = `
+╔════════════════════════════════════════════════════════╗
+║  EMAIL VALIDATION REPORT                              ║
+╚════════════════════════════════════════════════════════╝
+
+Template Type:  ${email.templateType}
+Status:         ${summary.isValid ? "✅ VALID" : "❌ INVALID"}
+Blocks:         ${email.body.blocks.length}
+Errors:         ${summary.errorCount}
+Warnings:       ${summary.warningCount}
+
+`;
+    if (summary.errorCount > 0) {
+        report += `ERRORS (${summary.errorCount}):\n`;
+        report += "─".repeat(56) + "\n";
+        summary.errors.forEach((error) => {
+            report += `  [${error.code}]\n`;
+            report += `  ${error.message}\n`;
+            if (error.blockId)
+                report += `  Block: ${error.blockId}\n`;
+            report += "\n";
+        });
+    }
+    if (summary.warningCount > 0) {
+        report += `\nWARNINGS (${summary.warningCount}):\n`;
+        report += "─".repeat(56) + "\n";
+        summary.warnings.forEach((warning) => {
+            report += `  [${warning.code}]\n`;
+            report += `  ${warning.message}\n`;
+            report += "\n";
+        });
+    }
+    if (summary.isValid) {
+        report += "\n✅ All validation checks passed!\n";
+    }
+    report += "\n╔════════════════════════════════════════════════════════╗\n";
+    return report;
+}
+/**
+ * Generate UUID v4
+ */
+function generateUUID() {
+    return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c) => {
+        const r = (Math.random() * 16) | 0;
+        const v = c === "x" ? r : (r & 0x3) | 0x8;
+        return v.toString(16);
+    });
+}
+// ============================================================================
+// DOCUMENTATION
+// ============================================================================
+/**
+ * Documentation files included in this module:
+ *
+ * 📄 ARCHITECTURE.md
+ *    Complete system design, decisions, security considerations
+ *
+ * 📄 PSEUDOCODE.md
+ *    Detailed pseudocode for all major functions
+ *
+ * 📄 types.ts
+ *    TypeScript interfaces and types
+ *
+ * 📄 template-config.ts
+ *    Per-template rules and constraints
+ *
+ * 📄 validator.ts
+ *    9 validation rules and validation engine
+ *
+ * 📄 sanitizer.ts
+ *    Text sanitization and HTML cleaning
+ */
+export const DOCUMENTATION = {
+    ARCHITECTURE: "ARCHITECTURE.md",
+    PSEUDOCODE: "PSEUDOCODE.md",
+    TYPES: "types.ts",
+    TEMPLATE_CONFIG: "template-config.ts",
+    VALIDATOR: "validator.ts",
+    SANITIZER: "sanitizer.ts",
+};
+// ============================================================================
+// QUICK START GUIDE
+// ============================================================================
+/**
+ * QUICK START
+ *
+ * 1. Create an email:
+ *    ```
+ *    const email = createEmail('open-fund', [
+ *      { type: 'title', id: 'h1', content: 'Welcome' },
+ *      { type: 'paragraph', id: 'p1', content: 'Hello!' }
+ *    ]);
+ *    ```
+ *
+ * 2. Validate:
+ *    ```
+ *    const isValid = isEmailDocumentValid(email);
+ *    const summary = getValidationSummary(email);
+ *    ```
+ *
+ * 3. Get report:
+ *    ```
+ *    console.log(generateReport(email));
+ *    ```
+ *
+ * 4. Sanitize text:
+ *    ```
+ *    const clean = sanitizeTextContent(userInput, 'paragraph');
+ *    ```
+ *
+ * TEMPLATE TYPES:
+ *   - 'open-fund'   : Fund launch announcement
+ *   - 'close-fund'  : Fund closure notification
+ *   - 'newsletter'  : Educational/updates
+ *
+ * BLOCK TYPES (all templates):
+ *   - title         : Heading (h1/h2/h3)
+ *   - paragraph     : Body text with links
+ *   - image         : Responsive image (HTTPS)
+ *   - button        : Call-to-action
+ *   - divider       : Visual separator
+ *   - highlight-box : Callout/feature box
+ *
+ * VALIDATION:
+ *   Automatic checks:
+ *   ✓ Block type allowed per template
+ *   ✓ Min/max block counts per type
+ *   ✓ Total block limit
+ *   ✓ Mandatory blocks present
+ *   ✓ Unique block IDs
+ *   ✓ Content not empty
+ *   ✓ Valid colors (hex format)
+ *   ✓ Valid URLs (HTTPS for images/buttons)
+ *   ✓ Required sections present
+ *
+ * SANITIZATION:
+ *   Automatic cleaning:
+ *   ✓ Strip dangerous HTML tags
+ *   ✓ Remove event handlers
+ *   ✓ Validate and escape URLs
+ *   ✓ Escape HTML special chars
+ *   ✓ Remove inline styles
+ *   ✓ Block non-HTTPS resources
+ *
+ * SECURITY:
+ *   ✓ XSS prevention (character escaping)
+ *   ✓ URL injection prevention
+ *   ✓ Email client compatibility
+ *   ✓ Compliance section protection
+ */

package/dist/renderer/blocks/button.d.ts

@@ -0,0 +1,18 @@
+/**
+ * BUTTON BLOCK RENDERER
+ *
+ * Responsibility: Render a single button block to HTML
+ * - Receives: ButtonBlock
+ * - Returns: HTML string for this block only
+ * - Owns: All styling for button blocks
+ * - Does NOT: Know about other blocks, templates, or document structure
+ */
+import type { ButtonBlock } from "../../types.js";
+/**
+ * Render a button block to HTML
+ *
+ * @param block - The button block to render
+ * @returns HTML string for this block
+ */
+export declare function renderButtonBlock(block: ButtonBlock): string;
+//# sourceMappingURL=button.d.ts.map

package/dist/renderer/blocks/button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/renderer/blocks/button.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAElD;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,WAAW,GAAG,MAAM,CA6C5D"}

package/dist/renderer/blocks/button.js

@@ -0,0 +1,57 @@
+/**
+ * BUTTON BLOCK RENDERER
+ *
+ * Responsibility: Render a single button block to HTML
+ * - Receives: ButtonBlock
+ * - Returns: HTML string for this block only
+ * - Owns: All styling for button blocks
+ * - Does NOT: Know about other blocks, templates, or document structure
+ */
+/**
+ * Render a button block to HTML
+ *
+ * @param block - The button block to render
+ * @returns HTML string for this block
+ */
+export function renderButtonBlock(block) {
+    // Default values if not specified
+    const backgroundColor = block.backgroundColor || "#006950";
+    const textColor = block.textColor || "#ffffff";
+    const padding = block.padding || "10px 16px";
+    const borderRadius = block.borderRadius || 6;
+    const marginTop = block.marginTop || 12;
+    const paddingBottom = block.paddingBottom || 0;
+    const align = block.align || "left";
+    // Parse padding if string format like "12px 24px"
+    const paddingValue = padding;
+    // Inline styles for button link
+    const linkStyles = [
+        `background-color: ${backgroundColor}`,
+        `color: ${textColor}`,
+        `padding: ${paddingValue}`,
+        "text-decoration: none",
+        `border-radius: ${borderRadius}px`,
+        "display: inline-block",
+        "font-weight: bold",
+        "border: none",
+        "cursor: pointer",
+    ].join(";");
+    // Container styles
+    const containerStyles = [
+        `margin-top: ${marginTop}px`,
+        `padding-bottom: ${paddingBottom}px`,
+        `text-align: ${align}`,
+    ].join(";");
+    // HTML table wrapper (email compatibility)
+    return `
+    <table width="100%" cellpadding="0" cellspacing="0" border="0">
+      <tr>
+        <td style="${containerStyles}">
+          <a href="${block.href}" style="${linkStyles}">
+            ${block.label}
+          </a>
+        </td>
+      </tr>
+    </table>
+  `.trim();
+}

package/dist/renderer/blocks/divider.d.ts

@@ -0,0 +1,18 @@
+/**
+ * DIVIDER BLOCK RENDERER
+ *
+ * Responsibility: Render a single divider block to HTML
+ * - Receives: DividerBlock
+ * - Returns: HTML string for this block only
+ * - Owns: All styling for divider blocks
+ * - Does NOT: Know about other blocks, templates, or document structure
+ */
+import type { DividerBlock } from '../../types.js';
+/**
+ * Render a divider block to HTML
+ *
+ * @param block - The divider block to render
+ * @returns HTML string for this block
+ */
+export declare function renderDividerBlock(block: DividerBlock): string;
+//# sourceMappingURL=divider.d.ts.map

package/dist/renderer/blocks/divider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"divider.d.ts","sourceRoot":"","sources":["../../../src/renderer/blocks/divider.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAEnD;;;;;GAKG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,YAAY,GAAG,MAAM,CA4B9D"}

package/dist/renderer/blocks/divider.js

@@ -0,0 +1,42 @@
+/**
+ * DIVIDER BLOCK RENDERER
+ *
+ * Responsibility: Render a single divider block to HTML
+ * - Receives: DividerBlock
+ * - Returns: HTML string for this block only
+ * - Owns: All styling for divider blocks
+ * - Does NOT: Know about other blocks, templates, or document structure
+ */
+/**
+ * Render a divider block to HTML
+ *
+ * @param block - The divider block to render
+ * @returns HTML string for this block
+ */
+export function renderDividerBlock(block) {
+    // Default values if not specified
+    const color = block.color || '#e6e9ee';
+    const height = block.height || 1;
+    const margin = block.margin || 16;
+    // Inline styles for divider
+    const styles = [
+        'border: none',
+        'border-top: none',
+        `border-bottom: ${height}px solid ${color}`,
+        `padding-top: ${margin}px`,
+        `padding-bottom: ${margin}px`,
+        'width: 100%',
+    ].join(";");
+    // HTML table wrapper (email compatibility)
+    // HR element doesn't work well in email, so use a table with a line
+    return `
+    <table width="100%" cellpadding="0" cellspacing="0" border="0">
+      <tr>
+        <td style="border-bottom: ${height}px solid ${color}; height: 0;"></td>
+      </tr>
+      <tr>
+        <td style="height: ${margin}px;"></td>
+      </tr>
+    </table>
+  `.trim();
+}

package/dist/renderer/blocks/highlight.d.ts

@@ -0,0 +1,18 @@
+/**
+ * HIGHLIGHT BOX BLOCK RENDERER
+ *
+ * Responsibility: Render a single highlight box block to HTML
+ * - Receives: HighlightBoxBlock
+ * - Returns: HTML string for this block only
+ * - Owns: All styling for highlight box blocks
+ * - Does NOT: Know about other blocks, templates, or document structure
+ */
+import type { HighlightBoxBlock } from '../../types.js';
+/**
+ * Render a highlight box block to HTML
+ *
+ * @param block - The highlight box block to render
+ * @returns HTML string for this block
+ */
+export declare function renderHighlightBlock(block: HighlightBoxBlock): string;
+//# sourceMappingURL=highlight.d.ts.map

package/dist/renderer/blocks/highlight.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"highlight.d.ts","sourceRoot":"","sources":["../../../src/renderer/blocks/highlight.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAExD;;;;;GAKG;AACH,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,iBAAiB,GAAG,MAAM,CAqCrE"}

package/dist/renderer/blocks/highlight.js

@@ -0,0 +1,49 @@
+/**
+ * HIGHLIGHT BOX BLOCK RENDERER
+ *
+ * Responsibility: Render a single highlight box block to HTML
+ * - Receives: HighlightBoxBlock
+ * - Returns: HTML string for this block only
+ * - Owns: All styling for highlight box blocks
+ * - Does NOT: Know about other blocks, templates, or document structure
+ */
+/**
+ * Render a highlight box block to HTML
+ *
+ * @param block - The highlight box block to render
+ * @returns HTML string for this block
+ */
+export function renderHighlightBlock(block) {
+    // Default values if not specified
+    const padding = block.padding || '20px';
+    const borderRadius = block.borderRadius || 8;
+    const paddingBottom = block.paddingBottom || 20;
+    const borderColor = block.borderColor || 'transparent';
+    // Container styles
+    const containerStyles = [
+        `background-color: ${block.backgroundColor}`,
+        `border-radius: ${borderRadius}px`,
+        `padding-bottom: ${paddingBottom}px`,
+        'margin-top: 0',
+    ].join(";");
+    // Content styles
+    const contentStyles = [
+        `padding: ${padding}`,
+        'word-wrap: break-word',
+    ].join(';');
+    // Add border if specified
+    let borderStyle = '';
+    if (block.borderColor && block.borderColor !== 'transparent') {
+        borderStyle = `border: 1px solid ${borderColor};`;
+    }
+    // HTML table wrapper (email compatibility)
+    return `
+    <table width="100%" cellpadding="0" cellspacing="0" border="0" style="${containerStyles} ${borderStyle}">
+      <tr>
+        <td style="${contentStyles}">
+          ${block.content}
+        </td>
+      </tr>
+    </table>
+  `.trim();
+}

package/dist/renderer/blocks/image.d.ts

@@ -0,0 +1,18 @@
+/**
+ * IMAGE BLOCK RENDERER
+ *
+ * Responsibility: Render a single image block to HTML
+ * - Receives: ImageBlock
+ * - Returns: HTML string for this block only
+ * - Owns: All styling for image blocks
+ * - Does NOT: Know about other blocks, templates, or document structure
+ */
+import type { ImageBlock } from '../../types.js';
+/**
+ * Render an image block to HTML
+ *
+ * @param block - The image block to render
+ * @returns HTML string for this block
+ */
+export declare function renderImageBlock(block: ImageBlock): string;
+//# sourceMappingURL=image.d.ts.map

package/dist/renderer/blocks/image.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"image.d.ts","sourceRoot":"","sources":["../../../src/renderer/blocks/image.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAEjD;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,UAAU,GAAG,MAAM,CAkD1D"}

package/dist/renderer/blocks/image.js

@@ -0,0 +1,59 @@
+/**
+ * IMAGE BLOCK RENDERER
+ *
+ * Responsibility: Render a single image block to HTML
+ * - Receives: ImageBlock
+ * - Returns: HTML string for this block only
+ * - Owns: All styling for image blocks
+ * - Does NOT: Know about other blocks, templates, or document structure
+ */
+/**
+ * Render an image block to HTML
+ *
+ * @param block - The image block to render
+ * @returns HTML string for this block
+ */
+export function renderImageBlock(block) {
+    // Default values if not specified
+    const maxWidth = block.maxWidth || 600;
+    const width = block.width || '100%';
+    const borderRadius = block.borderRadius || 0;
+    const paddingBottom = block.paddingBottom || 16;
+    // Build image element
+    let imgTag = `<img src="${block.src}" alt="${block.alt}"`;
+    // Add width if numeric
+    if (typeof block.width === 'number') {
+        imgTag += ` width="${block.width}"`;
+    }
+    // Add height if specified
+    if (block.height) {
+        imgTag += ` height="${block.height}"`;
+    }
+    // Inline styles for image
+    const imgStyles = [
+        `max-width: ${maxWidth}px`,
+        'width: 100%',
+        'height: auto',
+        'display: block',
+        borderRadius > 0 ? `border-radius: ${borderRadius}px` : '',
+    ]
+        .filter((s) => s.length > 0)
+        .join(';');
+    imgTag += ` style="${imgStyles}" />`;
+    // Container styles
+    const containerStyles = [
+        `padding-bottom: ${paddingBottom}px`,
+        'margin-top: 0',
+        'text-align: center',
+    ].join(";");
+    // HTML table wrapper (email compatibility)
+    return `
+    <table width="100%" cellpadding="0" cellspacing="0" border="0">
+      <tr>
+        <td style="${containerStyles}">
+          ${imgTag}
+        </td>
+      </tr>
+    </table>
+  `.trim();
+}

package/dist/renderer/blocks/paragraph.d.ts

@@ -0,0 +1,18 @@
+/**
+ * PARAGRAPH BLOCK RENDERER
+ *
+ * Responsibility: Render a single paragraph block to HTML
+ * - Receives: ParagraphBlock
+ * - Returns: HTML string for this block only
+ * - Owns: All styling for paragraph blocks
+ * - Does NOT: Know about other blocks, templates, or document structure
+ */
+import type { ParagraphBlock } from '../../types.js';
+/**
+ * Render a paragraph block to HTML
+ *
+ * @param block - The paragraph block to render
+ * @returns HTML string for this block
+ */
+export declare function renderParagraphBlock(block: ParagraphBlock): string;
+//# sourceMappingURL=paragraph.d.ts.map

package/dist/renderer/blocks/paragraph.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"paragraph.d.ts","sourceRoot":"","sources":["../../../src/renderer/blocks/paragraph.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAGrD;;;;;GAKG;AACH,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,cAAc,GAAG,MAAM,CA0BlE"}

package/dist/renderer/blocks/paragraph.js

@@ -0,0 +1,41 @@
+/**
+ * PARAGRAPH BLOCK RENDERER
+ *
+ * Responsibility: Render a single paragraph block to HTML
+ * - Receives: ParagraphBlock
+ * - Returns: HTML string for this block only
+ * - Owns: All styling for paragraph blocks
+ * - Does NOT: Know about other blocks, templates, or document structure
+ */
+import { parseInlineFormatting } from '../parseInlineFormatting.js';
+/**
+ * Render a paragraph block to HTML
+ *
+ * @param block - The paragraph block to render
+ * @returns HTML string for this block
+ */
+export function renderParagraphBlock(block) {
+    // Default values if not specified
+    const color = block.color || '#334155';
+    const lineHeight = block.lineHeight || 1.6;
+    const paddingBottom = block.paddingBottom || 16;
+    const textAlign = block.textAlign || 'left';
+    // Inline styles for paragraph
+    const styles = [
+        `color: ${color}`,
+        `line-height: ${lineHeight}`,
+        `padding-bottom: ${paddingBottom}px`,
+        'margin-top: 0',
+        `text-align: ${textAlign}`,
+    ].join(";");
+    // HTML table wrapper (email compatibility)
+    return `
+    <table width="100%" cellpadding="0" cellspacing="0" border="0">
+      <tr>
+        <td style="${styles}">
+          ${parseInlineFormatting(block.content)}
+        </td>
+      </tr>
+    </table>
+  `.trim();
+}

package/dist/renderer/blocks/title.d.ts

@@ -0,0 +1,18 @@
+/**
+ * TITLE BLOCK RENDERER
+ *
+ * Responsibility: Render a single title block to HTML
+ * - Receives: TitleBlock
+ * - Returns: HTML string for this block only
+ * - Owns: All styling for title blocks
+ * - Does NOT: Know about other blocks, templates, or document structure
+ */
+import type { TitleBlock } from '../../types.js';
+/**
+ * Render a title block to HTML
+ *
+ * @param block - The title block to render
+ * @returns HTML string for this block
+ */
+export declare function renderTitleBlock(block: TitleBlock): string;
+//# sourceMappingURL=title.d.ts.map

package/dist/renderer/blocks/title.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"title.d.ts","sourceRoot":"","sources":["../../../src/renderer/blocks/title.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAGjD;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,UAAU,GAAG,MAAM,CAoC1D"}