@curvenote/theme-ui 1.0.1

package/dist/components/index.d.ts

@@ -0,0 +1,4 @@
+export * from './layout';
+export * from './providers';
+export * from './ui';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,MAAM,CAAC"}

package/dist/components/index.js

@@ -0,0 +1,3 @@
+export * from './layout';
+export * from './providers';
+export * from './ui';

package/dist/components/layout/app-layout.d.ts

@@ -0,0 +1,8 @@
+import type { LayoutProps } from './types';
+export declare function AppLayout({ children, header, footer }: LayoutProps): import("react/jsx-runtime").JSX.Element;
+export declare function AppContainer({ children, header, className, }: {
+    children: React.ReactNode;
+    header?: React.ReactNode;
+    className?: string;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=app-layout.d.ts.map

package/dist/components/layout/app-layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-layout.d.ts","sourceRoot":"","sources":["../../../src/components/layout/app-layout.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAG3C,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,WAAW,2CAuBlE;AAED,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,MAAM,EACN,SAAS,GACV,EAAE;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,2CAwBA"}

package/dist/components/layout/app-layout.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { SidebarInset, SidebarProvider } from '../ui/sidebar';
+import { AppSidebar } from './app-sidebar';
+import { SiteHeader } from './site-header';
+import { useProjectManifest, useReferences } from '@myst-theme/providers';
+import { DocumentOutline } from '../ui/document-outline';
+import { cn } from '../../lib/utils';
+import { Banner } from '../ui';
+import { createSkipToTargets, SkipTo } from '../ui/accessibility-skip-to';
+import { useDesign } from '../providers';
+export function AppLayout({ children, header, footer }) {
+    return (_jsxs(_Fragment, { children: [_jsx(SkipTo, { targets: createSkipToTargets() }), _jsx("div", { className: cn('flex flex-col min-h-screen', {
+                    '[--header-height:calc(--spacing(22))]': header,
+                    '[--header-height:calc(--spacing(14))]': !header,
+                }), children: _jsxs(SidebarProvider, { className: "flex flex-col h-full", children: [_jsx(SiteHeader, { brandBar: header, showMobileMenu: true }), _jsxs("div", { className: "flex flex-1 pt-[var(--header-height)]", children: [_jsx(AppSidebar, {}), _jsxs(SidebarInset, { className: "flex flex-col min-h-full", children: [_jsx("div", { className: "flex-grow", children: children }), footer && _jsx("div", { className: "flex-shrink-0", children: footer })] })] })] }) })] }));
+}
+export function AppContainer({ children, header, className, }) {
+    const references = useReferences();
+    const project = useProjectManifest();
+    const design = useDesign();
+    return (_jsxs("article", { className: cn('relative app-grid grid-gap z-0 max-w-full article', className, {
+            'pt-8': !project?.banner,
+        }), children: [project?.banner && (_jsx(Banner, { thin: true, banner: project.banner, bannerOptimized: project.bannerOptimized })), header, !!header && _jsx("div", { className: "h-0 col-screen" }), !design.hide_outline && references?.article && (_jsx("aside", { className: "hidden sticky top-24 px-2 h-0 lg:block col-margin xl:px-4", children: _jsx(DocumentOutline, { mdast: references?.article }) })), children, _jsx("div", { id: "bottom-of-article", className: "h-0 col-screen" })] }));
+}

package/dist/components/layout/app-sidebar.d.ts

@@ -0,0 +1,2 @@
+export declare function AppSidebar(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=app-sidebar.d.ts.map

package/dist/components/layout/app-sidebar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-sidebar.d.ts","sourceRoot":"","sources":["../../../src/components/layout/app-sidebar.tsx"],"names":[],"mappings":"AA8PA,wBAAgB,UAAU,4CA2EzB"}

package/dist/components/layout/app-sidebar.js

@@ -0,0 +1,125 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { ChevronRight, Home, Notebook } from 'lucide-react';
+import * as React from 'react';
+import { useNavigation, useLocation, Link, NavLink } from 'react-router';
+import { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarMenu, SidebarMenuButton, SidebarMenuItem, } from '../ui/sidebar';
+import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '../ui';
+import { cn } from '../../lib/utils';
+import { getYear } from '../../lib/parse-date';
+import { CurvenoteLogo } from '@curvenote/icons';
+import { ThemeButton } from '../ui/theme-button';
+import { useBaseurl, useProjectManifest } from '@myst-theme/providers';
+import { useHydrated } from '../../hooks';
+import { usePage } from '../providers';
+const icons = {
+    notebook: Notebook,
+    notebooks: Notebook,
+    'supporting notebooks': Notebook,
+};
+// Helper function to build nested structure from flat pages array
+function buildNestedStructure(pages, baseUrl) {
+    const result = [];
+    const stack = [];
+    pages.forEach((page) => {
+        const item = {
+            title: page.short_title || page.title,
+            slug: page.slug,
+            url: page.slug
+                ? `${baseUrl}/${page.slug.replace(/\.index$/, '').replace(/\./g, '/')}`
+                : undefined,
+            icon: icons[(page.short_title || page.title).toLowerCase()],
+        };
+        // If this is a level 1 item, add it to the root
+        if (page.level === 1) {
+            result.push(item);
+            stack.length = 0; // Clear stack
+            stack.push(item);
+        }
+        else {
+            // Find the appropriate parent based on level
+            while (stack.length > 0 && stack.length >= page.level) {
+                stack.pop();
+            }
+            if (stack.length > 0) {
+                // Add to the last item in stack
+                if (!stack[stack.length - 1].children) {
+                    stack[stack.length - 1].children = [];
+                }
+                stack[stack.length - 1].children.push(item);
+                stack.push(item);
+            }
+            else {
+                // Fallback: add to root
+                result.push(item);
+                stack.push(item);
+            }
+        }
+    });
+    return result;
+}
+// Helper function to check if an item or its children contain the current page
+function containsCurrentPage(item, currentPage) {
+    if (!currentPage)
+        return false;
+    // Check if this item is the current page
+    if (item.slug === currentPage)
+        return true;
+    // Check if any children contain the current page
+    if (item.children) {
+        return item.children.some((child) => containsCurrentPage(child, currentPage));
+    }
+    return false;
+}
+// SidebarItem component to handle individual item state and effects
+function SidebarItemComponent({ item, currentPage, depth = 0, }) {
+    const location = useLocation();
+    const navigation = useNavigation();
+    const isNavigating = React.useMemo(() => navigation.state === 'loading', [navigation.state]);
+    // Only animate open/close after hydration
+    const isHydrated = useHydrated();
+    // Determine if this section should be expanded by default based on current page
+    const defaultOpen = containsCurrentPage(item, currentPage);
+    const [open, setOpen] = React.useState(defaultOpen);
+    // Close items that are not in use after navigation completes and URL changes
+    React.useEffect(() => {
+        if (!isNavigating && !containsCurrentPage(item, currentPage)) {
+            setOpen(false);
+        }
+        else if (!isNavigating && containsCurrentPage(item, currentPage)) {
+            // Keep items open that are relevant to the current page
+            setOpen(true);
+        }
+    }, [location.pathname, isNavigating, item, currentPage]);
+    if (item.children && item.children.length > 0) {
+        return (_jsx(Collapsible, { open: open, onOpenChange: setOpen, className: "group/collapsible", children: _jsxs(SidebarMenuItem, { children: [_jsx(CollapsibleTrigger, { asChild: true, children: _jsxs("div", { className: cn('flex w-full items-center rounded-md p-2 gap-2 text-sm outline-hidden', 'hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground', 'disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50', 'group-has-data-[sidebar=menu-action]/menu-item:pr-8', 'data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground', 'cursor-pointer', 'font-normal [&>svg]:opacity-50'), children: [item.url && (_jsxs(_Fragment, { children: [_jsxs(NavLink, { to: item.url, end: true, className: ({ isActive }) => `flex items-center gap-2 w-full ${isActive ? 'font-bold' : ''}`, prefetch: "intent", children: [item.icon && _jsx(item.icon, { className: "shrink-0 size-4" }), _jsx("div", { children: item.title })] }), _jsx(ChevronRight, { className: cn('ml-auto transition-transform duration-200 chevron shrink-0', {
+                                                'rotate-90': open,
+                                            }), size: 16 })] })), !item.url && (_jsxs(_Fragment, { children: [item.icon && _jsx(item.icon, { className: "shrink-0 size-4" }), _jsx("div", { children: item.title }), _jsx(ChevronRight, { className: cn('ml-auto transition-transform duration-200 chevron shrink-0', {
+                                                'rotate-90': open,
+                                            }), size: 16 })] }))] }) }), _jsx(CollapsibleContent, { className: cn('sidebar-submenu-content overflow-hidden', {
+                            'data-[state=closed]:animate-collapsible-up data-[state=open]:animate-collapsible-down duration-200': isHydrated,
+                        }), children: _jsx(SidebarMenu, { children: item.children.map((child) => (_jsx(SidebarItemComponent, { item: child, currentPage: currentPage, depth: depth + 1 }, child.title))) }) })] }) }, item.title));
+    }
+    else {
+        return (_jsx(SidebarMenuItem, { children: _jsx("div", { className: cn('flex gap-2 items-center w-full text-sm outline-hidden'), "data-slot": "sidebar-menu-button", "data-sidebar": "menu-button", "data-size": "default", children: _jsxs(NavLink, { to: item.url, end: true, className: ({ isActive }) => cn('p-2 rounded-md flex items-center gap-2 w-full', 'hover:bg-sidebar-accent hover:text-sidebar-accent-foreground', // focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground',
+                    'disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50', 'group-has-data-[sidebar=menu-action]/menu-item:pr-8', 'data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground', { 'font-semibold [&>svg]:opacity-100 bg-sidebar-accent': isActive }, { 'font-normal [&>svg]:opacity-50': !isActive }), prefetch: "intent", children: [depth === 0 && item.icon && _jsx(item.icon, { className: "shrink-0 size-4" }), _jsx("div", { children: item.title })] }) }) }, item.title));
+    }
+}
+export function AppSidebar() {
+    const page = usePage();
+    const currentPage = page.slug;
+    const project = useProjectManifest();
+    const baseUrl = useBaseurl() ?? '';
+    // Build nested structure from config pages
+    const sidebarItems = React.useMemo(() => {
+        if (!project?.pages) {
+            return [];
+        }
+        return buildNestedStructure(project.pages, baseUrl);
+    }, [project]);
+    const { title, authors, date: dateString } = project ?? {};
+    const year = getYear(dateString);
+    return (_jsxs(Sidebar, { className: "top-(--header-height) h-[calc(100svh-var(--header-height))]!", children: [_jsx(SidebarHeader, { children: _jsx(SidebarMenu, { children: _jsx(SidebarMenuItem, { children: _jsx(SidebarMenuButton, { size: "lg", asChild: true, children: _jsxs(Link, { to: baseUrl || '/', children: [_jsx("div", { className: "flex justify-center items-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground aspect-square size-8", children: _jsx(Home, { className: "size-4" }) }), _jsxs("div", { className: "grid flex-1 text-sm leading-tight text-left", children: [_jsx("span", { className: "font-medium truncate", children: title }), authors && (_jsxs("div", { className: "flex overflow-hidden gap-1 items-center", children: [_jsxs("div", { className: "text-xs truncate", children: [authors
+                                                                .map((author) => author.nameParsed?.family)
+                                                                .slice(0, 3)
+                                                                .join(', '), ' '] }), year && _jsxs("div", { className: "text-xs truncate shrink-0", children: ["(", year, ")"] })] }))] })] }) }) }) }) }), _jsx(SidebarContent, { children: _jsxs(SidebarGroup, { children: [_jsx(SidebarGroupLabel, { children: "Pages" }), _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: sidebarItems.map((item) => (_jsx(SidebarItemComponent, { item: item, currentPage: currentPage }, item.title))) }) })] }) }), _jsx(SidebarFooter, { className: "border-t", children: _jsxs("div", { className: "flex gap-2 pl-2 opacity-80 grayscale hover:grayscale-0 hover:opacity-100", children: [_jsxs("a", { href: "https://curvenote.com", target: "_blank", rel: "noopener noreferrer", className: "flex gap-2 items-center my-1 text-xs transition-all duration-300 text-sidebar-secondary-foreground grow", children: [_jsx(CurvenoteLogo, { size: 16 }), _jsx("span", { children: "Powered by Curvenote" })] }), _jsx("div", { className: "flex-0", children: _jsx(ThemeButton, {}) })] }) })] }));
+}

package/dist/components/layout/article-layout.d.ts

@@ -0,0 +1,8 @@
+import type { LayoutProps } from './types';
+export declare function ArticleLayout({ children, header, footer }: LayoutProps): import("react/jsx-runtime").JSX.Element;
+export declare function ArticleContainer({ children, header, className, }: {
+    children: React.ReactNode;
+    header?: React.ReactNode;
+    className?: string;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=article-layout.d.ts.map

package/dist/components/layout/article-layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"article-layout.d.ts","sourceRoot":"","sources":["../../../src/components/layout/article-layout.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAG3C,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,WAAW,2CAWtE;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,MAAM,EACN,SAAS,GACV,EAAE;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,2CAiCA"}

package/dist/components/layout/article-layout.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useProjectManifest, useReferences } from '@myst-theme/providers';
+import { SiteHeader } from './site-header';
+import { cn } from '../../lib/utils';
+import { createSkipToTargets, DocumentOutline, SkipTo, Banner } from '../ui';
+import { useDesign } from '../providers';
+export function ArticleLayout({ children, header, footer }) {
+    return (_jsxs(_Fragment, { children: [_jsx(SkipTo, { targets: createSkipToTargets() }), _jsxs("div", { className: "flex flex-col min-h-screen", children: [_jsx(SiteHeader, { brandBar: header }), _jsx("div", { className: "flex-grow", children: children }), footer && _jsx("div", { className: "flex-shrink-0", children: footer })] })] }));
+}
+export function ArticleContainer({ children, header, className, }) {
+    const references = useReferences();
+    const project = useProjectManifest();
+    const design = useDesign();
+    return (_jsxs("article", { className: cn('relative article-grid grid-gap prose dark:prose-invert w-full max-w-full', {
+            // if the banner is shown, or the title block is hidden, this padding accounts for the site header
+            'pt-14': project?.banner || design.hide_title_block,
+            // if the banner is not shown, and the title block is not hidden, then more padding is needed
+            'pt-28': !project?.banner && !design.hide_title_block,
+        }, 'z-0', className), children: [project?.banner && !design.hide_title_block && (_jsx(Banner, { inset: true, banner: project.banner, bannerOptimized: project.bannerOptimized })), header, !!header && _jsx("div", { className: "col-screen h-0" }), !design.hide_outline && references?.article && (_jsx("aside", { className: "hidden sticky top-24 px-2 h-0 lg:block col-margin xl:px-4", children: _jsx(DocumentOutline, { mdast: references?.article }) })), children, _jsx("div", { id: "bottom-of-article", className: "col-screen h-0" })] }));
+}

package/dist/components/layout/grid.d.ts

@@ -0,0 +1,2 @@
+export declare function GridLayout(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=grid.d.ts.map

package/dist/components/layout/grid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid.d.ts","sourceRoot":"","sources":["../../../src/components/layout/grid.tsx"],"names":[],"mappings":"AAAA,wBAAgB,UAAU,4CAkDzB"}

package/dist/components/layout/grid.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+export function GridLayout() {
+    return (_jsxs(_Fragment, { children: [_jsx("div", { children: _jsxs("div", { className: "justify-center justify-items-center items-center p-5 m-auto w-16 h-16 text-2xl bg-blue-500 rounded", children: [_jsx("span", { className: "hidden 2xl:block", children: "2xl" }), _jsx("div", { className: "hidden xl:block 2xl:hidden", children: "xl" }), _jsx("div", { className: "hidden lg:block xl:hidden", children: "lg" }), _jsx("div", { className: "hidden md:block lg:hidden", children: "md" }), _jsx("div", { className: "hidden sm:block md:hidden", children: "sm" })] }) }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-screen", children: "col-screen" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-page", children: "col-page" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-page-inset", children: "col-page-inset" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-body-outset", children: "col-body-outset" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-body-inset", children: "col-body-inset" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-margin-left", children: "col-margin-left" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-body", children: "col-body" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-margin", children: "col-margin" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-gutter-left", children: "col-gutter-left" }), _jsx("div", { className: "row-span-2 p-3 bg-gray-200 rounded col-body-right", children: "col-body-right" }), _jsx("div", { className: "row-span-2 p-3 bg-gray-200 rounded col-margin-right-inset", children: "col-margin-right-inset" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-gutter-outset-left", children: "col-gutter-outset-left" }), _jsx("div", { className: "row-span-2 p-3 bg-gray-200 rounded col-body-left", children: "col-body-left" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-gutter-right", children: "col-gutter-right" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-gutter-outset-right", children: "col-gutter-outset-right" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-screen-right", children: "col-screen-right" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-screen-inset-right", children: "col-screen-inset-right" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-page-right", children: "col-page-right" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-page-inset-right", children: "col-page-inset-right" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-body-outset-right", children: "col-body-outset-right" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-body-inset-right", children: "col-body-inset-right" }), _jsx("div", { className: "row-span-2 p-3 bg-gray-200 rounded col-gutter-page-right", children: "col-gutter-page-right" }), _jsx("div", { className: "row-span-2 p-3 bg-gray-200 rounded col-gutter-page-left", children: "col-gutter-page-left" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-page-middle", children: "col-page-middle" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-body-inset-left", children: "col-body-inset-left" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-body-outset-left", children: "col-body-outset-left" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-page-inset-left", children: "col-page-inset-left" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-page-left", children: "col-page-left" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-screen-inset-left", children: "col-screen-inset-left" }), _jsx("div", { className: "p-3 bg-gray-200 rounded col-screen-left", children: "col-screen-left" })] }));
+}

package/dist/components/layout/header.d.ts

@@ -0,0 +1,5 @@
+export declare function HeaderContainer({ brandBar, children, }: {
+    brandBar?: React.ReactNode;
+    children: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=header.d.ts.map

package/dist/components/layout/header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../../src/components/layout/header.tsx"],"names":[],"mappings":"AAEA,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,QAAQ,GACT,EAAE;IACD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,2CAUA"}

package/dist/components/layout/header.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { LoadingBar } from './loading-bar';
+export function HeaderContainer({ brandBar, children, }) {
+    return (_jsx("header", { className: "fixed top-0 z-50 w-full border-b bg-background", children: _jsxs("div", { className: "flex flex-col items-center", children: [brandBar && _jsx("div", { className: "w-full shrink-0", children: brandBar }), children, _jsx(LoadingBar, {})] }) }));
+}

package/dist/components/layout/index.d.ts

@@ -0,0 +1,7 @@
+export * from './app-layout';
+export * from './app-sidebar';
+export * from './article-layout';
+export * from './site-header';
+export * from './loading-bar';
+export * from './grid';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/layout/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/layout/index.ts"],"names":[],"mappings":"AACA,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,QAAQ,CAAC"}

package/dist/components/layout/index.js

@@ -0,0 +1,7 @@
+// Layout Components
+export * from './app-layout';
+export * from './app-sidebar';
+export * from './article-layout';
+export * from './site-header';
+export * from './loading-bar';
+export * from './grid';

package/dist/components/layout/loading-bar.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Show a loading progress bar if the load takes more than 150ms
+ */
+export declare function useLoading(): {
+    showLoading: boolean;
+    isLoading: boolean;
+};
+export declare function LoadingBar({ align, className, }: {
+    align?: 'bottom' | 'top';
+    className?: string;
+}): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=loading-bar.d.ts.map

package/dist/components/layout/loading-bar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"loading-bar.d.ts","sourceRoot":"","sources":["../../../src/components/layout/loading-bar.tsx"],"names":[],"mappings":"AAIA;;GAEG;AACH,wBAAgB,UAAU;;;EAmCzB;AAED,wBAAgB,UAAU,CAAC,EACzB,KAAgB,EAChB,SAAS,GACV,EAAE;IACD,KAAK,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,kDAiBA"}

package/dist/components/layout/loading-bar.js

@@ -0,0 +1,53 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useNavigation } from 'react-router';
+import { useEffect, useMemo, useState } from 'react';
+import { cn } from '../../lib/utils';
+/**
+ * Show a loading progress bar if the load takes more than 150ms
+ */
+export function useLoading() {
+    const transitionState = useNavigation().state;
+    const ref = useMemo(() => ({}), []);
+    const [showLoading, setShowLoading] = useState(false);
+    useEffect(() => {
+        if (transitionState === 'loading') {
+            ref.start = setTimeout(() => {
+                setShowLoading(true);
+            }, 150);
+        }
+        else {
+            if (ref.start) {
+                // We have stopped loading in <150ms
+                clearTimeout(ref.start);
+                delete ref.start;
+                setShowLoading(false);
+                return;
+            }
+            ref.finish = setTimeout(() => {
+                setShowLoading(false);
+            }, 150);
+        }
+        return () => {
+            if (ref.start) {
+                clearTimeout(ref.start);
+                delete ref.start;
+            }
+            if (ref.finish) {
+                clearTimeout(ref.finish);
+                delete ref.finish;
+            }
+        };
+    }, [transitionState]);
+    return { showLoading, isLoading: transitionState === 'loading' };
+}
+export function LoadingBar({ align = 'bottom', className, }) {
+    const { isLoading, showLoading } = useLoading();
+    if (!showLoading)
+        return null;
+    return (_jsx("div", { className: cn('absolute left-0 w-screen bg-blue-500 transition-transform origin-left h-[2px]', {
+            'bottom-0': align === 'bottom',
+            'top-0': align === 'top',
+            'animate-load scale-x-40': isLoading,
+            'scale-x-100': !isLoading,
+        }, className) }));
+}

package/dist/components/layout/site-header.d.ts

@@ -0,0 +1,8 @@
+export declare function SiteHeader({ showSearch, showBreadcrumbs, showArticleActions, showMobileMenu, brandBar, }: {
+    showSearch?: boolean;
+    showBreadcrumbs?: boolean;
+    showArticleActions?: boolean;
+    showMobileMenu?: boolean;
+    brandBar?: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=site-header.d.ts.map

package/dist/components/layout/site-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"site-header.d.ts","sourceRoot":"","sources":["../../../src/components/layout/site-header.tsx"],"names":[],"mappings":"AAqKA,wBAAgB,UAAU,CAAC,EACzB,UAAkB,EAClB,eAAe,EACf,kBAAkB,EAClB,cAAqB,EACrB,QAAQ,GACT,EAAE;IACD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,2CA6IA"}

package/dist/components/layout/site-header.js

@@ -0,0 +1,55 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from 'react';
+import { ExternalLink, ChevronDown, MenuIcon, SearchIcon, SidebarIcon } from 'lucide-react';
+import { NavLink } from 'react-router';
+import { Button, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, Sheet, SheetContent, SheetHeader, SheetTitle, SheetTrigger, buttonVariants, SearchDialog, SimpleTooltip, BreadcrumbList, Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbSeparator, BreadcrumbPage, Separator, ArticleActions, } from '../ui';
+import { cn } from '../../lib/utils';
+import { usePlatformConfig, usePlatformSite } from '../providers/platform-providers';
+import { HeaderContainer } from './header';
+import { useBaseurl, useFrontmatter, useProjectManifest } from '@myst-theme/providers';
+import { useSidebar } from '../ui/sidebar';
+function NavigationItem({ item }) {
+    if (item.children && item.children.length > 0) {
+        return (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", className: "text-sm font-medium", children: [item.title, _jsx(ChevronDown, { className: "w-3 h-3" })] }) }), _jsx(DropdownMenuContent, { align: "end", children: item.children.map((child) => (_jsx(DropdownMenuItem, { children: _jsx(NavigationItem, { item: child }) }, child.title))) })] }, item.title));
+    }
+    if (item.internal === false) {
+        return (_jsx(Button, { variant: "ghost", asChild: true, children: _jsxs("a", { href: item.url, target: "_blank", rel: "noopener noreferrer", className: "flex items-center text-sm font-medium transition-colors hover:text-primary", children: [item.title, _jsx(ExternalLink, { className: "ml-1 w-3 h-3" })] }) }, item.title));
+    }
+    return (_jsx(NavLink, { to: item.url, className: ({ isActive }) => cn(
+        // We cannot wrap this in a button as it will cause a hydration error with the active class
+        buttonVariants({ variant: 'ghost' }), 'text-sm font-medium transition-colors hover:text-primary', isActive && 'text-primary font-semibold'), children: item.title }, item.title));
+}
+function MobileNavigationItem({ item, closeMobileMenu, }) {
+    if (item.children && item.children.length > 0) {
+        return (_jsxs("div", { className: "space-y-2", children: [_jsx("div", { className: "px-3 py-1 text-sm font-medium text-muted-foreground", children: item.title }), item.children.map((child) => (_jsx("div", { children: child.internal === false ? (_jsxs("a", { href: child.url, target: "_blank", rel: "noopener noreferrer", className: "block items-center px-6 py-2 text-sm font-medium transition-colors hover:text-primary hover:bg-muted", onClick: closeMobileMenu, children: [child.title, _jsx(ExternalLink, { className: "ml-2 w-3 h-3" })] })) : (_jsx(NavLink, { to: child.url, className: ({ isActive }) => cn('text-sm font-medium transition-colors hover:text-primary py-2 px-6 hover:bg-muted block', isActive && 'text-primary font-semibold bg-muted'), onClick: closeMobileMenu, children: child.title })) }, child.title)))] }, item.title));
+    }
+    if (item.internal === false) {
+        return (_jsxs("a", { href: item.url, target: "_blank", rel: "noopener noreferrer", className: "flex flex-row items-center px-3 py-2 text-sm font-medium transition-colors hover:text-primary hover:bg-muted", onClick: closeMobileMenu, children: [item.title, _jsx(ExternalLink, { className: "ml-1 w-3 h-3" })] }, item.title));
+    }
+    return (_jsx(NavLink, { to: item.url, className: ({ isActive }) => cn('text-sm font-medium transition-colors hover:text-primary py-2 px-3 hover:bg-muted block', isActive && 'text-primary font-semibold bg-muted'), onClick: closeMobileMenu, children: item.title }, item.title));
+}
+export function SiteHeader({ showSearch = false, showBreadcrumbs, showArticleActions, showMobileMenu = true, brandBar, }) {
+    const { toggleSidebar } = useSidebar() ?? {};
+    const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
+    const site = usePlatformSite();
+    const config = usePlatformConfig();
+    const project = useProjectManifest();
+    const article = useFrontmatter();
+    const baseurl = useBaseurl() ?? '/';
+    const { nav, actions } = config ?? { nav: [], actions: [] };
+    const showNavLinksOnMediumScreen = (nav?.length ?? 0) < 5;
+    const showNavLinksOnLargeScreen = (nav?.length ?? 0) >= 5;
+    const logo = site?.logo || config?.options?.logo;
+    const logo_text = config?.options?.logo_text;
+    const title = site?.title || config?.title;
+    return (_jsx(HeaderContainer, { brandBar: brandBar, children: _jsxs("div", { className: "flex items-center px-2 w-full h-14", children: [_jsxs("div", { className: cn('flex gap-2 items-center h-full', { 'md:w-[200px]': !showBreadcrumbs }), children: [toggleSidebar && (_jsxs(_Fragment, { children: [_jsx(Button, { className: "w-8 h-8", variant: "ghost", size: "icon", onClick: toggleSidebar, children: _jsx(SidebarIcon, {}) }), _jsx(Separator, { orientation: "vertical", className: "mr-2 h-4" })] })), (logo || logo_text) && (_jsxs("a", { href: "/", className: "flex gap-2 items-center mr-2 shrink-0", children: [logo && _jsx("img", { src: logo, alt: title || 'Site Logo', className: "w-auto h-8 max-h-8" }), logo_text && _jsx("div", { className: "text-lg", children: logo_text })] }))] }), showBreadcrumbs && (_jsx(Breadcrumb, { className: "hidden sm:block grow", children: _jsxs(BreadcrumbList, { children: [_jsx(BreadcrumbItem, { children: _jsx(BreadcrumbLink, { href: baseurl, className: "truncate max-w-12 md:max-w-24 lg:max-w-48 xl:max-w-64", children: project?.title }) }), _jsx(BreadcrumbSeparator, {}), _jsx(BreadcrumbItem, { children: _jsx(BreadcrumbPage, { className: "truncate max-w-64 lg:max-w-96", children: article?.title }) })] }) })), !showBreadcrumbs && (_jsx("nav", { className: cn('hidden flex-1 gap-1 justify-center items-center', {
+                        'md:flex': showNavLinksOnMediumScreen,
+                        'lg:flex': showNavLinksOnLargeScreen,
+                    }), children: nav?.map((item) => (_jsx(NavigationItem, { item: item }, item.title || item.url))) })), _jsxs("div", { className: cn('flex gap-2 justify-end items-center', {
+                        'grow md:grow-0 md:w-[200px]': showNavLinksOnMediumScreen,
+                        'grow lg:grow-0 lg:w-[200px]': showNavLinksOnLargeScreen,
+                    }), children: [actions?.map((action) => (_jsx(Button, { variant: "outline", "aria-label": action.title, asChild: true, children: _jsx("a", { href: action.url, target: "_blank", rel: "noopener noreferrer", children: action.title }) }, action.title))), showSearch && (_jsx(SearchDialog, { children: _jsx(SimpleTooltip, { title: "Search", children: _jsx(Button, { variant: "outline", size: "icon", "aria-label": "Search", asChild: true, children: _jsx("div", { children: _jsx(SearchIcon, {}) }) }) }) })), showArticleActions && _jsx(ArticleActions, {}), showMobileMenu && nav && nav.length > 0 && (_jsxs(Sheet, { open: isMobileMenuOpen, onOpenChange: setIsMobileMenuOpen, children: [_jsx(SheetTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "sm", className: cn({
+                                            'md:hidden': !showBreadcrumbs && showNavLinksOnMediumScreen,
+                                            'lg:hidden': !showBreadcrumbs && showNavLinksOnLargeScreen,
+                                        }), children: _jsx(MenuIcon, { className: "w-5 h-5" }) }) }), _jsxs(SheetContent, { side: "right", className: "w-[300px] sm:w-[400px]", children: [_jsx(SheetHeader, { children: _jsx(SheetTitle, { children: "Navigation" }) }), _jsx("div", { className: "flex flex-col mt-6 space-y-4", children: _jsx("nav", { className: "flex flex-col space-y-2", children: nav?.map((item) => (_jsx(MobileNavigationItem, { item: item, closeMobileMenu: () => setIsMobileMenuOpen(false) }, item.title || item.url))) }) })] })] }))] })] }) }));
+}

package/dist/components/layout/types.d.ts

@@ -0,0 +1,6 @@
+export interface LayoutProps {
+    children: React.ReactNode;
+    header?: React.ReactNode;
+    footer?: React.ReactNode;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/components/layout/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/layout/types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,WAAW;IAC1B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B"}

package/dist/components/layout/types.js

@@ -0,0 +1 @@
+export {};

package/dist/components/providers/compute.d.ts

@@ -0,0 +1,5 @@
+export declare function ComputeProvider({ children, article, }: {
+    children: React.ReactNode;
+    article: any;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=compute.d.ts.map

package/dist/components/providers/compute.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"compute.d.ts","sourceRoot":"","sources":["../../../src/components/providers/compute.tsx"],"names":[],"mappings":"AAMA,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,OAAO,GACR,EAAE;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,EAAE,GAAG,CAAC;CACd,2CASA"}

package/dist/components/providers/compute.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ExecuteScopeProvider, ThebeLoaderAndServer, useComputeOptions, } from '@curvenote/bridge-jupyter';
+export function ComputeProvider({ children, article, }) {
+    const compute = useComputeOptions();
+    return (_jsx(ThebeLoaderAndServer, { connect: false, children: _jsx(ExecuteScopeProvider, { enable: compute?.enabled ?? false, contents: article, children: children }) }));
+}

package/dist/components/providers/connect.d.ts

@@ -0,0 +1,24 @@
+import type { ThebeServer } from 'thebe-core';
+/**
+ * @param serviceUrl (string) e.g. https://spyglass.hhmi.2i2c.cloud, https://sproxy.curvenote.dev;
+ * @param serviceTitle (string) e.g. 'Spyglass', 'Curvenote';
+ * @returns
+ */
+export declare const jupyterHubStreamingConnectFnFactory: ({ serviceUrl, clientProxyUrl, serviceTitle, gitPullerTargetPath, }: {
+    serviceUrl: string;
+    clientProxyUrl?: string;
+    serviceTitle?: string;
+    gitPullerTargetPath?: string;
+}) => (server: ThebeServer) => Promise<void>;
+/**
+ * @param serviceUrl (string) e.g. https://spyglass.hhmi.2i2c.cloud, https://sproxy.curvenote.dev;
+ * @param serviceTitle (string) e.g. 'Spyglass', 'Curvenote';
+ * @returns
+ */
+export declare const jupyterHubConnectFnFactory: ({ serviceUrl, clientProxyUrl, serviceTitle, gitPullerTargetPath, }: {
+    serviceUrl: string;
+    clientProxyUrl?: string;
+    serviceTitle?: string;
+    gitPullerTargetPath?: string;
+}) => (server: ThebeServer) => Promise<void>;
+//# sourceMappingURL=connect.d.ts.map

package/dist/components/providers/connect.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"connect.d.ts","sourceRoot":"","sources":["../../../src/components/providers/connect.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAE9C;;;;GAIG;AACH,eAAO,MAAM,mCAAmC,GAAI,oEAKjD;IACD,UAAU,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B,MACoD,QAAQ,WAAW,kBA6JvE,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,0BAA0B,GAAI,oEAKxC;IACD,UAAU,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B,MAC2C,QAAQ,WAAW,kBAwE9D,CAAC"}