ember.nvp 0.7.0 → 1.1.0

package/packages/rolldown/src/app-reexports.ts

@@ -0,0 +1,152 @@
+import { mkdirSync, readFileSync, writeFileSync } from "node:fs";
+import { dirname, extname, join, matchesGlob, relative, resolve, sep } from "node:path";
+
+import type { Plugin } from "rolldown";
+
+export interface AppReexportsOptions {
+  /**
+   * Globs, matched against each built filename (relative to the output
+   * directory), selecting which modules get an app re-export.
+   *
+   * Defaults to `["services/*"]` -- top-level services only. Under strict
+   * mode, components and helpers are imported, but services are still
+   * injected by name, so they are the one thing an app must always be able
+   * to resolve.
+   *
+   * `.d.ts` files never match.
+   */
+  include?: string[];
+
+  /**
+   * Globs removing files that `include` matched.
+   */
+  exclude?: string[];
+
+  /**
+   * Rename a re-export: receives the built filename, returns the filename the
+   * app sees. Defaults to the built filename unchanged.
+   */
+  mapFilename?: (filename: string) => string;
+
+  /**
+   * Which bindings a file's re-export module forwards: an array of names
+   * (default `["default"]`), or a raw export clause string such as `"*"`.
+   */
+  exports?: (filename: string) => string[] | string | undefined;
+}
+
+/**
+ * Merges built modules into the consuming app's namespace, so classic
+ * resolution (`{{a-component}}`, service/helper lookup by name) finds them --
+ * the same job as `@embroider/addon-dev`'s `appReexports` rollup plugin.
+ *
+ * For every built file matching `include` (minus `exclude` and `.d.ts`), it
+ * writes a tiny module under `<outDir>/_app_/` re-exporting from the
+ * library's own name, and records the full set in `package.json` under
+ * `ember-addon.app-js`.
+ *
+ * Unlike the embroider plugin, nothing is written unless its content actually
+ * differs from what is on disk: the `_app_/` modules are compared
+ * byte-for-byte, and `package.json` is only rewritten when the `app-js` map
+ * itself changed (so an equivalent map in different formatting is left
+ * alone). This keeps rebuilds from re-triggering file watchers.
+ *
+ * This is a separate import, because most libraries don't need it:
+ *
+ * ```js
+ * import { defineConfig } from "tsdown";
+ * import { ember } from "@nullvoxpopuli/ember-rolldown";
+ * import { appReexports } from "@nullvoxpopuli/ember-rolldown/app-reexports";
+ *
+ * export default defineConfig({
+ *   entry: ["./src/index.ts", "./src/services/session.ts"],
+ *   plugins: [ember(), appReexports()],
+ * });
+ * ```
+ *
+ * With no arguments, top-level services (`services/*`) are re-exported. A
+ * string argument is an include glob; an object gives full control:
+ *
+ * ```js
+ * appReexports();                          // services/*
+ * appReexports("components/**");           // one include glob
+ * appReexports({ include: ["services/*", "helpers/*"], exclude: [...] });
+ * ```
+ */
+export function appReexports(options: string | AppReexportsOptions = {}): Plugin {
+  const resolved = typeof options === "string" ? { include: [options] } : options;
+  const include = resolved.include ?? ["services/*"];
+
+  return {
+    name: "ember:app-reexports",
+
+    writeBundle(outputOptions, bundle) {
+      const manifest = readJsonSync("package.json");
+      const outDir = outputOptions.dir ?? dirname(outputOptions.file ?? "dist");
+      const appJs: Record<string, string> = {};
+
+      // Sorted so the app-js map (and therefore package.json) is stable
+      // across builds regardless of chunk emission order.
+      for (const builtFilename of Object.keys(bundle).sort()) {
+        if (!isIncluded(builtFilename, include, resolved.exclude)) continue;
+
+        const appFilename = resolved.mapFilename?.(builtFilename) ?? builtFilename;
+        const names = resolved.exports?.(builtFilename) || ["default"];
+        const clause = typeof names === "string" ? names : `{ ${names.join(", ")} }`;
+        const withoutExtension = builtFilename.slice(0, -extname(builtFilename).length);
+        const reexportPath = join(outDir, "_app_", appFilename);
+
+        appJs[`./${appFilename}`] = `./${toPosix(relative(process.cwd(), resolve(reexportPath)))}`;
+
+        writeFileIfChanged(
+          reexportPath,
+          `export ${clause} from "${manifest.name}/${withoutExtension}";\n`,
+        );
+      }
+
+      const existing = manifest["ember-addon"]?.["app-js"] ?? {};
+
+      if (!sameStringRecord(existing, appJs)) {
+        manifest["ember-addon"] = { ...manifest["ember-addon"], "app-js": appJs };
+        writeFileSync("package.json", JSON.stringify(manifest, null, 2) + "\n");
+      }
+    },
+  };
+}
+
+function readJsonSync(path: string) {
+  return JSON.parse(readFileSync(path, { encoding: "utf8" }));
+}
+
+function isIncluded(filename: string, include: string[], exclude?: string[]): boolean {
+  if (matchesGlob(filename, "**/*.d.ts")) return false;
+  if (!include.some((glob) => matchesGlob(filename, glob))) return false;
+  if (exclude?.some((glob) => matchesGlob(filename, glob))) return false;
+
+  return true;
+}
+
+function writeFileIfChanged(path: string, content: string) {
+  let existing: string | undefined;
+
+  try {
+    existing = readFileSync(path, { encoding: "utf8" });
+  } catch {
+    // Doesn't exist yet (or isn't readable) -- write it.
+  }
+
+  if (existing === content) return;
+
+  mkdirSync(dirname(path), { recursive: true });
+  writeFileSync(path, content);
+}
+
+function sameStringRecord(a: Record<string, string>, b: Record<string, string>): boolean {
+  const aKeys = Object.keys(a);
+
+  return aKeys.length === Object.keys(b).length && aKeys.every((key) => a[key] === b[key]);
+}
+
+function toPosix(path: string): string {
+  return path.split(sep).join("/");
+}

package/packages/rolldown/src/config.ts

@@ -0,0 +1,50 @@
+import type { TsdownPlugin, UserConfig } from "tsdown";
+
+/**
+ * Sensible defaults for an Ember v2 library, applied through plugin hooks so
+ * they travel with `ember()` — you get them whether you use this package's
+ * `defineConfig`, tsdown's, or a plain `tsdown.config.js` / `rolldown.config.js`.
+ *
+ * Every value is applied with `??=`, so anything you set explicitly wins.
+ *
+ * Under tsdown, the full set applies via the `tsdownConfig` hook (analogous to
+ * Vite's `config` hook):
+ *
+ * - `sourcemap` — emit sourcemaps alongside the output.
+ * - `clean` — wipe `dist/` between builds.
+ * - `dts` — emit `.d.ts` declarations (via isolated declarations).
+ * - `outExtensions` — `.js`/`.d.ts` rather than tsdown's default `.mjs`/`.d.mts`,
+ *   since exports maps conventionally point at `.js`/`.d.ts`.
+ * - `report` — off; the size report is noise for a library build.
+ * - `deps.neverBundle` — leave node builtins and the ember virtual packages to
+ *   the consuming app (`emberExternals()` handles the rest).
+ *
+ * A plain rolldown build has no notion of `clean`/`dts`/`outExtensions`/`report`
+ * (those are tsdown-level concepts), so only the options with rolldown
+ * equivalents are applied there, via rolldown's own `outputOptions` hook:
+ *
+ * - `output.sourcemap` — on (output option).
+ *
+ * Externals are handled by `emberExternals()` (a `resolveId` hook) in both cases.
+ */
+export function emberConfig(): TsdownPlugin {
+  return {
+    name: "ember:config",
+
+    tsdownConfig(config: UserConfig) {
+      config.sourcemap ??= true;
+      config.clean ??= true;
+      config.dts ??= { sourcemap: true };
+      config.outExtensions ??= () => ({ js: ".js", dts: ".d.ts" });
+      config.report ??= false;
+
+      config.deps ??= {};
+      config.deps.neverBundle ??= ["node:*", "@ember/*", "@glimmer/*"];
+    },
+
+    outputOptions(options) {
+      options.sourcemap ??= true;
+      return options;
+    },
+  };
+}

package/packages/rolldown/src/dts.test.ts

@@ -0,0 +1,166 @@
+import { mkdtemp, mkdir, readdir, readFile, writeFile } from "node:fs/promises";
+import { tmpdir } from "node:os";
+import path from "node:path";
+import { build } from "tsdown";
+import { afterEach, describe, expect, it } from "vitest";
+
+import { ember } from "../index.ts";
+
+/**
+ * Drives `ember()` through a real tsdown build (the dts pipeline included).
+ * `files` is a map of relative path -> source, written into a temp dir that
+ * becomes the cwd for the build (the externals and isolated-declarations
+ * plugins read package.json / tsconfig.json from cwd, like the tsdown CLI).
+ */
+async function buildFixture(files: Record<string, string>, entry: string[]): Promise<string> {
+  const dir = await mkdtemp(path.join(tmpdir(), "ember-rolldown-dts-"));
+
+  const withDefaults: Record<string, string> = {
+    "package.json": JSON.stringify({
+      name: "fixture",
+      version: "0.0.0",
+      type: "module",
+      exports: { "./*": { types: "./dist/*.d.ts", default: "./dist/*.js" } },
+    }),
+    "tsconfig.json": JSON.stringify({
+      compilerOptions: { isolatedDeclarations: true, declaration: true },
+    }),
+    ...files,
+  };
+
+  for (const [relative, source] of Object.entries(withDefaults)) {
+    const full = path.join(dir, relative);
+    await mkdir(path.dirname(full), { recursive: true });
+    await writeFile(full, source, "utf8");
+  }
+
+  const previousCwd = process.cwd();
+  process.chdir(dir);
+  restoreCwd = () => process.chdir(previousCwd);
+
+  await build({
+    entry,
+    config: false,
+    logLevel: "silent",
+    plugins: [ember()],
+  });
+
+  return dir;
+}
+
+let restoreCwd: (() => void) | undefined;
+
+afterEach(() => {
+  restoreCwd?.();
+  restoreCwd = undefined;
+});
+
+async function listFiles(dir: string): Promise<string[]> {
+  const out: string[] = [];
+  for (const entry of await readdir(dir, { withFileTypes: true, recursive: true })) {
+    if (entry.isFile()) {
+      out.push(path.relative(dir, path.join(entry.parentPath, entry.name)));
+    }
+  }
+  return out.sort();
+}
+
+describe("declarations (full ember() via tsdown)", () => {
+  it("emits .d.ts for an entry that type-imports from a non-entry .gts", async () => {
+    // Mirrors the luna-core shape: the component is in the runtime graph via
+    // the index entry, while a second entry (a service) only *type*-imports
+    // from it. The service's declaration then references the component's
+    // (virtual) .d.ts, which only exists in the bundler's module graph.
+    const dir = await buildFixture(
+      {
+        "src/index.ts": `export { default as Popup } from './popup.gts';`,
+        "src/service.ts": [
+          `import type { PopupBlock } from './popup.gts';`,
+          ``,
+          `export class TooltipService {`,
+          `  registerPopup(context: PopupBlock): void {`,
+          `    void context;`,
+          `  }`,
+          `}`,
+        ].join("\n"),
+        "src/popup.gts": [
+          `import Component from '@glimmer/component';`,
+          ``,
+          `export interface PopupBlock {`,
+          `  open: () => void;`,
+          `}`,
+          ``,
+          `export interface PopupSignature {`,
+          `  Element: HTMLDivElement;`,
+          `  Blocks: { default: [PopupBlock] };`,
+          `}`,
+          ``,
+          `export default class Popup extends Component<PopupSignature> {`,
+          `  <template>popup</template>`,
+          `}`,
+        ].join("\n"),
+      },
+      ["./src/index.ts", "./src/service.ts"],
+    );
+
+    const dist = await listFiles(path.join(dir, "dist"));
+
+    expect(dist).toContain("index.d.ts");
+    expect(dist).toContain("service.d.ts");
+
+    const serviceDts = await readFile(path.join(dir, "dist/service.d.ts"), "utf8");
+
+    // The PopupBlock type must be reachable: either inlined into the bundled
+    // declaration or imported via a specifier that exists in dist.
+    expect(serviceDts).toContain("PopupBlock");
+    expect(serviceDts).not.toContain(".gts");
+  });
+
+  it("bundles co-located CSS (via @tsdown/css) without breaking declarations", async () => {
+    // Ember components routinely import a co-located .css file. Without CSS
+    // handling the build dies on tsdown's css-guard — and because the failing
+    // component module never loads, every declaration that references it
+    // dangles (surfacing as misleading UNLOADABLE_DEPENDENCY errors on
+    // <component>.d.ts). @tsdown/css (this package's peer) makes both work.
+    const dir = await buildFixture(
+      {
+        "src/index.ts": `export { default as Popup } from './popup.gts';`,
+        "src/service.ts": [
+          `import type { PopupBlock } from './popup.gts';`,
+          ``,
+          `export function register(context: PopupBlock): void {`,
+          `  void context;`,
+          `}`,
+        ].join("\n"),
+        "src/popup.css": `.popup { color: red; }`,
+        "src/popup.gts": [
+          `import './popup.css';`,
+          `import Component from '@glimmer/component';`,
+          ``,
+          `export interface PopupBlock {`,
+          `  open: () => void;`,
+          `}`,
+          ``,
+          `export default class Popup extends Component {`,
+          `  <template>popup</template>`,
+          `}`,
+        ].join("\n"),
+      },
+      ["./src/index.ts", "./src/service.ts"],
+    );
+
+    const dist = await listFiles(path.join(dir, "dist"));
+
+    const cssFiles = dist.filter((file) => file.endsWith(".css"));
+    expect(cssFiles).toHaveLength(1);
+
+    const css = await readFile(path.join(dir, "dist", cssFiles[0]!), "utf8");
+    expect(css).toContain(".popup");
+
+    // The cascade regression: the css-importing component's declaration must
+    // still be generated and reachable from the service's declaration.
+    const serviceDts = await readFile(path.join(dir, "dist/service.d.ts"), "utf8");
+    expect(serviceDts).toContain("PopupBlock");
+    expect(serviceDts).not.toContain(".gts");
+  });
+});

package/packages/rolldown/src/transform.test.ts

@@ -0,0 +1,173 @@
+import { mkdtemp, mkdir, writeFile } from "node:fs/promises";
+import { tmpdir } from "node:os";
+import path from "node:path";
+import { rolldown } from "rolldown";
+import { describe, expect, it } from "vitest";
+
+import { emberTransform } from "./transform.ts";
+
+/**
+ * Drives the plugin through a real rolldown build. `files` is a map of
+ * relative path -> source; the build entry is `index.ts`. Every bare (package)
+ * specifier is marked external so the build only exercises the local
+ * `.gts`/`.gjs`/`.ts` handling and doesn't need real dependencies installed.
+ * Returns the concatenated code of every emitted chunk.
+ */
+async function bundle(files: Record<string, string>): Promise<string> {
+  const dir = await mkdtemp(path.join(tmpdir(), "ember-rolldown-build-"));
+
+  for (const [relative, source] of Object.entries(files)) {
+    const full = path.join(dir, relative);
+    await mkdir(path.dirname(full), { recursive: true });
+    await writeFile(full, source, "utf8");
+  }
+
+  const isLocal = (id: string) => id.startsWith(".") || id.startsWith("/") || path.isAbsolute(id);
+
+  const build = await rolldown({
+    input: path.join(dir, "index.ts"),
+    plugins: [emberTransform()],
+    external: (id) => !isLocal(id),
+    onwarn() {},
+  });
+
+  const { output } = await build.generate({ format: "es" });
+
+  const code = output
+    .filter((chunk): chunk is typeof chunk & { code: string } => "code" in chunk)
+    .map((chunk) => chunk.code)
+    .join("\n");
+
+  // rolldown's `//#region <path>` comments reference the random temp dir;
+  // collapse them to the bare filename so snapshots stay deterministic.
+  return code.replace(/(\/\/#region ).*\/([^/\n]+)$/gm, "$1$2");
+}
+
+describe("emberTransform (full plugin via rolldown)", () => {
+  it("compiles a .gts module's <template> and keeps bare imports external", async () => {
+    const code = await bundle({
+      "index.ts": `export { default as Foo } from './foo.gts';`,
+      "foo.gts": [
+        `import Component from '@glimmer/component';`,
+        `export default class Foo extends Component {`,
+        `  <template>Hello</template>`,
+        `}`,
+      ].join("\n"),
+    });
+
+    // <template> is gone, replaced by a content-tag `template(...)` call.
+    expect(code).not.toContain("<template>");
+    expect(code).toContain("template(");
+    // The bare import survived as an external dependency.
+    expect(code).toContain(`from "@glimmer/component"`);
+    // ...and it pulls in the template-compiler runtime import.
+    expect(code).toContain("@ember/template-compiler");
+
+    expect(code).toMatchInlineSnapshot(`
+      "import { template } from "@ember/template-compiler";
+      import Component from "@glimmer/component";
+      //#region foo.ts
+      var Foo = class extends Component {
+      	static {
+      		template(\`Hello\`, {
+      			component: this,
+      			eval() {
+      				return eval(arguments[0]);
+      			}
+      		});
+      	}
+      };
+      //#endregion
+      export { Foo };
+      "
+    `);
+  });
+
+  it("compiles .gjs alongside .gts and plain .ts in one graph", async () => {
+    const code = await bundle({
+      "index.ts": [
+        `export { default as Foo } from './foo.gts';`,
+        `export { greet } from './util.gjs';`,
+        `export { helper } from './plain.ts';`,
+      ].join("\n"),
+      "foo.gts": `<template>Foo</template>`,
+      "util.gjs": [
+        `export function greet() { return 'hi'; }`,
+        `<template>{{greet}}</template>`,
+      ].join("\n"),
+      "plain.ts": `export function helper() { return 1; }`,
+    });
+
+    expect(code).not.toContain("<template>");
+    expect(code).toContain("function greet()");
+    expect(code).toContain("function helper()");
+    expect(code).toContain("export {");
+
+    expect(code).toMatchInlineSnapshot(`
+      "import { template } from "@ember/template-compiler";
+      //#region foo.ts
+      var foo_default = template(\`Foo\`, { eval() {
+      	return eval(arguments[0]);
+      } });
+      //#endregion
+      //#region util.js
+      function greet() {
+      	return "hi";
+      }
+      var util_default = template(\`{{greet}}\`, { eval() {
+      	return eval(arguments[0]);
+      } });
+      //#endregion
+      //#region plain.ts
+      function helper() {
+      	return 1;
+      }
+      //#endregion
+      export { foo_default as Foo, greet, helper };
+      "
+    `);
+  });
+
+  it("resolves a .gts module that imports another .gts relatively", async () => {
+    const code = await bundle({
+      "index.ts": `export { default as Page } from './page.gts';`,
+      "page.gts": [
+        `import Widget from './widget.gts';`,
+        `export default class Page {`,
+        `  Widget = Widget;`,
+        `  <template><Widget /></template>`,
+        `}`,
+      ].join("\n"),
+      "widget.gts": `<template>widget</template>`,
+    });
+
+    // Both templates compiled, and the relative .gts import resolved (bundled).
+    expect(code).not.toContain("<template>");
+    expect(code).not.toContain(".gts");
+    expect(code).toContain("template(");
+
+    expect(code).toMatchInlineSnapshot(`
+      "import { template } from "@ember/template-compiler";
+      //#region widget.ts
+      var widget_default = template(\`widget\`, { eval() {
+      	return eval(arguments[0]);
+      } });
+      //#endregion
+      //#region page.ts
+      var Page = class {
+      	Widget = widget_default;
+      	static {
+      		template(\`<Widget />\`, {
+      			component: this,
+      			eval() {
+      				return eval(arguments[0]);
+      			}
+      		});
+      	}
+      };
+      //#endregion
+      export { Page };
+      "
+    `);
+  });
+});