polen 0.10.0-next.5 → 0.10.0-next.6

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

@@ -0,0 +1,3 @@
+import type { React } from '#dep/react/index';
+export declare const ThemeToggle: React.FC;
+//# sourceMappingURL=ThemeToggle.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeToggle.d.ts","sourceRoot":"","sources":["../../../src/template/components/ThemeToggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAA;AAK7C,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAe/B,CAAA"}

package/build/template/components/ThemeToggle.jsx

@@ -0,0 +1,10 @@
+import { MoonIcon, SunIcon } from '@radix-ui/react-icons';
+import { IconButton } from '@radix-ui/themes';
+import { useTheme } from "../contexts/ThemeContext.jsx";
+export const ThemeToggle = () => {
+    const { appearance, toggleTheme } = useTheme();
+    return (<IconButton size="2" variant="ghost" color="gray" onClick={toggleTheme} aria-label={`Switch to ${appearance === 'light' ? 'dark' : 'light'} theme`} style={{ cursor: 'pointer' }}>
+      {appearance === 'light' ? <MoonIcon width="18" height="18"/> : <SunIcon width="18" height="18"/>}
+    </IconButton>);
+};
+//# sourceMappingURL=ThemeToggle.jsx.map

package/build/template/components/ThemeToggle.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeToggle.jsx","sourceRoot":"","sources":["../../../src/template/components/ThemeToggle.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAA;AAEvD,MAAM,CAAC,MAAM,WAAW,GAAa,GAAG,EAAE;IACxC,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,GAAG,QAAQ,EAAE,CAAA;IAE9C,OAAO,CACL,CAAC,UAAU,CACT,IAAI,CAAC,GAAG,CACR,OAAO,CAAC,OAAO,CACf,KAAK,CAAC,MAAM,CACZ,OAAO,CAAC,CAAC,WAAW,CAAC,CACrB,UAAU,CAAC,CAAC,aAAa,UAAU,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,QAAQ,CAAC,CAC3E,KAAK,CAAC,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAE7B;MAAA,CAAC,UAAU,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,EAAG,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,EAAG,CACpG;IAAA,EAAE,UAAU,CAAC,CACd,CAAA;AACH,CAAC,CAAA"}

package/build/template/contexts/ThemeContext.d.ts

@@ -0,0 +1,12 @@
+import type { React } from '#dep/react/index';
+type ThemeAppearance = 'light' | 'dark';
+interface ThemeContextValue {
+    appearance: ThemeAppearance;
+    toggleTheme: () => void;
+}
+export declare const ThemeProvider: React.FC<{
+    children: React.ReactNode;
+}>;
+export declare const useTheme: () => ThemeContextValue;
+export {};
+//# sourceMappingURL=ThemeContext.d.ts.map

package/build/template/contexts/ThemeContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeContext.d.ts","sourceRoot":"","sources":["../../../src/template/contexts/ThemeContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAA;AAG7C,KAAK,eAAe,GAAG,OAAO,GAAG,MAAM,CAAA;AAEvC,UAAU,iBAAiB;IACzB,UAAU,EAAE,eAAe,CAAA;IAC3B,WAAW,EAAE,MAAM,IAAI,CAAA;CACxB;AAMD,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,CAqCjE,CAAA;AAED,eAAO,MAAM,QAAQ,yBAMpB,CAAA"}

package/build/template/contexts/ThemeContext.jsx

@@ -0,0 +1,41 @@
+import { createContext, useContext, useEffect, useState } from 'react';
+const ThemeContext = createContext(undefined);
+const THEME_STORAGE_KEY = 'polen-theme-preference';
+export const ThemeProvider = ({ children }) => {
+    const [appearance, setAppearance] = useState(() => {
+        // Check if we're in the browser
+        if (typeof window === 'undefined') {
+            return 'light';
+        }
+        // Check localStorage first
+        const stored = localStorage.getItem(THEME_STORAGE_KEY);
+        if (stored === 'light' || stored === 'dark') {
+            return stored;
+        }
+        // Check system preference
+        if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+            return 'dark';
+        }
+        return 'light';
+    });
+    useEffect(() => {
+        // Persist to localStorage
+        if (typeof window !== 'undefined') {
+            localStorage.setItem(THEME_STORAGE_KEY, appearance);
+        }
+    }, [appearance]);
+    const toggleTheme = () => {
+        setAppearance(prev => prev === 'light' ? 'dark' : 'light');
+    };
+    return (<ThemeContext.Provider value={{ appearance, toggleTheme }}>
+      {children}
+    </ThemeContext.Provider>);
+};
+export const useTheme = () => {
+    const context = useContext(ThemeContext);
+    if (!context) {
+        throw new Error('useTheme must be used within a ThemeProvider');
+    }
+    return context;
+};
+//# sourceMappingURL=ThemeContext.jsx.map

package/build/template/contexts/ThemeContext.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeContext.jsx","sourceRoot":"","sources":["../../../src/template/contexts/ThemeContext.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAStE,MAAM,YAAY,GAAG,aAAa,CAAgC,SAAS,CAAC,CAAA;AAE5E,MAAM,iBAAiB,GAAG,wBAAwB,CAAA;AAElD,MAAM,CAAC,MAAM,aAAa,GAA4C,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IACrF,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAkB,GAAG,EAAE;QACjE,gCAAgC;QAChC,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;YAClC,OAAO,OAAO,CAAA;QAChB,CAAC;QAED,2BAA2B;QAC3B,MAAM,MAAM,GAAG,YAAY,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAA;QACtD,IAAI,MAAM,KAAK,OAAO,IAAI,MAAM,KAAK,MAAM,EAAE,CAAC;YAC5C,OAAO,MAAM,CAAA;QACf,CAAC;QAED,0BAA0B;QAC1B,IAAI,MAAM,CAAC,UAAU,IAAI,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC,OAAO,EAAE,CAAC;YACnF,OAAO,MAAM,CAAA;QACf,CAAC;QAED,OAAO,OAAO,CAAA;IAChB,CAAC,CAAC,CAAA;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,0BAA0B;QAC1B,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;YAClC,YAAY,CAAC,OAAO,CAAC,iBAAiB,EAAE,UAAU,CAAC,CAAA;QACrD,CAAC;IACH,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAA;IAEhB,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAA;IAC5D,CAAC,CAAA;IAED,OAAO,CACL,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,UAAU,EAAE,WAAW,EAAE,CAAC,CACxD;MAAA,CAAC,QAAQ,CACX;IAAA,EAAE,YAAY,CAAC,QAAQ,CAAC,CACzB,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAG,EAAE;IAC3B,MAAM,OAAO,GAAG,UAAU,CAAC,YAAY,CAAC,CAAA;IACxC,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,MAAM,IAAI,KAAK,CAAC,8CAA8C,CAAC,CAAA;IACjE,CAAC;IACD,OAAO,OAAO,CAAA;AAChB,CAAC,CAAA"}

package/build/template/routes/root.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"root.d.ts","sourceRoot":"","sources":["../../../src/template/routes/root.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAA;AA+B1D,eAAO,MAAM,SAAS,mCAqBrB,CAAA;AAqLD,eAAO,MAAM,IAAI;;;;CAIf,CAAA"}
+{"version":3,"file":"root.d.ts","sourceRoot":"","sources":["../../../src/template/routes/root.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAA;AAiC1D,eAAO,MAAM,SAAS,mCAuBrB,CAAA;AAuLD,eAAO,MAAM,IAAI;;;;CAIf,CAAA"}

package/build/template/routes/root.jsx

@@ -12,13 +12,15 @@ import projectDataNavbar from 'virtual:polen/project/data/navbar.jsonsuper';
 import projectDataPages from 'virtual:polen/project/data/pages.jsonsuper';
 import { pages } from 'virtual:polen/project/pages.jsx';
 import { templateVariables } from 'virtual:polen/template/variables';
-import { Link } from '../components/Link.jsx';
-import { Logo } from '../components/Logo.jsx';
-import { Sidebar } from '../components/sidebar/Sidebar.jsx';
+import { Link } from "../components/Link.jsx";
+import { Logo } from "../components/Logo.jsx";
+import { Sidebar } from "../components/sidebar/Sidebar.jsx";
+import { ThemeToggle } from "../components/ThemeToggle.jsx";
+import { ThemeProvider, useTheme } from "../contexts/ThemeContext.jsx";
 import entryClientUrl from '../entry.client.jsx?url';
-import { changelog } from './changelog.jsx';
-import { index } from './index.jsx';
-import { reference } from './reference.jsx';
+import { changelog } from "./changelog.jsx";
+import { index } from "./index.jsx";
+import { reference } from "./reference.jsx";
 // todo: not needed anymore because not using hono dev vite plugin right?
 const reactRefreshPreamble = `
 import RefreshRuntime from "/@react-refresh";
@@ -41,7 +43,9 @@ export const Component = () => {
         {/* <meta name='theme-color' content='#000000' /> */}
       </head>
       <body style={{ margin: 0 }}>
-        <Layout />
+        <ThemeProvider>
+          <Layout />
+        </ThemeProvider>
         <ScrollRestoration />
         {import.meta.env.DEV && <script type='module' src={entryClientUrl}></script>}
       </body>
@@ -49,6 +53,7 @@ export const Component = () => {
 };
 const Layout = () => {
     const location = useLocation();
+    const { appearance } = useTheme();
     // Determine if we should show sidebar based on current path
     const getCurrentNavPathExp = () => {
         // todo: general path manipulation lib because we are duplicating logic here found in FileRouter
@@ -68,13 +73,14 @@ const Layout = () => {
       <LinkReactRouter to='/' style={{ color: `inherit`, textDecoration: `none` }}>
         <Logo src={logoSrc} title={templateVariables.title} height={30} showTitle={true}/>
       </LinkReactRouter>
-      <Flex direction='row' gap='4'>
+      <Flex direction='row' gap='4' style={{ flex: 1 }}>
         {projectDataNavbar.map((item, key) => (<Link key={key} color='gray' to={item.pathExp}>
             {item.title}
           </Link>))}
       </Flex>
+      <ThemeToggle />
     </Flex>);
-    return (<Theme asChild>
+    return (<Theme asChild appearance={appearance}>
       <Grid width={{ initial: 'var(--container-4)' }} areas="'header header header header header header header header' 'sidebar sidebar . content content content content content'" rows='min-content auto' columns='repeat(8, 1fr)' gapX='2' my='8' mx='auto'>
         <style>
           {`

package/build/template/routes/root.jsx.map

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "polen",
-  "version": "0.10.0-next.5",
+  "version": "0.10.0-next.6",
   "type": "module",
   "description": "A framework for delightful GraphQL developer portals",
   "author": {

package/src/template/components/ThemeToggle.tsx

@@ -0,0 +1,21 @@
+import type { React } from '#dep/react/index'
+import { MoonIcon, SunIcon } from '@radix-ui/react-icons'
+import { IconButton } from '@radix-ui/themes'
+import { useTheme } from '../contexts/ThemeContext.tsx'
+
+export const ThemeToggle: React.FC = () => {
+  const { appearance, toggleTheme } = useTheme()
+
+  return (
+    <IconButton
+      size="2"
+      variant="ghost"
+      color="gray"
+      onClick={toggleTheme}
+      aria-label={`Switch to ${appearance === 'light' ? 'dark' : 'light'} theme`}
+      style={{ cursor: 'pointer' }}
+    >
+      {appearance === 'light' ? <MoonIcon width="18" height="18" /> : <SunIcon width="18" height="18" />}
+    </IconButton>
+  )
+}

package/src/template/contexts/ThemeContext.tsx

@@ -0,0 +1,60 @@
+import type { React } from '#dep/react/index'
+import { createContext, useContext, useEffect, useState } from 'react'
+
+type ThemeAppearance = 'light' | 'dark'
+
+interface ThemeContextValue {
+  appearance: ThemeAppearance
+  toggleTheme: () => void
+}
+
+const ThemeContext = createContext<ThemeContextValue | undefined>(undefined)
+
+const THEME_STORAGE_KEY = 'polen-theme-preference'
+
+export const ThemeProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
+  const [appearance, setAppearance] = useState<ThemeAppearance>(() => {
+    // Check if we're in the browser
+    if (typeof window === 'undefined') {
+      return 'light'
+    }
+    
+    // Check localStorage first
+    const stored = localStorage.getItem(THEME_STORAGE_KEY)
+    if (stored === 'light' || stored === 'dark') {
+      return stored
+    }
+    
+    // Check system preference
+    if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+      return 'dark'
+    }
+    
+    return 'light'
+  })
+
+  useEffect(() => {
+    // Persist to localStorage
+    if (typeof window !== 'undefined') {
+      localStorage.setItem(THEME_STORAGE_KEY, appearance)
+    }
+  }, [appearance])
+
+  const toggleTheme = () => {
+    setAppearance(prev => prev === 'light' ? 'dark' : 'light')
+  }
+
+  return (
+    <ThemeContext.Provider value={{ appearance, toggleTheme }}>
+      {children}
+    </ThemeContext.Provider>
+  )
+}
+
+export const useTheme = () => {
+  const context = useContext(ThemeContext)
+  if (!context) {
+    throw new Error('useTheme must be used within a ThemeProvider')
+  }
+  return context
+}

package/src/template/routes/root.tsx

@@ -13,13 +13,15 @@ import projectDataNavbar from 'virtual:polen/project/data/navbar.jsonsuper'
 import projectDataPages from 'virtual:polen/project/data/pages.jsonsuper'
 import { pages } from 'virtual:polen/project/pages.jsx'
 import { templateVariables } from 'virtual:polen/template/variables'
-import { Link } from '../components/Link.jsx'
-import { Logo } from '../components/Logo.jsx'
-import { Sidebar } from '../components/sidebar/Sidebar.jsx'
+import { Link } from '../components/Link.tsx'
+import { Logo } from '../components/Logo.tsx'
+import { Sidebar } from '../components/sidebar/Sidebar.tsx'
+import { ThemeToggle } from '../components/ThemeToggle.tsx'
+import { ThemeProvider, useTheme } from '../contexts/ThemeContext.tsx'
 import entryClientUrl from '../entry.client.jsx?url'
-import { changelog } from './changelog.jsx'
-import { index } from './index.jsx'
-import { reference } from './reference.jsx'
+import { changelog } from './changelog.tsx'
+import { index } from './index.tsx'
+import { reference } from './reference.tsx'
 
 // todo: not needed anymore because not using hono dev vite plugin right?
 const reactRefreshPreamble = `
@@ -45,7 +47,9 @@ export const Component = () => {
         {/* <meta name='theme-color' content='#000000' /> */}
       </head>
       <body style={{ margin: 0 }}>
-        <Layout />
+        <ThemeProvider>
+          <Layout />
+        </ThemeProvider>
         <ScrollRestoration />
         {import.meta.env.DEV && <script type='module' src={entryClientUrl}></script>}
       </body>
@@ -55,6 +59,7 @@ export const Component = () => {
 
 const Layout = () => {
   const location = useLocation()
+  const { appearance } = useTheme()
 
   // Determine if we should show sidebar based on current path
   const getCurrentNavPathExp = (): string | null => {
@@ -88,18 +93,19 @@ const Layout = () => {
       >
         <Logo src={logoSrc} title={templateVariables.title} height={30} showTitle={true} />
       </LinkReactRouter>
-      <Flex direction='row' gap='4'>
+      <Flex direction='row' gap='4' style={{ flex: 1 }}>
         {projectDataNavbar.map((item, key) => (
           <Link key={key} color='gray' to={item.pathExp}>
             {item.title}
           </Link>
         ))}
       </Flex>
+      <ThemeToggle />
     </Flex>
   )
 
   return (
-    <Theme asChild>
+    <Theme asChild appearance={appearance}>
       <Grid
         width={{ initial: 'var(--container-4)' }}
         areas="'header header header header header header header header' 'sidebar sidebar . content content content content content'"