@jhits/plugin-newsletter 0.0.16 → 0.0.17

package/dist/views/CanvasEditor/BlockWrapper.js

@@ -12,7 +12,9 @@ import { useEditor } from '../../state/EditorContext';
 import { SlashCommandDetector } from './components/SlashCommandDetector';
 export function BlockWrapper({ block, onUpdate, onDelete, onMoveUp, onMoveDown, allBlocks = [], slashCommand, blockIndex, onAddBlockBelow, }) {
     const [isHovered, setIsHovered] = useState(false);
-    const { state } = useEditor();
+    const { state, translations, registeredBlockTypes } = useEditor();
+    // We use the block definition from registry
+    // The component will re-render when registeredBlockTypes changes
     const blockDefinition = blockRegistry.get(block.type);
     // Check if this is a container block
     const isContainer = isContainerBlock(block, blockRegistry);
@@ -25,6 +27,19 @@ export function BlockWrapper({ block, onUpdate, onDelete, onMoveUp, onMoveDown,
         return (_jsx("div", { className: "p-4 border border-red-300 dark:border-red-700 rounded-lg bg-red-50 dark:bg-red-900/20", children: _jsxs("p", { className: "text-sm text-red-600 dark:text-red-400", children: ["Unknown block type: ", block.type] }) }));
     }
     const EditComponent = blockDefinition.components.Edit;
+    // Helper to check if block is empty (for easier deletion)
+    const isBlockEmpty = () => {
+        if (block.type === 'paragraph' || block.type === 'heading') {
+            const text = block.data.text || '';
+            const html = block.data.html || '';
+            return text.trim() === '' && html.trim() === '';
+        }
+        if (block.type === 'list') {
+            const items = block.data.items || [];
+            return items.length === 0 || (items.length === 1 && (typeof items[0] === 'string' ? items[0].trim() === '' : items[0].text?.trim() === ''));
+        }
+        return false;
+    };
     // Store block ID when hovering for paste context
     useEffect(() => {
         if (isHovered) {
@@ -35,9 +50,15 @@ export function BlockWrapper({ block, onUpdate, onDelete, onMoveUp, onMoveDown,
     }, [isHovered, block.id]);
     return (_jsxs("div", { className: "group relative flex items-start gap-1 py-0.5", onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), "data-block-wrapper": true, "data-block-id": block.id, children: [_jsx("div", { className: "flex-1 min-w-0 email-block-content", children: block.type === 'paragraph' && slashCommand ? (_jsx(SlashCommandDetector, { blockId: block.id, blockIndex: blockIndex || 0, blockType: block.type, content: block.data.html || block.data.text || '', onContentChange: (content) => {
                         onUpdate({ html: content, text: content.replace(/<[^>]*>/g, '') });
-                    }, slashCommand: slashCommand, onAddBlockBelow: onAddBlockBelow, children: _jsx("div", { className: "email-block-wrapper", children: _jsx(EditComponent, { block: block, onUpdate: onUpdate, onDelete: onDelete, isSelected: state.selectedBlockId === block.id, childBlocks: childBlocks }) }) })) : (_jsx("div", { className: "email-block-wrapper", children: _jsx(EditComponent, { block: block, onUpdate: onUpdate, onDelete: onDelete, isSelected: state.selectedBlockId === block.id, childBlocks: childBlocks }) })) }), _jsx("div", { className: `flex-shrink-0 w-6 flex items-start justify-center pt-1 transition-opacity duration-150 ${isHovered ? 'opacity-100' : 'opacity-0'}`, children: _jsx("button", { onClick: (e) => {
+                    }, slashCommand: slashCommand, onAddBlockBelow: onAddBlockBelow, children: _jsx("div", { className: "email-block-wrapper", children: _jsx(EditComponent, { block: block, onUpdate: onUpdate, onDelete: onDelete, isSelected: state.selectedBlockId === block.id, childBlocks: childBlocks, context: {
+                                locale: state.metadata.lang || 'en',
+                                translations
+                            } }) }) })) : (_jsx("div", { className: "email-block-wrapper", children: _jsx(EditComponent, { block: block, onUpdate: onUpdate, onDelete: onDelete, isSelected: state.selectedBlockId === block.id, childBlocks: childBlocks, context: {
+                            locale: state.metadata.lang || 'en',
+                            translations
+                        } }) })) }), _jsx("div", { className: `flex-shrink-0 w-6 flex items-start justify-center pt-1 transition-opacity duration-150 ${isHovered ? 'opacity-100' : 'opacity-0'}`, children: _jsx("button", { onClick: (e) => {
                         e.stopPropagation();
-                        if (confirm('Delete this block?')) {
+                        if (isBlockEmpty() || 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", children: _jsx(Trash2, { size: 16, className: "text-neutral-400 dark:text-neutral-500 hover:text-red-500 dark:hover:text-red-400 transition-colors" }) }) })] }));

package/dist/views/CanvasEditor/CanvasEditorView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CanvasEditorView.d.ts","sourceRoot":"","sources":["../../../src/views/CanvasEditor/CanvasEditorView.tsx"],"names":[],"mappings":"AAeA,MAAM,WAAW,qBAAqB;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,qEAAqE;IACrE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,uCAAuC;IACvC,gBAAgB,CAAC,EAAE;QACf,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,CAAC,EAAE,MAAM,CAAC;KACjB,CAAC;IACF,oDAAoD;IACpD,cAAc,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,wBAAgB,gBAAgB,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,EAAE,qBAAqB,2CA4U1J"}
+{"version":3,"file":"CanvasEditorView.d.ts","sourceRoot":"","sources":["../../../src/views/CanvasEditor/CanvasEditorView.tsx"],"names":[],"mappings":"AAeA,MAAM,WAAW,qBAAqB;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,qEAAqE;IACrE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,uCAAuC;IACvC,gBAAgB,CAAC,EAAE;QACf,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,CAAC,EAAE,MAAM,CAAC;KACjB,CAAC;IACF,oDAAoD;IACpD,cAAc,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,wBAAgB,gBAAgB,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,EAAE,qBAAqB,2CA6Z1J"}

package/dist/views/CanvasEditor/CanvasEditorView.js

@@ -11,7 +11,7 @@ import { useSlashCommand } from './hooks/useSlashCommand';
 import { useNewsletterLoader, useRegisteredBlocks, useKeyboardShortcuts } from './hooks';
 import { blockRegistry } from '../../registry';
 export function CanvasEditorView({ newsletterId, darkMode, backgroundColors: propsBackgroundColors, siteId, locale, isWelcomeEmail }) {
-    const { state, helpers, dispatch, darkMode: contextDarkMode, backgroundColors: contextBackgroundColors, canUndo, canRedo } = useEditor();
+    const { state, helpers, dispatch, darkMode: contextDarkMode, backgroundColors: contextBackgroundColors, emailConfig: contextEmailConfig, canUndo, canRedo } = useEditor();
     const effectiveDarkMode = darkMode !== undefined ? darkMode : contextDarkMode;
     const effectiveBackgroundColors = propsBackgroundColors || contextBackgroundColors;
     const [isSidebarOpen, setSidebarOpen] = useState(true);
@@ -23,6 +23,12 @@ export function CanvasEditorView({ newsletterId, darkMode, backgroundColors: pro
     const [isLoadingLanguage, setIsLoadingLanguage] = useState(true);
     const [availableLanguages, setAvailableLanguages] = useState([locale || 'en']);
     const [currentLanguage, setCurrentLanguage] = useState(locale || 'en');
+    // Global branding settings from SMTP
+    const [globalUnsubscribeTranslations, setGlobalUnsubscribeTranslations] = useState({
+        en: '',
+        nl: '',
+        sv: '',
+    });
     // Get registered blocks
     const registeredBlocks = useRegisteredBlocks();
     // Newsletter loading - wait for language settings to be loaded first
@@ -65,6 +71,24 @@ export function CanvasEditorView({ newsletterId, darkMode, backgroundColors: pro
                 setPrimaryLanguage(primary);
                 setAvailableLanguages(available);
                 setCurrentLanguage(primary);
+                // Load global unsubscribe translations
+                if (smtpData.unsubscribeTranslations) {
+                    setGlobalUnsubscribeTranslations(smtpData.unsubscribeTranslations);
+                }
+                // Update emailConfig with logo from SMTP settings if available
+                if (smtpData.logoUrl) {
+                    if (typeof window !== 'undefined') {
+                        if (!window.__JHITS_PLUGIN_PROPS__)
+                            window.__JHITS_PLUGIN_PROPS__ = {};
+                        if (!window.__JHITS_PLUGIN_PROPS__['plugin-newsletter'])
+                            window.__JHITS_PLUGIN_PROPS__['plugin-newsletter'] = {};
+                        const currentConfig = window.__JHITS_PLUGIN_PROPS__['plugin-newsletter'].emailConfig || {};
+                        window.__JHITS_PLUGIN_PROPS__['plugin-newsletter'].emailConfig = {
+                            ...currentConfig,
+                            logoUrl: smtpData.logoUrl
+                        };
+                    }
+                }
             }
             catch (error) {
                 console.error('Failed to fetch language settings:', error);
@@ -75,6 +99,39 @@ export function CanvasEditorView({ newsletterId, darkMode, backgroundColors: pro
         };
         fetchLanguageSettings();
     }, []);
+    // Handle global unsubscribe text update
+    const handleGlobalUnsubscribeUpdate = async (text) => {
+        const newTranslations = {
+            ...globalUnsubscribeTranslations,
+            [currentLanguage]: text
+        };
+        // Optimistic update
+        setGlobalUnsubscribeTranslations(newTranslations);
+        // Update window props for immediate preview reflection
+        if (typeof window !== 'undefined') {
+            if (!window.__JHITS_PLUGIN_PROPS__)
+                window.__JHITS_PLUGIN_PROPS__ = {};
+            if (!window.__JHITS_PLUGIN_PROPS__['plugin-newsletter'])
+                window.__JHITS_PLUGIN_PROPS__['plugin-newsletter'] = {};
+            window.__JHITS_PLUGIN_PROPS__['plugin-newsletter'].unsubscribeTranslations = newTranslations;
+        }
+        try {
+            // We need current SMTP settings to save along with the new translation
+            const smtpResponse = await fetch('/api/plugin-newsletter/smtp');
+            const smtpData = await smtpResponse.json();
+            await fetch('/api/plugin-newsletter/smtp', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({
+                    ...smtpData,
+                    unsubscribeTranslations: newTranslations
+                }),
+            });
+        }
+        catch (error) {
+            console.error('Failed to save global unsubscribe translation:', error);
+        }
+    };
     // Handle language change for welcome email
     const handleLanguageChange = async (newLanguage) => {
         // Save current content first if dirty
@@ -164,17 +221,14 @@ export function CanvasEditorView({ newsletterId, darkMode, backgroundColors: pro
                 return;
             }
             // Replace the block in place by updating the blocks array directly
-            // This preserves the position and ID
             const newBlocks = state.blocks.map((block, idx) => {
                 if (idx === blockIndex) {
-                    // Replace this block with the new type
                     return {
                         ...block,
                         type: blockType,
                         data: { ...blockDefinition.defaultData },
                     };
                 }
-                // Keep all other blocks unchanged
                 return block;
             });
             dispatch({ type: 'SET_BLOCKS', payload: newBlocks });
@@ -185,12 +239,26 @@ export function CanvasEditorView({ newsletterId, darkMode, backgroundColors: pro
     }, [state.blocks, dispatch]);
     // Slash command hook
     const slashCommand = useSlashCommand(registeredBlocks, handleSlashCommandSelect);
+    // Lock dashboard scroll when editor is active to ensure our internal scrolling works
+    useEffect(() => {
+        if (typeof window === 'undefined')
+            return;
+        const dashboardContainer = document.querySelector('.custom-scrollbar.overflow-y-auto');
+        const originalOverflow = dashboardContainer ? dashboardContainer.style.overflow : '';
+        if (dashboardContainer) {
+            dashboardContainer.style.overflow = 'hidden';
+        }
+        return () => {
+            if (dashboardContainer) {
+                dashboardContainer.style.overflow = originalOverflow;
+            }
+        };
+    }, []);
     // Handle save
     const handleSave = async () => {
         setIsSaving(true);
         setSaveError(null);
         try {
-            // Always pass language for saving (both welcome email and regular newsletters)
             await helpers.save({ language: currentLanguage });
             setIsSaving(false);
         }
@@ -208,16 +276,8 @@ export function CanvasEditorView({ newsletterId, darkMode, backgroundColors: pro
     if (isLoadingNewsletter) {
         return (_jsx("div", { className: "h-full w-full bg-dashboard-card text-dashboard-text flex items-center justify-center", children: _jsxs("div", { className: "text-center", children: [_jsx("div", { className: "w-8 h-8 border-4 border-primary/20 border-t-primary rounded-full animate-spin mx-auto mb-4" }), _jsx("p", { className: "text-sm text-neutral-500 dark:text-neutral-400", children: "Loading newsletter..." })] }) }));
     }
-    return (_jsx("div", { className: "h-full rounded-[2.5rem] w-full bg-dashboard-card text-dashboard-text flex flex-col font-sans transition-colors duration-300 overflow-hidden relative", children: isLoadingLanguage ? (_jsx("div", { className: "h-full w-full flex items-center justify-center", children: _jsxs("div", { className: "text-center", children: [_jsx("div", { className: "w-8 h-8 border-2 border-primary border-t-transparent rounded-full animate-spin mx-auto mb-4" }), _jsx("p", { className: "text-sm text-dashboard-text-secondary", children: "Loading..." })] }) })) : (_jsxs("main", { className: "flex flex-1 flex-col relative min-h-0", children: [_jsx(ErrorBanner, { error: saveError, onDismiss: () => setSaveError(null) }), _jsx(EditorHeader, { isPreviewMode: isPreviewMode, onPreviewToggle: () => setIsPreviewMode(!isPreviewMode), isSidebarOpen: isSidebarOpen, onSidebarToggle: () => setSidebarOpen(!isSidebarOpen), isSaving: isSaving, onSave: handleSave, onSaveError: (error) => {
-                        if (error) {
-                            setSaveError(error);
-                        }
-                        else {
-                            setSaveError(null);
-                        }
-                    }, isDirty: state.isDirty, isWelcomeEmail: isWelcomeEmail, languages: availableLanguages, currentLanguage: currentLanguage, onLanguageChange: handleLanguageChange, onAddLanguage: handleAddLanguage }), _jsxs("div", { className: "flex flex-1 relative overflow-hidden min-h-0 flex-nowrap", children: [_jsx(EditorCanvas, { isPreviewMode: isPreviewMode, contentBlocks: state.blocks, title: state.title, siteId: siteId, locale: locale, darkMode: effectiveDarkMode, backgroundColors: effectiveBackgroundColors, metadata: state.metadata, onTitleChange: (title) => dispatch({ type: 'SET_TITLE', payload: title }), onMetadataChange: (metadata) => dispatch({ type: 'SET_METADATA', payload: metadata }), onBlockAdd: (type, index, containerId) => helpers.addBlock(type, index, containerId), onBlockUpdate: (id, data) => helpers.updateBlock(id, data), onBlockDelete: (id) => helpers.deleteBlock(id), onBlockMove: (id, newIndex, containerId) => helpers.moveBlock(id, newIndex, containerId), slashCommand: slashCommand }), !isPreviewMode && (_jsx("aside", { className: `transition-all duration-500 ease-[cubic-bezier(0.4,0,0.2,1)] border-l border-dashboard-border bg-dashboard-sidebar overflow-y-auto overflow-x-hidden h-full ${isSidebarOpen ? 'w-80' : 'w-0 opacity-0 pointer-events-none'}`, children: _jsx(EditorSidebar, { metadata: state.metadata, status: state.status, onMetadataUpdate: (metadata) => dispatch({ type: 'SET_METADATA', payload: metadata }), defaultLanguage: primaryLanguage, isWelcomeEmail: isWelcomeEmail, languages: availableLanguages, currentLanguage: currentLanguage, onLanguageChange: handleLanguageChange }) }))] }), slashCommand.isOpen && slashCommand.position && (_jsx(SlashCommandMenu, { blocks: slashCommand.filteredBlocks, query: slashCommand.query, selectedIndex: slashCommand.selectedIndex, onSelect: (replaceBlockId) => {
-                        // Use the replaceBlockId passed from the menu (which comes from state)
-                        // This ensures we use the correct block ID that was set when the menu opened
-                        slashCommand.selectCurrent(replaceBlockId);
-                    }, position: slashCommand.position, onClose: slashCommand.closeMenu, replaceBlockId: slashCommand.replaceBlockId }))] })) }));
+    return (_jsx("div", { className: "absolute inset-0 flex flex-col font-sans transition-colors duration-300 overflow-hidden bg-white dark:bg-neutral-950", children: isLoadingLanguage ? (_jsx("div", { className: "h-full w-full flex items-center justify-center", children: _jsxs("div", { className: "text-center", children: [_jsx("div", { className: "w-8 h-8 border-2 border-primary border-t-transparent rounded-full animate-spin mx-auto mb-4" }), _jsx("p", { className: "text-sm text-dashboard-text-secondary", children: "Loading..." })] }) })) : (_jsxs("main", { className: "flex flex-1 flex-col relative min-h-0 overflow-hidden", children: [_jsx(ErrorBanner, { error: saveError, onDismiss: () => setSaveError(null) }), _jsx("div", { className: "flex-none z-30 border-b border-dashboard-border", children: _jsx(EditorHeader, { isPreviewMode: isPreviewMode, onPreviewToggle: () => setIsPreviewMode(!isPreviewMode), isSidebarOpen: isSidebarOpen, onSidebarToggle: () => setSidebarOpen(!isSidebarOpen), isSaving: isSaving, onSave: handleSave, onSaveError: (error) => setSaveError(error || null), isDirty: state.isDirty, isWelcomeEmail: isWelcomeEmail, languages: availableLanguages, currentLanguage: currentLanguage, onLanguageChange: handleLanguageChange, onAddLanguage: handleAddLanguage }) }), _jsxs("div", { className: "flex-1 flex relative overflow-hidden min-h-0 flex-nowrap", children: [_jsx("div", { className: "flex-1 overflow-hidden h-full", children: _jsx(EditorCanvas, { isPreviewMode: isPreviewMode, contentBlocks: state.blocks, title: state.title, siteId: siteId, locale: currentLanguage, darkMode: effectiveDarkMode, backgroundColors: effectiveBackgroundColors, metadata: state.metadata, onTitleChange: (title) => dispatch({ type: 'SET_TITLE', payload: title }), onMetadataChange: (metadata) => dispatch({ type: 'SET_METADATA', payload: metadata }), onBlockAdd: (type, index, containerId) => helpers.addBlock(type, index, containerId), onBlockUpdate: (id, data) => helpers.updateBlock(id, data), onBlockDelete: (id) => helpers.deleteBlock(id), onBlockMove: (id, newIndex, containerId) => helpers.moveBlock(id, newIndex, containerId), slashCommand: slashCommand }) }), !isPreviewMode && (_jsx("aside", { className: `flex-none transition-all duration-500 ease-[cubic-bezier(0.4,0,0.2,1)] border-l border-dashboard-border bg-dashboard-sidebar overflow-y-auto custom-scrollbar h-full ${isSidebarOpen ? 'w-80' : 'w-0 opacity-0 pointer-events-none border-l-0'}`, children: _jsx(EditorSidebar, { metadata: state.metadata, status: state.status, onMetadataUpdate: (metadata) => dispatch({ type: 'SET_METADATA', payload: metadata }), defaultLanguage: primaryLanguage, isWelcomeEmail: isWelcomeEmail, languages: availableLanguages, currentLanguage: currentLanguage, onLanguageChange: handleLanguageChange, globalUnsubscribeText: globalUnsubscribeTranslations[currentLanguage], onGlobalUnsubscribeUpdate: handleGlobalUnsubscribeUpdate }) }))] }), slashCommand.isOpen && slashCommand.position && (_jsx("div", { className: "fixed z-50 transition-all duration-200", style: {
+                        left: slashCommand.position.left,
+                        top: slashCommand.position.top
+                    }, children: _jsx(SlashCommandMenu, { blocks: slashCommand.filteredBlocks, query: slashCommand.query, selectedIndex: slashCommand.selectedIndex, onSelect: (replaceBlockId) => slashCommand.selectCurrent(replaceBlockId), position: slashCommand.position, onClose: slashCommand.closeMenu, replaceBlockId: slashCommand.replaceBlockId }) }))] })) }));
 }

package/dist/views/CanvasEditor/EditorBody.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EditorBody.d.ts","sourceRoot":"","sources":["../../../src/views/CanvasEditor/EditorBody.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAMH,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE1C,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAE/D,MAAM,WAAW,eAAe;IAC5B,MAAM,EAAE,KAAK,EAAE,CAAC;IAChB,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACxE,aAAa,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,KAAK,IAAI,CAAC;IAClE,aAAa,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,WAAW,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1E,qEAAqE;IACrE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,uCAAuC;IACvC,gBAAgB,CAAC,EAAE;QACf,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,CAAC,EAAE,MAAM,CAAC;KACjB,CAAC;IACF,4BAA4B;IAC5B,YAAY,CAAC,EAAE,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;CACrD;AAED,wBAAgB,UAAU,CAAC,EACvB,MAAM,EACN,UAAU,EACV,aAAa,EACb,aAAa,EACb,WAAW,EACX,QAAe,EACf,gBAAgB,EAChB,YAAY,GACf,EAAE,eAAe,2CAuDjB"}
+{"version":3,"file":"EditorBody.d.ts","sourceRoot":"","sources":["../../../src/views/CanvasEditor/EditorBody.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAMH,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE1C,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAE/D,MAAM,WAAW,eAAe;IAC5B,MAAM,EAAE,KAAK,EAAE,CAAC;IAChB,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACxE,aAAa,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,KAAK,IAAI,CAAC;IAClE,aAAa,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,WAAW,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1E,qEAAqE;IACrE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,uCAAuC;IACvC,gBAAgB,CAAC,EAAE;QACf,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,CAAC,EAAE,MAAM,CAAC;KACjB,CAAC;IACF,4BAA4B;IAC5B,YAAY,CAAC,EAAE,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;CACrD;AAED,wBAAgB,UAAU,CAAC,EACvB,MAAM,EACN,UAAU,EACV,aAAa,EACb,aAAa,EACb,WAAW,EACX,QAAe,EACf,gBAAgB,EAChB,YAAY,GACf,EAAE,eAAe,2CA2DjB"}

package/dist/views/CanvasEditor/EditorBody.js

@@ -17,5 +17,5 @@ export function EditorBody({ blocks, onBlockAdd, onBlockUpdate, onBlockDelete, o
             }, 0);
         }
     };
-    return (_jsxs("div", { className: "relative", children: [blocks.map((block, index) => (_jsxs(React.Fragment, { children: [_jsx("div", { className: "relative h-2 group/add-button", children: _jsx("button", { onClick: () => onBlockAdd('paragraph', index), className: "absolute left-0 top-1/2 -translate-y-1/2 w-6 h-6 flex items-center justify-center opacity-0 group-hover/add-button:opacity-100 transition-opacity hover:bg-neutral-100 dark:hover:bg-neutral-800 rounded", title: "Add block", children: _jsx(Plus, { size: 14, className: "text-neutral-400 dark:text-neutral-500" }) }) }), _jsx("div", { className: "relative", children: _jsx(BlockWrapper, { block: block, onUpdate: (data) => onBlockUpdate(block.id, data), onDelete: () => handleDelete(block.id, index), onMoveUp: index > 0 ? () => onBlockMove(block.id, index - 1) : undefined, onMoveDown: index < blocks.length - 1 ? () => onBlockMove(block.id, index + 1) : undefined, allBlocks: blocks, slashCommand: slashCommand, blockIndex: index, onAddBlockBelow: (blockType) => onBlockAdd(blockType, index + 1) }) })] }, block.id))), _jsx("div", { className: "relative h-8 group/add-button-bottom mt-2", children: _jsx("button", { onClick: () => onBlockAdd('paragraph', blocks.length), className: "absolute left-0 top-1/2 -translate-y-1/2 w-6 h-6 flex items-center justify-center opacity-0 group-hover/add-button-bottom:opacity-100 transition-opacity hover:bg-neutral-100 dark:hover:bg-neutral-800 rounded", title: "Add block", children: _jsx(Plus, { size: 14, className: "text-neutral-400 dark:text-neutral-500" }) }) })] }));
+    return (_jsxs("div", { className: "relative", children: [blocks.map((block, index) => (_jsxs(React.Fragment, { children: [_jsx("div", { className: "relative h-4 group/add-button", children: _jsxs("div", { className: "absolute inset-x-0 top-1/2 -translate-y-1/2 flex items-center justify-center", children: [_jsx("div", { className: "w-full h-[1px] bg-neutral-100 dark:bg-neutral-800 opacity-0 group-hover/add-button:opacity-100 transition-opacity" }), _jsx("button", { onClick: () => onBlockAdd('paragraph', index), className: "mx-4 flex-shrink-0 w-6 h-6 flex items-center justify-center opacity-0 group-hover/add-button:opacity-100 transition-all hover:bg-primary hover:text-white bg-white dark:bg-neutral-800 border border-neutral-200 dark:border-neutral-700 shadow-sm rounded-full z-10", title: "Add block here", children: _jsx(Plus, { size: 14 }) }), _jsx("div", { className: "w-full h-[1px] bg-neutral-100 dark:bg-neutral-800 opacity-0 group-hover/add-button:opacity-100 transition-opacity" })] }) }), _jsx("div", { className: "relative", children: _jsx(BlockWrapper, { block: block, onUpdate: (data) => onBlockUpdate(block.id, data), onDelete: () => handleDelete(block.id, index), onMoveUp: index > 0 ? () => onBlockMove(block.id, index - 1) : undefined, onMoveDown: index < blocks.length - 1 ? () => onBlockMove(block.id, index + 1) : undefined, allBlocks: blocks, slashCommand: slashCommand, blockIndex: index, onAddBlockBelow: (blockType) => onBlockAdd(blockType, index + 1) }) })] }, block.id))), _jsx("div", { className: "relative h-12 mt-4 group/add-bottom", children: _jsx("button", { onClick: () => onBlockAdd('paragraph', blocks.length), className: "absolute left-0 top-1/2 -translate-y-1/2 w-8 h-8 flex items-center justify-center opacity-20 group-hover/add-bottom:opacity-100 hover:bg-neutral-100 dark:hover:bg-neutral-800 rounded-full transition-all text-neutral-500", title: "Add block at the end", children: _jsx(Plus, { size: 18 }) }) })] }));
 }

package/dist/views/CanvasEditor/components/EditorCanvas.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EditorCanvas.d.ts","sourceRoot":"","sources":["../../../../src/views/CanvasEditor/components/EditorCanvas.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AACpE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAiMhE,MAAM,WAAW,iBAAiB;IAC9B,aAAa,EAAE,OAAO,CAAC;IACvB,aAAa,EAAE,KAAK,EAAE,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,OAAO,CAAC;IAClB,gBAAgB,CAAC,EAAE;QACf,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,CAAC,EAAE,MAAM,CAAC;KACjB,CAAC;IACF,QAAQ,CAAC,EAAE,kBAAkB,CAAC;IAC9B,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,CAAC,kBAAkB,CAAC,KAAK,IAAI,CAAC;IACnE,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACxE,aAAa,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,KAAK,IAAI,CAAC;IAClE,aAAa,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,WAAW,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1E,YAAY,CAAC,EAAE,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;CACrD;AAED,wBAAgB,YAAY,CAAC,EACzB,aAAa,EACb,aAAa,EACb,KAAK,EACL,MAAM,EACN,MAAM,EACN,QAAQ,EACR,gBAAgB,EAChB,QAAQ,EACR,aAAa,EACb,gBAAgB,EAChB,UAAU,EACV,aAAa,EACb,aAAa,EACb,WAAW,EACX,YAAY,GACf,EAAE,iBAAiB,2CAuPnB"}
+{"version":3,"file":"EditorCanvas.d.ts","sourceRoot":"","sources":["../../../../src/views/CanvasEditor/components/EditorCanvas.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AACpE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAsNhE,MAAM,WAAW,iBAAiB;IAC9B,aAAa,EAAE,OAAO,CAAC;IACvB,aAAa,EAAE,KAAK,EAAE,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,OAAO,CAAC;IAClB,gBAAgB,CAAC,EAAE;QACf,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,CAAC,EAAE,MAAM,CAAC;KACjB,CAAC;IACF,QAAQ,CAAC,EAAE,kBAAkB,CAAC;IAC9B,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,CAAC,kBAAkB,CAAC,KAAK,IAAI,CAAC;IACnE,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACxE,aAAa,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,KAAK,IAAI,CAAC;IAClE,aAAa,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,WAAW,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1E,YAAY,CAAC,EAAE,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;CACrD;AAED,wBAAgB,YAAY,CAAC,EACzB,aAAa,EACb,aAAa,EACb,KAAK,EACL,MAAM,EACN,MAAM,EACN,QAAQ,EACR,gBAAgB,EAChB,QAAQ,EACR,aAAa,EACb,gBAAgB,EAChB,UAAU,EACV,aAAa,EACb,aAAa,EACb,WAAW,EACX,YAAY,GACf,EAAE,iBAAiB,2CAoQnB"}