#!/usr/bin/env node
/**
 * bundle-components.mjs — 重建 design/_ds_bundle.js（原型页组件运行时）
 *
 * ui_kits 预览页经 <script src="../../_ds_bundle.js"> 消费组件；该文件原为
 * Claude 设计导出产物、仓库内无法再生，组件源码一改即过期。本脚本用
 * desktop 现成的 esbuild（不新增依赖）从 design/components/ 重新打包：
 *   - JSX → React.createElement（运行时用页面全局 React，unpkg UMD）
 *   - import 'react' → 全局 React shim（组件源码保持 ESM 规范，vite 侧不受影响）
 *   - 导出统一挂到 window.DuduDesignSystem_2e0172（与原命名空间一致）
 *
 * 用法：node design-pipeline/bundle-components.mjs
 * 组件源码（components/ icons.js）变更后须重跑并提交产物。
 */

import { readFileSync, readdirSync, statSync, writeFileSync } from 'node:fs';
import { resolve, dirname, join, relative } from 'node:path';
import { fileURLToPath } from 'node:url';
import { createRequire } from 'node:module';

const __dir = dirname(fileURLToPath(import.meta.url));
const DESIGN = resolve(__dir, '../design');
const require = createRequire(resolve(__dir, '../desktop/package.json'));
const esbuild = require('esbuild');

// 收集全部组件导出（export function/const 大写开头）
function walk(dir, out = []) {
  for (const name of readdirSync(dir)) {
    const p = join(dir, name);
    if (statSync(p).isDirectory()) walk(p, out);
    else if (name.endsWith('.jsx')) out.push(p);
  }
  return out;
}

const imports = [];
const names = [];
for (const f of walk(join(DESIGN, 'components'))) {
  const src = readFileSync(f, 'utf8');
  const exported = [...src.matchAll(/export\s+(?:function|const)\s+([A-Z]\w+)/g)].map((m) => m[1]);
  if (!exported.length) continue;
  imports.push(`import { ${exported.join(', ')} } from './${relative(DESIGN, f)}';`);
  names.push(...exported);
}

const entry = `${imports.join('\n')}
const ns = (globalThis.DuduDesignSystem_2e0172 = globalThis.DuduDesignSystem_2e0172 || {});
Object.assign(ns, { ${names.join(', ')} });
`;

// import 'react' → 页面全局 React（unpkg UMD）
const reactShim = {
  name: 'react-global-shim',
  setup(build) {
    build.onResolve({ filter: /^react$/ }, () => ({ path: 'react', namespace: 'react-shim' }));
    build.onLoad({ filter: /.*/, namespace: 'react-shim' }, () => ({
      contents: `const R = globalThis.React;
export default R;
export const useState = R.useState, useEffect = R.useEffect, useRef = R.useRef,
  useMemo = R.useMemo, useCallback = R.useCallback, useContext = R.useContext,
  createElement = R.createElement, Fragment = R.Fragment;`,
      loader: 'js',
    }));
  },
};

const result = await esbuild.build({
  stdin: { contents: entry, resolveDir: DESIGN, loader: 'js', sourcefile: '_ds_entry.js' },
  bundle: true,
  format: 'iife',
  jsx: 'transform',
  jsxFactory: 'React.createElement',
  jsxFragment: 'React.Fragment',
  plugins: [reactShim],
  write: false,
  banner: {
    js: `/* 自动生成 — 请勿手改。来源 design/components/ + icons.js
   重新生成：node design-pipeline/bundle-components.mjs
   运行时依赖：页面全局 React（ui_kits 页先加载 unpkg UMD React）。
   导出命名空间：window.DuduDesignSystem_2e0172（组件 ${names.length} 个）*/`,
  },
});

writeFileSync(join(DESIGN, '_ds_bundle.js'), result.outputFiles[0].text, 'utf8');
console.log(`✅ design/_ds_bundle.js（${names.length} 个组件：${names.join(', ')}）`);