fix: publish Node-compatible package entrypoints

packages/core/package.json

@@ -258,7 +258,7 @@
     "types": "./dist/index.d.ts"
   },
   "scripts": {
-    "build": "bun run build:hyperframes-runtime && tsc",
+    "build": "bun run build:hyperframes-runtime && tsc && tsx scripts/rewrite-esm-extensions.ts",
     "test": "vitest run",
     "test:watch": "vitest",
     "test:coverage": "vitest run --coverage",

packages/core/scripts/rewrite-esm-extensions.ts

@@ -0,0 +1,77 @@
+import { existsSync, readdirSync, readFileSync, statSync, writeFileSync } from "node:fs";
+import { dirname, extname, join, normalize, resolve } from "node:path";
+
+const distDir = resolve(import.meta.dirname, "../dist");
+const runtimeExtensions = new Set([".js", ".mjs", ".cjs", ".json", ".wasm", ".node"]);
+
+function listJavaScriptFiles(dir: string): string[] {
+  const files: string[] = [];
+  for (const entry of readdirSync(dir)) {
+    const fullPath = join(dir, entry);
+    const stat = statSync(fullPath);
+    if (stat.isDirectory()) {
+      files.push(...listJavaScriptFiles(fullPath));
+    } else if (entry.endsWith(".js")) {
+      files.push(fullPath);
+    }
+  }
+  return files;
+}
+
+function hasRuntimeExtension(specifier: string): boolean {
+  return runtimeExtensions.has(extname(specifier));
+}
+
+function isRelativeSpecifier(specifier: string): boolean {
+  return specifier.startsWith("./") || specifier.startsWith("../");
+}
+
+function resolveExistingJsSpecifier(fromFile: string, specifier: string): string | undefined {
+  const absolute = resolve(dirname(fromFile), specifier);
+  const jsFile = `${absolute}.js`;
+  const indexFile = join(absolute, "index.js");
+
+  if (existsSync(jsFile)) return `${specifier}.js`;
+  if (existsSync(indexFile)) return `${specifier}/index.js`;
+}
+
+function resolveRuntimeSpecifier(fromFile: string, specifier: string): string {
+  if (!isRelativeSpecifier(specifier)) return specifier;
+  if (hasRuntimeExtension(specifier)) return specifier;
+
+  return resolveExistingJsSpecifier(fromFile, specifier) ?? specifier;
+}
+
+function rewriteSpecifiers(filePath: string, source: string): string {
+  const patterns = [
+    /(from\s+["'])(\.\.?\/[^"']+)(["'])/g,
+    /(import\s+["'])(\.\.?\/[^"']+)(["'])/g,
+    /(import\(\s*["'])(\.\.?\/[^"']+)(["']\s*\))/g,
+  ];
+
+  return patterns.reduce(
+    (nextSource, pattern) =>
+      nextSource.replace(pattern, (_match, prefix: string, specifier: string, suffix: string) => {
+        return `${prefix}${resolveRuntimeSpecifier(filePath, specifier)}${suffix}`;
+      }),
+    source,
+  );
+}
+
+let changed = 0;
+for (const filePath of listJavaScriptFiles(distDir)) {
+  const source = readFileSync(filePath, "utf8");
+  const rewritten = rewriteSpecifiers(filePath, source);
+  if (rewritten !== source) {
+    writeFileSync(filePath, rewritten);
+    changed += 1;
+  }
+}
+
+console.log(
+  JSON.stringify({
+    event: "core_esm_extensions_rewritten",
+    distDir: normalize(distDir),
+    changedFiles: changed,
+  }),
+);

packages/engine/package.json

@@ -7,6 +7,10 @@
     "url": "https://github.com/heygen-com/hyperframes",
     "directory": "packages/engine"
   },
+  "files": [
+    "dist",
+    "README.md"
+  ],
   "type": "module",
   "main": "./src/index.ts",
   "types": "./src/index.ts",
@@ -15,6 +19,26 @@
     "./alpha-blit": "./src/utils/alphaBlit.ts",
     "./shader-transitions": "./src/utils/shaderTransitions.ts"
   },
+  "publishConfig": {
+    "access": "public",
+    "exports": {
+      ".": {
+        "import": "./dist/index.js",
+        "types": "./dist/index.d.ts"
+      },
+      "./alpha-blit": {
+        "import": "./dist/utils/alphaBlit.js",
+        "types": "./dist/utils/alphaBlit.d.ts"
+      },
+      "./shader-transitions": {
+        "import": "./dist/utils/shaderTransitions.js",
+        "types": "./dist/utils/shaderTransitions.d.ts"
+      },
+      "./package.json": "./package.json"
+    },
+    "main": "./dist/index.js",
+    "types": "./dist/index.d.ts"
+  },
   "scripts": {
     "build": "tsc",
     "test": "vitest run",

packages/studio/package.json

@@ -19,9 +19,25 @@
     "./tailwind-preset": "./src/styles/tailwind-preset.ts",
     "./package.json": "./package.json"
   },
+  "publishConfig": {
+    "access": "public",
+    "exports": {
+      ".": {
+        "import": "./dist/index.js",
+        "types": "./dist/index.d.ts"
+      },
+      "./tailwind-preset": {
+        "import": "./dist/styles/tailwind-preset.js",
+        "types": "./dist/styles/tailwind-preset.d.ts"
+      },
+      "./package.json": "./package.json"
+    },
+    "main": "./dist/index.js",
+    "types": "./dist/index.d.ts"
+  },
   "scripts": {
     "dev": "vite",
-    "build": "vite build",
+    "build": "vite build && tsup",
     "typecheck": "tsc --noEmit",
     "test": "vitest run",
     "test:watch": "vitest"
@@ -56,6 +72,7 @@
     "postcss": "^8.4.0",
     "puppeteer-core": "^24.40.0",
     "tailwindcss": "^3.4.0",
+    "tsup": "^8.0.0",
     "typescript": "^5.0.0",
     "vite": "^6.4.2",
     "vitest": "^3.2.4",

packages/studio/src/styles/tailwind-preset.shared.js

@@ -0,0 +1,34 @@
+const studioPreset = {
+  theme: {
+    extend: {
+      colors: {
+        studio: {
+          bg: "#0a0a0a",
+          surface: "#141414",
+          border: "#262626",
+          text: "#e5e5e5",
+          muted: "#737373",
+          accent: "#3CE6AC",
+        },
+        panel: {
+          bg: "#0C0C0E",
+          input: "#161618",
+          surface: "#18181B",
+          hover: "#27272A",
+          border: "#1E1E1E",
+          "border-input": "#27272A",
+          "text-1": "#E4E4E7",
+          "text-2": "#A1A1AA",
+          "text-3": "#71717A",
+          "text-4": "#52525B",
+          "text-5": "#3F3F46",
+          accent: "#3CE6AC",
+          danger: "#EF4444",
+        },
+      },
+    },
+  },
+  plugins: [],
+};
+
+export default studioPreset;

packages/studio/src/styles/tailwind-preset.ts

@@ -0,0 +1,3 @@
+import studioPreset from "./tailwind-preset.shared.js";
+
+export default studioPreset;

packages/studio/tailwind.config.js

@@ -1,39 +1,11 @@
 import { resolve, dirname } from "path";
 import { fileURLToPath } from "url";
+import studioPreset from "./src/styles/tailwind-preset.shared.js";
 
 const __dirname = dirname(fileURLToPath(import.meta.url));
 
 /** @type {import('tailwindcss').Config} */
 export default {
   content: [resolve(__dirname, "./src/**/*.{ts,tsx}"), resolve(__dirname, "./index.html")],
-  theme: {
-    extend: {
-      colors: {
-        studio: {
-          bg: "#0a0a0a",
-          surface: "#141414",
-          border: "#262626",
-          text: "#e5e5e5",
-          muted: "#737373",
-          accent: "#3CE6AC",
-        },
-        panel: {
-          bg: "#0C0C0E",
-          input: "#161618",
-          surface: "#18181B",
-          hover: "#27272A",
-          border: "#1E1E1E",
-          "border-input": "#27272A",
-          "text-1": "#E4E4E7",
-          "text-2": "#A1A1AA",
-          "text-3": "#71717A",
-          "text-4": "#52525B",
-          "text-5": "#3F3F46",
-          accent: "#3CE6AC",
-          danger: "#EF4444",
-        },
-      },
-    },
-  },
-  plugins: [],
+  ...studioPreset,
 };

packages/studio/tsconfig.lib.json

@@ -0,0 +1,10 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "incremental": false,
+    "noEmit": false,
+    "paths": {},
+    "rootDir": "src"
+  },
+  "exclude": ["dist", "node_modules", "src/**/*.test.ts", "src/test-setup.ts"]
+}

packages/studio/tsup.config.ts

@@ -0,0 +1,39 @@
+import { defineConfig } from "tsup";
+
+export default defineConfig({
+  tsconfig: "tsconfig.lib.json",
+  entry: {
+    index: "src/index.ts",
+    "styles/tailwind-preset": "src/styles/tailwind-preset.ts",
+  },
+  format: ["esm"],
+  dts: true,
+  sourcemap: true,
+  clean: false,
+  splitting: true,
+  external: [
+    "@codemirror/autocomplete",
+    "@codemirror/commands",
+    "@codemirror/lang-css",
+    "@codemirror/lang-html",
+    "@codemirror/lang-javascript",
+    "@codemirror/lang-markdown",
+    "@codemirror/language",
+    "@codemirror/search",
+    "@codemirror/state",
+    "@codemirror/theme-one-dark",
+    "@codemirror/view",
+    "@hyperframes/core",
+    "@hyperframes/player",
+    "@hyperframes/sdk",
+    "@phosphor-icons/react",
+    "bpm-detective",
+    "dompurify",
+    "marked",
+    "mediabunny",
+    "react",
+    "react-dom",
+    "react/jsx-runtime",
+    "zustand",
+  ],
+});