polen 0.10.0-next.14 → 0.10.0-next.16

package/src/api/singletons/markdown/markdown.ts

@@ -1,29 +1,11 @@
-import rehypeShiki from '@shikijs/rehype'
 import rehypeStringify from 'rehype-stringify'
 import remarkGfm from 'remark-gfm'
 import remarkParse from 'remark-parse'
 import remarkRehype from 'remark-rehype'
 import { unified } from 'unified'
 
-// Create a processor with Shiki for syntax highlighting (async only)
-const createProcessorWithShiki = () => {
-  return unified()
-    .use(remarkParse)
-    .use(remarkGfm)
-    .use(remarkRehype)
-    .use(rehypeShiki, {
-      themes: {
-        light: `github-light`,
-        dark: `tokyo-night`,
-      },
-      defaultColor: false,
-      cssVariablePrefix: `--shiki-`,
-    })
-    .use(rehypeStringify)
-}
-
-// Create a processor without syntax highlighting for sync processing
-const createProcessorSync = () => {
+// Create a processor without syntax highlighting
+const createProcessor = () => {
   return unified()
     .use(remarkParse)
     .use(remarkGfm)
@@ -32,12 +14,11 @@ const createProcessorSync = () => {
 }
 
 export const parse = async (content: string): Promise<string> => {
-  const result = await createProcessorWithShiki().process(content)
+  const result = await createProcessor().process(content)
   return String(result)
 }
 
 export const parseSync = (content: string): string => {
-  // Note: Syntax highlighting is not available in sync mode due to @shikijs/rehype being async-only
-  const result = createProcessorSync().processSync(content)
+  const result = createProcessor().processSync(content)
   return String(result)
 }

package/src/api/static/index.ts

@@ -1 +1 @@
-export * as Static from './static.ts'
+export * as Static from './static.js'

package/src/api/static/manifest.test.ts

@@ -1,6 +1,6 @@
 import { Err, Fs, Path } from '@wollybeard/kit'
 import { afterEach, beforeEach, describe, expect, test } from 'vitest'
-import { buildManifest, type PolenBuildManifest } from './manifest.ts'
+import { buildManifest, type PolenBuildManifest } from './manifest.js'
 
 describe('validate-build', () => {
   let testDir: string

package/src/api/static/manifest.ts

@@ -2,7 +2,7 @@ import { Codec, Resource } from '@wollybeard/kit'
 import { z } from 'zod/v4'
 
 export const PolenBuildManifestSchema = z.object({
-  type: z.enum(['ssg', 'ssr']),
+  type: z.enum([`ssg`, `ssr`]),
   version: z.string(),
   basePath: z.string(),
 }).loose()
@@ -10,7 +10,7 @@ export const PolenBuildManifestSchema = z.object({
 export type PolenBuildManifest = z.infer<typeof PolenBuildManifestSchema>
 
 export const buildManifest = Resource.create({
-  name: 'polen-build-manifest',
-  path: '.polen/build.json',
+  name: `polen-build-manifest`,
+  path: `.polen/build.json`,
   codec: Codec.fromZod(PolenBuildManifestSchema),
 })

package/src/api/static/rebase.test.ts

@@ -1,10 +1,10 @@
 import { Fs, Path } from '@wollybeard/kit'
 import { afterEach, beforeEach, describe, expect, test } from 'vitest'
-import { rebase, type RebasePlan } from './rebase.ts'
+import { rebase, type RebasePlan } from './rebase.js'
 
 const testDir = 'temp/rebase-test'
 
-const createTestBuild = async (dir: string, basePath: string = '/') => {
+const createTestBuild = async (dir: string, basePath = '/') => {
   await Fs.makeDirectory(dir)
 
   // Create Polen build manifest

package/src/api/static/rebase.ts

@@ -1,18 +1,18 @@
 import { TinyGlobby } from '#dep/tiny-globby/index'
 import { Fs, Path } from '@wollybeard/kit'
 import { Err } from '@wollybeard/kit'
-import { buildManifest, type PolenBuildManifest } from './manifest.ts'
+import { buildManifest, type PolenBuildManifest } from './manifest.js'
 
 export type RebasePlan = RebaseOverwritePlan | RebaseCopyPlan
 
 export interface RebaseOverwritePlan {
-  changeMode: 'mutate'
+  changeMode: `mutate`
   newBasePath: string
   sourcePath: string
 }
 
 export interface RebaseCopyPlan {
-  changeMode: 'copy'
+  changeMode: `copy`
   newBasePath: string
   sourcePath: string
   targetPath: string
@@ -22,7 +22,7 @@ export const rebase = async (plan: RebasePlan): Promise<void> => {
   // 1. Validate source is a Polen build
   const manifestResult = await buildManifest.read(plan.sourcePath)
   if (Err.is(manifestResult)) {
-    throw new Error(`Polen build manifest not found at: ${Path.join(plan.sourcePath, '.polen', 'build.json')}`)
+    throw new Error(`Polen build manifest not found at: ${Path.join(plan.sourcePath, `.polen`, `build.json`)}`)
   }
   const manifest = manifestResult
 
@@ -33,7 +33,7 @@ export const rebase = async (plan: RebasePlan): Promise<void> => {
 
   // 3. Handle copy vs mutate
   let workingPath: string
-  if (plan.changeMode === 'copy') {
+  if (plan.changeMode === `copy`) {
     if (await Fs.exists(plan.targetPath)) {
       const isEmpty = await Fs.isEmptyDir(plan.targetPath)
       if (!isEmpty) {
@@ -64,8 +64,8 @@ export const rebase = async (plan: RebasePlan): Promise<void> => {
 // TODO: this is very generic, factor out to kit-temp
 const isValidUrlPath = (path: string): boolean => {
   // URL path should start with / and not contain invalid characters
-  if (!path.startsWith('/')) return false
-  if (!path.endsWith('/')) return false
+  if (!path.startsWith(`/`)) return false
+  if (!path.endsWith(`/`)) return false
 
   // Basic validation - no spaces, proper URL characters
   const urlPathRegex = /^\/[a-zA-Z0-9\-._~:/?#[\]@!$&'()*+,;=%]*\/$/
@@ -82,7 +82,7 @@ const updateHtmlFiles = async (buildPath: string, oldBasePath: string, newBasePa
 }
 
 const findHtmlFiles = async (dir: string): Promise<string[]> => {
-  return await TinyGlobby.glob('**/*.html', {
+  return await TinyGlobby.glob(`**/*.html`, {
     absolute: true,
     cwd: dir,
     onlyFiles: true,
@@ -108,10 +108,10 @@ const updateHtmlFile = async (filePath: string, oldBasePath: string, newBasePath
   } else {
     // Insert new base tag in head
     const headRegex = /<head[^>]*>/i
-    const headMatch = content.match(headRegex)
+    const headMatch = headRegex.exec(content)
 
     if (headMatch) {
-      const insertPosition = headMatch.index! + headMatch[0].length
+      const insertPosition = headMatch.index + headMatch[0].length
       updatedContent = content.slice(0, insertPosition)
         + `\n  <base href="${newBasePath}">`
         + content.slice(insertPosition)
@@ -124,7 +124,7 @@ const updateHtmlFile = async (filePath: string, oldBasePath: string, newBasePath
 }
 
 const updateManifest = async (buildPath: string, updates: Partial<PolenBuildManifest>): Promise<void> => {
-  const manifestPath = Path.join(buildPath, '.polen', 'build.json')
+  const manifestPath = Path.join(buildPath, `.polen`, `build.json`)
   const manifestResult = await buildManifest.read(buildPath)
   if (Err.is(manifestResult)) {
     throw new Error(`Polen build manifest not found at: ${manifestPath}`)

package/src/api/static/static.ts

@@ -1,2 +1,2 @@
-export * from './manifest.ts'
-export * from './rebase.ts'
+export * from './manifest.js'
+export * from './rebase.js'

package/src/api/utils/asset-url/asset-url.test.ts

@@ -1,5 +1,5 @@
 import { describe, expect, test } from 'vitest'
-import { assetUrl, faviconUrl, joinPaths, pageUrl } from './asset-url.ts'
+import { assetUrl, faviconUrl, joinPaths, pageUrl } from './asset-url.js'
 
 describe('asset-url helpers', () => {
   describe('joinPaths', () => {

package/src/api/utils/asset-url/index.ts

@@ -1 +1 @@
-export * from './asset-url.ts'
+export * from './asset-url.js'

package/src/api/vite/logger.ts

@@ -10,12 +10,12 @@ export const createLogger = (config: Config.Config): Vite.Logger => {
     ...baseLogger,
     info(msg, options) {
       // Filter out optimization-related messages
-      const msgString = typeof msg === 'string' ? msg : String(msg)
+      const msgString = typeof msg === `string` ? msg : String(msg)
       if (
-        msgString.includes('new dependencies optimized')
-        || msgString.includes('optimized dependencies changed')
-        || msgString.includes('Re-optimizing dependencies')
-        || msgString.includes('Forced re-optimization')
+        msgString.includes(`new dependencies optimized`)
+        || msgString.includes(`optimized dependencies changed`)
+        || msgString.includes(`Re-optimizing dependencies`)
+        || msgString.includes(`Forced re-optimization`)
       ) {
         return
       }

package/src/api/vite/plugins/{branding/index.ts → branding.ts}

@@ -6,7 +6,7 @@ import { debugPolen } from '#singletons/debug'
 import { Fs } from '@wollybeard/kit'
 import type { Plugin } from 'vite'
 
-const viLogo = polenVirtual(['project', 'assets', 'logo.svg'])
+const viLogo = polenVirtual([`project`, `assets`, `logo.svg`])
 
 const generateDefaultLogo = async () => {
   return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128" width="128" height="128">
@@ -15,12 +15,12 @@ const generateDefaultLogo = async () => {
 }
 
 export function Branding(config: Config.Config): Plugin {
-  const debug = debugPolen.sub('vite-plugin:branding')
-  debug('initialized')
+  const debug = debugPolen.sub(`vite-plugin:branding`)
+  debug(`initialized`)
 
   return {
-    name: 'polen:branding',
-    enforce: 'pre',
+    name: `polen:branding`,
+    enforce: `pre`,
 
     async buildStart() {
       this.addWatchFile(config.paths.project.absolute.public.logo)
@@ -46,7 +46,7 @@ export function Branding(config: Config.Config): Plugin {
       if (id === viLogo.resolved) {
         const logoFileContent = await Fs.read(config.paths.project.absolute.public.logo)
         const content = logoFileContent ? logoFileContent : await generateDefaultLogo()
-        const dataUrl = `data:image/svg+xml;base64,${Buffer.from(content).toString('base64')}`
+        const dataUrl = `data:image/svg+xml;base64,${Buffer.from(content).toString(`base64`)}`
         return `export default ${JSON.stringify(dataUrl)}`
       }
     },
@@ -63,7 +63,7 @@ interface HandleWatchedFileChangeParams {
 
 const handleWatchedFileChange = async (
   params: HandleWatchedFileChangeParams,
-): Promise<Array<Vite.ModuleNode> | void> => {
+): Promise<Vite.ModuleNode[] | void> => {
   const { watchedFile, changedFile, moduleId, server, debug } = params
 
   // Check if change is for watched file
@@ -93,8 +93,8 @@ const handleWatchedFileChange = async (
     case MutationType.Create:
       // Full reload needed - module never existed
       server.ws.send({
-        type: 'full-reload',
-        path: '*',
+        type: `full-reload`,
+        path: `*`,
       })
       break
 

package/src/api/vite/plugins/build.ts

@@ -5,12 +5,12 @@ import { ViteVirtual } from '#lib/vite-virtual/index'
 import { debugPolen } from '#singletons/debug'
 import { Fs, Path } from '@wollybeard/kit'
 import packageJson from '../../../../package.json' with { type: 'json' }
-import { isKitUnusedExternalImport, isRadixModuleLevelDirective } from '../log-filters.ts'
-import { polenVirtual } from '../vi.ts'
+import { isKitUnusedExternalImport, isRadixModuleLevelDirective } from '../log-filters.js'
+import { polenVirtual } from '../vi.js'
 
 export const Build = (config: Config.Config): Vite.Plugin[] => {
   const debug = debugPolen.sub(`vite-build`)
-  debug('construct')
+  debug(`construct`)
   // let viteConfigResolved: Vite.ResolvedConfig
 
   // const outDir = Path.join(config.paths.project.rootDir, `dist`)
@@ -36,7 +36,6 @@ export const Build = (config: Config.Config): Vite.Plugin[] => {
         if (isWrite) {
           for (const chunkOrAsset of Object.values(bundle)) {
             if (chunkOrAsset.type === `asset` && chunkOrAsset.names.includes(`entry.client.jsx`)) {
-              // eslint-disable-next-line
               delete bundle[chunkOrAsset.fileName]
             }
           }
@@ -53,7 +52,7 @@ export const Build = (config: Config.Config): Vite.Plugin[] => {
               build: {
                 manifest: true,
                 rollupOptions: {
-                  input: [config.paths.framework.template.client.entrypoint],
+                  input: [config.paths.framework.template.absolute.client.entrypoint],
                   external: id => id.startsWith(`node:`),
                   onwarn(message) {
                     if (isKitUnusedExternalImport(message)) return
@@ -86,7 +85,7 @@ export const Build = (config: Config.Config): Vite.Plugin[] => {
                 // The SSR build will follow the client build, and emptying the dir would lose the output of the client build.
                 emptyOutDir: false,
                 rollupOptions: {
-                  input: [config.paths.framework.template.server.entrypoint],
+                  input: [config.paths.framework.template.absolute.server.entrypoint],
                   output: {
                     entryFileNames: config.paths.project.relative.build.relative.serverEntrypoint,
                   },
@@ -105,7 +104,6 @@ export const Build = (config: Config.Config): Vite.Plugin[] => {
       //       console.log(chunkOrAsset)
       //       if (chunkOrAsset.type === `chunk`) {
       //         if (chunkOrAsset.facadeModuleId === viClientManifest.resolved) {
-      //           // eslint-disable-next-line
       //           delete bundle[chunkOrAsset.fileName]
       //         }
       //       }
@@ -157,20 +155,20 @@ const Manifest = (config: Config.Config): Vite.Plugin => {
 
 const BuildManifest = (config: Config.Config): Vite.Plugin => {
   return {
-    name: 'polen:build-manifest',
-    apply: 'build',
+    name: `polen:build-manifest`,
+    apply: `build`,
     applyToEnvironment: Vite.isEnvironmentClient,
     async generateBundle() {
       const manifest: PolenBuildManifest = {
-        type: config.build.architecture === 'ssr' ? 'ssr' : 'ssg',
+        type: config.build.architecture === `ssr` ? `ssr` : `ssg`,
         version: packageJson.version,
-        basePath: config.build.base || '/',
+        basePath: config.build.base || `/`,
       }
 
       // Emit the manifest as an asset
       this.emitFile({
-        type: 'asset',
-        fileName: '.polen/build.json',
+        type: `asset`,
+        fileName: `.polen/build.json`,
         source: JSON.stringify(manifest, null, 2),
       })
     },

package/src/api/vite/plugins/core.ts

@@ -1,31 +1,30 @@
 import type { Config } from '#api/config/index'
-import { NavbarData } from '#api/vite/data/navbar'
+import { Content } from '#api/content/$'
+import { createNavbar } from '#api/content/navbar'
 import { VitePluginSelfContainedMode } from '#cli/_/self-contained-mode'
 import type { ReactRouter } from '#dep/react-router/index'
 import type { Vite } from '#dep/vite/index'
 import { VitePluginJson } from '#lib/vite-plugin-json/index'
-import { VitePluginReactiveData } from '#lib/vite-plugin-reactive-data/index'
 import { ViteVirtual } from '#lib/vite-virtual/index'
 import { debugPolen } from '#singletons/debug'
 import { superjson } from '#singletons/superjson'
 import { Json, Str } from '@wollybeard/kit'
-import type { ProjectData } from '../../../project-data.ts'
-import { SchemaAugmentation } from '../../schema-augmentation/index.ts'
-import { Schema } from '../../schema/index.ts'
-import { createLogger } from '../logger.ts'
-import { polenVirtual } from '../vi.ts'
-import { Pages } from './pages.ts'
+import type { ProjectData } from '../../../project-data.js'
+import { SchemaAugmentation } from '../../schema-augmentation/index.js'
+import { Schema } from '../../schema/index.js'
+import { createLogger } from '../logger.js'
+import { polenVirtual } from '../vi.js'
+import { Pages } from './pages.js'
 
 const viTemplateVariables = polenVirtual([`template`, `variables`])
 const viTemplateSchemaAugmentations = polenVirtual([`template`, `schema-augmentations`])
-const viProjectData = polenVirtual([`project`, `data.jsonsuper`], { allowPluginProcessing: true })
+export const viProjectData = polenVirtual([`project`, `data.jsonsuper`], { allowPluginProcessing: true })
 
 export interface ProjectRoutesModule {
   routes: ReactRouter.RouteObject[]
 }
 
 export const Core = (config: Config.Config): Vite.PluginOption[] => {
-  // Schema cache management
   let schemaCache: Awaited<ReturnType<typeof Schema.readOrThrow>> | null = null
 
   const readSchema = async () => {
@@ -44,7 +43,6 @@ export const Core = (config: Config.Config): Vite.PluginOption[] => {
   }
 
   const plugins: Vite.Plugin[] = []
-  const navbarData = NavbarData()
 
   // Note: The main use for this right now is to resolve the react imports
   // from the mdx vite plugin which have to go through the Polen exports since Polen keeps those deps bundled.
@@ -60,11 +58,11 @@ export const Core = (config: Config.Config): Vite.PluginOption[] => {
   const jsonsuper = VitePluginJson.create({
     codec: {
       validate: superjson,
-      importPath: import.meta.resolve('#singletons/superjson'),
-      importExport: 'superjson',
+      importPath: import.meta.resolve(`#singletons/superjson`),
+      importExport: `superjson`,
     },
     filter: {
-      moduleTypes: ['jsonsuper'],
+      moduleTypes: [`jsonsuper`],
     },
   })
 
@@ -83,7 +81,7 @@ export const Core = (config: Config.Config): Vite.PluginOption[] => {
      */
     {
       name: `polen:internal-import-alias`,
-      enforce: 'pre' as const,
+      enforce: `pre` as const,
       resolveId(id, importer) {
         // const debug = debugPolen.sub(`vite-plugin:internal-import-alias`)
 
@@ -92,16 +90,6 @@ export const Core = (config: Config.Config): Vite.PluginOption[] => {
             && (
               importer.startsWith(config.paths.framework.sourceDir)
               || polenVirtual.includes(importer)
-              /*
-                TODO: can we make index.html be in the source dir?
-                Example case:
-
-                POLEN   VITE_PLUGIN_INTERNAL_IMPORT_ALIAS   CHECK  {
-                  id: '#singletons/superjson',
-                  importer: '/Users/jasonkuhrt/projects/the-guild-org/polen/index.html',
-                  isPolenImporter: false
-                }
-              */
               || (importer.startsWith(config.paths.framework.rootDir) && importer.endsWith(`index.html`))
             ),
         )
@@ -120,28 +108,30 @@ export const Core = (config: Config.Config): Vite.PluginOption[] => {
       },
     },
     jsonsuper,
-    VitePluginReactiveData.create({
-      moduleId: `virtual:polen/project/data/navbar.jsonsuper`,
-      codec: superjson,
-      data: navbarData.value,
-      name: `polen-navbar`,
-    }),
     ...Pages({
       config,
-      navbarData,
     }),
     {
       name: `polen:core`,
       config(_, { command }) {
-        // isServing = command === `serve`
         return {
           root: config.paths.framework.rootDir,
+          // todo
+          // future: {
+          //   removePluginHookHandleHotUpdate: 'warn',
+          //   removePluginHookSsrArgument: 'warn',
+          //   removeServerModuleGraph: 'warn',
+          //   removeServerHot: 'warn',
+          //   removeServerTransformRequest: 'warn',
+          //   removeSsrLoadModule: 'warn',
+          // },
           define: {
             __BUILDING__: Json.encode(command === `build`),
             __SERVING__: Json.encode(command === `serve`),
             __COMMAND__: Json.encode(command),
             __BUILD_ARCHITECTURE__: Json.encode(config.build.architecture),
             __BUILD_ARCHITECTURE_SSG__: Json.encode(config.build.architecture === `ssg`),
+            'process.env.NODE_ENV': Json.encode(config.advanced.debug ? 'development' : 'production'),
           },
           customLogger: createLogger(config),
           esbuild: false,
@@ -182,26 +172,33 @@ export const Core = (config: Config.Config): Vite.PluginOption[] => {
           async loader() {
             const debug = debugPolen.sub(`module-project-data`)
 
-            debug('load', { id: viProjectData.id })
+            debug(`load`, { id: viProjectData.id })
 
             const schema = await readSchema()
 
+            const navbar = []
+
             // ━ Schema presence causes adding some navbar items
             if (schema) {
-              const schemaNavbar = navbarData.get('schema')
-              schemaNavbar.length = 0 // Clear existing
-              debug('update navbar', { message: 'for schema' })
-
               // IMPORTANT: Always ensure paths start with '/' for React Router compatibility.
               // Without the leading slash, React Router treats paths as relative, which causes
               // hydration mismatches between SSR (where base path is prepended) and client
               // (where basename is configured). This ensures consistent behavior.
-              schemaNavbar.push({ pathExp: `/reference`, title: `Reference` })
+              navbar.push({ pathExp: `/reference`, title: `Reference` })
               if (schema.versions.length > 1) {
-                schemaNavbar.push({ pathExp: `/changelog`, title: `Changelog` })
+                navbar.push({ pathExp: `/changelog`, title: `Changelog` })
               }
             }
 
+            //
+            // ━━ Scan pages and add to navbar
+            //
+
+            const pagesDir = config.paths.project.absolute.pages
+            const scanResult = await Content.scan({ dir: pagesDir })
+            const data = createNavbar(scanResult.list)
+            navbar.push(...data)
+
             //
             // ━━ Put It All together
             //
@@ -210,6 +207,7 @@ export const Core = (config: Config.Config): Vite.PluginOption[] => {
               schema,
               basePath: config.build.base,
               paths: config.paths.project,
+              navbar, // Complete navbar with schema and pages
               server: {
                 static: {
                   // todo

package/src/api/vite/plugins/main.ts

@@ -1,13 +1,14 @@
 import type { Config } from '#api/config/index'
 import type { Vite } from '#dep/vite/index'
+import { vitePluginSsrCss } from '@hiogawa/vite-plugin-ssr-css'
 import ViteReact from '@vitejs/plugin-react-oxc'
-// import { Arr, Path } from '@wollybeard/kit'
-// import Inspect from 'vite-plugin-inspect'
-// import Restart from 'vite-plugin-restart'
-import { Branding } from './branding/index.ts'
-import { Build } from './build.ts'
-import { Core } from './core.ts'
-import { Serve } from './serve.ts'
+import { Arr, Path } from '@wollybeard/kit'
+import Inspect from 'vite-plugin-inspect'
+import Restart from 'vite-plugin-restart'
+import { Branding } from './branding.js'
+import { Build } from './build.js'
+import { Core } from './core.js'
+import { Serve } from './serve.js'
 
 export const Main = (
   config: Config.Config,
@@ -15,26 +16,28 @@ export const Main = (
   const plugins: Vite.PluginOption = []
 
   // Optional Plugins based on config
-  // TODO: Re-enable when compatible with Rolldown
 
-  // if (config.advanced.explorer) {
-  //   const outputDir = Path.join(config.paths.project.rootDir, `.bundle-explorer`)
-  //   const plugin = Inspect({
-  //     build: true,
-  //     outputDir,
-  //   })
-  //   plugins.push(plugin)
-  // }
+  if (config.advanced.explorer) {
+    const outputDir = Path.join(config.paths.project.rootDir, `.bundle-explorer`)
+    const plugin = Inspect({
+      build: true,
+      outputDir,
+    })
+    plugins.push(plugin)
+  }
 
-  // if (Arr.isntEmpty(config.watch.also)) {
-  //   const plugin = Restart({
-  //     restart: config.watch.also,
-  //   })
-  //   plugins.push(plugin)
-  // }
+  if (Arr.isntEmpty(config.watch.also)) {
+    const plugin = Restart({
+      restart: config.watch.also,
+    })
+    plugins.push(plugin)
+  }
 
   plugins.push(
     ViteReact(),
+    vitePluginSsrCss({
+      entries: [`/${config.paths.framework.template.relative.client.entrypoint}`],
+    }),
     Branding(config),
     Core(config),
     Serve(config),