@jhits/plugin-newsletter 0.0.6 → 0.0.8

package/src/types/block.ts

@@ -1,275 +0,0 @@
-/**
- * Core Block Types for Newsletter Plugin
- * Foundation for the Block-Based Architecture
- * Multi-Tenant Plugin Architecture - Blocks are provided by client applications
- * 
- * This is a headless implementation - no styling dependencies
- */
-
-import React from 'react';
-
-/**
- * Base Block Interface
- * Every block in the system extends this structure
- */
-export interface Block {
-    /** Unique identifier for the block */
-    id: string;
-    
-    /** Block type identifier (e.g., 'heading', 'paragraph', 'image') */
-    type: string;
-    
-    /** Block-specific data (varies by type) */
-    data: Record<string, unknown>;
-    
-    /** 
-     * Child blocks (for container blocks like Section, Columns)
-     * Can be an array of Block IDs (for flat storage) or Block objects (for nested structure)
-     */
-    children?: string[] | Block[];
-    
-    /** Optional metadata for editor state, styling, etc. */
-    meta?: {
-        /** Visual order in the editor */
-        order?: number;
-        /** Whether block is collapsed in editor */
-        collapsed?: boolean;
-        /** Custom styling overrides */
-        style?: Record<string, string>;
-        /** Editor-specific flags */
-        flags?: string[];
-        /** Column index (for column container blocks) */
-        columnIndex?: number;
-        /** Additional custom metadata */
-        [key: string]: unknown;
-    };
-}
-
-/**
- * Block Edit Component Props
- * Props passed to the Edit component in the dashboard editor
- */
-export interface BlockEditProps {
-    /** The block being edited */
-    block: Block;
-    
-    /** Update handler - call this to update the block's data */
-    onUpdate: (data: Partial<Block['data']>) => void;
-    
-    /** Delete handler - call this to remove the block */
-    onDelete?: () => void;
-    
-    /** Duplicate handler - call this to duplicate the block */
-    onDuplicate?: () => void;
-    
-    /** Whether the block is currently selected */
-    isSelected?: boolean;
-    
-    /** Whether the block is currently being dragged */
-    isDragging?: boolean;
-    
-    /** Focus mode state */
-    focusMode?: boolean;
-    
-    /** Child blocks (for container blocks like Section, Columns) */
-    childBlocks?: Block[];
-    
-    /** Add a child block (for container blocks) */
-    onChildBlockAdd?: (type: string, index?: number, containerId?: string) => void;
-    
-    /** Update a child block (for container blocks) */
-    onChildBlockUpdate?: (id: string, data: Partial<Block['data']>, containerId?: string) => void;
-    
-    /** Delete a child block (for container blocks) */
-    onChildBlockDelete?: (id: string, containerId?: string) => void;
-    
-    /** Move a child block (for container blocks) */
-    onChildBlockMove?: (id: string, newIndex: number, containerId?: string) => void;
-}
-
-/**
- * Block Preview Component Props
- * Props passed to the Preview component for headless rendering
- */
-export interface BlockPreviewProps {
-    /** The block to render */
-    block: Block;
-    
-    /** Additional rendering context */
-    context?: {
-        /** Site ID */
-        siteId?: string;
-        /** Locale */
-        locale?: string;
-        /** Custom render props */
-        [key: string]: unknown;
-    };
-    
-    /** Child blocks (for container blocks like Section, Columns) */
-    childBlocks?: Block[];
-    
-    /** Render a child block (for container blocks) */
-    renderChild?: (childBlock: Block) => React.ReactElement;
-}
-
-/**
- * Block Email Component Props
- * Props passed to the Email component for email rendering
- */
-export interface BlockEmailProps {
-    /** The block to render */
-    block: Block;
-    
-    /** Additional rendering context */
-    context?: {
-        /** Site ID */
-        siteId?: string;
-        /** Locale */
-        locale?: string;
-        /** Base URL for images and links */
-        baseUrl?: string;
-        /** Custom render props */
-        [key: string]: unknown;
-    };
-    
-    /** Child blocks (for container blocks) */
-    childBlocks?: Block[];
-    
-    /** Render a child block to email HTML (for container blocks) */
-    renderChild?: (childBlock: Block) => string;
-}
-
-/**
- * Strict Block Component Interface
- * Every client-provided block MUST implement this interface
- */
-export interface IBlockComponent {
-    /** 
-     * Edit Component - Rendered in the dashboard editor
-     * Must use dashboard design system
-     */
-    Edit: React.ComponentType<BlockEditProps>;
-    
-    /** 
-     * Preview Component - Rendered in headless/frontend context
-     * Can use client's own design system
-     */
-    Preview: React.ComponentType<BlockPreviewProps>;
-    
-    /** 
-     * Email Component - OPTIONAL - Renders block as email-safe HTML string
-     * If not provided, EmailRenderer will use fallback conversion
-     * Should return email-safe HTML with inline styles
-     */
-    Email?: (props: BlockEmailProps) => string;
-    
-    /** 
-     * Icon Component - Shown in block palette
-     * Should be a simple icon (lucide-react recommended)
-     */
-    Icon?: React.ComponentType<{ className?: string }>;
-}
-
-/**
- * Block Type Definition
- * Complete definition of a block type for the registry
- */
-export interface BlockTypeDefinition {
-    /** Unique type identifier */
-    type: string;
-    
-    /** Human-readable name */
-    name: string;
-    
-    /** Description of the block (shown in tooltips) */
-    description: string;
-    
-    /** Icon component (React component) - Optional, falls back to block component's Icon */
-    icon?: React.ComponentType<{ className?: string }>;
-    
-    /** Default data structure for this block type */
-    defaultData: Record<string, unknown>;
-    
-    /** Validation schema (optional, for runtime validation) */
-    validate?: (data: Record<string, unknown>) => boolean;
-    
-    /** Whether this block can contain nested blocks */
-    isContainer?: boolean;
-    
-    /** Allowed child block types (if container) */
-    allowedChildren?: string[];
-    
-    /** Category for grouping in block palette */
-    category?: 'text' | 'media' | 'layout' | 'interactive' | 'custom';
-    
-    /** 
-     * Block Components - REQUIRED for client-provided blocks
-     * Edit and Preview components must be provided
-     */
-    components: IBlockComponent;
-}
-
-/**
- * Rich Text Formatting Configuration
- * Optional configuration for rich text formatting in text blocks
- */
-export interface RichTextFormattingConfig {
-    /** Whether bold formatting is available */
-    bold?: boolean;
-    /** Whether italic formatting is available */
-    italic?: boolean;
-    /** Whether underline formatting is available */
-    underline?: boolean;
-    /** Whether links are available */
-    links?: boolean;
-    /** Available colors (array of color values or Tailwind classes) */
-    colors?: string[];
-    /** Custom CSS classes for formatted text */
-    styles?: {
-        bold?: string;
-        italic?: string;
-        underline?: string;
-        link?: string;
-        /** Color classes mapped by color value */
-        colorClasses?: Record<string, string>;
-    };
-}
-
-/**
- * Client Block Definition
- * Simplified interface for client apps to provide blocks
- */
-export interface ClientBlockDefinition {
-    /** Unique type identifier */
-    type: string;
-    
-    /** Human-readable name */
-    name: string;
-    
-    /** Description of the block */
-    description: string;
-    
-    /** Icon component (optional) */
-    icon?: React.ComponentType<{ className?: string }>;
-    
-    /** Default data structure */
-    defaultData: Record<string, unknown>;
-    
-    /** Validation function (optional) */
-    validate?: (data: Record<string, unknown>) => boolean;
-    
-    /** Whether this block can contain nested blocks */
-    isContainer?: boolean;
-    
-    /** Allowed child block types (if container) */
-    allowedChildren?: string[];
-    
-    /** Category for grouping */
-    category?: 'text' | 'media' | 'layout' | 'interactive' | 'custom';
-    
-    /** Block components - REQUIRED */
-    components: IBlockComponent;
-    
-    /** Rich text formatting configuration (optional) */
-    richTextFormatting?: RichTextFormattingConfig;
-}

package/src/types/newsletter.ts

@@ -1,151 +0,0 @@
-/**
- * Newsletter Plugin Types
- */
-
-import { Block } from './block';
-
-export interface Subscriber {
-    _id?: string;
-    email: string;
-    language: string;
-    subscribedAt: Date | string;
-    unsubscribedAt?: Date | string;
-    status?: 'active' | 'unsubscribed';
-}
-
-export interface NewsletterSettings {
-    id: string;
-    languages: {
-        [key: string]: {
-            title: string;
-            message: string;
-        };
-    };
-    updatedAt?: Date;
-}
-
-/**
- * Newsletter Status
- */
-export type NewsletterStatus = 'draft' | 'scheduled' | 'sent' | 'archived';
-
-/**
- * Newsletter Publication Data
- */
-export interface NewsletterPublicationData {
-    /** Publication status */
-    status: NewsletterStatus;
-    
-    /** Scheduled send date (ISO string) */
-    scheduledDate?: string;
-    
-    /** Actual send date (ISO string) */
-    sentDate?: string;
-    
-    /** Author ID */
-    authorId?: string;
-    
-    /** Last modified date */
-    updatedAt?: string;
-}
-
-/**
- * Newsletter Metadata
- */
-export interface NewsletterMetadata {
-    /** Subject line */
-    subject: string;
-    
-    /** Preview text */
-    previewText?: string;
-    
-    /** Language code */
-    lang?: string;
-    
-    /** Recipient filter (all, specific language, etc.) */
-    recipientFilter?: {
-        type: 'all' | 'language' | 'custom';
-        value?: string;
-    };
-}
-
-/**
- * Complete Newsletter Structure
- * This is the headless JSON structure stored in the database
- */
-export interface Newsletter {
-    /** Unique newsletter identifier */
-    id: string;
-    
-    /** Newsletter title */
-    title: string;
-    
-    /** URL slug (unique, auto-generated from title) */
-    slug: string;
-    
-    /** Array of content blocks */
-    blocks: Block[];
-    
-    /** Publication data */
-    publication: NewsletterPublicationData;
-    
-    /** Additional metadata */
-    metadata: NewsletterMetadata;
-    
-    /** Creation timestamp */
-    createdAt: string;
-    
-    /** Last update timestamp */
-    updatedAt: string;
-    
-    /** Version number for revision tracking */
-    version?: number;
-}
-
-/**
- * Newsletter List Item (for list views)
- * Lightweight version of Newsletter for performance
- */
-export interface NewsletterListItem {
-    id: string;
-    title: string;
-    slug: string;
-    status: NewsletterStatus;
-    subject: string;
-    scheduledDate?: string;
-    sentDate?: string;
-    authorId?: string;
-    updatedAt: string;
-    recipientCount?: number;
-}
-
-/**
- * Newsletter Filter Options
- */
-export interface NewsletterFilterOptions {
-    status?: NewsletterStatus | NewsletterStatus[];
-    language?: string;
-    authorId?: string;
-    search?: string;
-    dateFrom?: string;
-    dateTo?: string;
-    limit?: number;
-    skip?: number;
-    sortBy?: 'date' | 'title' | 'updatedAt' | 'sentDate';
-    sortOrder?: 'asc' | 'desc';
-}
-
-export interface NewsletterApiConfig {
-    getDb: () => Promise<{ db: () => any }>;
-    getUserId?: (req: any) => Promise<string | null>;
-    emailConfig?: {
-        host: string;
-        port: number;
-        user: string;
-        password: string;
-        from: string;
-    };
-    baseUrl?: string;
-    collectionName?: string;
-    [key: string]: any;
-}

package/src/types/registry.ts

@@ -1,14 +0,0 @@
-/**
- * Registry types for newsletter plugin
- */
-
-export interface BlockRegistry {
-    register(definition: any): void;
-    get(type: string): any | undefined;
-    getAll(): any[];
-    has(type: string): boolean;
-    clear(): void;
-}
-
-export type BlockTypeDefinition = any;
-export type ClientBlockDefinition = any;

package/src/views/CanvasEditor/BlockWrapper.tsx

@@ -1,143 +0,0 @@
-/**
- * Block Wrapper Component
- * Notion-style minimal block wrapper with simple hover controls
- */
-
-'use client';
-
-import React, { useState, useEffect, useRef } from 'react';
-import { Trash2 } from 'lucide-react';
-import { Block } from '../../types/block';
-import { blockRegistry } from '../../registry/BlockRegistry';
-import { getChildBlocks, isContainerBlock } from '../../lib/utils/blockHelpers';
-import { useEditor } from '../../state/EditorContext';
-import { SlashCommandDetector } from './components/SlashCommandDetector';
-import type { useSlashCommand } from './hooks/useSlashCommand';
-
-export interface BlockWrapperProps {
-    block: Block;
-    onUpdate: (data: Partial<Block['data']>) => void;
-    onDelete: () => void;
-    onMoveUp?: () => void;
-    onMoveDown?: () => void;
-    /** All blocks in the editor (for resolving child block IDs) */
-    allBlocks?: Block[];
-    /** Slash command handler */
-    slashCommand?: ReturnType<typeof useSlashCommand>;
-    /** Index of this block */
-    blockIndex?: number;
-    /** Callback to add a new block below this one */
-    onAddBlockBelow?: (blockType: string) => void;
-}
-
-export function BlockWrapper({
-    block,
-    onUpdate,
-    onDelete,
-    onMoveUp,
-    onMoveDown,
-    allBlocks = [],
-    slashCommand,
-    blockIndex,
-    onAddBlockBelow,
-}: BlockWrapperProps) {
-    const [isHovered, setIsHovered] = useState(false);
-    const { state } = useEditor();
-    const blockDefinition = blockRegistry.get(block.type);
-
-    // Check if this is a container block
-    const isContainer = isContainerBlock(block, blockRegistry);
-    const childBlocks = isContainer && block.children && Array.isArray(block.children) && block.children.length > 0
-        ? (typeof block.children[0] === 'object'
-            ? block.children as Block[]
-            : getChildBlocks(block, state.blocks))
-        : [];
-
-    if (!blockDefinition) {
-        return (
-            <div className="p-4 border border-red-300 dark:border-red-700 rounded-lg bg-red-50 dark:bg-red-900/20">
-                <p className="text-sm text-red-600 dark:text-red-400">
-                    Unknown block type: {block.type}
-                </p>
-            </div>
-        );
-    }
-
-    const EditComponent = blockDefinition.components.Edit;
-
-    // Store block ID when hovering for paste context
-    useEffect(() => {
-        if (isHovered) {
-            if (typeof window !== 'undefined') {
-                (window as any).__NEWSLETTER_EDITOR_HOVERED_BLOCK_ID__ = block.id;
-            }
-        }
-    }, [isHovered, block.id]);
-
-    return (
-        <div
-            className="group relative flex items-start gap-1 py-0.5"
-            onMouseEnter={() => setIsHovered(true)}
-            onMouseLeave={() => setIsHovered(false)}
-            data-block-wrapper
-            data-block-id={block.id}
-        >
-            {/* Block Content */}
-            <div className="flex-1 min-w-0 email-block-content">
-                {block.type === 'paragraph' && slashCommand ? (
-                    <SlashCommandDetector
-                        blockId={block.id}
-                        blockIndex={blockIndex || 0}
-                        blockType={block.type}
-                        content={(block.data.html as string) || (block.data.text as string) || ''}
-                        onContentChange={(content) => {
-                            onUpdate({ html: content, text: content.replace(/<[^>]*>/g, '') });
-                        }}
-                        slashCommand={slashCommand}
-                        onAddBlockBelow={onAddBlockBelow}
-                    >
-                        <div className="email-block-wrapper">
-                            <EditComponent
-                                block={block}
-                                onUpdate={onUpdate}
-                                onDelete={onDelete}
-                                isSelected={state.selectedBlockId === block.id}
-                                childBlocks={childBlocks}
-                            />
-                        </div>
-                    </SlashCommandDetector>
-                ) : (
-                    <div className="email-block-wrapper">
-                        <EditComponent
-                            block={block}
-                            onUpdate={onUpdate}
-                            onDelete={onDelete}
-                            isSelected={state.selectedBlockId === block.id}
-                            childBlocks={childBlocks}
-                        />
-                    </div>
-                )}
-            </div>
-
-            {/* Delete Button - Visible on Hover */}
-            <div
-                className={`flex-shrink-0 w-6 flex items-start justify-center pt-1 transition-opacity duration-150 ${
-                    isHovered ? 'opacity-100' : 'opacity-0'
-                }`}
-            >
-                <button
-                    onClick={(e) => {
-                        e.stopPropagation();
-                        if (confirm('Delete this block?')) {
-                            onDelete();
-                        }
-                    }}
-                    className="p-1 -mr-1 hover:bg-red-50 dark:hover:bg-red-900/20 rounded transition-colors"
-                    title="Delete block"
-                >
-                    <Trash2 size={16} className="text-neutral-400 dark:text-neutral-500 hover:text-red-500 dark:hover:text-red-400 transition-colors" />
-                </button>
-            </div>
-        </div>
-    );
-}