@jhits/plugin-newsletter 0.0.16 → 0.0.17

package/src/lib/email/EmailRenderer.tsx

@@ -13,7 +13,6 @@
 
 import { Block } from '../../types/block';
 import { blockRegistry } from '../../registry/BlockRegistry';
-import { getChildBlocks } from '../utils/blockHelpers';
 
 /**
  * Email rendering context
@@ -62,15 +61,25 @@ function renderBlockByType(block: Block, context: EmailRenderContext): string {
             const level = (block.data.level as number) || 1;
             const text = (block.data.text as string) || '';
             const tag = `h${Math.min(Math.max(level, 1), 6)}`;
-            const fontSize = level === 1 ? '32px' : level === 2 ? '24px' : level === 3 ? '20px' : '18px';
-            return `<${tag} style="font-size: ${fontSize}; font-weight: bold; color: #1a2e26; margin: 20px 0 10px 0; line-height: 1.3;">${escapeHtml(text)}</${tag}>`;
+            
+            // Aligned with BotanicsAndYou heading sizes
+            let fontSize = '30px';
+            if (level === 1) fontSize = '48px';
+            if (level === 2) fontSize = '36px';
+            if (level === 3) fontSize = '30px';
+            if (level >= 4) fontSize = '20px';
+            
+            const fontWeight = level >= 4 ? '500' : 'bold';
+            
+            return `<${tag} style="font-family: 'Georgia', serif; font-size: ${fontSize}; font-weight: ${fontWeight}; color: #1a2e26; margin: 40px 0 15px 0; line-height: 1.2;">${escapeHtml(text)}</${tag}>`;
         }
 
         case 'paragraph': {
             const html = (block.data.html as string) || (block.data.text as string) || '';
             // Convert basic HTML tags to email-safe inline styles
             const emailHtml = convertHtmlToEmailSafe(html);
-            return `<p style="font-size: 15px; line-height: 1.8; color: #1a2e26; margin: 0 0 15px 0;">${emailHtml}</p>`;
+            // Aligned with BotanicsAndYou paragraph style (text-lg = 18px)
+            return `<p style="font-family: 'Georgia', serif; font-size: 18px; line-height: 1.625; color: #1a2e26; margin: 0 0 24px 0;">${emailHtml}</p>`;
         }
 
         case 'image': {
@@ -146,7 +155,7 @@ function renderBlockByType(block: Block, context: EmailRenderContext): string {
 
             const imageStyleString = imageStyles.join('; ');
 
-            let html = `<table width="100%" cellpadding="0" cellspacing="0" border="0" style="margin: 20px 0;">
+            let html = `<table width="100%" cellpadding="0" cellspacing="0" border="0" style="margin: 30px 0;">
                 <tr>
                     <td align="center">
                         <img src="${imageUrl}" alt="${escapeHtml(alt)}" style="${imageStyleString}" />
@@ -155,7 +164,7 @@ function renderBlockByType(block: Block, context: EmailRenderContext): string {
             
             if (caption) {
                 html += `<tr>
-                    <td align="center" style="padding-top: 10px; font-size: 12px; color: #666; font-style: italic;">
+                    <td align="center" style="padding-top: 10px; font-size: 14px; color: #666; font-style: italic; font-family: 'Georgia', serif;">
                         ${escapeHtml(caption)}
                     </td>
                 </tr>`;
@@ -174,10 +183,10 @@ function renderBlockByType(block: Block, context: EmailRenderContext): string {
             const itemsHtml = items.map((item, idx) => {
                 const text = typeof item === 'string' ? item : (item.html || item.text || '');
                 const emailHtml = convertHtmlToEmailSafe(text);
-                return `<li style="margin: 8px 0; padding-left: 5px; line-height: 1.8; color: #1a2e26;">${emailHtml}</li>`;
+                return `<li style="margin: 12px 0; padding-left: 5px; line-height: 1.625; color: #1a2e26;">${emailHtml}</li>`;
             }).join('');
 
-            return `<${tag} style="margin: 15px 0; padding-left: 25px; color: #1a2e26; font-size: 15px; line-height: 1.8;">${itemsHtml}</${tag}>`;
+            return `<${tag} style="font-family: 'Georgia', serif; margin: 24px 0; padding-left: 24px; color: #1a2e26; font-size: 18px; line-height: 1.625;">${itemsHtml}</${tag}>`;
         }
 
         case 'table': {
@@ -189,7 +198,7 @@ function renderBlockByType(block: Block, context: EmailRenderContext): string {
             }
 
             // Build table HTML using email-safe table structure
-            let tableHtml = `<table width="100%" cellpadding="12" cellspacing="0" border="0" style="margin: 20px 0; border-collapse: collapse; width: 100%;">`;
+            let tableHtml = `<table width="100%" cellpadding="12" cellspacing="0" border="0" style="margin: 30px 0; border-collapse: collapse; width: 100%; font-family: 'Georgia', serif;">`;
             
             rows.forEach((row, rIdx) => {
                 const isHeaderRow = rIdx === 0 && useHeader;
@@ -201,7 +210,7 @@ function renderBlockByType(block: Block, context: EmailRenderContext): string {
                 tableHtml += `<tr>`;
                 row.forEach((cell) => {
                     const cellHtml = convertHtmlToEmailSafe(cell.html || cell.text || '');
-                    tableHtml += `<${tag} style="padding: 12px; border: 1px solid #e5e7eb; text-align: left; color: ${textColor}; font-size: 15px; line-height: 1.8; background-color: ${bgColor}; font-weight: ${fontWeight};">${cellHtml}</${tag}>`;
+                    tableHtml += `<${tag} style="padding: 15px; border: 1px solid #e5e7eb; text-align: left; color: ${textColor}; font-size: 16px; line-height: 1.6; background-color: ${bgColor}; font-weight: ${fontWeight};">${cellHtml}</${tag}>`;
                 });
                 tableHtml += `</tr>`;
             });
@@ -211,7 +220,7 @@ function renderBlockByType(block: Block, context: EmailRenderContext): string {
         }
 
         case 'divider': {
-            return `<table width="100%" cellpadding="0" cellspacing="0" border="0" style="margin: 30px 0;">
+            return `<table width="100%" cellpadding="0" cellspacing="0" border="0" style="margin: 40px 0;">
                 <tr>
                     <td align="center">
                         <table width="40" cellpadding="0" cellspacing="0" border="0">
@@ -228,7 +237,7 @@ function renderBlockByType(block: Block, context: EmailRenderContext): string {
             // Generic fallback - try to extract text content
             const text = extractTextFromBlock(block);
             if (text) {
-                return `<p style="font-size: 15px; line-height: 1.8; color: #1a2e26; margin: 0 0 15px 0;">${escapeHtml(text)}</p>`;
+                return `<p style="font-family: 'Georgia', serif; font-size: 18px; line-height: 1.625; color: #1a2e26; margin: 0 0 24px 0;">${escapeHtml(text)}</p>`;
             }
             return '';
     }
@@ -302,18 +311,20 @@ export function generateNewsletterEmailHtml(
     },
     context: EmailRenderContext & {
         unsubscribeUrl?: string;
+        unsubscribeText?: string;
         footerText?: string;
         logoUrl?: string;
         logoAlt?: string;
         locale?: string;
     }
 ): string {
-    const { baseUrl = '', unsubscribeUrl, footerText, logoUrl, logoAlt = 'Logo', locale = 'en' } = context;
+    const { baseUrl = '', unsubscribeUrl, unsubscribeText: propsUnsubscribeText, footerText, logoUrl, logoAlt = 'Logo', locale = 'en' } = context;
     const contentHtml = renderBlocksToEmail(blocks, context);
     
     // Get unsubscribe text based on locale (matching welcome email)
     const isDutch = locale === 'nl';
-    const unsubscribeText = isDutch ? 'Afmelden' : 'Unsubscribe';
+    const defaultText = isDutch ? 'Afmelden' : 'Unsubscribe';
+    const unsubscribeText = propsUnsubscribeText || defaultText;
 
     // Build header HTML if logo is provided
     const headerHtml = logoUrl ? `
@@ -355,8 +366,8 @@ export function generateNewsletterEmailHtml(
         .content { 
             padding: 0 50px 40px 50px; 
             color: #1a2e26; 
-            line-height: 1.8; 
-            font-size: 15px; 
+            line-height: 1.625; 
+            font-size: 18px; 
         }
         .footer { 
             padding: 40px 50px; 
@@ -368,12 +379,12 @@ export function generateNewsletterEmailHtml(
             border-top: 1px solid #faf9f6; 
         }
         h1 { 
-            font-weight: normal; 
-            font-style: italic; 
-            font-size: 30px; 
+            font-weight: bold; 
+            font-size: 48px; 
             margin-bottom: 30px; 
             color: #1a2e26; 
-            text-align: center; 
+            text-align: left;
+            line-height: 1.2;
         }
         .divider { 
             height: 1px; 

package/src/lib/utils/config-resolver.ts

@@ -0,0 +1,71 @@
+/**
+ * Newsletter Plugin Configuration Resolver
+ * Centralizes the logic for resolving plugin settings from multiple sources
+ */
+
+import { ClientBlockDefinition } from '../../types/block';
+
+export interface ResolvedConfig {
+    customBlocks: ClientBlockDefinition[];
+    darkMode: boolean;
+    backgroundColors?: {
+        light: string;
+        dark?: string;
+    };
+    translations?: Record<string, any>;
+    unsubscribeTranslations?: Record<string, string>;
+    emailConfig?: {
+        logoUrl?: string;
+        logoAlt?: string;
+        footerText?: string;
+    };
+}
+
+/**
+ * Resolves a specific configuration value from priority sources:
+ * 1. LocalStorage (Dev overrides)
+ * 2. Component Props
+ * 3. Window Global (__JHITS_PLUGIN_PROPS__)
+ * 4. Default Value
+ */
+export function resolveConfigValue<T>(
+    key: string,
+    propValue: T | undefined,
+    defaultValue: T,
+    pluginKey: string = 'plugin-newsletter'
+): T {
+    if (typeof window === 'undefined') return propValue ?? defaultValue;
+
+    // 1. Check LocalStorage (Dev priority)
+    try {
+        const saved = localStorage.getItem(`__JHITS_PLUGIN_NEWSLETTER_CONFIG__`);
+        if (saved) {
+            const config = JSON.parse(saved);
+            if (config[key] !== undefined) return config[key];
+        }
+    } catch (e) {}
+
+    // 2. Check Props
+    if (propValue !== undefined) return propValue;
+
+    // 3. Check Window Global
+    const globalProps = (window as any).__JHITS_PLUGIN_PROPS__?.[pluginKey] || (window as any).__JHITS_PLUGIN_PROPS__?.['newsletter'];
+    if (globalProps && globalProps[key] !== undefined) return globalProps[key];
+
+    // 4. Default
+    return defaultValue;
+}
+
+/**
+ * Resolves all plugin configuration
+ */
+export function resolvePluginConfig(props: any): ResolvedConfig {
+    return {
+        customBlocks: resolveConfigValue('customBlocks', props.customBlocks, []),
+        darkMode: resolveConfigValue('darkMode', props.darkMode, true),
+        backgroundColors: resolveConfigValue('backgroundColors', props.backgroundColors, undefined),
+        translations: resolveConfigValue('translations', props.translations, undefined),
+        unsubscribeTranslations: resolveConfigValue('unsubscribeTranslations', props.unsubscribeTranslations, undefined),
+        emailConfig: resolveConfigValue('emailConfig', props.emailConfig, undefined),
+    };
+}

package/src/registry/BlockRegistry.tsx

@@ -0,0 +1,255 @@
+/**
+ * Block Registry for Newsletter Plugin
+ * Dynamic registry for all block types in system
+ * Multi-Tenant Architecture: Blocks are provided by client applications
+ * 
+ * The registry is a singleton that starts empty and is populated by client apps
+ */
+
+import React from 'react';
+import {
+    BlockTypeDefinition,
+    ClientBlockDefinition,
+    BlockEditProps,
+    BlockPreviewProps
+} from '../types/block';
+import { 
+    Type, 
+    Heading as HeadingIcon, 
+    List, 
+    Image as ImageIcon, 
+    Table as TableIcon, 
+    Minus 
+} from 'lucide-react';
+
+// --- Default Block Components ---
+
+// Paragraph
+const DefaultParagraphEdit: React.FC<BlockEditProps> = ({ block, onUpdate }) => (
+    <textarea
+        value={(block.data.text as string) || ''}
+        onChange={(e) => onUpdate({ text: e.target.value })}
+        onInput={(e) => {
+            const target = e.target as HTMLTextAreaElement;
+            target.style.height = 'auto';
+            target.style.height = `${target.scrollHeight}px`;
+        }}
+        placeholder="Type your text..."
+        className="w-full bg-transparent border-none outline-none focus:ring-0 p-0 resize-none min-h-[1.5em] font-serif text-[18px] leading-[1.625] text-[#1a2e26] overflow-hidden"
+    />
+);
+const DefaultParagraphPreview: React.FC<BlockPreviewProps> = ({ block }) => (
+    <p 
+        className="font-serif text-[18px] leading-[1.625] text-[#1a2e26]"
+        dangerouslySetInnerHTML={{ __html: (block.data.html as string) || (block.data.text as string) || '' }}
+    />
+);
+
+// Heading
+const DefaultHeadingEdit: React.FC<BlockEditProps> = ({ block, onUpdate }) => {
+    const level = (block.data.level as number) || 2;
+    const fontSize = level === 1 ? '48px' : level === 2 ? '36px' : level === 3 ? '30px' : '20px';
+    return (
+        <input
+            type="text"
+            value={(block.data.text as string) || ''}
+            onChange={(e) => onUpdate({ text: e.target.value })}
+            placeholder="Heading..."
+            style={{ fontSize, lineHeight: '1.2' }}
+            className="w-full bg-transparent border-none outline-none focus:ring-0 p-0 font-serif font-bold text-[#1a2e26]"
+        />
+    );
+};
+const DefaultHeadingPreview: React.FC<BlockPreviewProps> = ({ block }) => {
+    const level = (block.data.level as number) || 2;
+    const fontSize = level === 1 ? '48px' : level === 2 ? '36px' : level === 3 ? '30px' : '20px';
+    const Tag = `h${level}` as keyof React.JSX.IntrinsicElements;
+    return (
+        <Tag 
+            style={{ fontSize, lineHeight: '1.2' }}
+            className="font-serif font-bold text-[#1a2e26]"
+            dangerouslySetInnerHTML={{ __html: (block.data.text as string) || '' }}
+        />
+    );
+};
+
+// List
+const DefaultListEdit: React.FC<BlockEditProps> = ({ block, onUpdate }) => {
+    const items = Array.isArray(block.data.items) ? block.data.items : [''];
+    return (
+        <div className="space-y-2">
+            {items.map((item, i) => (
+                <div key={i} className="flex gap-2">
+                    <span className="text-neutral-400">•</span>
+                    <input
+                        type="text"
+                        value={typeof item === 'string' ? item : item.text || ''}
+                        onChange={(e) => {
+                            const newItems = [...items];
+                            newItems[i] = e.target.value;
+                            onUpdate({ items: newItems });
+                        }}
+                        className="flex-1 bg-transparent border-none outline-none focus:ring-0 p-0 text-[18px] leading-[1.625] font-serif"
+                    />
+                </div>
+            ))}
+            <button 
+                type="button"
+                onClick={() => onUpdate({ items: [...items, ''] })}
+                className="text-xs text-primary font-bold hover:underline"
+            >
+                + Add Item
+            </button>
+        </div>
+    );
+};
+const DefaultListPreview: React.FC<BlockPreviewProps> = ({ block }) => {
+    const items = Array.isArray(block.data.items) ? block.data.items : [];
+    const Tag = block.data.type === 'ol' ? 'ol' : 'ul';
+    return (
+        <Tag className="list-disc pl-5 space-y-1 font-serif text-[18px] leading-[1.625] text-[#1a2e26]">
+            {items.map((item, i) => (
+                <li key={i}>{typeof item === 'string' ? item : item.text || ''}</li>
+            ))}
+        </Tag>
+    );
+};
+
+// Local interface to avoid import issues
+interface IBlockRegistry {
+    register(definition: BlockTypeDefinition): void;
+    registerClientBlocks(definitions: ClientBlockDefinition[]): void;
+    get(type: string): BlockTypeDefinition | undefined;
+    getAll(): BlockTypeDefinition[];
+    has(type: string): boolean;
+    clear(): void;
+}
+
+/** 
+ * Block Registry Implementation
+ * Singleton that manages all block types in the system
+ */
+class BlockRegistryImpl implements IBlockRegistry {
+    private blocks: Map<string, BlockTypeDefinition> = new Map();
+
+    constructor() {
+        // Register default blocks on instantiation (server & client)
+        this.registerDefaultBlocks();
+    }
+
+    private registerDefaultBlocks(): void {
+        const defaults: BlockTypeDefinition[] = [
+            {
+                type: 'paragraph',
+                name: 'Paragraph',
+                description: 'Simple text paragraph',
+                icon: Type,
+                category: 'text',
+                defaultData: { text: '' },
+                components: { Edit: DefaultParagraphEdit, Preview: DefaultParagraphPreview, Icon: Type }
+            },
+            {
+                type: 'heading',
+                name: 'Heading',
+                description: 'Section heading',
+                icon: HeadingIcon,
+                category: 'text',
+                defaultData: { text: '', level: 2 },
+                components: { Edit: DefaultHeadingEdit, Preview: DefaultHeadingPreview, Icon: HeadingIcon }
+            },
+            {
+                type: 'list',
+                name: 'List',
+                description: 'Bullet or numbered list',
+                icon: List,
+                category: 'text',
+                defaultData: { items: [''], type: 'ul' },
+                components: { Edit: DefaultListEdit, Preview: DefaultListPreview, Icon: List }
+            },
+            {
+                type: 'divider',
+                name: 'Divider',
+                description: 'Horizontal separator',
+                icon: Minus,
+                category: 'layout',
+                defaultData: {},
+                components: { 
+                    Edit: () => <hr className="my-4 border-t border-neutral-200" />, 
+                    Preview: () => <hr className="my-4 border-t border-neutral-200" />, 
+                    Icon: Minus 
+                }
+            }
+        ];
+
+        for (const def of defaults) {
+            // Use register to ensure it's also added to window
+            this.register(def);
+        }
+    }
+
+    register(definition: BlockTypeDefinition): void {
+        this.blocks.set(definition.type, definition);
+        
+        // Also attach to window for cross-context access
+        if (typeof window !== 'undefined') {
+            if (!(window as any).__JHITS_NEWSLETTER_REGISTRY__) {
+                (window as any).__JHITS_NEWSLETTER_REGISTRY__ = new Map();
+            }
+            (window as any).__JHITS_NEWSLETTER_REGISTRY__.set(definition.type, definition);
+        }
+    }
+
+    /**
+     * Register multiple client blocks at once
+     * This is the primary method for client applications to register their blocks
+     */
+    registerClientBlocks(definitions: ClientBlockDefinition[]): void {
+        for (const def of definitions) {
+            if (!def.type || !def.name || !def.components) continue;
+            if (!def.components.Edit || !def.components.Preview) continue;
+
+            const blockDefinition: BlockTypeDefinition = {
+                type: def.type,
+                name: def.name,
+                description: def.description,
+                icon: def.icon || def.components.Icon,
+                defaultData: def.defaultData,
+                validate: def.validate,
+                isContainer: def.isContainer,
+                allowedChildren: def.allowedChildren,
+                category: def.category || 'custom',
+                components: def.components,
+            };
+
+            this.register(blockDefinition);
+        }
+    }
+
+    get(type: string): BlockTypeDefinition | undefined {
+        const block = this.blocks.get(type);
+        if (block) return block;
+        
+        if (typeof window !== 'undefined' && (window as any).__JHITS_NEWSLETTER_REGISTRY__) {
+            return (window as any).__JHITS_NEWSLETTER_REGISTRY__.get(type);
+        }
+        
+        return undefined;
+    }
+
+    getAll(): BlockTypeDefinition[] {
+        return Array.from(this.blocks.values());
+    }
+
+    has(type: string): boolean {
+        return this.blocks.has(type);
+    }
+
+    clear(): void {
+        this.blocks.clear();
+        this.registerDefaultBlocks(); // Re-add defaults after clear
+    }
+}
+
+// Export singleton instance
+export const BlockRegistry = new BlockRegistryImpl();
+export const blockRegistry = BlockRegistry;

package/src/state/EditorContext.tsx

@@ -40,8 +40,18 @@ export interface EditorProviderProps {
         /** Background color for dark mode (optional) */
         dark?: string;
     };
+    /** Localized strings for modular blocks in the editor */
+    translations?: Record<string, any>;
     /** If true, this editor is for the welcome email */
     isWelcomeEmail?: boolean;
+    /** Email configuration (logo, footer, etc.) */
+    emailConfig?: {
+        logoUrl?: string;
+        logoAlt?: string;
+        footerText?: string;
+    };
+    /** Global translations for unsubscribe text */
+    unsubscribeTranslations?: Record<string, string>;
 }
 
 /**
@@ -56,23 +66,44 @@ export function EditorProvider({
     customBlocks = [],
     darkMode = true,
     backgroundColors,
-    isWelcomeEmail
+    translations,
+    isWelcomeEmail,
+    emailConfig,
+    unsubscribeTranslations
 }: EditorProviderProps) {
-    // Register client blocks on mount
+    const [state, dispatch] = useReducer(
+        editorReducer,
+        { ...initialEditorState, ...initialState }
+    );
+
+    // Track registered blocks in state to trigger re-renders
+    const [registeredBlockTypes, setRegisteredBlockBlocks] = useState<string[]>(() => 
+        BlockRegistry.getAll().map(b => b.type)
+    );
+
+    // Register client blocks on mount or when they change
     useEffect(() => {
         if (customBlocks && customBlocks.length > 0) {
             try {
-                customBlocks.forEach(block => BlockRegistry.register(block));
+                BlockRegistry.registerClientBlocks(customBlocks);
+                // Update state to trigger re-render
+                setRegisteredBlockBlocks(BlockRegistry.getAll().map(b => b.type));
             } catch (error) {
                 console.error('[NewsletterEditorContext] Failed to register custom blocks:', error);
             }
         }
     }, [customBlocks]);
 
-    const [state, dispatch] = useReducer(
-        editorReducer,
-        { ...initialEditorState, ...initialState }
-    );
+    // Periodically check for new blocks in global registry (fallback for late loads)
+    useEffect(() => {
+        const interval = setInterval(() => {
+            const currentTypes = BlockRegistry.getAll().map(b => b.type);
+            if (currentTypes.length !== registeredBlockTypes.length) {
+                setRegisteredBlockBlocks(currentTypes);
+            }
+        }, 1000);
+        return () => clearInterval(interval);
+    }, [registeredBlockTypes.length]);
 
     // Use a ref to always have access to the latest state in callbacks
     const stateRef = useRef(state);
@@ -244,6 +275,10 @@ export function EditorProvider({
             dispatch,
             darkMode,
             backgroundColors,
+            translations,
+            emailConfig,
+            unsubscribeTranslations,
+            registeredBlockTypes,
             helpers: {
                 addBlock,
                 updateBlock,
@@ -259,7 +294,7 @@ export function EditorProvider({
             canUndo: historyIndex > 0 && history.length > 0,
             canRedo: historyIndex < history.length - 1,
         }),
-        [state, dispatch, darkMode, backgroundColors, addBlock, updateBlock, deleteBlock, duplicateBlock, moveBlock, loadNewsletter, resetEditor, save, undo, redo, historyIndex, history.length]
+        [state, dispatch, darkMode, backgroundColors, translations, emailConfig, unsubscribeTranslations, registeredBlockTypes, addBlock, updateBlock, deleteBlock, duplicateBlock, moveBlock, loadNewsletter, resetEditor, save, undo, redo, historyIndex, history.length]
     );
 
     return <EditorContext.Provider value={value}>{children}</EditorContext.Provider>;

package/src/state/types.ts

@@ -90,6 +90,22 @@ export interface EditorContextValue {
         dark?: string;
     };
     
+    /** Localized strings for modular blocks in the editor */
+    translations?: Record<string, any>;
+
+    /** Email configuration (logo, footer, etc.) */
+    emailConfig?: {
+        logoUrl?: string;
+        logoAlt?: string;
+        footerText?: string;
+    };
+
+    /** Global translations for unsubscribe text */
+    unsubscribeTranslations?: Record<string, string>;
+
+    /** List of registered block types (used to trigger re-renders) */
+    registeredBlockTypes: string[];
+    
     /** Helper functions for common operations */
     helpers: {
         /** Add a new block (supports nested containers via containerId) */

package/src/types/block.ts

@@ -70,6 +70,16 @@ export interface BlockEditProps {
     
     /** Focus mode state */
     focusMode?: boolean;
+
+    /** Additional rendering context */
+    context?: {
+        /** Site ID */
+        siteId?: string;
+        /** Locale */
+        locale?: string;
+        /** Custom render props (e.g. translations) */
+        [key: string]: unknown;
+    };
     
     /** Child blocks (for container blocks like Section, Columns) */
     childBlocks?: Block[];

package/src/types/newsletter.ts

@@ -79,6 +79,9 @@ export interface NewsletterMetadata {
     /** Preview text */
     previewText?: string;
     
+    /** Unsubscribe text (localized) */
+    unsubscribeText?: string;
+    
     /** Language code */
     lang?: string;