@symbiote-native/angular 2.0.0 → 2.0.1

package/metro-config.cjs

@@ -1,20 +1,27 @@
 // Angular's AOT pipeline needs ONE Metro-side accommodation beyond the plain css-parser
 // transformer: ngc mirrors this app's whole source tree into its own outDir (see
 // tsconfig.angular.base.json's `outDir` convention, "build/angular" by default) but only ever
-// compiles .ts — a relative style import (`import './App.css'`) survives untouched in the
-// compiled .js, still pointing at the ORIGINAL source location, which ngc never copies there.
-// Metro resolves that relative specifier against the COMPILED file's own location
-// (<outDir>/...), so without this it 404s on a file that was never created there. This redirects
-// such an import back to the real source file instead of copying it — a copy would need its own
-// re-copy on every CSS edit during `ngc --watch` (which only re-runs on .ts changes), while this
-// redirect lets Metro's own watchFolders pick up a source-file CSS edit for free. Applies
-// identically to a release `react-native bundle`, which resolves through this same config.
+// compiles .ts — a relative non-script import (`import './App.css'`, a bundled asset require such
+// as `./assets/logo.png`) survives untouched in the compiled .js, still pointing at the ORIGINAL
+// source location, which
+// ngc never copies there. Metro resolves that relative specifier against the COMPILED file's own
+// location (<outDir>/...), so without this it 404s on a file that was never created there — a
+// device-diagnosed 2026-09-18 case: `Unable to resolve module ./assets/react-native-logo.png`
+// from a component that ships a bundled image `require()`, same failure shape as the CSS case
+// this originally shipped for, just a different extension. This redirects the resolution ORIGIN
+// back to the real source directory and lets Metro's own resolver take it from there (its usual
+// sourceFile/assetFile decision, including @2x/@3x density-variant lookup for images) — cheaper
+// and more general than hand-rolling either resolution shape here, and it generalizes to ANY
+// non-script asset ngc doesn't copy, not just the two extensions someone happened to hit first.
+// A real copy would need its own re-copy on every source edit during `ngc --watch` (which only
+// re-runs on .ts changes), while this redirect lets Metro's own watchFolders pick up a source
+// edit for free. Applies identically to a release `react-native bundle`, which resolves through
+// this same config.
 //
 // watchFolders/extraNodeModules are intentionally NOT included here — those are monorepo-only
 // pnpm-workspace concerns (deduping a single react/@angular/core copy across packages), not
 // relevant to an external app installing @symbiote-native/angular from npm; a consumer keeps
 // those local to their own metro.config.js if it needs them at all.
-const fs = require('node:fs');
 const path = require('node:path');
 
 function withSymbioteAngularMetroConfig(
@@ -38,10 +45,14 @@ function withSymbioteAngularMetroConfig(
         'styl',
       ],
       resolveRequest: (context, moduleName, platform) => {
-        const isRelativeStyleImport =
+        // ngc only ever emits .ts -> .js into buildRoot (and a bare extensionless specifier is
+        // always a real compiled module, e.g. `./MenuScreen`) — anything else with a relative
+        // specifier and an extension is a non-script file ngc never copied there.
+        const isRelativeNonScriptImport =
           /^\.\.?\//.test(moduleName) &&
-          /\.(css|scss|sass|less|styl)$/.test(moduleName);
-        if (isRelativeStyleImport) {
+          path.extname(moduleName) !== '' &&
+          !/\.(ts|tsx|js|jsx)$/.test(moduleName);
+        if (isRelativeNonScriptImport) {
           const originDir = path.dirname(context.originModulePath);
           if (
             originDir === buildRoot ||
@@ -51,10 +62,15 @@ function withSymbioteAngularMetroConfig(
               projectRoot,
               path.relative(buildRoot, originDir),
             );
-            const sourceFile = path.resolve(sourceDir, moduleName);
-            if (fs.existsSync(sourceFile)) {
-              return { type: 'sourceFile', filePath: sourceFile };
-            }
+            const fakeOrigin = path.join(
+              sourceDir,
+              path.basename(context.originModulePath),
+            );
+            return context.resolveRequest(
+              { ...context, originModulePath: fakeOrigin },
+              moduleName,
+              platform,
+            );
           }
         }
         return context.resolveRequest(context, moduleName, platform);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@symbiote-native/angular",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "description": "SymbioteNative's Angular adapter — a Renderer2/RendererFactory2 with DOM-less bootstrap driving real native iOS/Android views through the same engine as the other adapters.",
   "keywords": [
     "react-native",