import { defineConfig } from 'vite'

/**
 * The SDK is built as a set of ES modules and one global bundle.
 *
 * Two build shapes are produced because they serve different consumers:
 *
 *   - `runtime.js`, `react.js`, `global.js`, `embed.js`, `components.js` are ES
 *     modules with a
 *     stable, unhashed filename. A stable name matters because a consumer's
 *     import map has to name a specific URL, and a content hash in that URL would
 *     make the map wrong after every deploy.
 *   - The admin application and any hashed assets use the default hashed naming,
 *     because nothing references them by name.
 *
 * React is marked external so the module imports the bare specifier "react". The
 * host application resolves it through its own import map, which is what
 * guarantees there is exactly one React instance in the page: two copies would
 * each have their own hook dispatcher, and a hook called from one while another
 * renders would fail at run time in a way that is very hard to diagnose.
 */
export default defineConfig({
  plugins: [],
  build: {
    outDir: 'dist',
    emptyOutDir: true,
    target: 'es2022',
    sourcemap: true,
    minify: true,
    rollupOptions: {
      external: ['react', 'react-dom', 'react/jsx-runtime'],
      input: {
        runtime: 'src/runtime.js',
        react: 'src/react.js',
        global: 'src/global.js',
        embed: 'src/embed.js',
        components: 'src/components.js',
      },
      // Without this, a multi-entry library build treats each entry's exports as
      // unused by the other entries and tree-shakes the public API away, leaving
      // an empty module behind. 'strict' keeps every declared export.
      preserveEntrySignatures: 'strict',
      output: {
        // Stable, predictable names: see the comment above.
        entryFileNames: '[name].js',
        chunkFileNames: 'chunk-[name].js',
        assetFileNames: '[name][extname]',
      },
    },
  },
})