react-embed-docs 0.1.0 → 0.3.0

package/dist/client/components/DocsLayout.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"DocsLayout.d.ts","sourceRoot":"","sources":["../../../src/client/components/DocsLayout.tsx"],"names":[],"mappings":"AAoCA,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAA;AAavD,UAAU,eAAe;IACvB,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IACnC;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC5B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,eAAe,EAAE,CAAA;CAChD;AAsQD,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,YAAY,EACZ,UAAU,EACV,QAAkB,EAClB,UAAU,EACV,QAAQ,GACT,EAAE,eAAe,2CAgcjB"}

package/dist/client/components/DocsLayout.js

@@ -1,387 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { closestCenter, defaultDropAnimationSideEffects, DndContext, DragOverlay, KeyboardSensor, PointerSensor, useSensor, useSensors, } from '@dnd-kit/core';
-import { SortableContext, sortableKeyboardCoordinates, useSortable, verticalListSortingStrategy, } from '@dnd-kit/sortable';
-import { CSS } from '@dnd-kit/utilities';
-import { ChevronDown, ChevronRight, FileText, Folder, FolderOpen, GripVertical, PanelLeftCloseIcon, PanelLeftOpenIcon, Plus, Search, } from 'lucide-react';
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { useDocumentsQuery, useReorderDocumentMutation, } from '../hooks/useDocsQuery.js';
-import { Breadcrumbs } from './Breadcrumbs.js';
-function SortableTreeItem({ doc, isExpanded, isCurrent, onToggle, onNavigate, }) {
-    const { attributes, listeners, setNodeRef, transform, transition, isDragging, } = useSortable({ id: doc.id });
-    const style = {
-        transform: CSS.Transform.toString(transform),
-        transition,
-        opacity: isDragging ? 0.5 : 1,
-        paddingLeft: doc.depth * 12 + 8,
-    };
-    return (_jsxs("div", { ref: setNodeRef, style: style, className: [
-            'flex items-center gap-1 w-full px-2 py-1.5 text-sm rounded-md transition-colors cursor-pointer',
-            isCurrent ? 'font-bold' : 'hover:opacity-80',
-            isDragging && 'opacity-50',
-        ].join(' '), children: [_jsx("div", { ...attributes, ...listeners, className: "cursor-grab active:cursor-grabbing p-0.5 rounded", onClick: (e) => e.stopPropagation(), children: _jsx(GripVertical, { className: "h-4 w-4 text-gray-400" }) }), doc.hasChildren ? (_jsx("button", { onClick: (e) => {
-                    e.stopPropagation();
-                    onToggle(doc.id);
-                }, className: "p-0.5 hover:bg-gray-200 rounded shrink-0", children: isExpanded ? (_jsx(ChevronDown, { className: "h-4 w-4" })) : (_jsx(ChevronRight, { className: "h-4 w-4" })) })) : (_jsx("div", { className: "w-4" })), doc.emoji ? (_jsx("span", { className: "text-base shrink-0", children: doc.emoji })) : doc.hasChildren ? (isExpanded ? (_jsx(FolderOpen, { className: "h-4 w-4 shrink-0 text-muted" })) : (_jsx(Folder, { className: "h-4 w-4 shrink-0 text-muted" }))) : (_jsx(FileText, { className: "h-4 w-4 shrink-0 text-gray-400" })), _jsx("span", { className: "truncate flex-1", onClick: () => onNavigate(doc.id), children: doc.title })] }));
-}
-// Drag Overlay Item
-function DragOverlayItem({ doc }) {
-    return (_jsxs("div", { className: [
-            'flex items-center gap-1 w-full px-2 py-1.5 text-sm text-gray-500  rounded-md shadow-lg',
-            'opacity-80',
-        ].join(' '), children: [_jsx(GripVertical, { className: "h-4 w-4 text-gray-400" }), _jsx("div", { className: "w-5" }), doc.emoji ? (_jsx("span", { className: "text-base shrink-0", children: doc.emoji })) : doc.hasChildren ? (_jsx(Folder, { className: "h-4 w-4 shrink-0 text-blue-600" })) : (_jsx(FileText, { className: "h-4 w-4 shrink-0 text-gray-400" })), _jsx("span", { className: "truncate", children: doc.title })] }));
-}
-// Simple debounce hook
-function useDebounce(value, delay) {
-    const [debouncedValue, setDebouncedValue] = useState(value);
-    useEffect(() => {
-        const timer = setTimeout(() => {
-            setDebouncedValue(value);
-        }, delay);
-        return () => clearTimeout(timer);
-    }, [value, delay]);
-    return debouncedValue;
-}
-// Build breadcrumb path for a document
-function buildBreadcrumb(doc, allDocs) {
-    const parts = [doc.title];
-    let current = doc;
-    while (current.parentId) {
-        const parent = allDocs.find((d) => d.id === current.parentId);
-        if (!parent)
-            break;
-        parts.unshift(parent.title);
-        current = parent;
-    }
-    return parts.join(' / ');
-}
-// Build full path from root to document (for URL navigation)
-function buildDocumentPath(docId, allDocs, basePath) {
-    const pathParts = [];
-    const visited = new Set();
-    let currentId = docId;
-    while (currentId) {
-        // Prevent infinite loops from circular references
-        if (visited.has(currentId))
-            break;
-        visited.add(currentId);
-        const doc = allDocs.find((d) => d.id === currentId);
-        if (!doc)
-            break;
-        pathParts.unshift(doc.slug || doc.id);
-        currentId = doc.parentId ?? null;
-    }
-    if (pathParts.length === 0)
-        return basePath;
-    return `${basePath}/${pathParts.join('/')}`;
-}
-// Get all ancestor IDs of a document (for auto-expanding)
-function getAncestorIds(docId, allDocs) {
-    const ancestors = [];
-    const visited = new Set();
-    let currentId = docId;
-    while (currentId) {
-        if (visited.has(currentId))
-            break;
-        visited.add(currentId);
-        const doc = allDocs.find((d) => d.id === currentId);
-        if (!doc)
-            break;
-        if (doc.parentId) {
-            ancestors.push(doc.parentId);
-            currentId = doc.parentId;
-        }
-        else {
-            break;
-        }
-    }
-    return ancestors;
-}
-// Extract text snippets from BlockNote content
-function extractTextSnippets(content, query) {
-    if (!content || typeof content !== 'object')
-        return [];
-    const snippets = [];
-    const queryLower = query.toLowerCase();
-    const extractFromBlock = (block) => {
-        if (!block || typeof block !== 'object')
-            return '';
-        const b = block;
-        // Handle text content
-        if (b.content && Array.isArray(b.content)) {
-            return b.content
-                .map((c) => {
-                if (typeof c === 'string')
-                    return c;
-                if (c && typeof c === 'object') {
-                    const contentItem = c;
-                    if (contentItem.text && typeof contentItem.text === 'string') {
-                        return contentItem.text;
-                    }
-                }
-                return '';
-            })
-                .join(' ');
-        }
-        // Handle children
-        if (b.children && Array.isArray(b.children)) {
-            return b.children.map(extractFromBlock).join(' ');
-        }
-        return '';
-    };
-    const contentObj = content;
-    if (contentObj.content && Array.isArray(contentObj.content)) {
-        for (const block of contentObj.content) {
-            const text = extractFromBlock(block);
-            if (text.toLowerCase().includes(queryLower)) {
-                // Find the position of the match
-                const matchIndex = text.toLowerCase().indexOf(queryLower);
-                const start = Math.max(0, matchIndex - 20);
-                const end = Math.min(text.length, matchIndex + query.length + 60);
-                let snippet = text.slice(start, end);
-                // Add ellipsis if truncated
-                if (start > 0)
-                    snippet = '...' + snippet;
-                if (end < text.length)
-                    snippet = snippet + '...';
-                snippets.push(snippet);
-                if (snippets.length >= 2)
-                    break; // Limit to 2 snippets
-            }
-        }
-    }
-    return snippets;
-}
-export function DocsLayout({ children, currentDocId, onNavigate, basePath = '/docs', userAvatar, onSearch, }) {
-    const [expandedFolders, setExpandedFolders] = useState(new Set());
-    const [searchQuery, setSearchQuery] = useState('');
-    const [activeId, setActiveId] = useState(null);
-    const [isSidebarOpen, setIsSidebarOpen] = useState(true);
-    // Header search state
-    const [headerSearchQuery, setHeaderSearchQuery] = useState('');
-    const [showSearchResults, setShowSearchResults] = useState(false);
-    const debouncedSearchQuery = useDebounce(headerSearchQuery, 300);
-    const searchInputRef = useRef(null);
-    const { data } = useDocumentsQuery();
-    const reorderMutation = useReorderDocumentMutation();
-    const documents = data?.documents ?? [];
-    // Search query for header search
-    const { data: searchResultsData } = useDocumentsQuery(debouncedSearchQuery.length > 0 ? { search: debouncedSearchQuery } : {});
-    const searchResults = searchResultsData?.documents ?? [];
-    // Resolve currentDocId (which might be a slug) to actual document ID
-    const resolvedCurrentDocId = useMemo(() => {
-        if (!currentDocId || documents.length === 0)
-            return null;
-        // First try to find by ID
-        const byId = documents.find((d) => d.id === currentDocId);
-        if (byId)
-            return byId.id;
-        // Then try to find by slug
-        const bySlug = documents.find((d) => d.slug === currentDocId);
-        if (bySlug)
-            return bySlug.id;
-        return null;
-    }, [currentDocId, documents]);
-    // Auto-expand tree branches when current document changes
-    useEffect(() => {
-        if (!resolvedCurrentDocId || documents.length === 0)
-            return;
-        const ancestors = getAncestorIds(resolvedCurrentDocId, documents);
-        // Expand all ancestors so the current document is visible
-        if (ancestors.length > 0) {
-            setExpandedFolders((prev) => {
-                const newExpanded = new Set(prev);
-                ancestors.forEach((id) => newExpanded.add(id));
-                return newExpanded;
-            });
-        }
-    }, [resolvedCurrentDocId, documents]);
-    // Handle click outside to close search results
-    useEffect(() => {
-        const handleClickOutside = (event) => {
-            if (searchInputRef.current &&
-                !searchInputRef.current.contains(event.target)) {
-                setShowSearchResults(false);
-            }
-        };
-        document.addEventListener('mousedown', handleClickOutside);
-        return () => document.removeEventListener('mousedown', handleClickOutside);
-    }, []);
-    // Build flattened tree for sortable context
-    const flattenedTree = useMemo(() => {
-        const items = [];
-        const processed = new Set();
-        const processDoc = (doc, depth) => {
-            if (processed.has(doc.id))
-                return;
-            processed.add(doc.id);
-            const children = documents.filter((d) => d.parentId === doc.id);
-            const hasChildren = children.length > 0;
-            items.push({ ...doc, depth, hasChildren });
-            // If expanded, process children
-            if (hasChildren && expandedFolders.has(doc.id)) {
-                children
-                    .sort((a, b) => a.order - b.order)
-                    .forEach((child) => processDoc(child, depth + 1));
-            }
-        };
-        // Process root documents
-        documents
-            .filter((d) => !d.parentId)
-            .sort((a, b) => a.order - b.order)
-            .forEach((doc) => processDoc(doc, 0));
-        return items;
-    }, [documents, expandedFolders]);
-    const getChildren = useCallback((parentId) => documents.filter((d) => d.parentId === parentId), [documents]);
-    const toggleFolder = useCallback((folderId) => {
-        setExpandedFolders((prev) => {
-            const newExpanded = new Set(prev);
-            if (newExpanded.has(folderId)) {
-                newExpanded.delete(folderId);
-            }
-            else {
-                newExpanded.add(folderId);
-            }
-            return newExpanded;
-        });
-    }, []);
-    // Navigate with full path
-    const handleNavigate = useCallback((docId) => {
-        if (!onNavigate)
-            return;
-        if (docId === 'new') {
-            onNavigate(`${basePath}/new`);
-            return;
-        }
-        const path = buildDocumentPath(docId, documents, basePath);
-        onNavigate(path);
-    }, [onNavigate, documents, basePath]);
-    const sensors = useSensors(useSensor(PointerSensor, {
-        activationConstraint: {
-            distance: 5,
-        },
-    }), useSensor(KeyboardSensor, {
-        coordinateGetter: sortableKeyboardCoordinates,
-    }));
-    const handleDragStart = useCallback((event) => {
-        setActiveId(event.active.id);
-    }, []);
-    const handleDragOver = useCallback((event) => {
-        const { over } = event;
-        if (!over)
-            return;
-        const overId = over.id;
-        // Auto-expand folder when hovering over it
-        const overDoc = documents.find((d) => d.id === overId);
-        if (overDoc) {
-            const children = getChildren(overId);
-            if (children.length > 0 && !expandedFolders.has(overId)) {
-                toggleFolder(overId);
-            }
-        }
-    }, [documents, expandedFolders, getChildren, toggleFolder]);
-    const handleDragEnd = useCallback((event) => {
-        const { active, over } = event;
-        setActiveId(null);
-        if (!over)
-            return;
-        const draggedId = active.id;
-        const overId = over.id;
-        if (draggedId === overId)
-            return;
-        const activeDoc = documents.find((d) => d.id === draggedId);
-        const overDoc = documents.find((d) => d.id === overId);
-        if (!activeDoc || !overDoc)
-            return;
-        // Calculate new parent and order
-        let newParentId = null;
-        let newOrder = 0;
-        // Determine if we're dropping before, after, or inside the target
-        const activeIndex = flattenedTree.findIndex((item) => item.id === draggedId);
-        const overIndex = flattenedTree.findIndex((item) => item.id === overId);
-        if (activeIndex === -1 || overIndex === -1)
-            return;
-        if (activeIndex < overIndex) {
-            // Dropping after the target
-            newParentId = overDoc.parentId || null;
-            newOrder = overDoc.order + 5;
-        }
-        else {
-            // Dropping before the target
-            newParentId = overDoc.parentId || null;
-            newOrder = overDoc.order - 5;
-        }
-        // Check if dropping on a folder (to make it a child)
-        const overHasChildren = getChildren(overId).length > 0;
-        if (overHasChildren && activeIndex > overIndex) {
-            // If dropping after a folder, make it the first child
-            newParentId = overId;
-            newOrder = 0;
-        }
-        // Prevent dropping a parent into its own child
-        const isChildOfActive = (docId) => {
-            const doc = documents.find((d) => d.id === docId);
-            if (!doc)
-                return false;
-            if (doc.parentId === draggedId)
-                return true;
-            if (doc.parentId)
-                return isChildOfActive(doc.parentId);
-            return false;
-        };
-        if (isChildOfActive(overId)) {
-            console.log('Cannot drop a parent into its own child');
-            return;
-        }
-        // Execute the reorder
-        reorderMutation.mutate({
-            id: draggedId,
-            parentId: newParentId,
-            order: newOrder,
-        });
-    }, [documents, flattenedTree, getChildren, reorderMutation]);
-    const dropAnimation = {
-        sideEffects: defaultDropAnimationSideEffects({
-            styles: {
-                active: {
-                    opacity: '0.5',
-                },
-            },
-        }),
-    };
-    const activeDoc = useMemo(() => {
-        if (!activeId)
-            return null;
-        const doc = documents.find((d) => d.id === activeId);
-        if (!doc)
-            return null;
-        const children = getChildren(doc.id);
-        return { ...doc, depth: 0, hasChildren: children.length > 0 };
-    }, [activeId, documents, getChildren]);
-    return (_jsxs("div", { className: "flex h-screen w-full", children: [_jsxs("aside", { className: [
-                    'border-r border-border flex flex-col transition-all duration-200 ease-in-out overflow-hidden',
-                    isSidebarOpen ? 'w-64 opacity-100' : 'w-0 opacity-0',
-                ].join(' '), children: [_jsxs("div", { className: "p-4", children: [_jsxs("div", { className: "flex items-center justify-between mb-3", children: [_jsx("h2", { className: "font-semibold text-sm text-muted-foreground", children: "Documents" }), _jsx("button", { className: "p-2 hover:bg-primary rounded-md transition-colors cursor-pointer", onClick: () => handleNavigate('new'), children: _jsx(Plus, { className: "h-4 w-4" }) })] }), _jsxs("div", { className: "relative", children: [_jsx(Search, { className: "absolute left-2 top-2.5 h-4 w-4 text-gray-400" }), _jsx("input", { type: "text", placeholder: "Search docs...", value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), className: "w-full pl-8 pr-3 py-2 text-sm border border-gray-300 dark:border-gray-700 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent" })] })] }), _jsxs("div", { className: "flex-1 overflow-y-auto p-2 space-y-1", children: [_jsxs(DndContext, { sensors: sensors, collisionDetection: closestCenter, onDragStart: handleDragStart, onDragOver: handleDragOver, onDragEnd: handleDragEnd, children: [_jsx(SortableContext, { items: flattenedTree.map((item) => item.id), strategy: verticalListSortingStrategy, children: flattenedTree.map((doc) => (_jsx(SortableTreeItem, { doc: doc, isExpanded: expandedFolders.has(doc.id), isCurrent: doc.id === resolvedCurrentDocId, onToggle: toggleFolder, onNavigate: handleNavigate }, doc.id))) }), _jsx(DragOverlay, { dropAnimation: dropAnimation, children: activeDoc ? _jsx(DragOverlayItem, { doc: activeDoc }) : null })] }), documents.length === 0 && (_jsx("div", { className: "text-sm text-gray-500 text-center py-4", children: "No documents yet" }))] })] }), _jsxs("main", { className: "flex-1 flex flex-col min-w-0 overflow-hidden", children: [_jsxs("header", { className: "h-16 border-b border-border flex items-center justify-between px-6 shrink-0", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("button", { onClick: () => setIsSidebarOpen(!isSidebarOpen), className: "p-2 hover:bg-primary rounded-md transition-colors text-muted-foreground", title: isSidebarOpen ? 'Close sidebar' : 'Open sidebar', children: isSidebarOpen ? (_jsx(PanelLeftCloseIcon, { className: "h-6 w-6" })) : (_jsx(PanelLeftOpenIcon, { className: "h-6 w-6" })) }), _jsx(Breadcrumbs, { docId: resolvedCurrentDocId ?? undefined, documents: documents.map((d) => ({
-                                            id: d.id,
-                                            title: d.title,
-                                            slug: d.slug,
-                                            emoji: d.emoji ?? undefined,
-                                            parentId: d.parentId,
-                                        })), onNavigate: onNavigate, homeLabel: "Documents" })] }), _jsxs("div", { className: "flex items-center gap-4 py-2", children: [_jsxs("div", { ref: searchInputRef, className: "relative w-64", children: [_jsx(Search, { className: "absolute left-2 top-2.5 h-4 w-4 z-10" }), _jsx("input", { type: "text", placeholder: "Search documentation...", className: "w-full pl-8 pr-3 py-2 text-sm border border-border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent", value: headerSearchQuery, onChange: (e) => {
-                                                    setHeaderSearchQuery(e.target.value);
-                                                    setShowSearchResults(e.target.value.length > 0);
-                                                }, onFocus: () => {
-                                                    if (headerSearchQuery.length > 0) {
-                                                        setShowSearchResults(true);
-                                                    }
-                                                } }), showSearchResults && headerSearchQuery.length > 0 && (_jsx("div", { className: "absolute top-full left-0 right-0 mt-1 border border-gray-200 rounded-md shadow-lg max-h-80 overflow-y-auto z-50", children: searchResults.length === 0 ? (_jsxs("div", { className: "px-4 py-3 text-sm text-gray-500", children: ["No results found for \"", headerSearchQuery, "\""] })) : (_jsx("div", { className: "py-1", children: searchResults.map((doc) => {
-                                                        const breadcrumb = doc.parentId
-                                                            ? buildBreadcrumb(doc, documents)
-                                                            : null;
-                                                        return (_jsx("button", { onClick: () => {
-                                                                handleNavigate(doc.id);
-                                                                setHeaderSearchQuery('');
-                                                                setShowSearchResults(false);
-                                                            }, className: "w-full px-3 py-2 text-left hover:bg-gray-100 transition-colors", children: _jsxs("div", { className: "flex items-start gap-2", children: [_jsx("div", { className: "shrink-0 mt-0.5", children: doc.emoji ? (_jsx("span", { className: "text-base", children: doc.emoji })) : (_jsx(FileText, { className: "h-4 w-4 text-gray-400" })) }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsx("div", { className: "font-medium text-sm text-gray-900 truncate", children: doc.title }), breadcrumb && (_jsx("div", { className: "text-xs text-gray-500 truncate", children: breadcrumb }))] })] }) }, doc.id));
-                                                    }) })) }))] }), _jsxs("button", { onClick: () => handleNavigate('new'), className: "px-4 py-2 bg-secondary text-white text-sm rounded-md hover:bg-gray-800 flex items-center gap-2 transition-colors", children: [_jsx(Plus, { className: "h-4 w-4" }), "Create"] }), userAvatar] })] }), _jsx("div", { className: "flex-1 overflow-auto p-6", children: children })] })] }));
-}

package/dist/client/providers/DocumentProvider.d.ts

@@ -1 +0,0 @@
-//# sourceMappingURL=DocumentProvider.d.ts.map

package/dist/client/providers/DocumentProvider.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"DocumentProvider.d.ts","sourceRoot":"","sources":["../../../src/client/providers/DocumentProvider.tsx"],"names":[],"mappings":""}

package/dist/client/providers/DocumentProvider.js

@@ -1 +0,0 @@
-"use strict";