From 4e8e3d5199c478bfbe4578b7bcb45d3a7e5406f8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Hanno=20J=2E=20G=C3=B6decke?= <die.drei99@yahoo.de>
Date: Sun, 5 Apr 2026 18:50:18 +0200
Subject: [PATCH] allow react-native imports in bundle mode

---
 .../__tests__/plugin.test.ts                  | 46 +++++++++++++++++++
 .../react-native-worklets/plugin/index.js     | 23 ++++++++--
 .../plugin/src/bundleMode.ts                  | 31 ++++++++++---
 .../src/initializers/initializers.native.ts   |  4 +-
 .../workletRuntimeEntry.native.ts             |  1 +
 .../src/privateGlobals.d.ts                   |  1 +
 6 files changed, 94 insertions(+), 12 deletions(-)

diff --git a/packages/react-native-worklets/__tests__/plugin.test.ts b/packages/react-native-worklets/__tests__/plugin.test.ts
index 868f29af34ac..73dc3d64d3e3 100644
--- a/packages/react-native-worklets/__tests__/plugin.test.ts
+++ b/packages/react-native-worklets/__tests__/plugin.test.ts
@@ -540,6 +540,52 @@ describe('babel plugin', () => {
     });
   });
 
+  describe('for bundle mode runtime entry', () => {
+    const workletRuntimeEntryFilename =
+      '/tmp/react-native-worklets/src/initializers/workletRuntimeEntry.native.ts';
+
+    test('enables bundle mode in worklet runtime entry', () => {
+      const input = html`<script>
+        globalThis._WORKLETS_BUNDLE_MODE_ENABLED = false;
+      </script>`;
+
+      const { code } = runPlugin(input, undefined, {
+        bundleMode: true,
+      }, workletRuntimeEntryFilename);
+
+      expect(code).toContain('globalThis._WORKLETS_BUNDLE_MODE_ENABLED = true;');
+    });
+
+    test('allows react-native imports when explicitly configured', () => {
+      const input = html`<script>
+        globalThis._WORKLETS_REACT_NATIVE_IMPORTS_ALLOWED = false;
+      </script>`;
+
+      const { code } = runPlugin(input, undefined, {
+        bundleMode: true,
+        workletizableModules: ['react-native'],
+      }, workletRuntimeEntryFilename);
+
+      expect(code).toContain(
+        'globalThis._WORKLETS_REACT_NATIVE_IMPORTS_ALLOWED = true;'
+      );
+    });
+
+    test("doesn't allow react-native imports by default", () => {
+      const input = html`<script>
+        globalThis._WORKLETS_REACT_NATIVE_IMPORTS_ALLOWED = false;
+      </script>`;
+
+      const { code } = runPlugin(input, undefined, {
+        bundleMode: true,
+      }, workletRuntimeEntryFilename);
+
+      expect(code).toContain(
+        'globalThis._WORKLETS_REACT_NATIVE_IMPORTS_ALLOWED = false;'
+      );
+    });
+  });
+
   describe('for explicit worklets', () => {
     test('workletizes FunctionDeclaration', () => {
       const input = html`<script>
diff --git a/packages/react-native-worklets/plugin/index.js b/packages/react-native-worklets/plugin/index.js
index 5deeb2ae22ee..e8d52e1fec30 100644
--- a/packages/react-native-worklets/plugin/index.js
+++ b/packages/react-native-worklets/plugin/index.js
@@ -1368,17 +1368,30 @@ var require_bundleMode = __commonJS({
       if (!expressionPath.isAssignmentExpression()) {
         return;
       }
+      const propertyName = getGlobalPropertyName(expressionPath);
+      if (propertyName === "_WORKLETS_BUNDLE_MODE_ENABLED") {
+        expressionPath.get("right").replaceWith((0, types_12.booleanLiteral)(true));
+        return;
+      }
+      if (propertyName === "_WORKLETS_REACT_NATIVE_IMPORTS_ALLOWED" && areReactNativeImportsAllowed(state)) {
+        expressionPath.get("right").replaceWith((0, types_12.booleanLiteral)(true));
+      }
+    }
+    function getGlobalPropertyName(expressionPath) {
       const left = expressionPath.get("left");
       if (!left.isMemberExpression()) {
-        return;
+        return null;
       }
       const object = left.get("object");
       const property = left.get("property");
-      if (!object.isIdentifier() || object.node.name !== "globalThis" || !property.isIdentifier() || property.node.name !== "_WORKLETS_BUNDLE_MODE_ENABLED") {
-        return;
+      if (!object.isIdentifier() || object.node.name !== "globalThis" || !property.isIdentifier()) {
+        return null;
       }
-      const right = expressionPath.get("right");
-      right.replaceWith((0, types_12.booleanLiteral)(true));
+      return property.node.name;
+    }
+    function areReactNativeImportsAllowed(state) {
+      var _a, _b;
+      return (_b = (_a = state.opts.workletizableModules) === null || _a === void 0 ? void 0 : _a.includes("react-native")) !== null && _b !== void 0 ? _b : false;
     }
   }
 });
diff --git a/packages/react-native-worklets/plugin/src/bundleMode.ts b/packages/react-native-worklets/plugin/src/bundleMode.ts
index 9b9f77c5e3d5..8515cce2c118 100644
--- a/packages/react-native-worklets/plugin/src/bundleMode.ts
+++ b/packages/react-native-worklets/plugin/src/bundleMode.ts
@@ -30,10 +30,28 @@ export function toggleBundleMode(
     return;
   }
 
+  const propertyName = getGlobalPropertyName(expressionPath);
+
+  if (propertyName === '_WORKLETS_BUNDLE_MODE_ENABLED') {
+    expressionPath.get('right').replaceWith(booleanLiteral(true));
+    return;
+  }
+
+  if (
+    propertyName === '_WORKLETS_REACT_NATIVE_IMPORTS_ALLOWED' &&
+    areReactNativeImportsAllowed(state)
+  ) {
+    expressionPath.get('right').replaceWith(booleanLiteral(true));
+  }
+}
+
+function getGlobalPropertyName(
+  expressionPath: NodePath<ExpressionStatement['expression']>
+) {
   const left = expressionPath.get('left');
 
   if (!left.isMemberExpression()) {
-    return;
+    return null;
   }
 
   const object = left.get('object');
@@ -42,13 +60,14 @@ export function toggleBundleMode(
   if (
     !object.isIdentifier() ||
     object.node.name !== 'globalThis' ||
-    !property.isIdentifier() ||
-    property.node.name !== '_WORKLETS_BUNDLE_MODE_ENABLED'
+    !property.isIdentifier()
   ) {
-    return;
+    return null;
   }
 
-  const right = expressionPath.get('right');
+  return property.node.name;
+}
 
-  right.replaceWith(booleanLiteral(true));
+function areReactNativeImportsAllowed(state: WorkletsPluginPass) {
+  return state.opts.workletizableModules?.includes('react-native') ?? false;
 }
diff --git a/packages/react-native-worklets/src/initializers/initializers.native.ts b/packages/react-native-worklets/src/initializers/initializers.native.ts
index e080e5ab6865..849c685e5e3b 100644
--- a/packages/react-native-worklets/src/initializers/initializers.native.ts
+++ b/packages/react-native-worklets/src/initializers/initializers.native.ts
@@ -152,7 +152,9 @@ function initializeWorkletRuntime() {
 
     if (__DEV__) {
       silenceHMRWarnings();
-      disallowRNImports();
+      if (!globalThis._WORKLETS_REACT_NATIVE_IMPORTS_ALLOWED) {
+        disallowRNImports();
+      }
     }
 
     if (getStaticFeatureFlag('FETCH_PREVIEW_ENABLED')) {
diff --git a/packages/react-native-worklets/src/initializers/workletRuntimeEntry.native.ts b/packages/react-native-worklets/src/initializers/workletRuntimeEntry.native.ts
index 38fbb4366609..23077695f0f6 100644
--- a/packages/react-native-worklets/src/initializers/workletRuntimeEntry.native.ts
+++ b/packages/react-native-worklets/src/initializers/workletRuntimeEntry.native.ts
@@ -20,6 +20,7 @@ export function bundleModeInit() {
   // Worklets Babel Plugin replaces `false` with `true` here
   // when Bundle Mode is enabled.
   globalThis._WORKLETS_BUNDLE_MODE_ENABLED = false;
+  globalThis._WORKLETS_REACT_NATIVE_IMPORTS_ALLOWED = false;
 
   if (!globalThis._WORKLETS_BUNDLE_MODE_ENABLED) {
     return;
diff --git a/packages/react-native-worklets/src/privateGlobals.d.ts b/packages/react-native-worklets/src/privateGlobals.d.ts
index aaa95f96ebe8..691ed9715b73 100644
--- a/packages/react-native-worklets/src/privateGlobals.d.ts
+++ b/packages/react-native-worklets/src/privateGlobals.d.ts
@@ -22,6 +22,7 @@ declare global {
   var _toString: (value: unknown) => string;
   var __workletsModuleProxy: WorkletsModuleProxy;
   var _WORKLETS_BUNDLE_MODE_ENABLED: boolean | undefined;
+  var _WORKLETS_REACT_NATIVE_IMPORTS_ALLOWED: boolean | undefined;
   var _WORKLETS_VERSION_CPP: string | undefined;
   var _WORKLETS_VERSION_JS: string | undefined;
   var _createSerializable: <T>(