@r0hitsharma/vite-config 0.12.0-rohit-fork-ci.1

package/README.md

@@ -0,0 +1,130 @@
+# @r0hitsharma/vite-config
+
+Shared Vite build presets, so that wiring every app needs is written once.
+
+## Installation
+
+```bash
+npm install --save-dev @r0hitsharma/vite-config \
+  vite @vitejs/plugin-react @rolldown/plugin-babel babel-plugin-react-compiler
+```
+
+The four packages are peer dependencies: the preset composes them, it does not
+vendor them, so the app decides which versions its build runs on. Vite 8 is
+required: the preset is built on rolldown's plugin API.
+
+## React Compiler
+
+```typescript
+import reactCompiler from '@r0hitsharma/vite-config/react-compiler';
+import react from '@vitejs/plugin-react';
+import { defineConfig } from 'vite';
+
+export default defineConfig({
+  plugins: [react(), reactCompiler()],
+});
+```
+
+`react()` stays responsible for JSX and Fast Refresh; `reactCompiler()` adds the
+compiler. Order matters only in that both must be present.
+
+### Why this is not a `@vitejs/plugin-react` option
+
+Vite 8 bundles with rolldown, whose transformer is Oxc, and Oxc does not run
+Babel plugins. The React Compiler is a Babel plugin, so it arrives as a separate
+Babel pass — `@rolldown/plugin-babel` carrying `reactCompilerPreset()` — rather
+than as a `babel.plugins` entry on `react()`.
+
+That preset ships a `code` filter and no `id` filter, which means every module
+passing the code test is handed to Babel. Babel is the one part of the pipeline
+that is not Oxc, so this preset adds the `id` filter the preset omits.
+
+### Options
+
+| Option | Default | Effect |
+| --- | --- | --- |
+| `exclude` | `[]` | Extra module ids kept out of the Babel pass, merged after the defaults rather than replacing them |
+| `excludeStyledSystem` | `true` | Whether the default `styled-system` exclusion applies |
+| `compiler` | `undefined` | Options forwarded to `babel-plugin-react-compiler` |
+
+Excluded by default:
+
+| Pattern | Why |
+| --- | --- |
+| `/[/\\]node_modules[/\\]/` | Dependencies ship compiled; also `@rolldown/plugin-babel`'s own default, restated so this preset does not depend on that default staying put |
+| `/[/\\]styled-system[/\\](?!jsx[/\\])/` | Panda's generated output — style objects, token maps, type declarations — which every design-system consumer has and which holds no components |
+
+The `jsx` carve-out is deliberate. Under `jsxFramework: 'react'` Panda generates
+real `forwardRef` components into `styled-system/jsx/`, and this repo's own
+shared Panda config sets exactly that. Since `exclude` only ever adds, a blanket
+`styled-system` exclusion would skip the compiler on genuine components — so the
+default is narrowed to the part of the tree that is component-free under every
+Panda setting, rather than left for consumers to correct.
+
+That leaves one assumption: that the segment means Panda's `outdir` at all. A
+project where it does not — a hand-written `styled-system/` directory, say —
+would hit exactly the failure this preset exists to prevent, a build that
+type-checks, exits 0 and ships those components unoptimized, with no way to say
+so through an append-only `exclude`. `excludeStyledSystem: false` drops that one
+pattern:
+
+```typescript
+reactCompiler({ excludeStyledSystem: false });
+```
+
+`node_modules` is not part of the trade and stays out of the pass either way. It
+is also `@rolldown/plugin-babel`'s own default `exclude`, applied to the pass
+independently of the filter this preset sets, so an option to compile
+dependencies would not work even if one existed.
+
+Add your own generated trees:
+
+```typescript
+reactCompiler({ exclude: [/[/\\]src[/\\]generated[/\\]/] });
+```
+
+Regular expressions rather than globs, and the defaults are regexes for the
+same reason: a string pattern is compiled by two different matchers.
+`@rolldown/plugin-babel` compiles one copy with a bare `picomatch(pattern)`,
+which defaults to `dot: false`, so a project living under `.cache/` or `.pnpm/`
+drops out of a `**` glob entirely. rolldown's own id filter has no such blind
+spot and is the one that decides for this wiring, which is why a glob is not
+wrong here today — but it is right by way of which of the two gates happens to
+be authoritative, and that is a plugin internal. A `RegExp` is
+`pattern.test(id)` on both sides.
+
+Leave `compiler` unset on React 19.2 and later. The compiler then emits calls
+into `react/compiler-runtime`, which those versions ship; only an older React
+needs an explicit `target`.
+
+### Confirming it ran
+
+An unwired compiler is silent — the build succeeds and produces the same output
+it always did. The compiler's runtime import is the marker to look for, since
+nothing else in an app imports it:
+
+```bash
+vite build --minify false
+grep -rc 'react/compiler-runtime' dist/assets/*.js
+```
+
+This package's own tests assert exactly that, against real builds — including
+that the excluded trees really do come out untouched.
+
+## Linting for it
+
+The compiler's own static analysis is available as oxlint rules, and the `react`
+preset in [`@r0hitsharma/oxlint-config`](../oxlint-config/README.md) enables
+19 of them. A consumer on that preset gets the build and the lint agreeing
+without configuring anything.
+
+They are named one at a time — `react/hooks`, `react/purity`,
+`react/immutability`, `react/preserve-manual-memoization` and the rest — because
+the umbrella `react/react-compiler` rule no longer exists. oxlint 1.79.0 split it
+into one rule per compiler diagnostic, matching `eslint-plugin-react-hooks` v6,
+and naming the old umbrella is now a hard config-parse failure:
+`Rule 'react-compiler' not found in plugin 'react'`.
+
+Five further split rules are deferred to `off` in that preset, each with its
+reason and current finding count recorded beside it in
+[`react.ts`](../oxlint-config/react.ts).

package/dist/react-compiler.d.ts

@@ -0,0 +1,88 @@
+import { reactCompilerPreset } from '@vitejs/plugin-react';
+import type { PluginOption } from 'vite';
+/**
+ * Vite 8 bundles with rolldown, and rolldown's own transformer is Oxc, which
+ * does not run Babel plugins. So the React Compiler is not a `@vitejs/plugin-react`
+ * option: it is a separate Babel pass, added as a rolldown preset alongside
+ * `react()`. That indirection is the whole reason this preset exists — it is
+ * identical in every app, and easy to wire up in a way that silently compiles
+ * nothing.
+ */
+/** The React Compiler's Babel options, as `@vitejs/plugin-react` accepts them. */
+export type ReactCompilerBabelOptions = NonNullable<Parameters<typeof reactCompilerPreset>[0]>;
+/** A rolldown id filter pattern: a picomatch glob or a regular expression. */
+export type IdPattern = string | RegExp;
+export type ReactCompilerOptions = {
+    /**
+     * Extra module ids kept away from the Babel pass, merged after
+     * {@link DEFAULT_EXCLUDE} rather than replacing it. Generated trees are the
+     * usual candidates — anything with no components in it is pure cost.
+     *
+     * Prefer a `RegExp` over a glob string, for the reason
+     * {@link DEFAULT_EXCLUDE} gives: a glob is dot-blind in one of the two
+     * matchers that compile it.
+     */
+    exclude?: readonly IdPattern[];
+    /**
+     * Whether the default `styled-system` exclusion applies.
+     *
+     * Set it to `false` where that path segment does not mean what
+     * {@link DEFAULT_EXCLUDE} assumes it means — a directory of that name
+     * holding hand-written components rather than Panda's generated output.
+     * Since `exclude` only ever adds, that is otherwise unfixable, and it fails
+     * the way this package exists to prevent: the build type-checks, exits 0,
+     * and quietly ships those components unoptimized.
+     *
+     * `node_modules` is not part of this and stays out of the pass either way.
+     * It is also `@rolldown/plugin-babel`'s own default `exclude`, which that
+     * plugin applies to this pass independently of the filter set here — so an
+     * option to compile dependencies would not work even if one existed.
+     *
+     * @default true
+     */
+    excludeStyledSystem?: boolean;
+    /**
+     * Forwarded to the compiler itself. Leave it unset on React 19.2 and later:
+     * the compiler then emits calls into `react/compiler-runtime`, which those
+     * versions ship. Only an older React needs an explicit `target`.
+     */
+    compiler?: ReactCompilerBabelOptions;
+};
+/**
+ * Trees excluded from the Babel pass by default.
+ *
+ * Babel is the one part of a Vite 8 pipeline that is not Oxc, so it is the one
+ * part worth not running. Nothing upstream narrows it: the compiler preset
+ * ships only a `code` filter, and that filter is
+ * `/forwardRef|memo|\b(?:[A-Z]|use[A-Z0-9])/` — near enough every module with a
+ * capital letter in it, generated output very much included.
+ *
+ * Written as regular expressions rather than glob strings on purpose. A string
+ * pattern is compiled by two matchers that disagree: rolldown's own id filter,
+ * where a leading-dot path segment matches, and `@rolldown/plugin-babel`'s
+ * `picomatch(pattern)`, where it does not — picomatch defaults to
+ * `dot: false`, so a project under `.cache/` or `.pnpm/` falls out of a
+ * `styled-system` glob. Only rolldown's matcher is authoritative for the
+ * wiring below, so a glob is not wrong here today; it is right by way of which
+ * of the two gates happens to decide, which is a plugin internal. A `RegExp`
+ * is `pattern.test(id)` on both sides and has no such blind spot.
+ */
+export declare const DEFAULT_EXCLUDE: readonly IdPattern[];
+/**
+ * The React Compiler, wired for Vite 8.
+ *
+ * Add it after `@vitejs/plugin-react`, which stays responsible for JSX and Fast
+ * Refresh:
+ *
+ * ```ts
+ * import react from '@vitejs/plugin-react';
+ * import reactCompiler from '@r0hitsharma/vite-config/react-compiler';
+ *
+ * export default defineConfig({
+ *   plugins: [react(), reactCompiler()],
+ * });
+ * ```
+ *
+ * Returns a promise, which Vite accepts directly in `plugins`.
+ */
+export default function reactCompiler(options?: ReactCompilerOptions): PluginOption;

package/dist/react-compiler.js

@@ -0,0 +1,83 @@
+import babel from '@rolldown/plugin-babel';
+import { reactCompilerPreset } from '@vitejs/plugin-react';
+/**
+ * `node_modules` is also `@rolldown/plugin-babel`'s own default `exclude`.
+ * Restating it keeps this preset's exclusion self-contained rather than
+ * dependent on that default staying what it is, and it is the one pattern here
+ * that no option removes: dependencies ship compiled, and the plugin's own
+ * default would keep them out of the pass regardless.
+ */
+const NODE_MODULES_EXCLUDE = /[/\\]node_modules[/\\]/;
+/**
+ * Panda's generated output, which every design-system consumer has — style
+ * objects, token maps and type declarations, with no components in them.
+ *
+ * Its `jsx` subtree is the exception and is carved back IN: under
+ * `jsxFramework: 'react'`, which this repo's own shared Panda config sets,
+ * Panda generates real `forwardRef` components there. Excluding those would
+ * skip the compiler on genuine components, and `exclude` only ever adds, so
+ * undoing it would mean reaching for `excludeStyledSystem` — which no Panda
+ * consumer should have to discover. A default that is wrong under a supported
+ * Panda setting is worse than a default that compiles twenty extra generated
+ * files.
+ *
+ * This is the one pattern {@link ReactCompilerOptions.excludeStyledSystem}
+ * drops, for a project where the segment names something other than Panda's
+ * `outdir`.
+ */
+const STYLED_SYSTEM_EXCLUDE = /[/\\]styled-system[/\\](?!jsx[/\\])/;
+/**
+ * Trees excluded from the Babel pass by default.
+ *
+ * Babel is the one part of a Vite 8 pipeline that is not Oxc, so it is the one
+ * part worth not running. Nothing upstream narrows it: the compiler preset
+ * ships only a `code` filter, and that filter is
+ * `/forwardRef|memo|\b(?:[A-Z]|use[A-Z0-9])/` — near enough every module with a
+ * capital letter in it, generated output very much included.
+ *
+ * Written as regular expressions rather than glob strings on purpose. A string
+ * pattern is compiled by two matchers that disagree: rolldown's own id filter,
+ * where a leading-dot path segment matches, and `@rolldown/plugin-babel`'s
+ * `picomatch(pattern)`, where it does not — picomatch defaults to
+ * `dot: false`, so a project under `.cache/` or `.pnpm/` falls out of a
+ * `styled-system` glob. Only rolldown's matcher is authoritative for the
+ * wiring below, so a glob is not wrong here today; it is right by way of which
+ * of the two gates happens to decide, which is a plugin internal. A `RegExp`
+ * is `pattern.test(id)` on both sides and has no such blind spot.
+ */
+export const DEFAULT_EXCLUDE = [
+    NODE_MODULES_EXCLUDE,
+    STYLED_SYSTEM_EXCLUDE,
+];
+/**
+ * The React Compiler, wired for Vite 8.
+ *
+ * Add it after `@vitejs/plugin-react`, which stays responsible for JSX and Fast
+ * Refresh:
+ *
+ * ```ts
+ * import react from '@vitejs/plugin-react';
+ * import reactCompiler from '@r0hitsharma/vite-config/react-compiler';
+ *
+ * export default defineConfig({
+ *   plugins: [react(), reactCompiler()],
+ * });
+ * ```
+ *
+ * Returns a promise, which Vite accepts directly in `plugins`.
+ */
+export default function reactCompiler(options = {}) {
+    const preset = reactCompilerPreset(options.compiler);
+    const defaults = options.excludeStyledSystem === false
+        ? [NODE_MODULES_EXCLUDE]
+        : DEFAULT_EXCLUDE;
+    // The preset ships a `code` filter and no `id` filter, so without this every
+    // module that survives the code test is handed to Babel. Spread rather than
+    // replace: dropping the preset's own filters would widen the pass, not
+    // narrow it.
+    preset.rolldown.filter = {
+        ...preset.rolldown.filter,
+        id: { exclude: [...defaults, ...(options.exclude ?? [])] },
+    };
+    return babel({ presets: [preset] });
+}

package/package.json

@@ -0,0 +1,52 @@
+{
+  "name": "@r0hitsharma/vite-config",
+  "publishConfig": {
+    "access": "public"
+  },
+  "type": "module",
+  "files": [
+    "dist",
+    "react-compiler.ts"
+  ],
+  "scripts": {
+    "build": "tsc -p tsconfig.build.json",
+    "clean": "rm -rf dist",
+    "prepare": "npm run build",
+    "type:check": "tsc -p tsconfig.json --noEmit",
+    "lint": "oxlint -c oxlint.config.ts --max-warnings=0 *.ts",
+    "lint:fix": "oxlint -c oxlint.config.ts --fix *.ts",
+    "format": "oxfmt -c oxfmt.config.ts --write *.ts",
+    "format:check": "oxfmt -c oxfmt.config.ts --check *.ts",
+    "test": "npm run build && vitest run"
+  },
+  "exports": {
+    "./react-compiler": {
+      "types": "./dist/react-compiler.d.ts",
+      "default": "./dist/react-compiler.js"
+    }
+  },
+  "peerDependencies": {
+    "@rolldown/plugin-babel": "^0.2.3",
+    "@vitejs/plugin-react": "^6.0.5",
+    "babel-plugin-react-compiler": "^1.0.0",
+    "vite": "^8.0.0"
+  },
+  "devDependencies": {
+    "@babel/core": "7.29.7",
+    "@r0hitsharma/oxfmt-config": "*",
+    "@r0hitsharma/oxlint-config": "*",
+    "@r0hitsharma/tsconfig": "*",
+    "@rolldown/plugin-babel": "0.2.4",
+    "@types/babel__core": "7.20.5",
+    "@vitejs/plugin-react": "6.1.1",
+    "babel-plugin-react-compiler": "1.0.0",
+    "oxfmt": "0.67.0",
+    "oxlint": "1.82.0",
+    "vite": "8.2.2",
+    "vitest": "^4.1.9"
+  },
+  "version": "0.12.0-rohit-fork-ci.1",
+  "repository": {
+    "url": "https://github.com/r0hitsharma/uikit"
+  }
+}

package/react-compiler.ts

@@ -0,0 +1,148 @@
+import babel from '@rolldown/plugin-babel';
+import { reactCompilerPreset } from '@vitejs/plugin-react';
+import type { PluginOption } from 'vite';
+
+/**
+ * Vite 8 bundles with rolldown, and rolldown's own transformer is Oxc, which
+ * does not run Babel plugins. So the React Compiler is not a `@vitejs/plugin-react`
+ * option: it is a separate Babel pass, added as a rolldown preset alongside
+ * `react()`. That indirection is the whole reason this preset exists — it is
+ * identical in every app, and easy to wire up in a way that silently compiles
+ * nothing.
+ */
+
+/** The React Compiler's Babel options, as `@vitejs/plugin-react` accepts them. */
+export type ReactCompilerBabelOptions = NonNullable<
+  Parameters<typeof reactCompilerPreset>[0]
+>;
+
+/** A rolldown id filter pattern: a picomatch glob or a regular expression. */
+export type IdPattern = string | RegExp;
+
+export type ReactCompilerOptions = {
+  /**
+   * Extra module ids kept away from the Babel pass, merged after
+   * {@link DEFAULT_EXCLUDE} rather than replacing it. Generated trees are the
+   * usual candidates — anything with no components in it is pure cost.
+   *
+   * Prefer a `RegExp` over a glob string, for the reason
+   * {@link DEFAULT_EXCLUDE} gives: a glob is dot-blind in one of the two
+   * matchers that compile it.
+   */
+  exclude?: readonly IdPattern[];
+  /**
+   * Whether the default `styled-system` exclusion applies.
+   *
+   * Set it to `false` where that path segment does not mean what
+   * {@link DEFAULT_EXCLUDE} assumes it means — a directory of that name
+   * holding hand-written components rather than Panda's generated output.
+   * Since `exclude` only ever adds, that is otherwise unfixable, and it fails
+   * the way this package exists to prevent: the build type-checks, exits 0,
+   * and quietly ships those components unoptimized.
+   *
+   * `node_modules` is not part of this and stays out of the pass either way.
+   * It is also `@rolldown/plugin-babel`'s own default `exclude`, which that
+   * plugin applies to this pass independently of the filter set here — so an
+   * option to compile dependencies would not work even if one existed.
+   *
+   * @default true
+   */
+  excludeStyledSystem?: boolean;
+  /**
+   * Forwarded to the compiler itself. Leave it unset on React 19.2 and later:
+   * the compiler then emits calls into `react/compiler-runtime`, which those
+   * versions ship. Only an older React needs an explicit `target`.
+   */
+  compiler?: ReactCompilerBabelOptions;
+};
+
+/**
+ * `node_modules` is also `@rolldown/plugin-babel`'s own default `exclude`.
+ * Restating it keeps this preset's exclusion self-contained rather than
+ * dependent on that default staying what it is, and it is the one pattern here
+ * that no option removes: dependencies ship compiled, and the plugin's own
+ * default would keep them out of the pass regardless.
+ */
+const NODE_MODULES_EXCLUDE = /[/\\]node_modules[/\\]/;
+
+/**
+ * Panda's generated output, which every design-system consumer has — style
+ * objects, token maps and type declarations, with no components in them.
+ *
+ * Its `jsx` subtree is the exception and is carved back IN: under
+ * `jsxFramework: 'react'`, which this repo's own shared Panda config sets,
+ * Panda generates real `forwardRef` components there. Excluding those would
+ * skip the compiler on genuine components, and `exclude` only ever adds, so
+ * undoing it would mean reaching for `excludeStyledSystem` — which no Panda
+ * consumer should have to discover. A default that is wrong under a supported
+ * Panda setting is worse than a default that compiles twenty extra generated
+ * files.
+ *
+ * This is the one pattern {@link ReactCompilerOptions.excludeStyledSystem}
+ * drops, for a project where the segment names something other than Panda's
+ * `outdir`.
+ */
+const STYLED_SYSTEM_EXCLUDE = /[/\\]styled-system[/\\](?!jsx[/\\])/;
+
+/**
+ * Trees excluded from the Babel pass by default.
+ *
+ * Babel is the one part of a Vite 8 pipeline that is not Oxc, so it is the one
+ * part worth not running. Nothing upstream narrows it: the compiler preset
+ * ships only a `code` filter, and that filter is
+ * `/forwardRef|memo|\b(?:[A-Z]|use[A-Z0-9])/` — near enough every module with a
+ * capital letter in it, generated output very much included.
+ *
+ * Written as regular expressions rather than glob strings on purpose. A string
+ * pattern is compiled by two matchers that disagree: rolldown's own id filter,
+ * where a leading-dot path segment matches, and `@rolldown/plugin-babel`'s
+ * `picomatch(pattern)`, where it does not — picomatch defaults to
+ * `dot: false`, so a project under `.cache/` or `.pnpm/` falls out of a
+ * `styled-system` glob. Only rolldown's matcher is authoritative for the
+ * wiring below, so a glob is not wrong here today; it is right by way of which
+ * of the two gates happens to decide, which is a plugin internal. A `RegExp`
+ * is `pattern.test(id)` on both sides and has no such blind spot.
+ */
+export const DEFAULT_EXCLUDE: readonly IdPattern[] = [
+  NODE_MODULES_EXCLUDE,
+  STYLED_SYSTEM_EXCLUDE,
+];
+
+/**
+ * The React Compiler, wired for Vite 8.
+ *
+ * Add it after `@vitejs/plugin-react`, which stays responsible for JSX and Fast
+ * Refresh:
+ *
+ * ```ts
+ * import react from '@vitejs/plugin-react';
+ * import reactCompiler from '@r0hitsharma/vite-config/react-compiler';
+ *
+ * export default defineConfig({
+ *   plugins: [react(), reactCompiler()],
+ * });
+ * ```
+ *
+ * Returns a promise, which Vite accepts directly in `plugins`.
+ */
+export default function reactCompiler(
+  options: ReactCompilerOptions = {},
+): PluginOption {
+  const preset = reactCompilerPreset(options.compiler);
+
+  const defaults =
+    options.excludeStyledSystem === false
+      ? [NODE_MODULES_EXCLUDE]
+      : DEFAULT_EXCLUDE;
+
+  // The preset ships a `code` filter and no `id` filter, so without this every
+  // module that survives the code test is handed to Babel. Spread rather than
+  // replace: dropping the preset's own filters would widen the pass, not
+  // narrow it.
+  preset.rolldown.filter = {
+    ...preset.rolldown.filter,
+    id: { exclude: [...defaults, ...(options.exclude ?? [])] },
+  };
+
+  return babel({ presets: [preset] });
+}