polen 0.10.0-next.15 → 0.10.0-next.17

package/src/template/routes/changelog.tsx

@@ -2,6 +2,7 @@ import { createRoute } from '#lib/react-router-aid/react-router-aid'
 import { createLoader, useLoaderData } from '#lib/react-router-loader/react-router-loader'
 import PROJECT_DATA from 'virtual:polen/project/data.jsonsuper'
 import { Changelog } from '../components/Changelog.js'
+import { ChangelogLayout } from '../components/ChangelogLayout.js'
 
 const loader = createLoader(() => {
   return {
@@ -16,7 +17,11 @@ const Component = () => {
     return <div>No data to show. There is no schema is.</div>
   }
 
-  return <Changelog schema={data.schema} />
+  return (
+    <ChangelogLayout versions={data.schema.versions}>
+      <Changelog schema={data.schema} />
+    </ChangelogLayout>
+  )
 }
 
 export const changelog = createRoute({

package/src/template/routes/reference.tsx

@@ -1,8 +1,11 @@
+import type { Content } from '#api/content/$'
+import { GrafaidOld } from '#lib/grafaid-old/index'
 import { createRoute } from '#lib/react-router-aid/react-router-aid'
 import { createLoader, useLoaderData } from '#lib/react-router-loader/react-router-loader'
 import { Box } from '@radix-ui/themes'
 import { Outlet } from 'react-router'
 import PROJECT_DATA from 'virtual:polen/project/data.jsonsuper'
+import { SidebarLayout } from '../components/layouts/index.js'
 import { MissingSchema } from '../components/MissingSchema.js'
 import { reference$type } from './reference.$type.js'
 
@@ -20,10 +23,30 @@ const Component = () => {
     return <MissingSchema />
   }
 
+  // Build reference sidebar from schema types
+  const kindMap = GrafaidOld.getKindMap(data.schema)
+
+  const sidebarItems: Content.Item[] = []
+  const kindEntries = Object.entries(kindMap.list).filter(([_, types]) => types.length > 0)
+
+  for (const [title, types] of kindEntries) {
+    sidebarItems.push({
+      type: `ItemSection` as const,
+      title,
+      pathExp: `reference-${title.toLowerCase()}`,
+      isLinkToo: false,
+      links: types.map(type => ({
+        type: `ItemLink` as const,
+        title: type.name,
+        pathExp: `reference/${type.name}`,
+      })),
+    })
+  }
+
   return (
-    <Box className='prose'>
+    <SidebarLayout sidebar={sidebarItems}>
       <Outlet />
-    </Box>
+    </SidebarLayout>
   )
 }
 

package/src/template/routes/root.tsx

@@ -1,25 +1,17 @@
-import type { Content } from '#api/content/$'
 import type { ReactRouter } from '#dep/react-router/index'
-import { GrafaidOld } from '#lib/grafaid-old/index'
 import { createRoute } from '#lib/react-router-aid/react-router-aid'
-import { Box, Grid } from '@radix-ui/themes'
+import { Box } from '@radix-ui/themes'
 import { Flex, Theme } from '@radix-ui/themes'
-import { Arr } from '@wollybeard/kit'
-import { useEffect, useState } from 'react'
 import { Link as LinkReactRouter } from 'react-router'
-import { Outlet, ScrollRestoration, useLocation } from 'react-router'
+import { Outlet, ScrollRestoration } from 'react-router'
 import logoSrc from 'virtual:polen/project/assets/logo.svg'
 import PROJECT_DATA from 'virtual:polen/project/data.jsonsuper'
-import projectPagesCatalog from 'virtual:polen/project/data/pages-catalog.jsonsuper'
 import { routes } from 'virtual:polen/project/routes.jsx'
 import { templateVariables } from 'virtual:polen/template/variables'
 import { GraphQLSchemaProvider } from '../../lib/graphql-document/schema-context.js'
-import { CodeBlockEnhancer } from '../components/CodeBlockEnhancer.js'
-import { HamburgerMenu } from '../components/HamburgerMenu.js'
 import { Link } from '../components/Link.js'
 import { Logo } from '../components/Logo.js'
 import { NotFound } from '../components/NotFound.js'
-import { Sidebar } from '../components/sidebar/Sidebar.js'
 import { ThemeToggle } from '../components/ThemeToggle.js'
 import { ThemeProvider, useTheme } from '../contexts/ThemeContext.js'
 import { changelog } from './changelog.js'
@@ -39,7 +31,6 @@ export const Component = () => {
       <ThemeProvider>
         <GraphQLSchemaProvider schema={schema}>
           <Layout />
-          <CodeBlockEnhancer />
         </GraphQLSchemaProvider>
       </ThemeProvider>
       <ScrollRestoration />
@@ -48,64 +39,10 @@ export const Component = () => {
 }
 
 const Layout = () => {
-  const location = useLocation()
   const { appearance } = useTheme()
-  const [mobileMenuOpen, setMobileMenuOpen] = useState(false)
-
-  // Close mobile menu on route change
-  useEffect(() => {
-    setMobileMenuOpen(false)
-  }, [location.pathname])
-
-  // Determine if we should show sidebar based on current path
-  const getCurrentNavPathExp = (): string | null => {
-    // todo: general path manipulation lib because we are duplicating logic here found in FileRouter
-    // todo: kit: try a Str.split that returns [] | string[] so that our predicates can refine on it?
-    const segments = location.pathname.split(`/`).filter(Boolean)
-    if (Arr.isntEmpty(segments)) {
-      return `/${segments[0]}`
-    }
-    return null
-  }
-
-  const currentNavPathExp = getCurrentNavPathExp()
-  const isReferencePage = currentNavPathExp === `/reference`
-
-  const sidebar = (() => {
-    if (isReferencePage && PROJECT_DATA.schema) {
-      // Build reference sidebar from schema types
-      const schema = PROJECT_DATA.schema.versions[0].after
-      const kindMap = GrafaidOld.getKindMap(schema)
-
-      const sidebarItems: Content.Item[] = []
-      const kindEntries = Object.entries(kindMap.list).filter(([_, types]) => types.length > 0)
-
-      for (const [title, types] of kindEntries) {
-        sidebarItems.push({
-          type: `ItemSection` as const,
-          title,
-          pathExp: `reference-${title.toLowerCase()}`,
-          isLinkToo: false,
-          links: types.map(type => ({
-            type: `ItemLink` as const,
-            title: type.name,
-            pathExp: `reference/${type.name}`,
-          })),
-        })
-      }
-
-      return { items: sidebarItems }
-    } else {
-      // Use regular page sidebar
-      return currentNavPathExp ? projectPagesCatalog.sidebarIndex[currentNavPathExp] || null : null
-    }
-  })()
-
-  const isShowSidebar = sidebar && sidebar.items.length > 0
 
   const header = (
     <Flex
-      gridArea={`header`}
       align='center'
       gap={{ initial: `4`, md: `8` }}
       pb='4'
@@ -114,20 +51,6 @@ const Layout = () => {
         borderBottom: `1px solid var(--gray-3)`,
       }}
     >
-      {/* Mobile menu - only show when sidebar exists */}
-      {isShowSidebar && (
-        <HamburgerMenu
-          isOpen={mobileMenuOpen}
-          onToggle={() => {
-            setMobileMenuOpen(!mobileMenuOpen)
-          }}
-          onClose={() => {
-            setMobileMenuOpen(false)
-          }}
-          sidebarData={sidebar.items}
-        />
-      )}
-
       <LinkReactRouter
         to='/'
         style={{ color: `inherit`, textDecoration: `none` }}
@@ -149,40 +72,17 @@ const Layout = () => {
 
   return (
     <Theme asChild appearance={appearance}>
-      <Grid
+      <Box
         width={{ initial: `100%`, sm: `100%`, md: `var(--container-4)` }}
         maxWidth='100vw'
-        areas={{
-          initial: `'header' 'content'`,
-          sm: `'header' 'content'`,
-          md:
-            `'header header header header header header header header' 'sidebar sidebar . content content content content content'`,
-        }}
-        rows='min-content auto'
-        columns={{ initial: `1fr`, sm: `1fr`, md: `repeat(8, 1fr)` }}
-        gapX={{ initial: `0`, sm: `0`, md: `2` }}
         my={{ initial: `0`, sm: `0`, md: `8` }}
         mx='auto'
         px={{ initial: `4`, sm: `4`, md: `0` }}
         py={{ initial: `4`, sm: `4`, md: `0` }}
       >
         {header}
-
-        {/* Desktop Sidebar */}
-        {isShowSidebar && (
-          <Box
-            display={{ initial: `none`, xs: `none`, sm: `none`, md: `block` }}
-            gridColumn='1 / 3'
-            gridRow='2 / auto'
-          >
-            <Sidebar data={sidebar.items} />
-          </Box>
-        )}
-
-        <Box gridArea='content / content / auto / 8' className='prose'>
-          <Outlet />
-        </Box>
-      </Grid>
+        <Outlet />
+      </Box>
     </Theme>
   )
 }

package/build/template/components/CodeBlockEnhancer.d.ts

@@ -1,2 +0,0 @@
-export declare const CodeBlockEnhancer: () => null;
-//# sourceMappingURL=CodeBlockEnhancer.d.ts.map

package/build/template/components/CodeBlockEnhancer.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"CodeBlockEnhancer.d.ts","sourceRoot":"","sources":["../../../src/template/components/CodeBlockEnhancer.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,iBAAiB,YA2L7B,CAAA"}

package/build/template/components/CodeBlockEnhancer.js

@@ -1,175 +0,0 @@
-import { useEffect } from 'react';
-import { useLocation } from 'react-router';
-import { useTheme } from '../contexts/ThemeContext.js';
-export const CodeBlockEnhancer = () => {
-    const { appearance } = useTheme();
-    const location = useLocation();
-    useEffect(() => {
-        // Add styles for code block enhancements
-        const styleId = `code-block-enhancer-styles`;
-        let styleElement = document.getElementById(styleId);
-        if (!styleElement) {
-            styleElement = document.createElement(`style`);
-            styleElement.id = styleId;
-            document.head.appendChild(styleElement);
-        }
-        styleElement.textContent = `
-      /* Enhanced code block styles */
-      pre.shiki {
-        position: relative;
-      }
-      
-      pre.shiki[data-title] {
-        margin-top: 0;
-        border-radius: 0 0 8px 8px !important;
-      }
-      
-      pre.shiki[data-title]::before {
-        content: attr(data-title);
-        display: block;
-        position: absolute;
-        top: -2.5rem;
-        left: -1px;
-        right: -1px;
-        background-color: ${appearance === `dark` ? `#2a2b3d` : `#f3f4f6`};
-        border: 1px solid var(--gray-4);
-        border-bottom: 1px solid ${appearance === `dark` ? `#3a3b4d` : `#e5e7eb`};
-        border-radius: 8px 8px 0 0;
-        padding: 0.5rem 1rem;
-        font-size: 0.875rem;
-        font-weight: 500;
-        color: var(--gray-11);
-        font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
-      }
-      
-      pre.shiki[data-title][data-language]::after {
-        content: attr(data-language);
-        position: absolute;
-        top: -2rem;
-        right: 1rem;
-        font-size: 0.75rem;
-        color: var(--gray-9);
-        font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
-      }
-      
-      .code-block-copy {
-        position: absolute;
-        top: 0.5rem;
-        right: 0.5rem;
-        padding: 0.25rem 0.5rem;
-        font-size: 0.75rem;
-        cursor: pointer;
-        border: none;
-        border-radius: 4px;
-        transition: all 0.2s;
-        background-color: ${appearance === `dark` ? `rgba(0, 0, 0, 0.5)` : `rgba(255, 255, 255, 0.8)`};
-        backdrop-filter: blur(4px);
-        color: ${appearance === `dark` ? `#fff` : `#000`};
-        font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
-      }
-      
-      pre.shiki[data-title] .code-block-copy {
-        top: -2rem;
-        right: 6rem;
-        background-color: transparent;
-        color: var(--gray-11);
-      }
-      
-      .code-block-copy:hover {
-        background-color: var(--accent-9) !important;
-        color: white !important;
-      }
-      
-      .code-block-copy[data-copied="true"] {
-        background-color: var(--green-9) !important;
-        color: white !important;
-      }
-    `;
-        return () => {
-            if (styleElement && styleElement.parentNode) {
-                styleElement.parentNode.removeChild(styleElement);
-            }
-        };
-    }, [appearance]);
-    useEffect(() => {
-        const enhanceCodeBlocks = () => {
-            const codeBlocks = document.querySelectorAll(`pre.shiki:not([data-enhanced])`);
-            codeBlocks.forEach((block) => {
-                const preElement = block;
-                preElement.setAttribute(`data-enhanced`, `true`);
-                // Get language from class name
-                const classes = preElement.className.split(` `);
-                const language = classes.find(c => c !== `shiki` && c !== `shiki-light` && c !== `shiki-dark`) || `text`;
-                // Check for title in first line
-                const codeElement = preElement.querySelector(`code`);
-                if (!codeElement)
-                    return;
-                const firstLine = codeElement.textContent?.split(`\n`)[0] || ``;
-                let title = ``;
-                const titleMatch = /^\/\/\s*title:\s*(.+)$/i.exec(firstLine);
-                if (titleMatch?.[1]) {
-                    title = titleMatch[1];
-                    // Remove title line from display
-                    const firstLineElement = codeElement.querySelector(`span.line`);
-                    if (firstLineElement) {
-                        firstLineElement.style.display = `none`;
-                    }
-                    // Set data attributes for CSS
-                    preElement.setAttribute(`data-title`, title);
-                    preElement.setAttribute(`data-language`, language);
-                    preElement.style.marginTop = `3rem`;
-                }
-                // Create copy button
-                const copyButton = document.createElement(`button`);
-                copyButton.className = `code-block-copy`;
-                copyButton.textContent = `Copy`;
-                copyButton.setAttribute(`data-copied`, `false`);
-                copyButton.onclick = async (e) => {
-                    e.preventDefault();
-                    e.stopPropagation();
-                    // Get clean code without the title line
-                    const code = codeElement.textContent || ``;
-                    const cleanCode = title ? code.split(`\n`).slice(1).join(`\n`) : code;
-                    try {
-                        await navigator.clipboard.writeText(cleanCode);
-                        copyButton.textContent = `Copied!`;
-                        copyButton.setAttribute(`data-copied`, `true`);
-                        setTimeout(() => {
-                            copyButton.textContent = `Copy`;
-                            copyButton.setAttribute(`data-copied`, `false`);
-                        }, 2000);
-                    }
-                    catch (err) {
-                        console.error(`Failed to copy:`, err);
-                    }
-                };
-                // Append copy button directly to pre element
-                preElement.appendChild(copyButton);
-            });
-        };
-        // Small delay to ensure DOM is ready
-        const timeoutId = setTimeout(enhanceCodeBlocks, 100);
-        return () => {
-            clearTimeout(timeoutId);
-            // Clean up enhanced code blocks
-            document.querySelectorAll(`pre.shiki[data-enhanced]`).forEach(block => {
-                block.removeAttribute(`data-enhanced`);
-                block.removeAttribute(`data-title`);
-                block.removeAttribute(`data-language`);
-                const copyButton = block.querySelector(`.code-block-copy`);
-                if (copyButton) {
-                    copyButton.remove();
-                }
-                // Restore hidden title lines
-                const firstLine = block.querySelector(`span.line`);
-                if (firstLine && firstLine.style.display === `none`) {
-                    firstLine.style.display = ``;
-                } // Reset margin
-                ;
-                block.style.marginTop = ``;
-            });
-        };
-    }, [location.pathname]); // Re-run when route changes
-    return null;
-};
-//# sourceMappingURL=CodeBlockEnhancer.js.map

package/build/template/components/CodeBlockEnhancer.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CodeBlockEnhancer.js","sourceRoot":"","sources":["../../../src/template/components/CodeBlockEnhancer.tsx"],"names":[],"mappings":"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"}

package/build/template/styles/code-block.css

@@ -1,218 +0,0 @@
-/* Code Block Styles */
-
-/* Base code block container */
-.code-block {
-  position: relative;
-  margin: 1rem 0;
-  border-radius: 8px;
-  overflow: hidden;
-  font-size: 14px;
-  line-height: 1.6;
-}
-
-.code-block pre {
-  margin: 0;
-  padding: 1rem;
-  overflow-x: auto;
-  background: inherit;
-}
-
-.code-block code {
-  font-family: 'JetBrains Mono', 'Fira Code', 'SF Mono', Consolas, 'Liberation Mono', Menlo, monospace;
-  font-variant-ligatures: contextual;
-}
-
-/* Shiki theme switching with CSS variables */
-/* Default to light theme */
-:root {
-  color-scheme: light;
-}
-
-/* When dark mode is active */
-.dark {
-  color-scheme: dark;
-}
-
-/* Shiki token colors for light theme (github-light) */
-:root {
-  --shiki-color-text: #24292e;
-  --shiki-color-background: #f6f8fa;
-  --shiki-token-constant: #005cc5;
-  --shiki-token-string: #032f62;
-  --shiki-token-comment: #6a737d;
-  --shiki-token-keyword: #d73a49;
-  --shiki-token-parameter: #e36209;
-  --shiki-token-function: #6f42c1;
-  --shiki-token-string-expression: #032f62;
-  --shiki-token-punctuation: #24292e;
-  --shiki-token-link: #032f62;
-}
-
-/* Shiki token colors for dark theme (tokyo-night) */
-.dark {
-  --shiki-color-text: #c0caf5;
-  --shiki-color-background: #1a1b26;
-  --shiki-token-constant: #ff9e64;
-  --shiki-token-string: #9ece6a;
-  --shiki-token-comment: #565f89;
-  --shiki-token-keyword: #bb9af7;
-  --shiki-token-parameter: #e0af68;
-  --shiki-token-function: #7aa2f7;
-  --shiki-token-string-expression: #9ece6a;
-  --shiki-token-punctuation: #c0caf5;
-  --shiki-token-link: #9ece6a;
-}
-
-/* Shiki code blocks */
-pre.shiki {
-  margin: 1rem 0;
-  padding: 1rem;
-  border-radius: 8px;
-  overflow-x: auto;
-  font-size: 14px;
-  line-height: 1.6;
-  background-color: var(--shiki-color-background);
-  color: var(--shiki-color-text);
-}
-
-pre.shiki code {
-  font-family: 'JetBrains Mono', 'Fira Code', 'SF Mono', Consolas, 'Liberation Mono', Menlo, monospace;
-  font-variant-ligatures: contextual;
-}
-
-/* Line numbers */
-.code-block[data-line-numbers="true"] pre {
-  padding-left: 3.5rem;
-  position: relative;
-}
-
-.code-block[data-line-numbers="true"] .line {
-  position: relative;
-}
-
-.code-block[data-line-numbers="true"] .line::before {
-  content: attr(data-line);
-  position: absolute;
-  left: -3rem;
-  width: 2.5rem;
-  text-align: right;
-  color: var(--gray-a6);
-  user-select: none;
-}
-
-/* Line highlighting */
-.code-block .line[data-highlighted="true"] {
-  background-color: var(--amber-a3);
-  display: block;
-  margin: 0 -1rem;
-  padding: 0 1rem;
-}
-
-/* Diff lines */
-.code-block .line[data-diff="+"] {
-  background-color: var(--green-a3);
-  display: block;
-  margin: 0 -1rem;
-  padding: 0 1rem;
-}
-
-.code-block .line[data-diff="-"] {
-  background-color: var(--red-a3);
-  display: block;
-  margin: 0 -1rem;
-  padding: 0 1rem;
-}
-
-.code-block .line[data-diff="+"]::before {
-  content: "+ ";
-  color: var(--green-11);
-  font-weight: bold;
-}
-
-.code-block .line[data-diff="-"]::before {
-  content: "- ";
-  color: var(--red-11);
-  font-weight: bold;
-}
-
-/* Focus lines */
-.code-block .line:not([data-focus="true"]) {
-  opacity: 0.5;
-  filter: grayscale(100%);
-  transition: opacity 0.2s, filter 0.2s;
-}
-
-.code-block:hover .line:not([data-focus="true"]) {
-  opacity: 0.8;
-  filter: grayscale(0%);
-}
-
-/* Copy button */
-.code-block-copy {
-  position: absolute;
-  top: 0.5rem;
-  right: 0.5rem;
-  padding: 0.25rem 0.5rem;
-  border-radius: 4px;
-  background: var(--gray-a3);
-  color: var(--gray-12);
-  border: 1px solid var(--gray-a5);
-  cursor: pointer;
-  font-size: 12px;
-  transition: all 0.2s;
-}
-
-.code-block-copy:hover {
-  background: var(--gray-a4);
-  border-color: var(--gray-a6);
-}
-
-.code-block-copy.copied {
-  background: var(--green-a3);
-  border-color: var(--green-a5);
-  color: var(--green-11);
-}
-
-/* Language badge */
-.code-block-lang {
-  position: absolute;
-  top: 0;
-  right: 0;
-  padding: 0.25rem 0.75rem;
-  background: var(--gray-a3);
-  color: var(--gray-11);
-  font-size: 12px;
-  font-weight: 500;
-  border-bottom-left-radius: 4px;
-  user-select: none;
-}
-
-/* Scrollbar styling */
-.code-block pre::-webkit-scrollbar {
-  height: 8px;
-  width: 8px;
-}
-
-.code-block pre::-webkit-scrollbar-track {
-  background: var(--gray-a3);
-  border-radius: 4px;
-}
-
-.code-block pre::-webkit-scrollbar-thumb {
-  background: var(--gray-a6);
-  border-radius: 4px;
-}
-
-.code-block pre::-webkit-scrollbar-thumb:hover {
-  background: var(--gray-a7);
-}
-
-/* Inline code */
-code:not(.code-block code) {
-  padding: 0.2em 0.4em;
-  margin: 0;
-  font-size: 0.85em;
-  background-color: var(--gray-a3);
-  border-radius: 4px;
-  font-family: 'JetBrains Mono', 'Fira Code', 'SF Mono', Consolas, 'Liberation Mono', Menlo, monospace;
-}