@jhits/plugin-blog 0.0.14 → 0.0.16

package/src/views/CanvasEditor/hooks/usePostLoader.d.ts

@@ -0,0 +1,5 @@
+import type { BlogPost } from '../../../types/post';
+export declare function usePostLoader(postId: string | undefined, currentPostId: string | null, loadPost: (post: BlogPost) => void, resetHeroBlock: () => void): {
+    isLoadingPost: boolean;
+};
+//# sourceMappingURL=usePostLoader.d.ts.map

package/src/views/CanvasEditor/hooks/usePostLoader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePostLoader.d.ts","sourceRoot":"","sources":["usePostLoader.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAEpD,wBAAgB,aAAa,CACzB,MAAM,EAAE,MAAM,GAAG,SAAS,EAC1B,aAAa,EAAE,MAAM,GAAG,IAAI,EAC5B,QAAQ,EAAE,CAAC,IAAI,EAAE,QAAQ,KAAK,IAAI,EAClC,cAAc,EAAE,MAAM,IAAI;;EA8B7B"}

package/src/views/CanvasEditor/hooks/usePostLoader.ts

@@ -0,0 +1,39 @@
+import { useEffect, useState } from 'react';
+import { apiToBlogPost, type APIBlogDocument } from '../../../lib/mappers/apiMapper';
+import type { BlogPost } from '../../../types/post';
+
+export function usePostLoader(
+    postId: string | undefined,
+    currentPostId: string | null,
+    loadPost: (post: BlogPost) => void,
+    resetHeroBlock: () => void
+) {
+    const [isLoadingPost, setIsLoadingPost] = useState(false);
+
+    useEffect(() => {
+        if (postId && !currentPostId) {
+            const loadPostData = async () => {
+                try {
+                    setIsLoadingPost(true);
+                    // Reset hero block before loading new post so it gets re-initialized from the new post's blocks
+                    resetHeroBlock();
+                    const response = await fetch(`/api/plugin-blog/${postId}`);
+                    if (!response.ok) {
+                        throw new Error('Failed to load post');
+                    }
+                    const apiDoc: APIBlogDocument = await response.json();
+                    const blogPost = apiToBlogPost(apiDoc);
+                    loadPost(blogPost);
+                } catch (error) {
+                    console.error('Failed to load post:', error);
+                    alert('Failed to load post. Please try again.');
+                } finally {
+                    setIsLoadingPost(false);
+                }
+            };
+            loadPostData();
+        }
+    }, [postId, currentPostId, loadPost, resetHeroBlock]);
+
+    return { isLoadingPost };
+}

package/src/views/CanvasEditor/hooks/useRegisteredBlocks.d.ts

@@ -0,0 +1,2 @@
+export declare function useRegisteredBlocks(): import("../../..").BlockTypeDefinition[];
+//# sourceMappingURL=useRegisteredBlocks.d.ts.map

package/src/views/CanvasEditor/hooks/useRegisteredBlocks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRegisteredBlocks.d.ts","sourceRoot":"","sources":["useRegisteredBlocks.ts"],"names":[],"mappings":"AAGA,wBAAgB,mBAAmB,6CAmDlC"}

package/src/views/CanvasEditor/hooks/useRegisteredBlocks.ts

@@ -0,0 +1,55 @@
+import { useState, useEffect } from 'react';
+import { blockRegistry } from '../../../registry/BlockRegistry';
+
+export function useRegisteredBlocks() {
+    const [registeredBlocks, setRegisteredBlocks] = useState(() => {
+        const initial = blockRegistry.getAll();
+        return initial;
+    });
+
+    // Watch for registry changes and update state
+    useEffect(() => {
+        // Check immediately
+        const checkBlocks = () => {
+            const currentBlocks = blockRegistry.getAll();
+            const hasChanged = currentBlocks.length !== registeredBlocks.length ||
+                currentBlocks.some((b, i) => b.type !== registeredBlocks[i]?.type) ||
+                registeredBlocks.some((b, i) => b.type !== currentBlocks[i]?.type);
+
+            if (hasChanged) {
+                setRegisteredBlocks([...currentBlocks]);
+            }
+        };
+
+        // Initial check
+        checkBlocks();
+
+        // Poll for registry changes (blocks are registered asynchronously in useEffect)
+        // Use a shorter interval initially, then longer
+        let pollCount = 0;
+        const interval = setInterval(() => {
+            pollCount++;
+            checkBlocks();
+            // Stop polling after 5 seconds (25 checks at 200ms)
+            if (pollCount > 25) {
+                clearInterval(interval);
+            }
+        }, 200);
+
+        // Also check after delays to catch initial registrations
+        const timeouts = [
+            setTimeout(checkBlocks, 50),
+            setTimeout(checkBlocks, 100),
+            setTimeout(checkBlocks, 300),
+            setTimeout(checkBlocks, 500),
+            setTimeout(checkBlocks, 1000),
+        ];
+
+        return () => {
+            clearInterval(interval);
+            timeouts.forEach(clearTimeout);
+        };
+    }, [registeredBlocks.length]);
+
+    return registeredBlocks;
+}

package/src/views/CanvasEditor/hooks/useUnsavedChanges.d.ts

@@ -0,0 +1,25 @@
+/**
+ * Hook for managing unsaved changes warnings and auto-save
+ */
+import type { EditorState } from '../../../state/types';
+import type { Block } from '../../../types/block';
+interface UseUnsavedChangesOptions {
+    state: EditorState;
+    isDirty: boolean;
+    onSave: (heroBlock?: Block | null) => Promise<void>;
+    heroBlock?: Block | null;
+    autoSaveEnabled?: boolean;
+    autoSaveDelay?: number;
+    postId?: string | null;
+}
+/**
+ * Hook to manage unsaved changes warnings and auto-save
+ */
+export declare function useUnsavedChanges({ state, isDirty, onSave, heroBlock, autoSaveEnabled: propAutoSaveEnabled, autoSaveDelay, postId, }: UseUnsavedChangesOptions): {
+    autoSaveEnabled: boolean;
+    setAutoSaveEnabled: (enabled: boolean) => void;
+    countdown: number | null;
+    saveStatus: "error" | "idle" | "saving" | "saved";
+};
+export {};
+//# sourceMappingURL=useUnsavedChanges.d.ts.map

package/src/views/CanvasEditor/hooks/useUnsavedChanges.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useUnsavedChanges.d.ts","sourceRoot":"","sources":["useUnsavedChanges.ts"],"names":[],"mappings":"AAAA;;GAEG;AAKH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAElD,UAAU,wBAAwB;IAC9B,KAAK,EAAE,WAAW,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,CAAC,SAAS,CAAC,EAAE,KAAK,GAAG,IAAI,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACpD,SAAS,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;IACzB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC1B;AAKD;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,EAC9B,KAAK,EACL,OAAO,EACP,MAAM,EACN,SAAS,EACT,eAAe,EAAE,mBAAmB,EACpC,aAAuC,EACvC,MAAM,GACT,EAAE,wBAAwB;;kCAoD6B,OAAO;;;EA4P9D"}

package/src/views/CanvasEditor/hooks/useUnsavedChanges.ts

@@ -0,0 +1,339 @@
+/**
+ * Hook for managing unsaved changes warnings and auto-save
+ */
+
+'use client';
+
+import { useEffect, useRef, useCallback, useState } from 'react';
+import type { EditorState } from '../../../state/types';
+import type { Block } from '../../../types/block';
+
+interface UseUnsavedChangesOptions {
+    state: EditorState;
+    isDirty: boolean;
+    onSave: (heroBlock?: Block | null) => Promise<void>;
+    heroBlock?: Block | null;
+    autoSaveEnabled?: boolean;
+    autoSaveDelay?: number; // in milliseconds
+    postId?: string | null; // Post ID to detect when a post is loaded
+}
+
+const AUTO_SAVE_STORAGE_KEY = 'blog-editor-autosave-enabled';
+const DEFAULT_AUTO_SAVE_DELAY = 10000; // 10 seconds
+
+/**
+ * Hook to manage unsaved changes warnings and auto-save
+ */
+export function useUnsavedChanges({
+    state,
+    isDirty,
+    onSave,
+    heroBlock,
+    autoSaveEnabled: propAutoSaveEnabled,
+    autoSaveDelay = DEFAULT_AUTO_SAVE_DELAY,
+    postId,
+}: UseUnsavedChangesOptions) {
+    const autoSaveTimeoutRef = useRef<NodeJS.Timeout | null>(null);
+    const isSavingRef = useRef(false);
+    const lastSavedStateRef = useRef<string>('');
+    const countdownIntervalRef = useRef<NodeJS.Timeout | null>(null);
+    const [countdown, setCountdown] = useState<number | null>(null);
+    const [saveStatus, setSaveStatus] = useState<'idle' | 'saving' | 'saved' | 'error'>('idle');
+    const saveStatusTimeoutRef = useRef<NodeJS.Timeout | null>(null);
+    const previousIsDirtyRef = useRef<boolean>(false);
+    const countdownStartTimeRef = useRef<number | null>(null);
+    const performAutoSaveRef = useRef<(() => Promise<void>) | null>(null);
+
+    // Get auto-save preference from localStorage
+    const getAutoSavePreference = useCallback((): boolean => {
+        if (typeof window === 'undefined') return false;
+        try {
+            const stored = localStorage.getItem(AUTO_SAVE_STORAGE_KEY);
+            if (stored !== null) {
+                return stored === 'true';
+            }
+        } catch (error) {
+            console.error('[useUnsavedChanges] Failed to read auto-save preference:', error);
+        }
+        // Default to false if not set
+        return false;
+    }, []);
+
+    // State to track auto-save enabled status (reactive)
+    const [autoSaveEnabledState, setAutoSaveEnabledState] = useState<boolean>(() => {
+        // Initialize from prop or localStorage
+        if (propAutoSaveEnabled !== undefined) {
+            return propAutoSaveEnabled;
+        }
+        return getAutoSavePreference();
+    });
+
+    // Sync with prop changes
+    useEffect(() => {
+        if (propAutoSaveEnabled !== undefined) {
+            setAutoSaveEnabledState(propAutoSaveEnabled);
+        }
+    }, [propAutoSaveEnabled]);
+
+    // Initialize from localStorage on mount (if no prop provided)
+    useEffect(() => {
+        if (propAutoSaveEnabled === undefined && typeof window !== 'undefined') {
+            const stored = getAutoSavePreference();
+            setAutoSaveEnabledState(stored);
+        }
+    }, []); // Only run on mount
+
+    // Set auto-save preference in localStorage and state
+    const setAutoSavePreference = useCallback((enabled: boolean) => {
+        if (typeof window === 'undefined') return;
+        try {
+            localStorage.setItem(AUTO_SAVE_STORAGE_KEY, enabled.toString());
+            setAutoSaveEnabledState(enabled);
+            console.log('[useUnsavedChanges] Auto-save preference updated:', enabled);
+        } catch (error) {
+            console.error('[useUnsavedChanges] Failed to save auto-save preference:', error);
+        }
+    }, []);
+
+    // Determine if auto-save is enabled (prop takes precedence over state)
+    const autoSaveEnabled = propAutoSaveEnabled !== undefined 
+        ? propAutoSaveEnabled 
+        : autoSaveEnabledState;
+
+    // Create a stable reference of the current state for comparison
+    const getStateSnapshot = useCallback(() => {
+        return JSON.stringify({
+            title: state.title,
+            slug: state.slug,
+            blocks: state.blocks,
+            seo: state.seo,
+            metadata: state.metadata,
+            status: state.status,
+        });
+    }, [state]);
+
+    // Initialize lastSavedStateRef when a post is loaded and marked as clean
+    useEffect(() => {
+        // When a post is loaded (postId exists) and isDirty is false, update the saved state reference
+        if (postId && !isDirty && lastSavedStateRef.current === '') {
+            lastSavedStateRef.current = getStateSnapshot();
+            console.log('[useUnsavedChanges] Initialized saved state reference after post load');
+        }
+        // Also update if isDirty becomes false after being true (e.g., after save or MARK_CLEAN)
+        if (!isDirty && lastSavedStateRef.current !== getStateSnapshot()) {
+            lastSavedStateRef.current = getStateSnapshot();
+        }
+    }, [postId, isDirty, getStateSnapshot]);
+
+    // Auto-save function
+    const performAutoSave = useCallback(async () => {
+        if (isSavingRef.current || !isDirty) {
+            return;
+        }
+
+        try {
+            isSavingRef.current = true;
+            setSaveStatus('saving');
+            setCountdown(null);
+            countdownStartTimeRef.current = null;
+            console.log('[useUnsavedChanges] Auto-saving...');
+            await onSave(heroBlock);
+            lastSavedStateRef.current = getStateSnapshot();
+            setSaveStatus('saved');
+            console.log('[useUnsavedChanges] Auto-save completed');
+            
+            // Clear save status after 2 seconds
+            if (saveStatusTimeoutRef.current) {
+                clearTimeout(saveStatusTimeoutRef.current);
+            }
+            saveStatusTimeoutRef.current = setTimeout(() => {
+                setSaveStatus('idle');
+            }, 2000);
+        } catch (error) {
+            console.error('[useUnsavedChanges] Auto-save failed:', error);
+            setSaveStatus('error');
+            // Clear error status after 3 seconds
+            if (saveStatusTimeoutRef.current) {
+                clearTimeout(saveStatusTimeoutRef.current);
+            }
+            saveStatusTimeoutRef.current = setTimeout(() => {
+                setSaveStatus('idle');
+            }, 3000);
+        } finally {
+            isSavingRef.current = false;
+        }
+    }, [isDirty, onSave, heroBlock, getStateSnapshot]);
+
+    // Keep ref updated with latest function
+    useEffect(() => {
+        performAutoSaveRef.current = performAutoSave;
+    }, [performAutoSave]);
+
+    // Set up auto-save timer and countdown when state changes
+    useEffect(() => {
+        // Only reset countdown if isDirty changed from false to true, or if auto-save was just disabled
+        const isDirtyChanged = previousIsDirtyRef.current !== isDirty;
+        const becameDirty = !previousIsDirtyRef.current && isDirty;
+        
+        // Update previous isDirty ref
+        previousIsDirtyRef.current = isDirty;
+
+        // Clear existing countdown interval
+        if (countdownIntervalRef.current) {
+            clearInterval(countdownIntervalRef.current);
+            countdownIntervalRef.current = null;
+        }
+
+        if (!autoSaveEnabled || !isDirty || isSavingRef.current) {
+            setCountdown(null);
+            countdownStartTimeRef.current = null;
+            // Clear timeout if auto-save is disabled or not dirty
+            if (autoSaveTimeoutRef.current) {
+                clearTimeout(autoSaveTimeoutRef.current);
+                autoSaveTimeoutRef.current = null;
+            }
+            return;
+        }
+
+        // Only reset countdown if:
+        // 1. isDirty just became true (new changes)
+        // 2. Or if there's no active countdown
+        const shouldResetCountdown = becameDirty || countdownStartTimeRef.current === null;
+
+        if (shouldResetCountdown) {
+            // Clear existing timeout
+            if (autoSaveTimeoutRef.current) {
+                clearTimeout(autoSaveTimeoutRef.current);
+            }
+
+            // Initialize countdown
+            const secondsRemaining = Math.ceil(autoSaveDelay / 1000);
+            setCountdown(secondsRemaining);
+            countdownStartTimeRef.current = Date.now();
+
+            // Set new timeout for auto-save
+            autoSaveTimeoutRef.current = setTimeout(() => {
+                if (performAutoSaveRef.current) {
+                    performAutoSaveRef.current();
+                }
+            }, autoSaveDelay);
+        } else {
+            // Countdown is already running, just update it based on elapsed time
+            if (countdownStartTimeRef.current && autoSaveTimeoutRef.current) {
+                const elapsed = Date.now() - countdownStartTimeRef.current;
+                const remaining = Math.max(0, autoSaveDelay - elapsed);
+                const secondsRemaining = Math.ceil(remaining / 1000);
+                setCountdown(secondsRemaining);
+            }
+        }
+
+        // Update countdown every second (only if we have an active countdown)
+        if (shouldResetCountdown || countdownIntervalRef.current === null) {
+            countdownIntervalRef.current = setInterval(() => {
+                if (countdownStartTimeRef.current && autoSaveTimeoutRef.current) {
+                    const elapsed = Date.now() - countdownStartTimeRef.current;
+                    const remaining = Math.max(0, autoSaveDelay - elapsed);
+                    const secondsRemaining = Math.ceil(remaining / 1000);
+                    
+                    if (secondsRemaining <= 0) {
+                        setCountdown(null);
+                        if (countdownIntervalRef.current) {
+                            clearInterval(countdownIntervalRef.current);
+                            countdownIntervalRef.current = null;
+                        }
+                    } else {
+                        setCountdown(secondsRemaining);
+                    }
+                }
+            }, 1000);
+        }
+
+        return () => {
+            if (autoSaveTimeoutRef.current) {
+                clearTimeout(autoSaveTimeoutRef.current);
+            }
+            if (countdownIntervalRef.current) {
+                clearInterval(countdownIntervalRef.current);
+            }
+        };
+    }, [autoSaveEnabled, isDirty, autoSaveDelay]);
+
+    // Handle browser beforeunload event (page refresh/close)
+    useEffect(() => {
+        if (!isDirty) {
+            return;
+        }
+
+        const handleBeforeUnload = (e: BeforeUnloadEvent) => {
+            e.preventDefault();
+            // Modern browsers ignore custom messages, but we still need to set returnValue
+            e.returnValue = '';
+            return '';
+        };
+
+        window.addEventListener('beforeunload', handleBeforeUnload);
+
+        return () => {
+            window.removeEventListener('beforeunload', handleBeforeUnload);
+        };
+    }, [isDirty]);
+
+    // Handle link clicks (for Next.js App Router)
+    useEffect(() => {
+        if (!isDirty) {
+            return;
+        }
+
+        const handleLinkClick = (e: MouseEvent) => {
+            const target = e.target as HTMLElement;
+            const link = target.closest('a');
+            
+            if (link && link.href) {
+                const url = new URL(link.href);
+                const currentPath = window.location.pathname;
+                
+                // Check if navigating away from editor
+                if (!url.pathname.includes('/blog/editor') && !url.pathname.includes('/blog/new')) {
+                    const confirmed = window.confirm(
+                        'You have unsaved changes. Are you sure you want to leave? Your changes will be lost.'
+                    );
+                    
+                    if (!confirmed) {
+                        e.preventDefault();
+                        e.stopPropagation();
+                        return false;
+                    }
+                }
+            }
+        };
+
+        // Listen for clicks on links
+        document.addEventListener('click', handleLinkClick, true);
+
+        return () => {
+            document.removeEventListener('click', handleLinkClick, true);
+        };
+    }, [isDirty]);
+
+    // Cleanup on unmount
+    useEffect(() => {
+        return () => {
+            if (autoSaveTimeoutRef.current) {
+                clearTimeout(autoSaveTimeoutRef.current);
+            }
+            if (countdownIntervalRef.current) {
+                clearInterval(countdownIntervalRef.current);
+            }
+            if (saveStatusTimeoutRef.current) {
+                clearTimeout(saveStatusTimeoutRef.current);
+            }
+        };
+    }, []);
+
+    return {
+        autoSaveEnabled,
+        setAutoSaveEnabled: setAutoSavePreference,
+        countdown,
+        saveStatus,
+    };
+}

package/src/views/CanvasEditor/index.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Canvas Editor View Exports
+ */
+export { CanvasEditorView } from './CanvasEditorView';
+export type { CanvasEditorViewProps } from './CanvasEditorView';
+export { EditorBody } from './EditorBody';
+export { LayoutContainer } from './LayoutContainer';
+export type { LayoutContainerProps } from './LayoutContainer';
+export type { EditorBodyProps } from './EditorBody';
+export { BlockWrapper } from './BlockWrapper';
+export type { BlockWrapperProps } from './BlockWrapper';
+export { EditorHeader } from './EditorHeader';
+export type { EditorHeaderProps } from './EditorHeader';
+export { SaveConfirmationModal } from './SaveConfirmationModal';
+export type { SaveConfirmationModalProps } from './SaveConfirmationModal';
+//# sourceMappingURL=index.d.ts.map

package/src/views/CanvasEditor/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,YAAY,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,YAAY,EAAE,0BAA0B,EAAE,MAAM,yBAAyB,CAAC"}

package/src/views/CanvasEditor/index.ts

@@ -0,0 +1,16 @@
+/**
+ * Canvas Editor View Exports
+ */
+
+export { CanvasEditorView } from './CanvasEditorView';
+export type { CanvasEditorViewProps } from './CanvasEditorView';
+export { EditorBody } from './EditorBody';
+export { LayoutContainer } from './LayoutContainer';
+export type { LayoutContainerProps } from './LayoutContainer';
+export type { EditorBodyProps } from './EditorBody';
+export { BlockWrapper } from './BlockWrapper';
+export type { BlockWrapperProps } from './BlockWrapper';
+export { EditorHeader } from './EditorHeader';
+export type { EditorHeaderProps } from './EditorHeader';
+export { SaveConfirmationModal } from './SaveConfirmationModal';
+export type { SaveConfirmationModalProps } from './SaveConfirmationModal';

package/src/views/PostManager/EmptyState.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Empty State Component
+ * Botanical-themed empty state for when no posts are found
+ */
+export interface EmptyStateProps {
+    hasFilters: boolean;
+    onCreatePost: () => void;
+}
+export declare function EmptyState({ hasFilters, onCreatePost }: EmptyStateProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=EmptyState.d.ts.map

package/src/views/PostManager/EmptyState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["EmptyState.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAOH,MAAM,WAAW,eAAe;IAC5B,UAAU,EAAE,OAAO,CAAC;IACpB,YAAY,EAAE,MAAM,IAAI,CAAC;CAC5B;AAED,wBAAgB,UAAU,CAAC,EAAE,UAAU,EAAE,YAAY,EAAE,EAAE,eAAe,2CAyBvE"}

package/src/views/PostManager/EmptyState.tsx

@@ -0,0 +1,42 @@
+/**
+ * Empty State Component
+ * Botanical-themed empty state for when no posts are found
+ */
+
+'use client';
+
+import React from 'react';
+import { Sprout, Plus } from 'lucide-react';
+
+export interface EmptyStateProps {
+    hasFilters: boolean;
+    onCreatePost: () => void;
+}
+
+export function EmptyState({ hasFilters, onCreatePost }: EmptyStateProps) {
+    return (
+        <div className="flex flex-col items-center justify-center py-20 px-8 bg-neutral-100 dark:bg-neutral-800/50 rounded-[2.5rem] border-2 border-dashed border-neutral-300 dark:border-neutral-700">
+            <div className="w-24 h-24 rounded-full bg-green-500/10 dark:bg-green-500/20 flex items-center justify-center mb-6">
+                <Sprout className="text-green-600 dark:text-green-400 size-12" />
+            </div>
+            <h3 className="text-xl font-black text-neutral-950 dark:text-white uppercase tracking-tight mb-2">
+                {hasFilters ? 'No Posts Found' : 'No Posts Yet'}
+            </h3>
+            <p className="text-sm text-neutral-500 dark:text-neutral-400 text-center mb-6 max-w-md">
+                {hasFilters
+                    ? 'Try adjusting your search or filter criteria to find what you\'re looking for.'
+                    : 'Start growing your content garden. Create your first blog post to share your botanical knowledge with the world.'}
+            </p>
+            {!hasFilters && (
+                <button
+                    onClick={onCreatePost}
+                    className="inline-flex items-center gap-2 px-6 py-3 bg-primary text-white rounded-full text-[10px] font-black uppercase tracking-widest hover:bg-primary/90 transition-all shadow-lg shadow-primary/20"
+                >
+                    <Plus size={16} />
+                    Create Your First Post
+                </button>
+            )}
+        </div>
+    );
+}
+

package/src/views/PostManager/PostActionsMenu.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Post Actions Menu Component
+ * Three-dot menu with actions for each post
+ */
+export interface PostActionsMenuProps {
+    onEdit: () => void;
+    onPreview: () => void;
+    onDuplicate: () => void;
+    onDelete: () => void;
+}
+export declare function PostActionsMenu({ onEdit, onPreview, onDuplicate, onDelete, }: PostActionsMenuProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=PostActionsMenu.d.ts.map

package/src/views/PostManager/PostActionsMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PostActionsMenu.d.ts","sourceRoot":"","sources":["PostActionsMenu.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAQH,MAAM,WAAW,oBAAoB;IACjC,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,QAAQ,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,wBAAgB,eAAe,CAAC,EAC5B,MAAM,EACN,SAAS,EACT,WAAW,EACX,QAAQ,GACX,EAAE,oBAAoB,2CAuFtB"}