@woodsportal/hubspot-kit 1.0.4 → 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

@@ -0,0 +1,59 @@
+/**
+ * Greenfield / wp init dev shell — module-config overlay only (no full portal app).
+ * 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,
+  setModuleConfigAdapter,
+  syncHubSpotDataFromModuleState,
+} from '@/dev/module-config/runtime/module-config-bridge'
+import { initModuleConfigRuntime } from '@/dev/module-config/runtime/module-config-runtime'
+import {
+  ModuleConfigOverlay,
+  registerModuleConfigShortcutHint,
+} from '@/dev/module-config/ui/ModuleConfigOverlay'
+import wphsAdapter from '@wphs/adapter'
+
+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 {
+    setModuleConfigAdapter(wphsAdapter)
+    bindModuleConfigToHubSpotData()
+    const moduleState = await initModuleConfigRuntime()
+    syncHubSpotDataFromModuleState(moduleState)
+    registerModuleConfigShortcutHint()
+
+    if (!rootElement) {
+      throw new Error('Missing #app element — add index.html with <div id="app">')
+    }
+
+    createRoot(rootElement).render(
+      <div>
+        <ModuleConfigOverlay />
+        {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)
+    if (rootElement) {
+      rootElement.innerHTML = `<pre style="padding:1rem;font-family:system-ui;color:#b91c1c;white-space:pre-wrap">WoodsCLI dev failed to start:\n${message}</pre>`
+    }
+    console.error('[woodscli] mountGreenfieldDev failed', error)
+  }
+}

package/src/dev/bootstrap.tsx

@@ -0,0 +1,46 @@
+/**
+ * Kit-owned local dev bootstrap — module-config overlay + live export provider.
+ * Never imported in production CDN/HubSpot builds.
+ */
+import { createRoot } from 'react-dom/client'
+
+import { mountPortal, router } from '@/portal/mount-portal'
+import {
+  bindModuleConfigToHubSpotData,
+  setModuleConfigAdapter,
+  syncHubSpotDataFromModuleState,
+} from '@/dev/module-config/runtime/module-config-bridge'
+import { initModuleConfigRuntime } from '@/dev/module-config/runtime/module-config-runtime'
+import {
+  ModuleConfigOverlay,
+  registerModuleConfigShortcutHint,
+} from '@/dev/module-config/ui/ModuleConfigOverlay'
+import { useDevModuleConfigLiveRevision } from '@/dev/module-config/ui/use-dev-module-config-live-revision'
+import { DevHubSpotLiveProvider } from '@/integrations/dev-hubspot-live-provider'
+import { App } from '@/app'
+import wphsAdapter from '@wphs/adapter'
+
+export async function mountDevPortal(): Promise<void> {
+  setModuleConfigAdapter(wphsAdapter)
+  bindModuleConfigToHubSpotData()
+  const moduleState = await initModuleConfigRuntime()
+  syncHubSpotDataFromModuleState(moduleState)
+  registerModuleConfigShortcutHint()
+
+  await mountPortal({ includeGlobalStyles: true, skipAppRender: true })
+
+  const rootElement = document.getElementById('app')
+  if (!rootElement) return
+
+  function DevRoot() {
+    const revision = useDevModuleConfigLiveRevision()
+    return (
+      <DevHubSpotLiveProvider revision={revision}>
+        <ModuleConfigOverlay />
+        <App router={router} />
+      </DevHubSpotLiveProvider>
+    )
+  }
+
+  createRoot(rootElement).render(<DevRoot />)
+}