feat(superdoc/ui): dedicated UI-only entry + bundle audit (SD-2803) (#2999)

* feat(superdoc/ui): dedicated UI-only entry + bundle audit (SD-2803)

`superdoc/ui` re-exported from the editor package's root barrel, so
consumers pulled the entire editor app shell into their bundle even
when they only wanted the UI controller — measured at ~7.7 MB across
11 side-effect chunks, dominated by the 4.4 MB main `src-*.es.js`
barrel that carries SuperDoc.vue, the Vue editor app, and friends.

Add a dedicated `./ui` exports entry on `@superdoc/super-editor` that
points at `src/ui/index.ts` directly, plus a Vite alias so the
workspace dev/build resolves it before falling through to the root.
Reroute `packages/superdoc/src/{ui.js,ui.d.ts}` to consume the new
entry.

After: ~3.4 MB across 8 chunks. The 4.4 MB main barrel is gone. The
remaining cost comes from the toolbar handle's `twipsToLines` import
pulling in `super-converter` + `xml-js` + `jszip`; slimming that
chain is a separate refactor.

Add a regression guard to `audit-bundle.cjs` that fails the build if
`ui.es.js` ever side-effect-imports a chunk matching the main barrel
pattern again.

* fix(super-editor): emit dist/ui.es.js as runtime target for ./ui (PR #2999 review)

The new `./ui` exports entry had only `source` + `types`, which is
the established pattern for other workspace-only subpaths
(`./markdown`, `./blank-docx`, `./parts-runtime`,
`./document-api-adapters`). At runtime the published `superdoc/ui`
artifact never resolves through `@superdoc/super-editor/ui` — that
path is a build-time alias hop only — so the source+types-only entry
was sufficient for the actual consumer surface.

Add a real `import` target anyway. Costs nothing, removes ambiguity
for any direct consumer of `@superdoc/super-editor`, and matches the
shape of `./editor`, `./toolbar`, `./headless-toolbar/*`, etc. which
all carry a runtime artifact.

Author: caio-pizzol

packages/super-editor/package.json

@@ -29,6 +29,11 @@
       "source": "./src/editors/v1/core/helpers/markdown/index.ts",
       "types": "./dist/src/editors/v1/core/helpers/markdown/index.d.ts"
     },
+    "./ui": {
+      "source": "./src/ui/index.ts",
+      "types": "./dist/src/ui/index.d.ts",
+      "import": "./dist/ui.es.js"
+    },
     "./parts-runtime": {
       "source": "./src/editors/v1/core/parts/init-parts-runtime.ts",
       "types": "./dist/src/editors/v1/core/parts/init-parts-runtime.d.ts"

packages/super-editor/vite.config.js

@@ -121,6 +121,7 @@ export default defineConfig(({ mode }) => {
           'headless-toolbar-react': 'src/headless-toolbar/react.ts',
           'headless-toolbar-vue': 'src/headless-toolbar/vue.ts',
           'super-editor': 'src/index.ts',
+          'ui': 'src/ui/index.ts',
           'types': 'src/types.ts',
           'editor': '@core/Editor',
           'converter': '@core/super-converter/SuperConverter',

packages/superdoc/scripts/audit-bundle.cjs

@@ -117,3 +117,39 @@ if (sizeFailed) {
   console.error('[audit-bundle] Size budget exceeded — investigate before merging.');
   process.exit(1);
 }
+
+// `superdoc/ui` is the browser-only UI controller. Importing it must not
+// drag in the editor's main barrel (which carries Vue components, SuperDoc
+// app shell, etc.). The signal is a side-effect import of the rolldown
+// chunk that holds the `superdoc` entry — historically `chunks/src-*.es.js`.
+//
+// SD-2803: the dedicated `@superdoc/super-editor/ui` entry removed this
+// dependency. Guard against regression by checking the emitted `ui.es.js`.
+const uiBundlePath = path.join(distRoot, 'ui.es.js');
+if (fs.existsSync(uiBundlePath)) {
+  const uiSource = fs.readFileSync(uiBundlePath, 'utf8');
+  const importRegex = /import\s+(?:[^"']*\s+from\s+)?["']([^"']+)["']/g;
+  const violations = [];
+  let match;
+  while ((match = importRegex.exec(uiSource)) !== null) {
+    const importPath = match[1];
+    // Forbidden chunks: the main superdoc app entry (Vue components,
+    // SuperDoc.vue), and any chunk whose source maps to the super-editor
+    // root barrel rather than its `src/ui` sub-tree.
+    if (/\/chunks\/(src|superdoc|super-editor|main|index)-[A-Za-z0-9_-]+\.es\.js$/.test(importPath)) {
+      violations.push(importPath);
+    }
+  }
+  if (violations.length > 0) {
+    console.error(
+      '[audit-bundle] ✗ ui.es.js side-effect-imports forbidden chunks (regression of SD-2803):',
+    );
+    for (const v of violations) console.error(`    ${v}`);
+    console.error(
+      '    The `superdoc/ui` sub-entry must route through `@superdoc/super-editor/ui`,',
+    );
+    console.error('    not the package root barrel. See packages/superdoc/src/ui.js.');
+    process.exit(1);
+  }
+  console.log('[audit-bundle] ✓ ui.es.js does not pull in the editor main barrel');
+}

packages/superdoc/src/ui.d.ts

@@ -25,4 +25,4 @@ export {
   type ViewportHandle,
   type ViewportRect,
   type ViewportRectResult,
-} from '@superdoc/super-editor';
+} from '@superdoc/super-editor/ui';

packages/superdoc/src/ui.js

@@ -1,14 +1,13 @@
 /**
  * Public sub-entry: `superdoc/ui`
  *
- * Re-exports the browser-only UI controller from
- * `@superdoc/super-editor`. A dedicated `@superdoc/super-editor/ui`
- * sub-export (with its own Vite build entry) would tighten bundle
- * + IDE-resolve hygiene for consumers; tracked as a follow-up. For
- * now consumers only pull the two named runtime exports below, so
- * tree-shaking already drops the rest at the consumer's bundler
- * step.
+ * Re-exports the browser-only UI controller from the dedicated
+ * `@superdoc/super-editor/ui` sub-export. This sub-export points at
+ * `packages/super-editor/src/ui/index.ts` directly, so consumers
+ * pull only the UI controller and its types — not the editor core,
+ * SuperConverter, jszip, xml-js, headless-toolbar, etc. that the
+ * package's main entry transitively imports.
  *
  * Source: `packages/super-editor/src/ui/`
  */
-export { createSuperDocUI, shallowEqual } from '@superdoc/super-editor';
+export { createSuperDocUI, shallowEqual } from '@superdoc/super-editor/ui';

packages/superdoc/vite.config.js

@@ -85,6 +85,7 @@ export const getAliases = (_isDev) => {
     { find: '@superdoc/super-editor/headless-toolbar/react', replacement: path.resolve(__dirname, '../super-editor/src/headless-toolbar/react.ts') },
     { find: '@superdoc/super-editor/headless-toolbar/vue', replacement: path.resolve(__dirname, '../super-editor/src/headless-toolbar/vue.ts') },
     { find: '@superdoc/super-editor/presentation-editor', replacement: path.resolve(__dirname, '../super-editor/src/index.ts') },
+    { find: '@superdoc/super-editor/ui', replacement: path.resolve(__dirname, '../super-editor/src/ui/index.ts') },
     { find: '@superdoc/super-editor', replacement: path.resolve(__dirname, '../super-editor/src/index.ts') },
 
     // Map @superdoc/<name> to ./src/<name> for internal paths