@woodsportal/hubspot-kit 1.0.5 → 1.0.26

package/scripts/watch-hubspot.mjs

@@ -3,15 +3,21 @@
  * HubSpot CMS watch — uses woodscli.json upload paths.
  */
 import { spawn, spawnSync } from 'node:child_process'
-import { watch } from 'node:fs'
-import { resolve } from 'node:path'
+import { existsSync, watch } from 'node:fs'
+import { dirname, resolve } from 'node:path'
+import { fileURLToPath } from 'node:url'
 
 import { moduleOutDir, moduleUploadPath, readWoodsportalConfig, themeUploadPath } from './read-woodsportal-config.mjs'
 
+const kitScriptsDir = dirname(fileURLToPath(import.meta.url))
+const kitRoot = resolve(kitScriptsDir, '..')
+const kitCli = resolve(kitRoot, 'dist/cli.js')
+
+const argv = process.argv.slice(2)
+const rebuild = argv.includes('--rebuild')
+const tier = parseTier(argv)
+
 const { root, config } = readWoodsportalConfig()
-const rebuild = process.argv.includes('--rebuild')
-const isProd = process.argv.includes('--prod')
-const buildScript = isProd ? 'build:prod' : 'build:dev'
 
 const isTheme = config?.projectType === 'theme-starter'
 const hubspotModulePath = moduleOutDir(root)
@@ -22,13 +28,85 @@ const watchRoots = isTheme
   ? [theme.srcDir]
   : ['src', 'public'].map((dir) => resolve(root, dir))
 
+/** @type {import('node:child_process').ChildProcess | null} */
+let cmsChild = null
+/** @type {ReturnType<typeof setTimeout> | null} */
+let debounceTimer = null
+/** @type {import('node:fs').FSWatcher[]} */
+const fsWatchers = []
+let shuttingDown = false
+
+function parseTier(args) {
+  const idx = args.indexOf('--tier')
+  if (idx >= 0 && args[idx + 1]) {
+    const value = args[idx + 1]
+    if (value === 'dev' || value === 'stg' || value === 'prod') return value
+  }
+  if (args.includes('--prod')) return 'prod'
+  if (args.includes('--stg')) return 'stg'
+  return 'dev'
+}
+
 function log(msg) {
   console.log(`[watch] ${msg}`)
 }
 
-function runYarn(script) {
-  const result = spawnSync('yarn', [script], { cwd: root, stdio: 'inherit' })
-  if (result.status !== 0) process.exit(result.status ?? 1)
+function shutdown(signal) {
+  if (shuttingDown) return
+  shuttingDown = true
+
+  if (debounceTimer) {
+    clearTimeout(debounceTimer)
+    debounceTimer = null
+  }
+
+  for (const watcher of fsWatchers) {
+    try {
+      watcher.close()
+    } catch {
+      // ignore
+    }
+  }
+
+  if (cmsChild && !cmsChild.killed) {
+    cmsChild.kill(signal)
+    return
+  }
+
+  process.exit(signal === 'SIGINT' ? 130 : 143)
+}
+
+process.on('SIGINT', () => shutdown('SIGINT'))
+process.on('SIGTERM', () => shutdown('SIGTERM'))
+
+/**
+ * Run wp build from the same @woodsportal/hubspot-kit package as this script.
+ * Avoids consumer node_modules/.bin/wp (often an older pin with wrong outDir).
+ */
+function runWpBuild() {
+  const env = { ...process.env, WP_HS_PROJECT_ROOT: root }
+
+  let command = process.execPath
+  let args = []
+
+  if (existsSync(kitCli)) {
+    args = [kitCli, 'build', '--tier', tier, '--quiet']
+  } else {
+    const localWp = resolve(root, 'node_modules', '.bin', 'wp')
+    command = existsSync(localWp) ? localWp : 'wp'
+    args = ['build', '--tier', tier, '--quiet']
+  }
+
+  log(`Running wp build --tier ${tier} …`)
+  const result = spawnSync(command, args, {
+    cwd: root,
+    stdio: 'inherit',
+    env,
+    shell: command === 'wp',
+  })
+  if (result.status !== 0) {
+    process.exit(result.status ?? 1)
+  }
 }
 
 function runBuild() {
@@ -36,19 +114,22 @@ function runBuild() {
     log('Theme project — no module build step')
     return
   }
-  log(`Running ${buildScript} …`)
-  runYarn(buildScript)
+  runWpBuild()
 }
 
 function startCmsWatch() {
   const src = isTheme ? theme.srcDir : hubspotModulePath
   const target = isTheme ? theme.uploadPath : hubspotUploadTarget
   log(`Starting hs cms watch ${src} → ${target}`)
-  return spawn('hs', ['cms', 'watch', src, target], { cwd: root, stdio: 'inherit' })
+  cmsChild = spawn('hs', ['cms', 'watch', src, target], { cwd: root, stdio: 'inherit' })
+  cmsChild.on('exit', (code) => {
+    if (shuttingDown) return
+    process.exit(code ?? 0)
+  })
+  return cmsChild
 }
 
 function startRebuildWatcher() {
-  let debounceTimer = null
   let building = false
   let pending = false
 
@@ -75,12 +156,21 @@ function startRebuildWatcher() {
   }
 
   for (const watchRoot of watchRoots) {
-    watch(watchRoot, { recursive: true }, () => scheduleBuild())
+    const watcher = watch(watchRoot, { recursive: true }, () => scheduleBuild())
+    fsWatchers.push(watcher)
+    log(`Watching ${watchRoot}`)
   }
 }
 
-if (!isTheme) runBuild()
-const cms = startCmsWatch()
-if (rebuild && !isTheme) startRebuildWatcher()
+if (!isTheme) {
+  const moduleJs = resolve(hubspotModulePath, 'module.js')
+  if (!existsSync(moduleJs)) {
+    log('Module dist missing — building before watch')
+    runBuild()
+  } else if (rebuild) {
+    runBuild()
+  }
+}
 
-cms.on('exit', (code) => process.exit(code ?? 0))
+startCmsWatch()
+if (rebuild && !isTheme) startRebuildWatcher()

package/scripts/wphs-paths.mjs

@@ -68,6 +68,7 @@ export function wphsPaths(projectRoot) {
     stateDir: join(workspaceRoot, 'state'),
     kitModuleConfigLink: join(workspaceRoot, '.kit-module-config'),
     kitBootstrapLink: join(workspaceRoot, '.kit-bootstrap.tsx'),
+    kitBootstrapGreenfieldLink: join(workspaceRoot, '.kit-bootstrap-greenfield.tsx'),
     readmePath: join(workspaceRoot, 'README.md'),
     brandingAssetsUrlPrefix: `/${workspaceDir}/assets/branding/`,
     legacyBrandingAssetsUrlPrefixes: [

package/scripts/write-audit-artifacts.mjs

@@ -6,6 +6,7 @@ import { existsSync, mkdirSync, readFileSync, readdirSync, writeFileSync } from
 import { resolve, dirname } from 'node:path'
 import { fileURLToPath } from 'node:url'
 import { findProjectRoot } from './project-root.mjs'
+import { moduleOutDir } from './read-woodsportal-config.mjs'
 import { gzipSync } from 'node:zlib'
 
 const root = findProjectRoot()
@@ -33,7 +34,7 @@ const report = {
   cdn: {},
 }
 
-const moduleDir = resolve(root, 'dist/WoodsPortal.Module')
+const moduleDir = moduleOutDir(root)
 for (const name of ['module.js', 'module.css', 'module.html', 'fields.json']) {
   const path = resolve(moduleDir, name)
   if (existsSync(path)) {

package/src/dev/bootstrap-greenfield.tsx

@@ -3,6 +3,7 @@
  * Use after `wp init`; adopt `dev/bootstrap` when wiring a real WoodsPortal consumer app.
  */
 import { createRoot } from 'react-dom/client'
+import type { ReactNode } from 'react'
 
 import {
   bindModuleConfigToHubSpotData,
@@ -16,7 +17,12 @@ import {
 } from '@/dev/module-config/ui/ModuleConfigOverlay'
 import wphsAdapter from '@wphs/adapter'
 
-export async function mountGreenfieldDev(): Promise<void> {
+export type MountGreenfieldDevOptions = {
+  /** Scaffold-owned preview (e.g. templates/src/app/StarterPage.tsx). */
+  preview?: ReactNode
+}
+
+export async function mountGreenfieldDev(options: MountGreenfieldDevOptions = {}): Promise<void> {
   const rootElement = document.getElementById('app')
 
   try {
@@ -31,15 +37,17 @@ export async function mountGreenfieldDev(): Promise<void> {
     }
 
     createRoot(rootElement).render(
-      <>
+      <div>
         <ModuleConfigOverlay />
-        <main style={{ padding: '1.5rem', fontFamily: 'system-ui, sans-serif' }}>
-          <h1>WoodsCLI dev</h1>
-          <p>
-            Edit HubSpot module fields with <kbd>Ctrl+Shift+Z</kbd> (Mac: <kbd>⌃⇧Z</kbd>).
-          </p>
-        </main>
-      </>
+        {options.preview ?? (
+          <main style={{ padding: '1.5rem', fontFamily: 'system-ui, sans-serif' }}>
+            <h1>WoodsCLI dev</h1>
+            <p>
+              Edit HubSpot module fields with <kbd>Ctrl+Shift+Z</kbd> (Mac: <kbd>⌃⇧Z</kbd>).
+            </p>
+          </main>
+        )}
+      </div>
     )
   } catch (error) {
     const message = error instanceof Error ? error.message : String(error)

package/src/dev-module-config/dev-module-display-name.ts

@@ -0,0 +1,5 @@
+/** Module slug from woodscli.json — injected by Vite in local dev. */
+export function devModuleDisplayName(): string {
+  const name = import.meta.env.VITE_WPHS_MODULE_NAME
+  return typeof name === 'string' && name.trim() ? name.trim() : 'module'
+}

package/src/dev-module-config/ui/ModuleConfigPersistenceStatus.tsx

@@ -8,7 +8,7 @@ type ModuleConfigPersistenceStatusProps = {
 function StatusIcon({ variant }: { variant: 'dirty' | 'saved' | 'info' }) {
   if (variant === 'dirty') {
     return (
-      <svg viewBox="0 0 16 16" className="h-4 w-4 shrink-0" fill="currentColor" aria-hidden>
+      <svg viewBox="0 0 16 16" className="mc-status-icon" fill="currentColor" aria-hidden>
         <circle cx="8" cy="8" r="3.5" />
       </svg>
     )
@@ -16,7 +16,7 @@ function StatusIcon({ variant }: { variant: 'dirty' | 'saved' | 'info' }) {
 
   if (variant === 'saved') {
     return (
-      <svg viewBox="0 0 16 16" className="h-4 w-4 shrink-0" fill="none" aria-hidden>
+      <svg viewBox="0 0 16 16" className="mc-status-icon" fill="none" aria-hidden>
         <path
           d="M3.5 8.5 6.5 11.5 12.5 4.5"
           stroke="currentColor"
@@ -29,7 +29,7 @@ function StatusIcon({ variant }: { variant: 'dirty' | 'saved' | 'info' }) {
   }
 
   return (
-    <svg viewBox="0 0 16 16" className="h-4 w-4 shrink-0" fill="none" aria-hidden>
+    <svg viewBox="0 0 16 16" className="mc-status-icon" fill="none" aria-hidden>
       <circle cx="8" cy="8" r="6.25" stroke="currentColor" strokeWidth="1.5" />
       <path d="M8 7v4" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" />
       <circle cx="8" cy="4.75" r="0.85" fill="currentColor" />
@@ -59,7 +59,7 @@ export function ModuleConfigPersistenceStatus({
         <StatusIcon variant="saved" />
         <div className="mc-persistence-status__body">
           <span className="mc-persistence-status__label">Saved locally</span>
-          <code className="mc-persistence-status__path">.dev/module-config.local.json</code>
+          <code className="mc-persistence-status__path">.wphs/config/module-config.local.json</code>
         </div>
       </div>
     )
@@ -71,7 +71,7 @@ export function ModuleConfigPersistenceStatus({
         <StatusIcon variant="info" />
         <div className="mc-persistence-status__body">
           <span className="mc-persistence-status__label">Using example config</span>
-          <code className="mc-persistence-status__path">.dev/module-config.example.json</code>
+          <code className="mc-persistence-status__path">.wphs/config/module-config.example.json</code>
         </div>
       </div>
     )

package/src/dev-module-config/ui/ModuleConfigShell.tsx

@@ -25,6 +25,7 @@ import { mcSurface } from './module-config-surfaces'
 import { ModuleConfigThemeToggle } from './ModuleConfigThemeToggle'
 import { ModuleConfigDockSideIcon } from './ModuleConfigDockSideIcon'
 import { ModuleConfigPersistenceStatus } from './ModuleConfigPersistenceStatus'
+import { devModuleDisplayName } from '../dev-module-display-name'
 
 type Tab = 'CONTENT' | 'STYLE'
 
@@ -179,7 +180,7 @@ function ModuleConfigShellInner({
           ))}
         </nav>
         <div className="flex items-start justify-between gap-2">
-          <h2 className={hsTypography.moduleTitle}>woodsportal-module</h2>
+          <h2 className={hsTypography.moduleTitle}>{devModuleDisplayName()}</h2>
           <div className="flex shrink-0 items-center gap-1">
             <ModuleConfigThemeToggle theme={theme} onToggle={toggleTheme} />
             {compact && onToggleOverlaySide ? (

package/src/dev-module-config/ui/module-config-theme.css

@@ -277,6 +277,12 @@
   padding: 0.625rem 0.75rem;
 }
 
+.mc-status-icon {
+  height: 1rem;
+  width: 1rem;
+  flex-shrink: 0;
+}
+
 .mc-persistence-status__body {
   min-width: 0;
   flex: 1 1 0%;

package/src/dev-module-config/ui/navigation/ModuleConfigNavContext.tsx

@@ -7,6 +7,8 @@ import {
   type ReactNode,
 } from 'react'
 
+import { devModuleDisplayName } from '../../dev-module-display-name'
+
 export type BreadcrumbSegment = {
   id: string
   label: string
@@ -27,6 +29,14 @@ type ModuleConfigNavContextValue = {
 
 const ROOT_SEGMENT: BreadcrumbSegment = { id: 'contents', label: 'Contents' }
 
+function moduleTitleSegment(stackLength: number, popTo: (id: string) => void): BreadcrumbSegment {
+  return {
+    id: 'module',
+    label: devModuleDisplayName(),
+    onClick: stackLength > 1 ? () => popTo('module') : undefined,
+  }
+}
+
 const ModuleConfigNavContext = createContext<ModuleConfigNavContextValue | null>(null)
 
 export function ModuleConfigNavProvider({ children }: { children: ReactNode }) {
@@ -124,11 +134,7 @@ export function ModuleConfigNavProvider({ children }: { children: ReactNode }) {
   }, [clearAllDrillDownPanels])
 
   const segments = useMemo(() => {
-    const moduleTitle: BreadcrumbSegment = {
-      id: 'module',
-      label: 'woodsportal-module',
-      onClick: stack.length > 1 ? () => popTo('module') : undefined,
-    }
+    const moduleTitle = moduleTitleSegment(stack.length, popTo)
 
     if (stack.length <= 1) {
       return [ROOT_SEGMENT, moduleTitle]

package/templates/module-hybrid-cdn/README.md

@@ -1,9 +1,59 @@
-# HubSpot portal module (hybrid CDN)
+# Getting started
 
-Scaffolded by `wp init --template module-hybrid-cdn`.
+This project was scaffolded with **WoodsCLI** (`@woodsportal/hubspot-kit`).
+
+## Daily dev
 
 ```bash
-npm install
+yarn install
 wp doctor
 wp dev
 ```
+
+Open the local URL, then **Ctrl+Shift+Z** (Mac **⌃⇧Z**) to edit module fields. Click **Apply changes** to refresh the starter preview.
+
+## Routing (`wp init`)
+
+Default is **hash history** — same as `woodsportal-client-frontend` (`#/guide` URLs work in HubSpot CMS).
+
+| `wp init --router` | Behavior |
+|--------------------|----------|
+| `hash` (default) | `createHashHistory()` — production-safe in HubSpot embeds |
+| `browser` | Clean `/guide` URLs for local dev only |
+| `none` | Single-page starter, no TanStack Router |
+
+Recorded in `woodscli.json` → `scaffold.router`.
+
+## `src/` layout
+
+| Path | Purpose |
+|------|---------|
+| `main.tsx` | Dev entry — loads styles and `mountDevPreview()` |
+| `app.tsx` | `RouterProvider` shell (client-frontend pattern) |
+| `config/router.ts` | Hash vs browser history |
+| `portal/` | Dev vs production mount (`mount-dev-preview`, `mount-portal`) |
+| `routes/` | TanStack file routes — keep thin; import from `features/` |
+| `features/starter/` | Demo home + developer guide (replace with your app) |
+| `components/` | Shared layout and UI |
+| `integrations/` | Router and third-party wiring |
+| `hubspot/` | HubSpot types and dev fixtures |
+| `config/` | Route constants and app config |
+| `assets/css/` | Tailwind entry for local dev |
+
+Kit runtime expects `src/defaultData.ts` (re-exports `hubspot/default-data.ts`).
+
+## Docs (in the kit package)
+
+After `npm install`, see:
+
+- `node_modules/@woodsportal/hubspot-kit/docs/CLI-REFERENCE.md`
+- `node_modules/@woodsportal/hubspot-kit/docs/MODULES.md`
+- `node_modules/@woodsportal/hubspot-kit/docs/HUBSPOT-CLI-SETUP.md`
+
+## HubSpot upload
+
+```bash
+cp hubspot.config.yml.example hubspot.config.yml
+# add portal + personal access key
+wp upload
+```

package/templates/module-hybrid-cdn/package.json

@@ -9,11 +9,15 @@
     "deploy:prod": "wp deploy --tier prod"
   },
   "devDependencies": {
-    "@woodsportal/hubspot-kit": "^1.0.5",
+    "@woodsportal/hubspot-kit": "^1.0.11",
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/sortable": "^10.0.0",
+    "@dnd-kit/utilities": "^3.2.2",
     "@tailwindcss/vite": "^4.0.6",
+    "@tanstack/react-router": "^1.121.2",
     "@tanstack/router-plugin": "^1.121.2",
     "@vitejs/plugin-react": "^4.3.4",
-    "babel-plugin-react-compiler": "^1.0.0",
+    "babel-plugin-react-compiler": "^1.0.11",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "tailwindcss": "^4.0.6",

package/templates/module-hybrid-cdn/public/fields.json

@@ -1 +1,44 @@
-[{"name":"title","label":"Title","type":"text","default":"WoodsCLI module"}]
+[
+  {
+    "name": "title",
+    "label": "Portal title",
+    "type": "text",
+    "tab": "CONTENT",
+    "default": "My HubSpot Portal"
+  },
+  {
+    "name": "tagline",
+    "label": "Tagline",
+    "type": "text",
+    "tab": "CONTENT",
+    "help_text": "Subtitle shown under the hero title in the local dev preview.",
+    "default": "Customize this preview with Ctrl+Shift+Z, then replace StarterPage with your portal app."
+  },
+  {
+    "name": "show_feature_cards",
+    "label": "Show feature cards",
+    "type": "boolean",
+    "display": "toggle",
+    "tab": "CONTENT",
+    "default": true
+  },
+  {
+    "name": "accent_color",
+    "label": "Accent color",
+    "type": "color",
+    "tab": "STYLE",
+    "default": { "color": "#0091ae", "opacity": 100 }
+  },
+  {
+    "name": "hero_style",
+    "label": "Hero style",
+    "type": "choice",
+    "tab": "STYLE",
+    "choices": [
+      ["gradient", "Gradient"],
+      ["minimal", "Minimal"],
+      ["bold", "Bold"]
+    ],
+    "default": "gradient"
+  }
+]

package/templates/module-hybrid-cdn/src/app.tsx

@@ -0,0 +1,8 @@
+import { RouterProvider } from '@tanstack/react-router'
+
+import { router } from '@/integrations/tanstack-router/router'
+
+/** Root app shell — same pattern as woodsportal-client-frontend `App`. */
+export function App() {
+  return <RouterProvider router={router} />
+}

package/templates/module-hybrid-cdn/src/assets/css/main.dev.css

@@ -1,3 +1,8 @@
 @import 'tailwindcss';
 
-@source '../../.wphs/**/*.{js,jsx,ts,tsx}';
+/* Kit dev-module-config — paths relative to this file (src/assets/css/) */
+@source '../../../.wphs/.kit-module-config/**/*.{ts,tsx}';
+@source '../../../.wphs/.kit-bootstrap.tsx';
+@source '../../../.wphs/.kit-bootstrap-greenfield.tsx';
+@source '../../../src/**/*.{ts,tsx}';
+@source '../../../node_modules/@woodsportal/hubspot-kit/src/dev-module-config/**/*.{ts,tsx}';

package/templates/module-hybrid-cdn/src/cdn/app-entry.ts

@@ -0,0 +1,32 @@
+/**
+ * CDN application chunk — mounts after vendor.js (HubSpot require_js order).
+ */
+import { mountPortal } from '@/portal/mount-portal'
+
+declare const __PORTAL_BUILD_ID__: string | undefined
+
+declare global {
+  interface Window {
+    WoodsPortal?: {
+      mount: typeof mountPortal
+      version: string
+    }
+  }
+}
+
+const buildId =
+  typeof __PORTAL_BUILD_ID__ !== 'undefined' ? String(__PORTAL_BUILD_ID__) : 'dev'
+
+window.WoodsPortal = {
+  mount: mountPortal,
+  version: buildId,
+}
+
+async function autoMount() {
+  if (!document.getElementById('app')) {
+    return
+  }
+  await mountPortal()
+}
+
+void autoMount()

package/templates/module-hybrid-cdn/src/cdn/vendor-entry.ts

@@ -0,0 +1,28 @@
+/**
+ * CDN vendor chunk — React + ReactDOM on `window` for the app IIFE externals.
+ */
+import React from 'react'
+import * as ReactDOM from 'react-dom'
+import * as ReactDOMClient from 'react-dom/client'
+import * as jsxRuntime from 'react/jsx-runtime'
+import * as jsxDevRuntime from 'react/jsx-dev-runtime'
+
+declare global {
+  interface Window {
+    WoodsPortalVendor?: {
+      React: typeof React
+      ReactDOM: typeof ReactDOM
+      ReactDOMClient: typeof ReactDOMClient
+      jsxRuntime: typeof jsxRuntime
+      jsxDevRuntime: typeof jsxDevRuntime
+    }
+  }
+}
+
+window.WoodsPortalVendor = {
+  React,
+  ReactDOM,
+  ReactDOMClient,
+  jsxRuntime,
+  jsxDevRuntime,
+}

package/templates/module-hybrid-cdn/src/components/layout/section-card.tsx

@@ -0,0 +1,20 @@
+import type { ReactNode } from 'react'
+
+export function SectionCard({
+  title,
+  children,
+  className = '',
+}: {
+  title: string
+  children: ReactNode
+  className?: string
+}) {
+  return (
+    <section
+      className={`rounded-lg border border-[#cbd6e2] bg-white p-6 shadow-sm ${className}`}
+    >
+      <h2 className="text-base font-semibold text-[#33475b]">{title}</h2>
+      <div className="mt-4">{children}</div>
+    </section>
+  )
+}

package/templates/module-hybrid-cdn/src/components/layout/starter-nav.tsx

@@ -0,0 +1,28 @@
+import { Link } from '@tanstack/react-router'
+
+import { ROUTES } from '@/config/routes'
+
+export function StarterNav() {
+  return (
+    <header className="border-b border-[#cbd6e2] bg-white/90 backdrop-blur">
+      <div className="mx-auto flex max-w-4xl items-center justify-between gap-4 px-6 py-3 sm:px-10">
+        <span className="text-sm font-semibold text-[#0091ae]">WoodsCLI starter</span>
+        <nav className="flex gap-4 text-sm font-medium">
+          <Link
+            to={ROUTES.home}
+            className="text-[#516f90] hover:text-[#0091ae] [&.active]:text-[#0091ae]"
+            activeOptions={{ exact: true }}
+          >
+            Home
+          </Link>
+          <Link
+            to={ROUTES.guide}
+            className="text-[#516f90] hover:text-[#0091ae] [&.active]:text-[#0091ae]"
+          >
+            Developer guide
+          </Link>
+        </nav>
+      </div>
+    </header>
+  )
+}

package/templates/module-hybrid-cdn/src/components/layout/starter-shell.tsx

@@ -0,0 +1,18 @@
+import type { ReactNode } from 'react'
+
+import { StarterNav } from './starter-nav'
+
+export function StarterShell({
+  children,
+  showNav = true,
+}: {
+  children: ReactNode
+  showNav?: boolean
+}) {
+  return (
+    <div className="min-h-screen bg-[#eaf0f6] text-[#33475b]">
+      {showNav ? <StarterNav /> : null}
+      {children}
+    </div>
+  )
+}

package/templates/module-hybrid-cdn/src/config/router.ts

@@ -0,0 +1,4 @@
+/** Router history — set by `wp init`. Hash matches woodsportal-client-frontend (HubSpot CMS embeds). */
+export type RouterHistoryMode = 'hash' | 'browser'
+
+export const ROUTER_HISTORY: RouterHistoryMode = 'hash'

package/templates/module-hybrid-cdn/src/config/routes.ts

@@ -0,0 +1,5 @@
+/** Route paths — keep in sync with `src/routes/` file routes. */
+export const ROUTES = {
+  home: '/',
+  guide: '/guide',
+} as const

package/templates/module-hybrid-cdn/src/defaultData.ts

@@ -1,7 +1,2 @@
-/** Local dev fixtures for module-config runtime (greenfield wp init). */
-export const defaultData = {
-  dataSourceSet: [],
-  hubId: 'dev',
-  userData: {},
-  objectList: [] as unknown[],
-}
+/** Kit runtime imports `@/defaultData` — re-export from the hubspot slice. */
+export { devDefaultData as defaultData } from './hubspot/default-data'