@brainfish-ai/devdoc 0.1.42 → 0.1.43

package/renderer/components/docs-viewer/content/changelog-page.js

@@ -0,0 +1,297 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { Spinner } from '@phosphor-icons/react';
+import { MDXRemote } from 'next-mdx-remote';
+import { cn } from '@/lib/utils';
+// Import base MDX components (using relative path for Vercel compatibility)
+import { Note, Warning as WarningCallout, Info, Tip, Check, Error as ErrorCallout, Callout } from '../../docs/mdx/index';
+// Custom styled components for changelog content
+const changelogMdxComponents = {
+    h2: ({ children, ...props })=>/*#__PURE__*/ _jsx("h2", {
+            className: "text-lg font-semibold text-foreground mt-6 mb-3",
+            ...props,
+            children: children
+        }),
+    h3: ({ children, ...props })=>/*#__PURE__*/ _jsx("h3", {
+            className: "text-base font-medium text-foreground mt-4 mb-2",
+            ...props,
+            children: children
+        }),
+    p: ({ children, ...props })=>/*#__PURE__*/ _jsx("p", {
+            className: "text-muted-foreground mb-4",
+            ...props,
+            children: children
+        }),
+    ul: ({ children, ...props })=>/*#__PURE__*/ _jsx("ul", {
+            className: "space-y-2 text-muted-foreground mb-4",
+            ...props,
+            children: children
+        }),
+    li: ({ children, ...props })=>/*#__PURE__*/ _jsxs("li", {
+            className: "flex items-start gap-2",
+            ...props,
+            children: [
+                /*#__PURE__*/ _jsx("span", {
+                    className: "mt-2 h-1.5 w-1.5 rounded-full bg-foreground shrink-0"
+                }),
+                /*#__PURE__*/ _jsx("span", {
+                    children: children
+                })
+            ]
+        }),
+    strong: ({ children, ...props })=>/*#__PURE__*/ _jsx("strong", {
+            className: "font-semibold text-foreground",
+            ...props,
+            children: children
+        }),
+    // Keep callout components
+    Note,
+    Warning: WarningCallout,
+    Info,
+    Tip,
+    Check,
+    Error: ErrorCallout,
+    Callout
+};
+// Format date to be more readable
+function formatDate(dateString) {
+    try {
+        const date = new Date(dateString);
+        return date.toLocaleDateString('en-US', {
+            year: 'numeric',
+            month: 'long',
+            day: 'numeric'
+        });
+    } catch  {
+        return dateString;
+    }
+}
+// Extract version from slug (e.g., "changelog/v1.2.0" -> "v1.2.0")
+function getVersionFromSlug(slug) {
+    return slug.replace(/^changelog\//, '');
+}
+// Single release entry component
+function ReleaseEntry({ release, content, isLatest, isLast }) {
+    // Use version extracted from slug for the ID (without changelog/ prefix)
+    const versionId = getVersionFromSlug(release.slug);
+    return /*#__PURE__*/ _jsxs("article", {
+        id: `release-${versionId}`,
+        className: "docs-changelog-entry relative scroll-mt-24 pl-8",
+        children: [
+            !isLast && /*#__PURE__*/ _jsx("div", {
+                className: "absolute left-[3px] top-3 bottom-0 w-[2px] bg-border"
+            }),
+            /*#__PURE__*/ _jsx("div", {
+                className: cn("absolute left-0 top-[6px] w-[8px] h-[8px] rounded-full border-2 z-10", isLatest ? "bg-primary border-primary" : "bg-background border-muted-foreground/40")
+            }),
+            /*#__PURE__*/ _jsxs("div", {
+                className: "pb-10",
+                children: [
+                    /*#__PURE__*/ _jsxs("div", {
+                        className: "flex flex-wrap items-center gap-3 mb-4",
+                        children: [
+                            /*#__PURE__*/ _jsxs("span", {
+                                className: cn("docs-changelog-version inline-flex items-center px-3 py-1 text-sm font-semibold rounded-full", isLatest ? "bg-primary/10 text-primary border border-primary/20" : "bg-muted text-foreground border border-border"),
+                                children: [
+                                    release.version,
+                                    isLatest && /*#__PURE__*/ _jsx("span", {
+                                        className: "ml-2 text-xs font-normal opacity-75",
+                                        children: "Latest"
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsx("time", {
+                                className: "docs-changelog-date text-sm text-muted-foreground",
+                                children: formatDate(release.date)
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsx("h2", {
+                        className: "docs-changelog-title text-xl font-semibold text-foreground mb-4",
+                        children: release.title
+                    }),
+                    content ? /*#__PURE__*/ _jsx("div", {
+                        className: "docs-changelog-content prose prose-sm dark:prose-invert max-w-none",
+                        children: /*#__PURE__*/ _jsx(MDXRemote, {
+                            ...content.mdxSource,
+                            components: changelogMdxComponents
+                        })
+                    }) : /*#__PURE__*/ _jsxs("div", {
+                        className: "flex items-center gap-2 text-muted-foreground py-4",
+                        children: [
+                            /*#__PURE__*/ _jsx(Spinner, {
+                                className: "h-4 w-4 animate-spin"
+                            }),
+                            /*#__PURE__*/ _jsx("span", {
+                                className: "text-sm",
+                                children: "Loading..."
+                            })
+                        ]
+                    })
+                ]
+            })
+        ]
+    });
+}
+export function ChangelogPage({ releases, tabName = 'Changelog' }) {
+    const [releaseContents, setReleaseContents] = useState(new Map());
+    const [loadingAll, setLoadingAll] = useState(true);
+    const [error, setError] = useState(null);
+    const [activeVersion, setActiveVersion] = useState(releases[0]?.version || null);
+    // Load all releases on mount
+    useEffect(()=>{
+        async function fetchAllReleases() {
+            if (releases.length === 0) {
+                setLoadingAll(false);
+                return;
+            }
+            setLoadingAll(true);
+            setError(null);
+            const contents = new Map();
+            // Fetch all releases in parallel
+            const fetchPromises = releases.map(async (release)=>{
+                try {
+                    const response = await fetch(`/api/docs?slug=${encodeURIComponent(release.slug)}`);
+                    if (response.ok) {
+                        const data = await response.json();
+                        contents.set(release.version, data);
+                    }
+                } catch (err) {
+                    console.error(`Error loading release ${release.version}:`, err);
+                }
+            });
+            await Promise.all(fetchPromises);
+            setReleaseContents(contents);
+            setLoadingAll(false);
+        }
+        fetchAllReleases();
+    }, [
+        releases
+    ]);
+    // Track active version based on scroll position
+    useEffect(()=>{
+        const observer = new IntersectionObserver((entries)=>{
+            for (const entry of entries){
+                if (entry.isIntersecting) {
+                    const version = entry.target.getAttribute('data-version');
+                    if (version) {
+                        setActiveVersion(version);
+                    }
+                }
+            }
+        }, {
+            rootMargin: '-100px 0px -70% 0px',
+            threshold: 0
+        });
+        // Observe all release entries
+        releases.forEach((release)=>{
+            const versionId = getVersionFromSlug(release.slug);
+            const element = document.getElementById(`release-${versionId}`);
+            if (element) {
+                element.setAttribute('data-version', release.version);
+                observer.observe(element);
+            }
+        });
+        return ()=>observer.disconnect();
+    }, [
+        releases,
+        releaseContents
+    ]);
+    const scrollToRelease = (slug)=>{
+        const versionId = getVersionFromSlug(slug);
+        const element = document.getElementById(`release-${versionId}`);
+        if (element) {
+            element.scrollIntoView({
+                behavior: 'smooth',
+                block: 'start'
+            });
+        }
+    };
+    if (releases.length === 0) {
+        return /*#__PURE__*/ _jsx("div", {
+            className: "flex-1 flex items-center justify-center py-12",
+            children: /*#__PURE__*/ _jsx("p", {
+                className: "text-muted-foreground",
+                children: "No changelog releases found."
+            })
+        });
+    }
+    return /*#__PURE__*/ _jsxs("div", {
+        className: "docs-changelog flex flex-1 h-full overflow-hidden",
+        children: [
+            /*#__PURE__*/ _jsx("div", {
+                className: "docs-changelog-main flex-1 overflow-y-auto",
+                children: /*#__PURE__*/ _jsxs("div", {
+                    className: "max-w-3xl mx-auto px-6 py-8 lg:px-8",
+                    children: [
+                        /*#__PURE__*/ _jsxs("header", {
+                            className: "docs-changelog-header mb-10",
+                            children: [
+                                /*#__PURE__*/ _jsx("h1", {
+                                    className: "docs-content-title text-3xl font-bold text-foreground mb-2",
+                                    children: tabName
+                                }),
+                                /*#__PURE__*/ _jsx("p", {
+                                    className: "text-muted-foreground",
+                                    children: "All notable changes and updates to this project."
+                                })
+                            ]
+                        }),
+                        loadingAll && releaseContents.size === 0 && /*#__PURE__*/ _jsx("div", {
+                            className: "docs-loading flex items-center justify-center py-12",
+                            children: /*#__PURE__*/ _jsx(Spinner, {
+                                className: "h-6 w-6 animate-spin text-muted-foreground"
+                            })
+                        }),
+                        error && /*#__PURE__*/ _jsx("div", {
+                            className: "docs-error text-center py-12",
+                            children: /*#__PURE__*/ _jsx("p", {
+                                className: "text-destructive",
+                                children: error
+                            })
+                        }),
+                        /*#__PURE__*/ _jsx("div", {
+                            className: "docs-changelog-releases relative",
+                            children: releases.map((release, index)=>/*#__PURE__*/ _jsx(ReleaseEntry, {
+                                    release: release,
+                                    content: releaseContents.get(release.version) || null,
+                                    isLatest: index === 0,
+                                    isLast: index === releases.length - 1
+                                }, release.version))
+                        })
+                    ]
+                })
+            }),
+            releases.length > 1 && /*#__PURE__*/ _jsx("aside", {
+                className: "docs-changelog-sidebar hidden lg:flex lg:flex-col w-48 h-full border-l border-border bg-muted/20 overflow-y-auto shrink-0",
+                children: /*#__PURE__*/ _jsxs("div", {
+                    className: "p-4 sticky top-0",
+                    children: [
+                        /*#__PURE__*/ _jsx("h3", {
+                            className: "docs-changelog-sidebar-title text-xs font-semibold text-muted-foreground uppercase tracking-wider mb-3",
+                            children: "Releases"
+                        }),
+                        /*#__PURE__*/ _jsx("nav", {
+                            className: "docs-changelog-nav space-y-1",
+                            children: releases.map((release, index)=>/*#__PURE__*/ _jsx("button", {
+                                    onClick: ()=>scrollToRelease(release.slug),
+                                    className: cn('docs-changelog-nav-item block w-full text-left px-3 py-2 text-sm rounded-md transition-all duration-200', activeVersion === release.version ? 'docs-changelog-nav-item-active bg-primary/10 text-primary font-medium' : 'text-muted-foreground hover:text-foreground hover:bg-muted'),
+                                    children: /*#__PURE__*/ _jsxs("span", {
+                                        className: "flex items-center gap-2",
+                                        children: [
+                                            release.version,
+                                            index === 0 && /*#__PURE__*/ _jsx("span", {
+                                                className: "text-[10px] px-1.5 py-0.5 rounded bg-primary/10 text-primary",
+                                                children: "Latest"
+                                            })
+                                        ]
+                                    })
+                                }, release.version))
+                        })
+                    ]
+                })
+            })
+        ]
+    });
+}

package/renderer/components/docs-viewer/content/doc-page.js

@@ -0,0 +1,264 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState, useCallback, useRef } from 'react';
+import { Spinner } from '@phosphor-icons/react';
+import { MDXRemote } from 'next-mdx-remote';
+import { useDocsNavigation } from '@/lib/docs-navigation-context';
+import { useCodeCopy } from '@/hooks/use-code-copy';
+import { NotFoundPage } from './not-found-page';
+// Custom Link component for MDX - uses docs navigation context
+function MdxLink({ href, children, ...props }) {
+    const docsNav = useDocsNavigation();
+    const handleClick = useCallback((e)=>{
+        // Handle anchor links (same page)
+        if (href?.startsWith('#')) {
+            return; // Let default behavior handle anchor scrolling
+        }
+        // Handle internal doc links
+        if (href?.startsWith('/') && docsNav?.isApiDocsView) {
+            e.preventDefault();
+            // Extract the slug from the path
+            let slug = href;
+            // Remove leading slash
+            if (slug.startsWith('/')) {
+                slug = slug.slice(1);
+            }
+            // Handle special paths
+            if (slug.startsWith('api-reference')) {
+                docsNav.switchToTab('api-reference');
+                return;
+            }
+            if (slug.startsWith('changelog')) {
+                docsNav.switchToTab('changelog');
+                return;
+            }
+            // Remove docs/ prefix if present
+            if (slug.startsWith('docs/')) {
+                slug = slug.slice(5);
+            }
+            // Navigate to the page
+            docsNav.navigateToPage(slug);
+        }
+    }, [
+        href,
+        docsNav
+    ]);
+    // Determine link styling - better visibility and accessibility
+    // Using visited: to override browser's purple visited link color
+    const linkClassName = "text-primary visited:text-primary font-medium underline decoration-primary/30 underline-offset-2 hover:decoration-primary transition-colors";
+    // External links
+    if (href && !href.startsWith('/') && !href.startsWith('#')) {
+        return /*#__PURE__*/ _jsx("a", {
+            href: href,
+            target: "_blank",
+            rel: "noopener noreferrer",
+            className: linkClassName,
+            ...props,
+            children: children
+        });
+    }
+    return /*#__PURE__*/ _jsx("a", {
+        href: href,
+        onClick: handleClick,
+        className: linkClassName,
+        ...props,
+        children: children
+    });
+}
+// Import MDX components
+import { Note, Warning, Info, Tip, Check, Error as ErrorCallout, Callout, Card, CardGroup, Accordion, AccordionGroup, Steps, Step, Tabs, Tab, CodeGroup, Frame, Columns, Snippet, Latex, ParamField, ResponseField, Expandable, Iframe, Video, Loom, Image, Screenshot, Logo, Icon, Highlight, Marker, Underline, Badge, Mermaid, PDF, Audio, Download, // Landing Page Components
+Hero, Pre, Tagline, Headline, Description, CommandBox, Section, Center, FeatureGrid, FeatureItem, ButtonLink, Spacer, Divider } from '../../docs/mdx/index';
+// MDX components mapping
+const mdxComponents = {
+    // Callouts
+    Note,
+    Warning,
+    Info,
+    Tip,
+    Check,
+    Error: ErrorCallout,
+    Callout,
+    // Cards
+    Card,
+    CardGroup,
+    // Accordion
+    Accordion,
+    AccordionGroup,
+    // Steps
+    Steps,
+    Step,
+    // Tabs
+    Tabs,
+    Tab,
+    // Code
+    CodeGroup,
+    // Layout
+    Frame,
+    Columns,
+    Snippet,
+    Latex,
+    // API docs
+    ParamField,
+    ResponseField,
+    Expandable,
+    // Embeds
+    Iframe,
+    Video,
+    Loom,
+    // Images
+    Image,
+    Screenshot,
+    Logo,
+    Icon,
+    // Highlight
+    Highlight,
+    Marker,
+    Underline,
+    // Badge
+    Badge,
+    // Mermaid
+    Mermaid,
+    // File Embeds
+    PDF,
+    Audio,
+    Download,
+    // Landing Page
+    Hero,
+    Pre,
+    Tagline,
+    Headline,
+    Description,
+    CommandBox,
+    Section,
+    Center,
+    FeatureGrid,
+    FeatureItem,
+    ButtonLink,
+    Spacer,
+    Divider,
+    // Links
+    a: MdxLink
+};
+export function DocPage({ slug, onSearch }) {
+    const [pageData, setPageData] = useState(null);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState(null);
+    const [isNotFound, setIsNotFound] = useState(false);
+    const contentRef = useRef(null);
+    // Add copy buttons to code blocks after content loads
+    useCodeCopy(contentRef, [
+        pageData
+    ]);
+    useEffect(()=>{
+        async function fetchPage() {
+            try {
+                setLoading(true);
+                setError(null);
+                setIsNotFound(false);
+                const response = await fetch(`/api/docs?slug=${encodeURIComponent(slug)}`);
+                if (response.status === 404) {
+                    setIsNotFound(true);
+                    return;
+                }
+                if (!response.ok) {
+                    throw new Error('Failed to load page');
+                }
+                const data = await response.json();
+                setPageData(data);
+            } catch (err) {
+                console.error('Error loading doc page:', err);
+                setError(err instanceof Error ? err.message : 'Failed to load page');
+            } finally{
+                setLoading(false);
+            }
+        }
+        fetchPage();
+    }, [
+        slug
+    ]);
+    if (loading) {
+        return /*#__PURE__*/ _jsx("div", {
+            className: "docs-page docs-page-loading w-full min-h-[200px]",
+            children: /*#__PURE__*/ _jsx("div", {
+                className: "docs-loading flex items-center justify-center py-12",
+                children: /*#__PURE__*/ _jsx(Spinner, {
+                    className: "h-6 w-6 animate-spin text-muted-foreground"
+                })
+            })
+        });
+    }
+    // Show 404 page for not found errors
+    if (isNotFound) {
+        return /*#__PURE__*/ _jsx(NotFoundPage, {
+            slug: slug,
+            onSearch: onSearch
+        });
+    }
+    // Show generic error for other errors
+    if (error || !pageData) {
+        return /*#__PURE__*/ _jsx("div", {
+            className: "docs-page docs-page-error w-full min-h-[200px]",
+            children: /*#__PURE__*/ _jsx("div", {
+                className: "docs-error text-center py-12",
+                children: /*#__PURE__*/ _jsx("p", {
+                    className: "text-destructive",
+                    children: error || 'Failed to load page'
+                })
+            })
+        });
+    }
+    const { mode = 'default', hideHeader, fullWidth, background } = pageData.frontmatter;
+    const isCustomMode = mode === 'custom';
+    const isWideMode = mode === 'wide';
+    const showHeader = !hideHeader && !isCustomMode;
+    // Custom mode: Full-width layout for landing pages
+    if (isCustomMode) {
+        return /*#__PURE__*/ _jsx("div", {
+            ref: contentRef,
+            className: "docs-page docs-page-custom docs-content w-full min-h-full",
+            style: {
+                background: background || 'var(--background)',
+                // Ensure the content fills the entire viewport width within the content area
+                marginLeft: 0,
+                marginRight: 0
+            },
+            children: /*#__PURE__*/ _jsx("div", {
+                className: "docs-custom-content [&>*]:w-full",
+                children: /*#__PURE__*/ _jsx(MDXRemote, {
+                    ...pageData.mdxSource,
+                    components: mdxComponents
+                })
+            })
+        });
+    }
+    // Default/Wide mode: Standard documentation layout
+    const containerClass = isWideMode ? 'max-w-6xl' // Wide mode
+     : 'max-w-4xl' // Default mode
+    ;
+    return /*#__PURE__*/ _jsxs("div", {
+        ref: contentRef,
+        className: `docs-page docs-content ${containerClass} mx-auto px-4 py-6 sm:px-8 sm:py-8`,
+        children: [
+            showHeader && /*#__PURE__*/ _jsxs("div", {
+                className: "docs-page-header mb-6",
+                children: [
+                    /*#__PURE__*/ _jsx("h1", {
+                        className: "docs-content-title text-2xl sm:text-3xl font-bold mb-2 text-foreground",
+                        children: pageData.frontmatter.title
+                    }),
+                    pageData.frontmatter.description && /*#__PURE__*/ _jsx("p", {
+                        className: "docs-content-description text-lg text-muted-foreground",
+                        children: pageData.frontmatter.description
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsx("div", {
+                className: "docs-prose prose prose-sm max-w-none prose-headings:text-foreground prose-p:text-muted-foreground prose-strong:text-foreground prose-code:text-foreground prose-pre:bg-muted prose-code:bg-muted prose-code:px-1 prose-code:py-0.5 prose-code:rounded prose-pre:overflow-x-auto prose-table:w-full prose-th:text-left prose-th:p-3 prose-th:bg-muted prose-td:p-3 prose-td:border-b prose-td:border-border",
+                children: /*#__PURE__*/ _jsx(MDXRemote, {
+                    ...pageData.mdxSource,
+                    components: mdxComponents
+                })
+            })
+        ]
+    });
+}

package/renderer/components/docs-viewer/content/documentation-viewer.js

@@ -0,0 +1,14 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { MarkdownRenderer } from '../shared/markdown-renderer';
+export function DocumentationViewer({ content }) {
+    return /*#__PURE__*/ _jsx("div", {
+        className: "max-w-4xl mx-auto p-8",
+        children: /*#__PURE__*/ _jsx("div", {
+            className: "prose prose-sm max-w-none",
+            children: /*#__PURE__*/ _jsx(MarkdownRenderer, {
+                content: content
+            })
+        })
+    });
+}

package/renderer/components/docs-viewer/content/index.js

@@ -0,0 +1,29 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { RequestDetails } from './request-details';
+export function ApiDocsContent({ request }) {
+    if (!request) {
+        return /*#__PURE__*/ _jsx("div", {
+            className: "flex-1 flex items-center justify-center bg-background",
+            children: /*#__PURE__*/ _jsxs("div", {
+                className: "text-center",
+                children: [
+                    /*#__PURE__*/ _jsx("p", {
+                        className: "text-muted-foreground text-lg mb-2",
+                        children: "Select an endpoint"
+                    }),
+                    /*#__PURE__*/ _jsx("p", {
+                        className: "text-sm text-muted-foreground",
+                        children: "Choose an endpoint from the sidebar to view its documentation"
+                    })
+                ]
+            })
+        });
+    }
+    return /*#__PURE__*/ _jsx("div", {
+        className: "flex-1 overflow-y-auto bg-background",
+        children: /*#__PURE__*/ _jsx(RequestDetails, {
+            request: request
+        })
+    });
+}