fix(repack-plugin-nativewind): configure SWC rules nested in oneOf

.changeset/nativewind-swc-oneof.md

@@ -0,0 +1,5 @@
+---
+"@callstack/repack-plugin-nativewind": patch
+---
+
+Configure the NativeWind JSX import source for `builtin:swc-loader` rules nested in `oneOf` or `rules`, such as the ones from `getJsTransformRules`. Previously only top-level rules were updated, so JSX kept importing from `react`.

packages/plugin-nativewind/src/plugin.ts

@@ -1,5 +1,6 @@
 import type {
   Compiler as RspackCompiler,
+  RuleSetRules,
   RuleSetUse,
   RuleSetUseItem,
   SwcLoaderOptions,
@@ -154,7 +155,11 @@ export class NativeWindPlugin {
      *
      * TODO made obsolete by the new babel-swc-loader, remove in 6.0
      */
-    compiler.options.module.rules.forEach((rule) => {
+    this.configureRules(compiler.options.module.rules);
+  }
+
+  private configureRules(rules: RuleSetRules | undefined) {
+    rules?.forEach((rule) => {
       if (!rule || typeof rule !== 'object') {
         return;
       }
@@ -168,6 +173,10 @@ export class NativeWindPlugin {
           rule.options as SwcLoaderOptions
         );
       }
+
+      // e.g. `getJsTransformRules` nests its `builtin:swc-loader` rules in `oneOf`
+      this.configureRules(rule.oneOf);
+      this.configureRules(rule.rules);
     });
   }
 }

tests/integration/package.json

@@ -14,6 +14,7 @@
   "devDependencies": {
     "@babel/runtime": "^7.29.7",
     "@callstack/repack": "workspace:*",
+    "@callstack/repack-plugin-nativewind": "workspace:*",
     "@module-federation/enhanced": "2.0.1",
     "@module-federation/enhanced-v15": "npm:@module-federation/enhanced@0.15.0",
     "@module-federation/enhanced-v21": "npm:@module-federation/enhanced@0.21.0",

tests/integration/src/helpers.ts

@@ -1,6 +1,8 @@
 import type {
   Compiler as RspackCompiler,
   Configuration as RspackConfiguration,
+  RuleSetRule,
+  RuleSetUseItem,
 } from '@rspack/core';
 import { createFsFromVolume, Volume } from 'memfs';
 import { inject } from 'vitest';
@@ -112,3 +114,32 @@ export function getReactNativeVirtualModules(
       };`,
   };
 }
+
+export type SwcLoaderOptions = {
+  jsc?: {
+    transform?: {
+      react?: { development?: boolean; importSource?: string };
+    };
+  };
+};
+
+/**
+ * Collect options of every `builtin:swc-loader` in `module.rules`,
+ * including nested `oneOf` and `rules`
+ */
+export function collectSwcLoaderOptions(rules: unknown[]): SwcLoaderOptions[] {
+  return rules.flatMap((rule) => {
+    if (!rule || typeof rule !== 'object') return [];
+    const { use, loader, options, oneOf, rules: nested } = rule as RuleSetRule;
+    const uses = [use].flat().filter(Boolean) as RuleSetUseItem[];
+    return [
+      ...(loader === 'builtin:swc-loader' ? [options as SwcLoaderOptions] : []),
+      ...uses
+        .filter((item) => typeof item === 'object')
+        .filter((item) => item.loader === 'builtin:swc-loader')
+        .map((item) => (item as { options: SwcLoaderOptions }).options),
+      ...collectSwcLoaderOptions(oneOf ?? []),
+      ...collectSwcLoaderOptions(nested ?? []),
+    ];
+  });
+}

tests/integration/src/plugins/NativeWindPlugin.test.ts

@@ -0,0 +1,29 @@
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { getJsTransformRules } from '@callstack/repack';
+import { NativeWindPlugin } from '@callstack/repack-plugin-nativewind';
+import { describe, expect, inject, it } from 'vitest';
+import { collectSwcLoaderOptions, createCompiler } from '../helpers.js';
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+
+// builtin:swc-loader only exists in Rspack
+describe.runIf(inject('bundlerType') === 'rspack')('NativeWindPlugin', () => {
+  it('uses the NativeWind JSX import source in getJsTransformRules', async () => {
+    const compiler = await createCompiler({
+      context: __dirname,
+      mode: 'development',
+      entry: './index.js',
+      output: { path: '/out' },
+      module: { rules: getJsTransformRules() },
+      plugins: [new NativeWindPlugin({ checkDependencies: false })],
+    });
+
+    const importSources = collectSwcLoaderOptions(
+      compiler.options.module.rules
+    ).map((options) => options.jsc?.transform?.react?.importSource);
+
+    expect(importSources.length).toBeGreaterThan(0);
+    expect(new Set(importSources)).toEqual(new Set(['nativewind']));
+  });
+});