@jhits/plugin-blog 0.0.8 → 0.0.9

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.js

@@ -0,0 +1,32 @@
+import { useEffect, useState } from 'react';
+import { apiToBlogPost } from '../../../lib/mappers/apiMapper';
+export function usePostLoader(postId, currentPostId, loadPost, resetHeroBlock) {
+    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 = 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.js

@@ -0,0 +1,47 @@
+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) => { var _a; return b.type !== ((_a = registeredBlocks[i]) === null || _a === void 0 ? void 0 : _a.type); }) ||
+                registeredBlocks.some((b, i) => { var _a; return b.type !== ((_a = currentBlocks[i]) === null || _a === void 0 ? void 0 : _a.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.js

@@ -0,0 +1,285 @@
+/**
+ * Hook for managing unsaved changes warnings and auto-save
+ */
+'use client';
+import { useEffect, useRef, useCallback, useState } from 'react';
+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, }) {
+    const autoSaveTimeoutRef = useRef(null);
+    const isSavingRef = useRef(false);
+    const lastSavedStateRef = useRef('');
+    const countdownIntervalRef = useRef(null);
+    const [countdown, setCountdown] = useState(null);
+    const [saveStatus, setSaveStatus] = useState('idle');
+    const saveStatusTimeoutRef = useRef(null);
+    const previousIsDirtyRef = useRef(false);
+    const countdownStartTimeRef = useRef(null);
+    const performAutoSaveRef = useRef(null);
+    // Get auto-save preference from localStorage
+    const getAutoSavePreference = useCallback(() => {
+        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(() => {
+        // 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) => {
+        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) => {
+            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) => {
+            const target = e.target;
+            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.js

@@ -0,0 +1,9 @@
+/**
+ * Canvas Editor View Exports
+ */
+export { CanvasEditorView } from './CanvasEditorView';
+export { EditorBody } from './EditorBody';
+export { LayoutContainer } from './LayoutContainer';
+export { BlockWrapper } from './BlockWrapper';
+export { EditorHeader } from './EditorHeader';
+export { SaveConfirmationModal } 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.js

@@ -0,0 +1,12 @@
+/**
+ * Empty State Component
+ * Botanical-themed empty state for when no posts are found
+ */
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Sprout, Plus } from 'lucide-react';
+export function EmptyState({ hasFilters, onCreatePost }) {
+    return (_jsxs("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", children: [_jsx("div", { className: "w-24 h-24 rounded-full bg-green-500/10 dark:bg-green-500/20 flex items-center justify-center mb-6", children: _jsx(Sprout, { className: "text-green-600 dark:text-green-400 size-12" }) }), _jsx("h3", { className: "text-xl font-black text-neutral-950 dark:text-white uppercase tracking-tight mb-2", children: hasFilters ? 'No Posts Found' : 'No Posts Yet' }), _jsx("p", { className: "text-sm text-neutral-500 dark:text-neutral-400 text-center mb-6 max-w-md", children: 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.' }), !hasFilters && (_jsxs("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", children: [_jsx(Plus, { size: 16 }), "Create Your First Post"] }))] }));
+}

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"}

package/src/views/PostManager/PostActionsMenu.js

@@ -0,0 +1,58 @@
+/**
+ * Post Actions Menu Component
+ * Three-dot menu with actions for each post
+ */
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState, useRef, useEffect } from 'react';
+import { createPortal } from 'react-dom';
+import { MoreVertical, Edit, Copy, Trash2 } from 'lucide-react';
+export function PostActionsMenu({ onEdit, onPreview, onDuplicate, onDelete, }) {
+    const [isOpen, setIsOpen] = useState(false);
+    const [menuPosition, setMenuPosition] = useState({ top: 0, right: 0 });
+    const buttonRef = useRef(null);
+    const menuRef = useRef(null);
+    // Calculate menu position when opening
+    useEffect(() => {
+        if (isOpen && buttonRef.current) {
+            const buttonRect = buttonRef.current.getBoundingClientRect();
+            setMenuPosition({
+                top: buttonRect.bottom + 8, // 8px = mt-2 equivalent
+                right: window.innerWidth - buttonRect.right,
+            });
+        }
+    }, [isOpen]);
+    useEffect(() => {
+        function handleClickOutside(event) {
+            if (menuRef.current &&
+                !menuRef.current.contains(event.target) &&
+                buttonRef.current &&
+                !buttonRef.current.contains(event.target)) {
+                setIsOpen(false);
+            }
+        }
+        if (isOpen) {
+            document.addEventListener('mousedown', handleClickOutside);
+        }
+        return () => {
+            document.removeEventListener('mousedown', handleClickOutside);
+        };
+    }, [isOpen]);
+    const actions = [
+        { label: 'Edit', icon: Edit, onClick: onEdit, color: 'text-neutral-600 dark:text-neutral-400' },
+        // { label: 'Preview', icon: Eye, onClick: onPreview, color: 'text-blue-600 dark:text-blue-400' },
+        { label: 'Duplicate', icon: Copy, onClick: onDuplicate, color: 'text-neutral-600 dark:text-neutral-400' },
+        { label: 'Delete', icon: Trash2, onClick: onDelete, color: 'text-red-600 dark:text-red-400' },
+    ];
+    const menuContent = isOpen && (_jsx("div", { ref: menuRef, className: "fixed w-48 bg-dashboard-card border border-dashboard-border rounded-2xl shadow-xl z-9999 overflow-hidden", style: {
+            top: `${menuPosition.top}px`,
+            right: `${menuPosition.right}px`,
+        }, children: actions.map((action) => {
+            const Icon = action.icon;
+            return (_jsxs("button", { onClick: () => {
+                    action.onClick();
+                    setIsOpen(false);
+                }, className: `w-full flex items-center font-sans gap-3 px-4 py-3 text-sm hover:bg-dashboard-bg transition-colors ${action.color}`, children: [_jsx(Icon, { size: 16 }), _jsx("span", { children: action.label })] }, action.label));
+        }) }));
+    return (_jsxs(_Fragment, { children: [_jsx("button", { ref: buttonRef, onClick: () => setIsOpen(!isOpen), className: "p-2 text-neutral-400 hover:text-dashboard-text hover:bg-dashboard-bg rounded-full transition-colors", title: "Actions", children: _jsx(MoreVertical, { size: 18 }) }), typeof window !== 'undefined' && isOpen && createPortal(menuContent, document.body)] }));
+}

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

@@ -0,0 +1,15 @@
+/**
+ * Post Cards Component
+ * Card-based layout for displaying posts
+ */
+import { PostListItem } from '../../types/post';
+export interface PostCardsProps {
+    posts: PostListItem[];
+    locale: string;
+    onEdit: (postId: string) => void;
+    onPreview: (postId: string) => void;
+    onDuplicate: (postId: string) => void;
+    onDelete: (postId: string) => void;
+}
+export declare function PostCards({ posts, locale, onEdit, onPreview, onDuplicate, onDelete, }: PostCardsProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=PostCards.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PostCards.d.ts","sourceRoot":"","sources":["PostCards.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAOH,OAAO,EAAE,YAAY,EAAc,MAAM,kBAAkB,CAAC;AAI5D,MAAM,WAAW,cAAc;IAC3B,KAAK,EAAE,YAAY,EAAE,CAAC;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,WAAW,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC;AA0BD,wBAAgB,SAAS,CAAC,EACtB,KAAK,EACL,MAAM,EACN,MAAM,EACN,SAAS,EACT,WAAW,EACX,QAAQ,GACX,EAAE,cAAc,2CA6IhB"}

package/src/views/PostManager/PostCards.js

@@ -0,0 +1,79 @@
+/**
+ * Post Cards Component
+ * Card-based layout for displaying posts
+ */
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from 'react';
+import { Calendar, User, UserCheck } from 'lucide-react';
+import { Image } from '@jhits/plugin-images';
+import { PostActionsMenu } from './PostActionsMenu';
+import { useSession } from 'next-auth/react';
+function getStatusBadgeColor(status) {
+    switch (status) {
+        case 'published':
+            return 'bg-green-500/10 text-green-700 dark:text-green-400 border-green-500/20';
+        case 'draft':
+            return 'bg-amber-500/10 text-amber-700 dark:text-amber-400 border-amber-500/20';
+        case 'scheduled':
+            return 'bg-blue-500/10 text-blue-700 dark:text-blue-400 border-blue-500/20';
+        case 'archived':
+            return 'bg-neutral-500/10 text-neutral-700 dark:text-neutral-400 border-neutral-500/20';
+        default:
+            return 'bg-neutral-500/10 text-neutral-700 dark:text-neutral-400 border-neutral-500/20';
+    }
+}
+function formatDate(dateString, locale) {
+    if (!dateString)
+        return 'No date';
+    return new Date(dateString).toLocaleDateString(locale, {
+        day: 'numeric',
+        month: 'short',
+        year: 'numeric',
+    });
+}
+export function PostCards({ posts, locale, onEdit, onPreview, onDuplicate, onDelete, }) {
+    var _a;
+    const { data: session, status: sessionStatus } = useSession();
+    const currentUserId = (_a = session === null || session === void 0 ? void 0 : session.user) === null || _a === void 0 ? void 0 : _a.id;
+    const [userMap, setUserMap] = useState({});
+    // Helper function to check if user is the owner
+    const isPostOwner = (post) => {
+        if (sessionStatus === 'loading')
+            return false; // Don't show actions while loading
+        if (!currentUserId || !post.authorId)
+            return false;
+        // Convert both to strings for comparison to handle ObjectId vs string
+        return String(currentUserId) === String(post.authorId);
+    };
+    // Fetch users to map IDs to names
+    useEffect(() => {
+        const fetchUsers = async () => {
+            try {
+                const response = await fetch('/api/users');
+                const users = await response.json();
+                if (Array.isArray(users)) {
+                    const map = {};
+                    users.forEach((user) => {
+                        var _a;
+                        const id = (_a = user._id) === null || _a === void 0 ? void 0 : _a.toString();
+                        if (id) {
+                            map[id] = user.name || user.email || 'Unknown';
+                        }
+                    });
+                    setUserMap(map);
+                }
+            }
+            catch (error) {
+                console.error('Failed to fetch users:', error);
+            }
+        };
+        fetchUsers();
+    }, []);
+    const getAuthorName = (authorId) => {
+        if (!authorId)
+            return 'Unknown';
+        return userMap[authorId] || authorId;
+    };
+    return (_jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6", children: posts.map((post) => (_jsxs("div", { className: "bg-dashboard-card rounded-2xl border border-dashboard-border overflow-hidden hover:shadow-xl transition-all duration-300 group", children: [_jsxs("div", { className: "relative w-full h-48 bg-neutral-200 dark:bg-neutral-800 overflow-hidden", children: [post.featuredImage ? (_jsx(Image, { id: post.featuredImage, alt: post.title, fill: true, editable: false, className: "w-full h-full object-cover group-hover:scale-105 transition-transform duration-300" })) : (_jsx("div", { className: "w-full h-full flex items-center justify-center", children: _jsx("span", { className: "text-sm text-neutral-400", children: "No Image" }) })), isPostOwner(post) && (_jsx("div", { className: "absolute top-4 left-4 z-10", children: _jsx("div", { className: "bg-white/90 dark:bg-neutral-900/90 backdrop-blur-sm rounded-full p-1 shadow-lg border border-neutral-200 dark:border-neutral-700", children: _jsx(PostActionsMenu, { onEdit: () => onEdit(post.id), onPreview: () => onPreview(post.id), onDuplicate: () => onDuplicate(post.id), onDelete: () => onDelete(post.id) }) }) })), _jsx("div", { className: "absolute top-4 right-4", children: _jsx("span", { className: `inline-flex items-center px-3 py-1 rounded-full text-[10px] font-black uppercase tracking-wider border backdrop-blur-sm ${getStatusBadgeColor(post.status)}`, children: post.status }) })] }), _jsxs("div", { className: "p-6", children: [_jsxs("div", { className: "mb-4", children: [_jsx("button", { onClick: () => onEdit(post.id), className: "text-left w-full hover:cursor-pointer", children: _jsx("h3", { className: "font-bold text-lg text-neutral-950 dark:text-white mb-2 line-clamp-2 group-hover:text-primary transition-colors hover:underline", children: post.title }) }), _jsxs("p", { className: "text-xs text-neutral-500 dark:text-neutral-400 font-mono", children: ["/", post.slug] })] }), post.excerpt && (_jsx("p", { className: "text-sm text-neutral-600 dark:text-neutral-400 mb-4 line-clamp-2", children: post.excerpt })), _jsxs("div", { className: "space-y-3 pt-4 border-t border-neutral-200 dark:border-neutral-700", children: [_jsxs("div", { className: "flex items-center gap-2", children: [isPostOwner(post) ? (_jsx(UserCheck, { size: 14, className: "text-primary" })) : (_jsx(User, { size: 14, className: "text-neutral-400" })), _jsxs("span", { className: `text-xs ${isPostOwner(post) ? 'text-primary font-semibold' : 'text-neutral-600 dark:text-neutral-400'}`, children: [getAuthorName(post.authorId), isPostOwner(post) && (_jsx("span", { className: "ml-1", children: "(You)" }))] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Calendar, { size: 14, className: "text-neutral-400" }), _jsx("span", { className: "text-xs text-neutral-600 dark:text-neutral-400", children: formatDate(post.updatedAt, locale) })] })] })] })] }, post.id))) }));
+}