cursedbelt 4.3.0 → 4.5.0

package/src/demoFixture.spec.ts

@@ -4,15 +4,18 @@ import { resolve } from 'node:path';
 import {
 	DEMO_COMMAND,
 	DEMO_DEV_SCRIPT,
+	DEMO_DIST_DIR,
+	DEMO_HOST,
 	DEMO_PACKAGE_DIR,
 	DEMO_PORT,
 	DEMO_ROOT,
 	DEMO_SERVE_SCRIPT,
 	DEMO_URL,
-} from '../demo/devServer';
-import { DEMO_TSCONFIG, derivePaths, readDemoTsconfig, renderPathsBlock } from '../demo/generatePaths';
+} from '../demo/devServer.js';
+import { DEMO_TSCONFIG, derivePaths, readDemoTsconfig, renderPathsBlock } from '../demo/generatePaths.js';
 import pkg from '../package.json';
-import { STAGES } from '../scripts/verify';
+// The declared graph, read as data — there is no scheduler in this repo to import from.
+const STAGES: readonly { script: string }[] = (pkg as { gate?: { stages?: { script: string }[] } }).gate?.stages ?? [];
 
 /**
  * 🔴 The e2e suite must never be able to sit green while it drives nothing.
@@ -56,19 +59,38 @@ describe('the e2e fixture exists', () => {
 		}
 		expect(pkg.scripts.demo, 'the demo script must start vite on the demo config').toInclude('demo/vite.config.ts');
 		// Playwright drives the BUILT bundle, not the dev server — see demo/devServer.ts.
-		expect(pkg.scripts['demo:serve'], 'demo:serve must build before it previews').toInclude('demo:build');
-		expect(pkg.scripts['demo:serve']).toInclude('vite preview');
+		expect(pkg.scripts['demo:serve'], 'demo:serve must build before it serves').toInclude('demo:build');
+		// 🔴 And it serves it from OUR server, never `vite preview` — which under Bun 1.4.2
+		// exits 1 with ERR_STREAM_WRITE_AFTER_END when a Playwright worker hangs up
+		// mid-response, reddening this gate about one run in four (task 388, 2026-09-18).
+		// Going back to it is a one-word edit, so it is a one-line assertion.
+		expect(pkg.scripts['demo:serve'], 'demo:serve must run scripts/demoServer.ts').toInclude('scripts/demoServer.ts');
+		expect(pkg.scripts['demo:serve'], '`vite preview` dies on a client hang-up under Bun').not.toInclude(
+			'vite preview',
+		);
 	});
 
-	it('both servers serve the port the specs are pointed at', () => {
+	it('every server serves the port the specs are pointed at', () => {
 		// vite silently walks to the next free port unless `strictPort` is set, which is
 		// the same outage wearing a costume: a server that starts perfectly well and a
-		// suite that times out against the port nobody is listening on.
+		// suite that times out against the port nobody is listening on. `Bun.serve` throws
+		// EADDRINUSE rather than walking, and `demoStaticServer.spec.ts` proves it does.
 		const viteConfig = readFileSync(resolve(DEMO_ROOT, 'vite.config.ts'), 'utf8');
-		expect(DEMO_URL).toBe(`http://localhost:${DEMO_PORT}`);
-		// Once for `server` (dev), once for `preview` (what e2e drives).
-		expect(viteConfig.match(/port: DEMO_PORT/g) ?? [], 'both server and preview must pin the port').toHaveLength(2);
-		expect(viteConfig.match(/strictPort: true/g) ?? [], 'both must set strictPort').toHaveLength(2);
+		expect(DEMO_URL).toBe(`http://${DEMO_HOST}:${DEMO_PORT}`);
+		// 🔴 A literal address, never `localhost`. Measured 2026-09-18: two demo servers
+		// bound 4318 at the same time — one on `[::1]`, one on `127.0.0.1` — because
+		// `localhost` resolves to both and each process took whichever its resolver offered
+		// first. Neither bind collided, and which one a client reached was its own
+		// resolution order. A name here is a gate that can silently test a stale bundle.
+		expect(DEMO_HOST, 'the fixture must not be reached through a name that resolves twice').toBe('127.0.0.1');
+		expect(viteConfig, 'the dev server must bind the same one address').toInclude('host: DEMO_HOST');
+		// Once, for `server` — the dev server a human runs. There is no `preview` block any
+		// more, and a second match here would mean one grew back unread.
+		expect(viteConfig.match(/port: DEMO_PORT/g) ?? [], 'the dev server must pin the port').toHaveLength(1);
+		expect(viteConfig.match(/strictPort: true/g) ?? [], 'and must set strictPort').toHaveLength(1);
+		expect(viteConfig, 'the preview block is dead config now — e2e is served by scripts/demoServer.ts').not.toInclude(
+			'preview:',
+		);
 	});
 
 	it('every page the specs navigate to is a real demo entry point', () => {
@@ -98,13 +120,35 @@ describe('the e2e fixture exists', () => {
 		expect(unlisted, `demo/vite.config.ts's rollup input omits:\n  ${unlisted.join('\n  ')}`).toEqual([]);
 	});
 
+	it('🔴 never reuses a server somebody else started', () => {
+		// The gate's meaning must not depend on what the previous agent in this checkout
+		// left running. `reuseExistingServer: !process.env.CI` meant exactly that: `CI` is
+		// unset on this Mac, so a stale listener on 4318 was silently adopted and the demo
+		// build was skipped. Two agents measured the same command at 34.8s and 45.0s on
+		// 2026-09-18 for that reason — the fast one tested a bundle nobody had rebuilt.
+		const config = readFileSync(resolve(e2eDir, 'playwright.config.ts'), 'utf8');
+		expect(config, 'the webServer must always be ours').toInclude('reuseExistingServer: false');
+		expect(config, 'reuse must not be conditional on an env var this machine never sets').not.toMatch(
+			/reuseExistingServer:\s*!?\s*process\.env/,
+		);
+	});
+
+	it('serves exactly the directory the demo build writes', () => {
+		// `scripts/demoServer.ts` serves DEMO_DIST_DIR; vite writes to `outDir` resolved
+		// against its `root`. A custom `outDir` would leave the server pointed at an empty
+		// directory and every spec 404ing against a 200-answering process.
+		const viteConfig = readFileSync(resolve(DEMO_ROOT, 'vite.config.ts'), 'utf8');
+		expect(DEMO_DIST_DIR).toBe(resolve(DEMO_ROOT, 'dist'));
+		expect(viteConfig, 'demoServer.ts assumes vite’s default outDir').not.toInclude('outDir');
+	});
+
 	it('verify actually runs the suite', () => {
 		// Everything above proves the fixture resolves. Only this proves anybody looks:
 		// without it, `e2e` drops back out of the gate and this whole file becomes a
 		// comment about a suite nothing runs.
 		//
 		// 🔴 `verify` stopped being an `&&` chain on 2026-09-15 and became a dependency
-		// graph (`scripts/verify.ts`), so "the script mentions e2e" is no longer where the
+		// graph (the `gate` block in `package.json`), so "the script mentions e2e" is no longer where the
 		// answer lives. Asking the graph is strictly stronger than asking the string was:
 		// `verifyGraph.spec.ts` additionally pins that every OTHER stage of the old chain
 		// is still in it, which the `toInclude` never checked for any of them.

package/src/demoStaticServer.spec.ts

@@ -0,0 +1,169 @@
+/**
+ * 🔴 The demo's static server, and specifically the fault that used to end the gate.
+ *
+ * `bun run verify` went red about one run in four on an unmodified tree (task 388,
+ * 2026-09-18): `vite preview` — connect on Bun's `node:http` shim — threw
+ * `ERR_STREAM_WRITE_AFTER_END` out of `advanceResponsePipeline` when a Playwright worker
+ * hung up on a response that was still being written, and the throw landed after the
+ * handler had returned, where no middleware could catch it. The process exited 1, the
+ * `webServer` never came ready, and 138 innocent specs went red 120 seconds later.
+ *
+ * So the first assertion here is the one that matters: abort requests mid-flight and prove
+ * the server is still serving afterwards. Everything else in this file is the ordinary
+ * contract that makes the fixture pages reachable at all.
+ */
+import { describe, expect, it } from 'bun:test';
+import { mkdirSync, mkdtempSync, writeFileSync } from 'node:fs';
+import { tmpdir } from 'node:os';
+import { join, resolve } from 'node:path';
+import { DEMO_HOST, DEMO_URL } from '../demo/devServer.js';
+import { isPeerHangup, resolveRequestPath, startDemoServer } from '../scripts/demoServer.js';
+
+/**
+ * A throwaway `dist` shaped like the one `bun run demo:build` writes. `$TMPDIR` is already
+ * redirected into this repo's scratch root by `scripts/testTmpRoot.ts` in the preload.
+ */
+function fixtureRoot(): string {
+	const root = mkdtempSync(join(tmpdir(), 'demo-server-'));
+	mkdirSync(resolve(root, 'assets'), { recursive: true });
+	writeFileSync(resolve(root, 'index.html'), '<!doctype html><title>kitchen sink</title>');
+	writeFileSync(resolve(root, 'table-layout.html'), '<!doctype html><title>table layout</title>');
+	// Big enough that an abort lands mid-body rather than after the whole thing arrived.
+	writeFileSync(resolve(root, 'assets', 'app.js'), `export const pad = '${'x'.repeat(4_000_000)}';\n`);
+	writeFileSync(resolve(root, 'assets', 'app.css'), ':root { color-scheme: dark; }\n');
+	return root;
+}
+
+/** Runs `body` against a server on an ephemeral port, and always stops it. */
+async function withServer(body: (base: string) => Promise<void>): Promise<void> {
+	const server = startDemoServer({ root: fixtureRoot(), port: 0, hostname: '127.0.0.1' });
+	try {
+		await body(`http://127.0.0.1:${server.port}`);
+	} finally {
+		await server.stop(true);
+	}
+}
+
+describe('🔴 a client that hangs up is a non-event', () => {
+	it('keeps serving after a burst of aborted requests', async () => {
+		await withServer(async (base) => {
+			expect((await fetch(`${base}/`)).status, 'the server must be up before we abort at it').toBe(200);
+
+			// Eight, because that is how many Playwright workers this repo runs, and each one
+			// abandons in-flight subresources on every navigation.
+			for (let i = 0; i < 8; i++) {
+				const control = new AbortController();
+				const inFlight = fetch(`${base}/assets/app.js`, { signal: control.signal });
+				// Abort on the next turn of the loop: late enough that the response is being
+				// written, early enough that the body has not finished.
+				queueMicrotask(() => control.abort());
+				await inFlight.then(
+					async (response) => {
+						// If it won the race, drain it and abort during the read instead.
+						control.abort();
+						await response.text().catch(() => undefined);
+					},
+					() => undefined,
+				);
+			}
+
+			// The whole point. Under `vite preview` the process was gone by now.
+			const after = await fetch(`${base}/`);
+			expect(after.status, 'the server died on a client hang-up — the exact task-388 bug').toBe(200);
+			expect(await after.text()).toInclude('kitchen sink');
+		});
+	});
+
+	it('names the peer faults it tolerates, and nothing else', () => {
+		// 🔴 A blanket handler would keep a broken server alive and let the gate measure a
+		// corpse that answers 200. The list is closed; this is the negative control.
+		expect(isPeerHangup({ code: 'ERR_STREAM_WRITE_AFTER_END' })).toBe(true);
+		expect(isPeerHangup({ code: 'ECONNRESET' })).toBe(true);
+		expect(isPeerHangup({ code: 'EPIPE' })).toBe(true);
+		expect(isPeerHangup(Object.assign(new Error('aborted'), { name: 'AbortError' }))).toBe(true);
+		expect(isPeerHangup(new TypeError('x is not a function'))).toBe(false);
+		expect(isPeerHangup({ code: 'ENOSPC' })).toBe(false);
+		expect(isPeerHangup(null)).toBe(false);
+		expect(isPeerHangup('ECONNRESET')).toBe(false);
+	});
+});
+
+describe('the pages the specs navigate to', () => {
+	it('serves the fixture pages, with the right content type and no caching', async () => {
+		await withServer(async (base) => {
+			const index = await fetch(`${base}/`);
+			expect(index.status).toBe(200);
+			expect(index.headers.get('content-type')).toInclude('text/html');
+			// 🔴 A cached bundle is a gate reading pre-checkout code, which is the trap this
+			// whole change exists to close.
+			expect(index.headers.get('cache-control')).toInclude('no-store');
+
+			const page = await fetch(`${base}/table-layout.html`);
+			expect(page.status).toBe(200);
+			expect(await page.text()).toInclude('table layout');
+
+			const css = await fetch(`${base}/assets/app.css`);
+			expect(css.status).toBe(200);
+			expect(css.headers.get('content-type')).toInclude('text/css');
+		});
+	});
+
+	it('404s what it does not have, rather than answering with index.html', async () => {
+		// A SPA fallback here would make `demoFixture.spec.ts`'s "every page the specs
+		// navigate to is real" assertion unfalsifiable at runtime: a typo'd fixture URL
+		// would load the kitchen sink and fail on a missing selector instead.
+		await withServer(async (base) => {
+			expect((await fetch(`${base}/no-such-page.html`)).status).toBe(404);
+			expect((await fetch(`${base}/assets/`)).status, 'no directory listings').toBe(404);
+		});
+	});
+});
+
+describe('what it refuses to serve', () => {
+	const root = '/tmp/demo-dist';
+
+	it('resolves the shapes the fixture actually uses', () => {
+		expect(resolveRequestPath(root, '/../../etc/passwd')).toBeNull();
+		expect(resolveRequestPath(root, '/%2e%2e/%2e%2e/etc/passwd')).toBeNull();
+		expect(resolveRequestPath(root, '/%zz')).toBeNull();
+		expect(resolveRequestPath(root, '/nope.html')).toBeNull();
+	});
+
+	it('cannot be walked out of its root even through an encoded traversal', async () => {
+		// The pure check above says `null`; this says the socket agrees, because a server
+		// that resolved correctly and then read the file anyway would pass the first.
+		await withServer(async (base) => {
+			for (const path of ['/../package.json', '/%2e%2e/package.json', '/..%2fpackage.json']) {
+				const response = await fetch(`${base}${path}`);
+				expect(await response.text(), `${path} escaped the demo dist`).not.toInclude('cursedbelt');
+			}
+		});
+	});
+});
+
+describe('the port', () => {
+	it('🔴 binds one literal address, so a second server cannot hide beside it', async () => {
+		// Measured 2026-09-18: with `hostname: 'localhost'` two processes bound 4318 at once,
+		// one on `[::1]` and one on `127.0.0.1`, and NEITHER raised EADDRINUSE — `localhost`
+		// resolves to both, so they were never competing for the same socket. The gate would
+		// then test whichever one the client happened to reach.
+		const server = startDemoServer({ root: fixtureRoot(), port: 0 });
+		try {
+			expect(server.hostname, 'a resolvable NAME here is two sockets pretending to be one').toBe(DEMO_HOST);
+			expect(DEMO_URL).toInclude(DEMO_HOST);
+		} finally {
+			await server.stop(true);
+		}
+	});
+
+	it('🔴 refuses a taken port instead of walking to the next one', async () => {
+		// The same rule `strictPort: true` gave the vite servers: a fixture that quietly
+		// moves to 4319 is a suite that times out against the port it was pointed at.
+		const first = startDemoServer({ root: fixtureRoot(), port: 0, hostname: '127.0.0.1' });
+		try {
+			expect(() => startDemoServer({ root: fixtureRoot(), port: first.port, hostname: '127.0.0.1' })).toThrow();
+		} finally {
+			await first.stop(true);
+		}
+	});
+});

package/src/fixtureAppCss.spec.ts

@@ -36,7 +36,7 @@
  */
 import { describe, expect, it } from 'bun:test';
 import pkg from '../package.json';
-import { flatten, lostRules, referenced } from '../scripts/cssRules';
+import { flatten, lostRules, referenced } from '../scripts/cssRules.js';
 import {
 	BASELINE,
 	FIXTURE,
@@ -51,9 +51,9 @@ import {
 	requiredCss,
 	uncoveredModules,
 	unionRouteCss,
-} from '../scripts/fixtureAppCss';
-import { REPO_ROOT } from '../scripts/generateStaticStyles';
-import { CORE } from '../scripts/styleAreas';
+} from '../scripts/fixtureAppCss.js';
+import { REPO_ROOT } from '../scripts/generateStaticStyles.js';
+import { CORE } from '../scripts/styleAreas.js';
 
 const exportsMap = (pkg as { exports: Record<string, unknown> }).exports;
 const declared = await declaredAreas();

package/src/publicSurface.spec.ts

@@ -1,5 +1,5 @@
 import { describe, expect, it } from 'bun:test';
-import { run } from '../scripts/publicSurface';
+import { run } from '../scripts/publicSurface.js';
 
 /**
  * The public-surface ratchet, wired into `bun run verify` at its cheapest correct

package/src/publishShape.spec.ts

@@ -52,6 +52,31 @@ const typesThatAreNotDeclarations = (exports: Record<string, unknown>): string[]
 		.filter(([, target]) => !target.endsWith('.d.ts'))
 		.map(([subpath, target]) => `${subpath} → ${target}`);
 
+/**
+ * Every `[subpath, condition, target]` this manifest resolves OUTSIDE `dist/`.
+ *
+ * `./dist/` is deliberately excluded: those are `scripts/checkDistExports.ts`' job, and it
+ * has to be a build step because `dist/` is the one directory no spec here may open
+ * (`src/verifyGraph.spec.ts` asserts it, because `build` runs beside `test`). Everything
+ * else is a file that is already on disk when the tests run, so it belongs here.
+ *
+ * A string-valued export (`'./styles.css': './src/styles.css'`) is one target under the
+ * implicit `default` condition — 48 of this manifest's entries are that shape.
+ */
+const targetsOutsideDist = (exports: Record<string, unknown>): [string, string, string][] => {
+	const out: [string, string, string][] = [];
+	for (const [subpath, entry] of Object.entries(exports)) {
+		const conditions: Record<string, unknown> =
+			typeof entry === 'string' ? { default: entry } : typeof entry === 'object' && entry !== null ? (entry as Record<string, unknown>) : {};
+		for (const [condition, target] of Object.entries(conditions)) {
+			if (typeof target === 'string' && target.startsWith('./') && !target.startsWith('./dist/')) {
+				out.push([subpath, condition, target]);
+			}
+		}
+	}
+	return out;
+};
+
 describe('publish shape', () => {
 	it('ships every directory its exports resolve into', () => {
 		const files = (pkg as { files?: string[] }).files ?? [];
@@ -147,7 +172,61 @@ describe('publish shape', () => {
 		expect(typesThatAreNotDeclarations({ './a': { types: './dist/a.js' } })).toHaveLength(1);
 	});
 
+	it('🔴 points every non-dist export condition at a file that EXISTS', async () => {
+		// ── The third of three ways this manifest can lie, and the only one nothing watched ──
+		// `publishShape` above proves an export's ROOT directory is in `files`;
+		// `scripts/checkDistExports.ts` proves every `./dist/` target was emitted. Between
+		// them sits the condition a consumer actually RUNS — `bun`/`source`/`default`, which
+		// for this package is raw `./src/**` and `./scripts/guardrailsEnforce.ts` — and
+		// nothing proved those files are there. `files` ships whole directories, so renaming
+		// or moving one leaves the root shipped, the tarball valid, and the target dangling.
+		//
+		// It is not hypothetical and it is not ours to survive: since task 202 folded
+		// `--baseline` into the scanner, SIX apps run
+		// `bun node_modules/cursedbelt/scripts/guardrailsEnforce.ts …` inside their own
+		// `verify`. That path and this manifest's `./guardrails` conditions name the same
+		// file, so the day it moves, six repos go red in a file none of them wrote — the
+		// exact three-repos-away failure that tasks 172 and 219 each cost a session to find.
+		//
+		// The 48 string-valued CSS entries are the sharper half: they are GENERATED
+		// (`bun run styles:areas`) and have no second condition to fall through to, so a
+		// generator that stops emitting one is an unresolvable import for every consumer
+		// with nothing red on this side at all.
+		const repo = `${import.meta.dir}/..`;
+		const missing: string[] = [];
+		for (const [subpath, condition, target] of targetsOutsideDist(pkg.exports as unknown as Record<string, unknown>)) {
+			// 🔴 Bun.file, NOT node:fs — the preload virtualizes node:fs and an existsSync
+			// here would answer from MOCK data. Same trap as the header of this file.
+			if (!(await Bun.file(`${repo}/${target.slice(2)}`).exists())) missing.push(`${subpath} [${condition}] → ${target}`);
+		}
+		expect(
+			missing,
+			'these export conditions name a file that is not on disk. A consumer does not get a\n' +
+				'helpful error — the resolver falls through to whatever condition is left, or fails\n' +
+				'outright for the CSS entries, which have none:\n  ' +
+				missing.join('\n  '),
+		).toEqual([]);
+	});
+
+	it('catches a dangling non-dist target, and leaves dist to the build step', () => {
+		// The negative control for the rule above. Without it, `targetsOutsideDist` could
+		// quietly stop matching and the assertion would be green against nothing.
+		const found = targetsOutsideDist({
+			'./guardrails': { types: './dist/scripts/guardrailsEnforce.d.ts', bun: './scripts/moved.ts' },
+			'./styles.css': './src/styles.css',
+			'./react': { types: './dist/react/index.d.ts', import: './dist/react/index.js' },
+		});
+		// The `./dist/` conditions are checkDistExports' to police, so neither appears here.
+		expect(found).toEqual([
+			['./guardrails', 'bun', './scripts/moved.ts'],
+			['./styles.css', 'default', './src/styles.css'],
+		]);
+	});
+
 	it('reads the real manifest, so the rule cannot pass vacuously', () => {
+		// The scan above must see the whole non-dist surface, not a handful of it: 97 targets
+		// across the `bun`/`source`/`default` conditions and the 48 bare CSS entries.
+		expect(targetsOutsideDist(pkg.exports as unknown as Record<string, unknown>).length).toBeGreaterThan(90);
 		// `types` is what every conditional export in this package leads with; if the scan
 		// ever returns nothing, both assertions above are green about a manifest they never
 		// looked at.

package/src/react/AuthGate.tsx

@@ -1,10 +1,10 @@
 import { useEffect, useState } from 'react';
 import type { ReactNode } from 'react';
-import { AuthCard, LoginForm, RegisterForm } from './components/auth';
+import { AuthCard, LoginForm, RegisterForm } from './components/auth/index.js';
 // The 401 bus lives in its own React-free leaf so the RAISER (the data tier's
 // `EngineDataProvider`) can import it without dragging these two auth forms
 // into every fetching app's bundle. See `authSignal.ts`.
-import { notifyUnauthorized, subscribeUnauthorized } from './authSignal';
+import { notifyUnauthorized, subscribeUnauthorized } from './authSignal.js';
 
 export { notifyUnauthorized };
 

package/src/react/Toast.spec.tsx

@@ -1,6 +1,6 @@
 import { afterEach, describe, expect, test } from 'bun:test';
 import { cleanup, render } from '@testing-library/react';
-import { Toaster, toast } from './Toast';
+import { Toaster, toast } from './Toast.js';
 
 afterEach(cleanup);
 

package/src/react/VirtualCardGrid.spec.tsx

@@ -12,7 +12,7 @@ const observerMock = {
 // @ts-expect-error — happy-dom doesn't ship ResizeObserver
 globalThis.ResizeObserver = mock(() => observerMock);
 
-import { VirtualCardGrid } from './VirtualCardGrid';
+import { VirtualCardGrid } from './VirtualCardGrid.js';
 
 describe('VirtualCardGrid', () => {
   test('mounts without throwing', () => {

package/src/react/VirtualCardGrid.tsx

@@ -8,8 +8,8 @@ import {
   useRef,
   useState,
 } from 'react';
-import { useResizeObserver } from './hooks/useResizeObserver';
-import { cn } from './lib/cn';
+import { useResizeObserver } from './hooks/useResizeObserver.js';
+import { cn } from './lib/cn.js';
 
 /**
  * Where the scroll actually happens. Deliberately the SAME vocabulary as

package/src/react/VirtualList.spec.tsx

@@ -18,7 +18,7 @@ beforeAll(() => {
   Object.defineProperty(window, 'innerHeight', { value: 600, writable: true });
 });
 
-import { VirtualList } from './VirtualList';
+import { VirtualList } from './VirtualList.js';
 
 describe('VirtualList — scroll="self" (default)', () => {
   test('mounts without throwing', () => {

package/src/react/VirtualList.tsx

@@ -1,7 +1,7 @@
 import { useVirtualizer, useWindowVirtualizer } from '@tanstack/react-virtual';
 import { type ReactNode, useEffect, useRef } from 'react';
-import { cn } from './lib/cn';
-import { useResizeObserver } from './hooks/useResizeObserver';
+import { cn } from './lib/cn.js';
+import { useResizeObserver } from './hooks/useResizeObserver.js';
 
 type ScrollMode = 'self' | 'window' | { root: HTMLElement | null };
 

package/src/react/activity-bar/ActivityBar.spec.tsx

@@ -1,6 +1,6 @@
 import { afterEach, describe, expect, test } from 'bun:test';
 import { cleanup, fireEvent, render, screen } from '@testing-library/react';
-import { ActivityBar, type ActivityBarItem } from './ActivityBar';
+import { ActivityBar, type ActivityBarItem } from './ActivityBar.js';
 
 /**
  * What is worth pinning here.

package/src/react/activity-bar/ActivityBar.tsx

@@ -57,7 +57,7 @@
  * that gap.
  */
 import type { JSX, ReactNode } from 'react';
-import { Tooltip } from '../components/Tooltip';
+import { Tooltip } from '../components/Tooltip.js';
 import './activityBar.css';
 
 /**

package/src/react/activity-bar/index.ts

@@ -5,4 +5,4 @@
 //
 // Its own subpath, like `react/file-tree`, so an app that never mounts one does not pull the
 // stylesheet in. See `ActivityBar.tsx` for what belongs in the top group vs the bottom one.
-export { ActivityBar, type ActivityBarItem, type ActivityBarProps } from './ActivityBar';
+export { ActivityBar, type ActivityBarItem, type ActivityBarProps } from './ActivityBar.js';

package/src/react/analytics/AnalyticsPanel.tsx

@@ -1,7 +1,7 @@
 import type { ReactNode } from 'react';
 import { rangeLabel, type RangeWindow } from 'cursedbelt-core/analytics/range';
-import { ChartTablePanel, type ChartTablePanelProps } from '../components/ChartTablePanel';
-import type { ColDef } from '../components/DataTable/types';
+import { ChartTablePanel, type ChartTablePanelProps } from '../components/ChartTablePanel.js';
+import type { ColDef } from '../components/DataTable/types.js';
 
 export interface AnalyticsPanelProps<TRow extends Record<string, unknown>>
   extends Omit<ChartTablePanelProps<TRow>, 'title'> {

package/src/react/analytics/MetricDrilldown.tsx

@@ -1,7 +1,7 @@
 import { type ReactNode, useCallback, useState } from 'react';
-import { Modal } from '../components/Modal';
-import type { ColDef } from '../components/DataTable/types';
-import { AnalyticsPanel } from './AnalyticsPanel';
+import { Modal } from '../components/Modal.js';
+import type { ColDef } from '../components/DataTable/types.js';
+import { AnalyticsPanel } from './AnalyticsPanel.js';
 import type { RangeWindow } from 'cursedbelt-core/analytics/range';
 
 export interface MetricDrilldownProps<TRow extends Record<string, unknown>> {

package/src/react/analytics/RangeTabs.tsx

@@ -7,8 +7,8 @@ import {
   rangePreset,
   startOfDay,
 } from 'cursedbelt-core/analytics/range';
-import { DateRangePicker, type DateRangeValue } from '../components/DateRangePicker';
-import { SegmentedControl } from '../components/SegmentedControl';
+import { DateRangePicker, type DateRangeValue } from '../components/DateRangePicker.js';
+import { SegmentedControl } from '../components/SegmentedControl.js';
 
 export interface RangeTabsProps {
   value: RangeKey;

package/src/react/analytics/index.ts

@@ -16,13 +16,13 @@
  * moment something here knows what a "task" or a "pageview" is, it has moved to
  * the wrong layer.
  */
-export { AnalyticsPanel, type AnalyticsPanelProps } from './AnalyticsPanel';
+export { AnalyticsPanel, type AnalyticsPanelProps } from './AnalyticsPanel.js';
 export {
   MetricDrilldown,
   type MetricDrilldownProps,
   useDrilldown,
-} from './MetricDrilldown';
-export { RangeTabs, type RangeTabsProps, rangeDescription } from './RangeTabs';
+} from './MetricDrilldown.js';
+export { RangeTabs, type RangeTabsProps, rangeDescription } from './RangeTabs.js';
 
 // The pure half, re-exported so a dashboard needs one import path. The
 // framework-free module stays separately importable for a server that must not

package/src/react/charts/AreaChart.tsx

@@ -7,10 +7,10 @@ import {
   XAxis,
   YAxis,
 } from 'recharts';
-import { ChartFrame } from './ChartFrame';
-import { legendContent } from './ChartLegend';
-import { tooltipContent } from './ChartTooltip';
-import { axisProps, type ChartDatum, type ChartSeries, seriesColor, useGradientId } from './shared';
+import { ChartFrame } from './ChartFrame.js';
+import { legendContent } from './ChartLegend.js';
+import { tooltipContent } from './ChartTooltip.js';
+import { axisProps, type ChartDatum, type ChartSeries, seriesColor, useGradientId } from './shared.js';
 
 export type AreaChartProps = {
   data: ChartDatum[];

package/src/react/charts/BarChart.tsx

@@ -1,8 +1,8 @@
 import { Bar, CartesianGrid, Legend, BarChart as RBarChart, Tooltip, XAxis, YAxis } from 'recharts';
-import { ChartFrame } from './ChartFrame';
-import { legendContent } from './ChartLegend';
-import { tooltipContent } from './ChartTooltip';
-import { axisProps, type ChartDatum, type ChartSeries, seriesColor } from './shared';
+import { ChartFrame } from './ChartFrame.js';
+import { legendContent } from './ChartLegend.js';
+import { tooltipContent } from './ChartTooltip.js';
+import { axisProps, type ChartDatum, type ChartSeries, seriesColor } from './shared.js';
 
 type Corners = [number, number, number, number];
 

package/src/react/charts/ChartFrame.tsx

@@ -1,7 +1,7 @@
 import { type ReactElement, useRef } from 'react';
 import { ResponsiveContainer } from 'recharts';
-import { cn } from '../lib/cn';
-import { type ChartTokens, useChartTokens } from './tokens';
+import { cn } from '../lib/cn.js';
+import { type ChartTokens, useChartTokens } from './tokens.js';
 
 export type ChartFrameProps = {
   /** Human label for the chart's `role="img"` wrapper (SVG a11y). */

package/src/react/charts/ChartLegend.tsx

@@ -1,5 +1,5 @@
 import type { ReactNode } from 'react';
-import { type ChartTokens, FALLBACK_TOKENS } from './tokens';
+import { type ChartTokens, FALLBACK_TOKENS } from './tokens.js';
 
 type LegendItem = { value?: ReactNode; color?: string; dataKey?: string | number };
 

package/src/react/charts/ChartTooltip.tsx

@@ -1,5 +1,5 @@
 import type { ReactNode } from 'react';
-import { type ChartTokens, FALLBACK_TOKENS } from './tokens';
+import { type ChartTokens, FALLBACK_TOKENS } from './tokens.js';
 
 type TooltipItem = {
   name?: ReactNode;

package/src/react/charts/HeatmapChart.spec.ts

@@ -1,5 +1,5 @@
 import { describe, expect, test } from 'bun:test';
-import { heatFraction } from './HeatmapChart';
+import { heatFraction } from './HeatmapChart.js';
 
 describe('heatFraction — normalising magnitude onto the ramp', () => {
   test('a value scales linearly against the top of the scale', () => {

package/src/react/charts/HeatmapChart.tsx

@@ -1,8 +1,8 @@
 import { type CSSProperties, type ReactNode, useRef } from 'react';
-import { cn } from '../lib/cn';
-import { sequentialStep } from './categorical';
-import { type ChartTokens, type ChartTone, toneColor, useChartTokens } from './tokens';
-import { Tooltip } from '../components/Tooltip';
+import { cn } from '../lib/cn.js';
+import { sequentialStep } from './categorical.js';
+import { type ChartTokens, type ChartTone, toneColor, useChartTokens } from './tokens.js';
+import { Tooltip } from '../components/Tooltip.js';
 
 /** One cell. `value === null` means NO OBSERVATION — rendered distinctly from zero. */
 export type HeatmapCell = {

package/src/react/charts/IntervalTimeline.color.spec.tsx

@@ -1,6 +1,6 @@
 import { afterEach, describe, expect, test } from 'bun:test';
 import { cleanup, render } from '@testing-library/react';
-import { IntervalTimeline, type TimelineInterval } from './IntervalTimeline';
+import { IntervalTimeline, type TimelineInterval } from './IntervalTimeline.js';
 
 afterEach(cleanup);