@woodsportal/hubspot-kit 1.0.2

package/scripts/tailwind/prefix-plugin.js

@@ -0,0 +1,291 @@
+import { parse } from '@babel/parser'
+import traverse from '@babel/traverse'
+import * as t from '@babel/types'
+import generate from '@babel/generator'
+import { prefix } from './prefix.env.js'
+
+const prefix1 = `${prefix}:`
+const prefix2 = `${prefix}\:`
+
+export default function TailwindPrefixPlugin() {
+  return {
+    name: 'vite-tailwind-prefix',
+    enforce: 'pre',
+    transform(code, id) {
+      // Handle CSS files: prefix custom class selectors safely
+      if (id.endsWith('.css')) {
+        // don't need to add prefix to override.style.css
+        if (id.endsWith('override.style.css')) return code;
+
+
+        const lines = code.split('\n')
+        let braceDepth = 0
+
+        const prefixedLines = lines.map((line) => {
+          // Count { and } to track depth
+          const openBraces = (line.match(/{/g) || []).length
+          const closeBraces = (line.match(/}/g) || []).length
+
+          let newLine = line
+          if (braceDepth === 0 && line.includes('{')) {
+            const braceIndex = line.indexOf('{')
+            const selector = line.slice(0, braceIndex)
+            const rest = line.slice(braceIndex)
+
+            const prefixedSelector = selector.replace(
+              /(\.)([a-zA-Z0-9_-]+)/g,
+              (match, dot, cls) => {
+                // ✅ Skip ProseMirror-related, EditorView-related classes
+                if (
+                  cls.startsWith('ProseMirror') ||
+                  cls.startsWith('EditorView') ||
+                  cls.startsWith('EmailView') ||
+                  cls.startsWith('CUSTOM') ||
+                  cls.startsWith(prefix1) ||
+                  cls.startsWith(prefix2)
+                ) {
+                  return match
+                }
+                return `${dot}${prefix2}${cls}`
+              },
+            )
+
+            newLine = prefixedSelector + rest
+          }
+
+          braceDepth += openBraces - closeBraces
+          return newLine
+        })
+
+        return { code: prefixedLines.join('\n'), map: null }
+      }
+
+
+      if (!id.endsWith('.tsx') && !id.endsWith('.ts')) return null
+
+      try {
+        const ast = parse(code, {
+          sourceType: 'module',
+          plugins: ['jsx', 'typescript'],
+        })
+
+        const addImportant = (c) => {
+          if (!c) return c
+          const parts = c.split(':')
+          const utility = parts.pop()
+          if (!utility || utility.startsWith('!')) {
+            return c
+          }
+          parts.push(`!${utility}`)
+          return parts.join(':')
+        }
+
+        const prefixClasses = (str) => {
+          return str
+            .split(/\s+/)
+            .filter(Boolean)
+            .map((c) => {
+              if (c.startsWith(prefix1) || c.startsWith('CUSTOM') || c.startsWith('ProseMirror') || c.startsWith('EmailView')) return c
+              return `${prefix1}${c}`
+            })
+            .map((c) => {
+              if (c.startsWith('CUSTOM') || c.startsWith('ProseMirror') || c.startsWith('EmailView')) return c
+              return addImportant(c)
+            })
+            .join(' ')
+        }
+
+        traverse.default(ast, {
+          // ✅ Handle variables whose name includes "DynamicClassName"
+
+          JSXAttribute(path) {
+            if (path.node.name.name !== 'className') return
+
+            const value = path.node.value
+
+            // String literal: className="..."
+            if (t.isStringLiteral(value)) {
+              path.node.value = t.stringLiteral(prefixClasses(value.value))
+            }
+            // Template literal: className={`...`}
+            else if (
+              t.isJSXExpressionContainer(value) &&
+              t.isTemplateLiteral(value.expression)
+            ) {
+              const quasis = value.expression.quasis.map((quasi, i) => {
+                let classes = prefixClasses(quasi.value.raw)
+
+                if (i < value.expression.expressions.length) classes += ' '
+                if (i > 0 && !classes.startsWith(' ')) classes = ' ' + classes
+
+                return t.templateElement({ raw: classes, cooked: classes })
+              })
+
+              // 🔥 also fix expressions inside ${ ... }
+              const expressions = value.expression.expressions.map((expr) => {
+                if (t.isStringLiteral(expr)) {
+                  return t.stringLiteral(prefixClasses(expr.value))
+                }
+                if (t.isLogicalExpression(expr)) {
+                  if (t.isStringLiteral(expr.right)) {
+                    return t.logicalExpression(
+                      expr.operator,
+                      expr.left,
+                      t.stringLiteral(prefixClasses(expr.right.value)),
+                    )
+                  }
+                }
+                if (t.isConditionalExpression(expr)) {
+                  const newConsequent = t.isStringLiteral(expr.consequent)
+                    ? t.stringLiteral(prefixClasses(expr.consequent.value))
+                    : expr.consequent
+                  const newAlternate = t.isStringLiteral(expr.alternate)
+                    ? t.stringLiteral(prefixClasses(expr.alternate.value))
+                    : expr.alternate
+                  return t.conditionalExpression(
+                    expr.test,
+                    newConsequent,
+                    newAlternate,
+                  )
+                }
+                return expr
+              })
+
+              path.node.value = t.jsxExpressionContainer(
+                t.templateLiteral(quasis, expressions),
+              )
+            }
+
+            // className={condition ? "..." : "..."}
+            else if (
+              t.isJSXExpressionContainer(value) &&
+              t.isConditionalExpression(value.expression)
+            ) {
+              const expr = value.expression
+              const newConsequent = t.isStringLiteral(expr.consequent)
+                ? t.stringLiteral(prefixClasses(expr.consequent.value))
+                : expr.consequent
+              const newAlternate = t.isStringLiteral(expr.alternate)
+                ? t.stringLiteral(prefixClasses(expr.alternate.value))
+                : expr.alternate
+
+              path.node.value = t.jsxExpressionContainer(
+                t.conditionalExpression(expr.test, newConsequent, newAlternate),
+              )
+            }
+
+            // Other expressions (e.g., clsx())
+            else if (
+              t.isJSXExpressionContainer(value) &&
+              t.isCallExpression(value.expression)
+            ) {
+              const args = value.expression.arguments.map((arg) => {
+                if (t.isStringLiteral(arg))
+                  return t.stringLiteral(prefixClasses(arg.value))
+                return arg
+              })
+              path.node.value = t.jsxExpressionContainer(
+                t.callExpression(value.expression.callee, args),
+              )
+            }
+          },
+          VariableDeclarator(path) {
+            const id = path.node.id
+            const init = path.node.init
+            if (!t.isIdentifier(id)) return
+
+            // 🔹 only affect DynamicClassName variables
+            if (!id.name.includes('DynamicClassName')) return
+            if (!init) return
+
+            const prefixString = (expr) =>
+              t.isStringLiteral(expr)
+                ? t.stringLiteral(prefixClasses(expr.value))
+                : expr
+
+            const prefixObject = (objExpr) => {
+              if (!t.isObjectExpression(objExpr)) return objExpr
+              objExpr.properties.forEach((prop) => {
+                if (t.isObjectProperty(prop)) {
+                  if (t.isStringLiteral(prop.value)) {
+                    prop.value = t.stringLiteral(
+                      prefixClasses(prop.value.value),
+                    )
+                  } else if (t.isTemplateLiteral(prop.value)) {
+                    const quasis = prop.value.quasis.map((quasi) => {
+                      const raw = prefixClasses(quasi.value.raw)
+                      return t.templateElement({ raw, cooked: raw })
+                    })
+                    prop.value = t.templateLiteral(
+                      quasis,
+                      prop.value.expressions,
+                    )
+                  } else if (t.isObjectExpression(prop.value)) {
+                    prop.value = prefixObject(prop.value) // recurse
+                  } else if (t.isConditionalExpression(prop.value)) {
+                    prop.value = t.conditionalExpression(
+                      prop.value.test,
+                      prefixString(prop.value.consequent),
+                      prefixString(prop.value.alternate),
+                    )
+                  } else if (t.isLogicalExpression(prop.value)) {
+                    const right = t.isStringLiteral(prop.value.right)
+                      ? t.stringLiteral(prefixClasses(prop.value.right.value))
+                      : prop.value.right
+                    prop.value = t.logicalExpression(
+                      prop.value.operator,
+                      prop.value.left,
+                      right,
+                    )
+                  }
+                }
+              })
+              return objExpr
+            }
+
+            if (t.isStringLiteral(init)) {
+              path.node.init = t.stringLiteral(prefixClasses(init.value))
+            } else if (t.isTemplateLiteral(init)) {
+              const quasis = init.quasis.map((quasi) => {
+                const raw = prefixClasses(quasi.value.raw)
+                return t.templateElement({ raw, cooked: raw })
+              })
+              path.node.init = t.templateLiteral(quasis, init.expressions)
+            } else if (t.isObjectExpression(init)) {
+              path.node.init = prefixObject(init)
+            } else if (t.isConditionalExpression(init)) {
+              path.node.init = t.conditionalExpression(
+                init.test,
+                prefixString(init.consequent),
+                prefixString(init.alternate),
+              )
+            } else if (t.isLogicalExpression(init)) {
+              const right = t.isStringLiteral(init.right)
+                ? t.stringLiteral(prefixClasses(init.right.value))
+                : init.right
+              path.node.init = t.logicalExpression(
+                init.operator,
+                init.left,
+                right,
+              )
+            }
+          },
+        })
+
+        const output = generate.default(ast, {}, code)
+        return { code: output.code, map: output.map }
+      } catch (err) {
+        console.error(`Error transforming file ${id}:`, err)
+        return null
+      }
+    },
+  }
+}
+
+// Handles:
+// ✅ className="..."
+// ✅ className={\`...\`}with${"foo"}inside
+// ✅className={cond ? "a" : "b"}
+// ✅className={cond && "foo"}
+// ✅className={clsx("foo", cond && "bar")}
+// ✅const fooDynamicClassName = "..." | {...} | cond ? ... : ...`

package/scripts/tailwind/prefix.env.js

@@ -0,0 +1,11 @@
+import { isPrefixBuildMode } from '../portal-env-mode.mjs'
+
+const forcePrefix = null // true, false, or null to auto-detect
+
+export const prefix = 'dw'
+
+const isPrefix = (env) => {
+  if (forcePrefix != null) return forcePrefix
+  return isPrefixBuildMode(env)
+}
+export default isPrefix

package/scripts/tailwind/tailwind-content-plugin.js

@@ -0,0 +1,27 @@
+import tailwindContent from './tailwind-content.js'
+
+export default function TailwindContentPlugin() {
+  return {
+    name: 'vite-tailwind-content',
+    apply: 'serve',
+
+    async buildStart() {
+      await tailwindContent()
+    },
+    async handleHotUpdate({ file }) {
+      // ❌ ignore changes inside .temp (to avoid infinite loop)
+      if (file.includes('.temp')) return
+
+      if (
+        /\.(tsx|jsx|css)$/.test(file) &&
+        (file.includes('/src/') ||
+          file.includes('/dev-module-config/') ||
+          file.includes('/.wphs/') ||
+          file.includes('/.kit-module-config/') ||
+          file.includes('/.dev/'))
+      ) {
+        await tailwindContent()
+      }
+    },
+  }
+}

package/scripts/tailwind/tailwind-content.js

@@ -0,0 +1,267 @@
+import fs from 'fs'
+import path from 'path'
+import { prefix } from './prefix.env.js'
+import { findProjectRoot, getKitRoot } from '../project-root.mjs'
+import { moduleConfigPaths } from '../module-config-dir.mjs'
+
+const prefix1 = `${prefix}:`
+
+const tempDir = path.resolve('./.temp')
+
+function resolveContentScanDirs() {
+  const dirs = [path.resolve('./src')]
+  try {
+    const projectRoot = findProjectRoot()
+    const { devDir } = moduleConfigPaths(projectRoot)
+    const kitModuleConfig = path.join(getKitRoot(), 'src/dev-module-config')
+    const shimModuleConfig = path.join(devDir, '.kit-module-config')
+
+    for (const dir of [kitModuleConfig, shimModuleConfig]) {
+      if (fs.existsSync(dir) && !dirs.includes(dir)) {
+        dirs.push(dir)
+      }
+    }
+  } catch {
+    // cwd may not be a woodsportal project (e.g. kit-only scripts)
+  }
+  return dirs
+}
+
+if (!fs.existsSync(tempDir)) fs.mkdirSync(tempDir, { recursive: true })
+
+function addPrefix(token) {
+  if (!token) return token
+  if (token.startsWith(prefix1)) return token
+  return `${prefix1}${token}`
+}
+
+function addImportant(token) {
+  if (!token) return token
+  const parts = token.split(':')
+  const utility = parts.pop()
+  if (!utility || utility.startsWith('!')) {
+    return token
+  }
+  parts.push(`!${utility}`)
+  return parts.join(':')
+}
+
+// function prefixStaticClasses(str) {
+//   // Prefix whitespace-separated class tokens (outside ${ ... })
+//   return str.split(/\s+/).filter(Boolean).map(addPrefix).join(' ')
+// }
+
+// ✅ Safe prefixing for static classes
+function prefixStaticClasses(str) {
+  return str
+    .split(/\s+/)
+    .filter(Boolean)
+    .map((token) => {
+      if (!token) return token
+      if (token.startsWith(prefix1)) return addImportant(token)
+
+      // ✅ Handle opening arbitrary value like "z-["
+      if (/^[a-z0-9-]+-\[$/i.test(token)) {
+        return addImportant(`${prefix1}${token}`)
+      }
+
+      // ✅ Leave closing bracket "]" untouched
+      if (token === ']') {
+        return token
+      }
+
+      // ✅ Handle complete arbitrary values like "z-[999]" or "top-[50%]"
+      // const match = token.match(/^([a-z0-9-]+(?:\/[a-z0-9-]+)?):?\[(.+)\]$/i)
+      // if (match) {
+      //   const [, key, val] = match
+      //   return `${prefix1}${key}-[${val}]`
+      // }
+
+      return addImportant(addPrefix(token))
+    })
+    .join(' ')
+}
+
+// Prefix static segments of a template literal body (leave ${...} untouched)
+function prefixTemplateLiteralBody(body) {
+  const parts = body.split(/(\$\{[^}]*\})/g)
+  return parts
+    .map((part) => {
+      if (part.startsWith('${')) return part
+      if (!part.trim()) return part
+      const leading = part.match(/^\s*/)?.[0] ?? ''
+      const trailing = part.match(/\s*$/)?.[0] ?? ''
+      const core = part.trim()
+      if (!core) return part
+      return leading + prefixStaticClasses(core) + trailing
+    })
+    .join('')
+}
+
+// Prefix class strings inside object literals, quoted strings, and template literals
+function prefixValueStrings(value) {
+  let result = value.replace(/"([^"]*)"/g, (_, cls) => `"${prefixStaticClasses(cls)}"`)
+  result = result.replace(/`([^`]*)`/g, (_, body) => `\`${prefixTemplateLiteralBody(body)}\``)
+  return result
+}
+
+// Prefix classes inside quoted strings ONLY, e.g. "...${cond ? 'lg:w-[...]' : 'lg:w-[...]'}..."
+function prefixQuotedStringsInExpression(expr) {
+  // Replace '..."' or '...' with prefixed contents
+  return expr.replace(/(['"])((?:\\.|(?!\1).)*)\1/g, (_, quote, inner) => {
+    return `${quote}${prefixStaticClasses(inner)}${quote}`
+  })
+}
+
+// Handle className
+function prefixClassesInCode(code) {
+  // 1) Plain string: className="..."
+  code = code.replace(/className\s*=\s*["']([^"']*)["']/g, (_, classStr) => {
+    return `className="${prefixStaticClasses(classStr)}"`
+  })
+
+  // code = code.replace(/className\s*=\s*["']([^"']*)["']/g, (_, classStr) => {
+  //   // 🛑 Skip prefixing if contains "ProseMirror"
+  //   if (/\bProseMirror\b/.test(classStr)) {
+  //     return `className="${classStr}"`
+  //   }
+  //   return `className="${prefixStaticClasses(classStr)}"`
+  // })
+
+  // 2) Template literal: className={`...`}
+  code = code.replace(/className\s*=\s*{\s*`([\s\S]*?)`\s*}/g, (_, tplBody) => {
+    const parts = tplBody.split(/(\$\{[\s\S]*?\})/g)
+
+    // const rebuilt = parts
+    //   .map((part) => {
+    //     if (part.startsWith('${')) {
+    //       return part.replace(
+    //         /^\$\{([\s\S]*?)\}$/,
+    //         (_m, inner) => '${' + prefixQuotedStringsInExpression(inner) + '}',
+    //       )
+    //     }
+    //     return prefixStaticClasses(part)
+    //   })
+    //   .join('')
+    
+
+      // return `className={\`${rebuilt}\`}`
+      const rebuilt = parts
+        .map((part, i) => {
+          if (part.startsWith('${')) {
+            // normalize: always prefix with one space
+            return ' ' + part.replace(
+              /^\$\{([\s\S]*?)\}$/,
+              (_m, inner) => '${' + prefixQuotedStringsInExpression(inner) + '}',
+            )
+          }
+          // static classes
+          return prefixStaticClasses(part).trim()
+        })
+        .join(' ')
+        .replace(/\s+/g, ' ') // collapse multiple spaces
+
+      return `className={\`${rebuilt.trim()}\`}`
+  })
+
+  // 3) Ternary expressions: className={cond ? "..." : "..."}
+  code = code.replace(
+    /className\s*=\s*{([^{};]+?\?[^:]+:[^}]+)}/g,
+    (match, inner) => {
+      const ternaryMatch = inner.match(
+        /^(.*?\?)\s*(['"][^'"]*['"])\s*:\s*(['"][^'"]*['"])\s*$/,
+      )
+      if (!ternaryMatch) return match
+
+      const [, condition, whenTrue, whenFalse] = ternaryMatch
+      const prefixedTrue = whenTrue.replace(
+        /(['"])(.*?)\1/,
+        (_, q, cls) => `${q}${prefixStaticClasses(cls)}${q}`,
+      )
+      const prefixedFalse = whenFalse.replace(
+        /(['"])(.*?)\1/,
+        (_, q, cls) => `${q}${prefixStaticClasses(cls)}${q}`,
+      )
+
+      return `className={${condition} ${prefixedTrue} : ${prefixedFalse}}`
+    },
+  )
+
+  // 4) Variables with "DynamicClassName" (supports TypeScript annotations like `: any`)
+  code = code.replace(
+    /(const|let|var)\s+([A-Za-z0-9_]*DynamicClassName[A-Za-z0-9_]*)\s*(?::\s*([^=]+))?\s*=\s*([\s\S]*?);/g,
+    (match, decl, varName, typeAnnotation, value) => {
+      const typeSuffix = typeAnnotation ? `: ${typeAnnotation.trim()}` : ''
+      const trimmed = value.trim()
+      if (/^\{[\s\S]*\}$/.test(trimmed)) {
+        return `${decl} ${varName}${typeSuffix} = ${prefixValueStrings(value)};`
+      }
+      if (/\?.*:/.test(trimmed)) {
+        return `${decl} ${varName}${typeSuffix} = ${prefixValueStrings(value)};`
+      }
+      if (/^["'`]/.test(trimmed)) {
+        if (trimmed.startsWith('`')) {
+          const body = trimmed.slice(1, -1)
+          return `${decl} ${varName}${typeSuffix} = \`${prefixTemplateLiteralBody(body)}\`;`
+        }
+        const cls = trimmed.slice(1, -1)
+        return `${decl} ${varName}${typeSuffix} = "${prefixStaticClasses(cls)}";`
+      }
+      return match
+    },
+  )
+
+  // 5) Handle classNames(...) or clsx(...)
+  code = code.replace(
+    /className\s*=\s*{?\s*(classNames|clsx)\(([\s\S]*?)\)}?/g,
+    (match, fnName, args) => {
+      const transformedArgs = args.replace(/(['"])(.*?)\1/g, (_, q, cls) => {
+        return `${q}${prefixStaticClasses(cls)}${q}`
+      })
+      return `className={${fnName}(${transformedArgs})}`
+    },
+  )
+
+  return code
+}
+
+// 🔥 helper: recursively collect all `.tsx` files under src
+function getAllTsxFiles(dir, fileList = []) {
+  const files = fs.readdirSync(dir)
+  for (const file of files) {
+    const fullPath = path.join(dir, file)
+    const stat = fs.statSync(fullPath)
+    if (stat.isDirectory()) {
+      getAllTsxFiles(fullPath, fileList)
+    } else if (file.endsWith('.tsx')) {
+      fileList.push(fullPath)
+    }
+  }
+  return fileList
+}
+
+// Pre-build static file for Tailwind
+export default async function tailwindContent() {
+  const srcFiles = resolveContentScanDirs().flatMap((dir) => getAllTsxFiles(dir))
+  let allPrefixedClasses = ''
+
+  for (const filePath of srcFiles) {
+    const code = fs.readFileSync(filePath, 'utf-8')
+    const transformed = prefixClassesInCode(code)
+    allPrefixedClasses += transformed + '\n'
+  }
+
+  const outputPath = path.resolve(tempDir, 'tailwind-classes.tsx')
+  fs.mkdirSync(path.dirname(outputPath), { recursive: true })
+  fs.writeFileSync(outputPath, allPrefixedClasses, 'utf-8')
+
+  // Return the file as Tailwind content
+  return [
+    {
+      raw: allPrefixedClasses,
+      extension: 'tsx',
+    },
+  ]
+}
+
+tailwindContent()

package/scripts/verify-cdn-api-endpoint.mjs

@@ -0,0 +1,68 @@
+#!/usr/bin/env node
+/**
+ * Fail if dist/cdn/app.*.js does not bake the API URL from .env.stg / .env.prod.
+ *
+ * Usage:
+ *   node scripts/verify-cdn-api-endpoint.mjs --stg
+ *   node scripts/verify-cdn-api-endpoint.mjs --prod
+ */
+import { existsSync, readFileSync, readdirSync } from 'node:fs'
+import { dirname, resolve } from 'node:path'
+import { fileURLToPath } from 'node:url'
+import { findProjectRoot } from './project-root.mjs'
+import { loadEnv } from 'vite'
+
+import { resolvePortalBuildId } from './resolve-portal-build-id.mjs'
+import { resolvePortalViteMode } from './portal-env-mode.mjs'
+
+const root = findProjectRoot()
+
+const stg = process.argv.includes('--stg') || process.argv.includes('--staging')
+const prod = process.argv.includes('--prod') || process.argv.includes('--production')
+
+if (stg === prod) {
+  console.error(
+    'Usage: node scripts/verify-cdn-api-endpoint.mjs --stg | --prod',
+  )
+  process.exit(1)
+}
+
+const mode = resolvePortalViteMode()
+const expected = loadEnv(mode, root, '').VITE_PUBLIC_REST_API_ENDPOINT?.replace(/\/$/, '')
+
+if (!expected) {
+  console.error(`[verify-cdn-api] Missing VITE_PUBLIC_REST_API_ENDPOINT in .env.${mode}`)
+  process.exit(1)
+}
+
+const cdnDir = resolve(root, 'dist/cdn')
+if (!existsSync(cdnDir)) {
+  console.error('[verify-cdn-api] dist/cdn missing — run yarn build:cdn:dev or yarn build:cdn:prod first')
+  process.exit(1)
+}
+
+const buildId = resolvePortalBuildId()
+const appFile = readdirSync(cdnDir).find((f) => f === `app.${buildId}.js`)
+
+if (!appFile) {
+  console.error(
+    `[verify-cdn-api] app.${buildId}.js not found in dist/cdn — rebuild with matching .portal-build-id`,
+  )
+  process.exit(1)
+}
+
+const source = readFileSync(resolve(cdnDir, appFile), 'utf8')
+const found = [...source.matchAll(/https:\/\/api(?:\.dev)?\.woodsportal\.com/g)].map((m) => m[0])
+const unique = [...new Set(found)]
+
+if (!unique.includes(expected)) {
+  console.error('[verify-cdn-api] API URL mismatch in dist/cdn — refusing to publish.')
+  console.error(`  expected (${mode}): ${expected}`)
+  console.error(`  found in ${appFile}: ${unique.join(', ') || '(none)'}`)
+  console.error('')
+  console.error('  Dev API on HubSpot:  yarn deploy:dev')
+  console.error('  Prod API on HubSpot: yarn deploy:prod')
+  process.exit(1)
+}
+
+console.log(`[verify-cdn-api] OK ${appFile} bakes ${expected} (${mode})`)