@bleedingdev/modern-js-ultramodern-app-tools 3.9.3-ultramodern.13 → 3.9.3-ultramodern.15

package/README.md

@@ -25,6 +25,47 @@ The selector belongs to this config import. Do not add another `appTools()` or
 native application source and dependencies, then a dev-server restart and a
 document reload. The generated entries own mounting and hydration.
 
+## Default React runtime
+
+React applications use the framework's exact `@tanstack/redact@0.2.1` runtime
+by default, on the client, Node SSR and Cloudflare workerd SSR. Keep authoring
+normal React 19 imports; no application dependency or template edits enable it.
+The framework owns Redact, `rsbuild-redact-plugin@0.1.0`, and a React 19 copy for
+the public plugin's version check under pnpm's strict dependency isolation.
+CSR uses that public plugin; SSR uses a fork-owned integration with the same
+exact aliases, including canonical Redact imports, in every environment.
+Custom Document compilers inherit these aliases instead of forcing real React
+externals; the native compiler respects explicit runtime aliases.
+
+```ts
+export default defineConfig({
+  // Omit for Redact with view transitions disabled.
+  redact: { viewTransitions: true },
+  server: { ssr: true },
+});
+```
+
+Set `redact: false` to use real React throughout the application. Invalid values
+fail configuration validation. **RSC applications always use real React**, on
+both server and client: Flight requires React internals Redact does not provide.
+The CLI logs this limitation once rather than mixing runtimes.
+
+Enabled builds require the reviewed pnpm patch whose first line in Redact's
+`dist/server/stream.js` is `// ultramodern-redact-patch: v1`. Missing patches
+fail the build with installation guidance and the `redact: false` escape hatch;
+there is no configuration bypass. The patch fixes streamed Suspense IDs,
+post-hydration IDs, namespace-sensitive segments and deferred reveal ordering.
+
+Federated hosts and remotes must choose the same runtime. Their existing
+renderer manifest contract publishes the effective runtime and hydration
+identity (Redact `0.2.1`, or actual React for opt-out/RSC), and rejects mismatches
+before remote initialization. Redact publishes under React's own share keys
+(`react`, `react-dom`, JSX runtimes), once each, so hosts that govern those
+singletons keep working. Each key carries Redact's real version with strict
+matching, not a React 19 version, and direct Redact imports consume the same
+singletons. The React authoring
+profile continues to describe React's API/compiler, not the runtime override.
+
 ## Native application imports
 
 | Renderer | Component authoring | Application router |

package/dist/cjs/native-composition/config.js

@@ -50,6 +50,7 @@ var external_node_path_default = /*#__PURE__*/ __webpack_require__.n(external_no
 const cli_namespaceObject = require("@modern-js/plugin/cli");
 const utils_namespaceObject = require("@modern-js/utils");
 const external_config_read_context_js_namespaceObject = require("./config-read-context.js");
+const external_redact_config_js_namespaceObject = require("./redact-config.js");
 const external_renderer_registration_js_namespaceObject = require("./renderer-registration.js");
 const external_renderer_router_resolution_js_namespaceObject = require("./renderer-router-resolution.js");
 const external_renderer_selection_js_namespaceObject = require("./renderer-selection.js");
@@ -59,6 +60,7 @@ function isConfigPromise(value) {
 }
 function selectConfig(config, factory) {
     if (!config || 'object' != typeof config || Array.isArray(config)) throw new Error('UltraModern configuration must be an object');
+    (0, external_redact_config_js_namespaceObject.validateRedactConfig)(config.redact);
     const renderer = (0, external_renderer_registration_js_namespaceObject.resolveRendererAdapter)(config.renderer).name;
     const plugins = config.plugins ?? [];
     (0, external_renderer_selection_js_namespaceObject.assertNoAdditionalBasePlugins)(plugins);
@@ -88,6 +90,7 @@ function createDefineConfig(factory) {
 }
 async function resolveUltramodernConfig(config, context) {
     const resolved = 'function' == typeof config ? await config(context) : config;
+    (0, external_redact_config_js_namespaceObject.validateRedactConfig)(resolved.redact);
     const renderer = (0, external_renderer_registration_js_namespaceObject.resolveRendererAdapter)(resolved.renderer).name;
     return void 0 === resolved.renderer ? {
         ...resolved,

package/dist/cjs/native-composition/module-federation-renderer-plugin.js

@@ -72,9 +72,9 @@ function nativeManifestAssetNames(manifest) {
 function resolveRendererFederationRuntimePlugin(registrarUrl = __rslib_import_meta_url__) {
     return (0, external_node_module_namespaceObject.createRequire)(registrarUrl).resolve('@modern-js/federation-runtime/renderer-runtime-plugin');
 }
-function resolveRendererFederationCompatibility(renderer) {
+function resolveRendererFederationCompatibility(renderer, config = {}) {
     const adapter = (0, external_renderer_registration_js_namespaceObject.resolveRendererAdapter)(renderer);
-    if ('native' !== adapter.kind) return (0, module_federation_js_namespaceObject.resolveReactFederationCompatibility)();
+    if ('native' !== adapter.kind) return (0, module_federation_js_namespaceObject.resolveReactFederationCompatibility)(config);
     const owners = adapter.runtime;
     const metadata = (0, external_renderer_profile_js_namespaceObject.resolveRendererProfileMetadata)(renderer);
     const bootstrap = metadata.frameworkPackages.find((owner)=>owner.specifier === owners.bootstrap);
@@ -121,7 +121,7 @@ function createRendererModuleFederationIntegration(renderer, options = {}) {
             api.modifyBundlerChain((chain)=>{
                 const nativeKeys = NATIVE_PLUGINS.filter((key)=>chain.plugins.has(key));
                 if (!nativeKeys.length) return;
-                const compatibility = (0, renderer_contract_namespaceObject.readRendererFederationCompatibility)(options.resolveCompatibility?.() ?? resolveRendererFederationCompatibility(renderer));
+                const compatibility = (0, renderer_contract_namespaceObject.readRendererFederationCompatibility)(options.resolveCompatibility?.() ?? resolveRendererFederationCompatibility(renderer, api.getNormalizedConfig()));
                 const runtimePlugin = (options.resolveRuntimePlugin ?? resolveRendererFederationRuntimePlugin)();
                 const stamped = new WeakSet();
                 const publications = new Set();
@@ -132,6 +132,7 @@ function createRendererModuleFederationIntegration(renderer, options = {}) {
                     const config = {
                         ...original
                     };
+                    if ('react' === renderer) config.shared = (0, module_federation_js_namespaceObject.withReactRuntimeShared)(config.shared, compatibility);
                     if (false === config.manifest) throw (0, renderer_contract_namespaceObject.rendererFederationError)('renderer components require native manifest publication.');
                     if (void 0 !== config.manifest && true !== config.manifest && !record(config.manifest)) throw (0, renderer_contract_namespaceObject.rendererFederationError)('native manifest options must be a boolean or record.');
                     const manifest = record(config.manifest) ? config.manifest : {};

package/dist/cjs/native-composition/native-development.js

@@ -96,6 +96,47 @@ function emittedBytes(result, name) {
     });
 }
 class NativeDevelopment {
+    async captureFederationGraph(result) {
+        try {
+            const entryNames = Object.keys(this.options.getSessionIdentities().identities);
+            const assets = await (0, external_native_federation_dev_assets_js_namespaceObject.collectNativeFederationDevAssets)(result, entryNames, (name)=>emittedBytes(result, name));
+            if (0 === assets.size) return;
+            return {
+                assets,
+                graph: (0, external_native_federation_dev_assets_js_namespaceObject.nativeFederationDevGraph)(result)
+            };
+        } catch  {
+            return;
+        }
+    }
+    retainFinishedGraphs() {
+        const pending = this.finishedFederationGraphs;
+        this.finishedFederationGraphs = [];
+        for (const finished of pending){
+            if (this.closed) return;
+            const revision = (0, external_native_federation_dev_assets_js_namespaceObject.nativeFederationDevRevision)(finished.assets);
+            const graphManifest = finished.graph?.immutableManifest;
+            try {
+                this.retainedFederationAssets = (0, external_native_federation_dev_assets_js_namespaceObject.retainNativeFederationDevAssets)(this.retainedFederationAssets, new Map([
+                    ...finished.assets
+                ].map(([url, asset])=>[
+                        url,
+                        {
+                            ...asset,
+                            revision,
+                            graphManifest
+                        }
+                    ])));
+            } catch (error) {
+                utils_namespaceObject.logger.warn('Native development could not retain a finished federation graph.', error);
+                continue;
+            }
+            this.federationAssets = new Map([
+                ...this.federationAssets,
+                ...this.retainedFederationAssets
+            ]);
+        }
+    }
     notify() {
         for (const waiter of this.waiters)waiter();
         this.waiters.clear();
@@ -277,6 +318,7 @@ class NativeDevelopment {
         this.federationAssets = new Map();
         this.federationCompilers = new Set();
         this.retainedFederationAssets = new Map();
+        this.finishedFederationGraphs = [];
         this.mutableClientAssets = new Set([
             'renderer-assets.json'
         ]);
@@ -422,11 +464,16 @@ class NativeDevelopment {
                             this.invalidate();
                         });
                         candidate.hooks.failed.tap('UltraModernNativeDevelopment', (error)=>this.fail(error));
+                        candidate.hooks.done.tapPromise(runHook, async (result)=>{
+                            if (result.hasErrors()) return;
+                            const finished = await this.captureFederationGraph(result);
+                            if (finished) this.finishedFederationGraphs.push(finished);
+                        });
                     }
                 });
                 api.onDevCompileDone(({ stats })=>{
                     const epoch = this.epoch;
-                    const publishNext = async ()=>{
+                    const publishCurrent = async ()=>{
                         if (this.closed || epoch !== this.epoch) return;
                         const results = 'stats' in stats ? stats.stats : [
                             stats
@@ -440,6 +487,7 @@ class NativeDevelopment {
                             const publication = await this.publish(stats);
                             if (this.closed || epoch !== this.epoch) return;
                             this.retainedFederationAssets = publication.retainedFederationAssets;
+                            this.retainFinishedGraphs();
                             this.federationAssets = new Map([
                                 ...publication.federationAssets,
                                 ...this.retainedFederationAssets
@@ -455,6 +503,13 @@ class NativeDevelopment {
                             api.logger.error('Native development could not load the compiled application.', error);
                         }
                     };
+                    const publishNext = async ()=>{
+                        try {
+                            await publishCurrent();
+                        } finally{
+                            this.retainFinishedGraphs();
+                        }
+                    };
                     this.publication = this.publication.then(publishNext, publishNext);
                     return this.publication;
                 });

package/dist/cjs/native-composition/redact-config.js

@@ -0,0 +1,51 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, getters, values)=>{
+        var define = (defs, kind)=>{
+            for(var key in defs)if (__webpack_require__.o(defs, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+                enumerable: true,
+                [kind]: defs[key]
+            });
+        };
+        define(getters, "get");
+        define(values, "value");
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+function validateRedactConfig(value) {
+    if (void 0 === value || 'boolean' == typeof value) return;
+    if (null !== value && 'object' == typeof value && !Array.isArray(value) && (Object.getPrototypeOf(value) === Object.prototype || null === Object.getPrototypeOf(value)) && Object.keys(value).every((key)=>'viewTransitions' === key) && (!('viewTransitions' in value) || void 0 === value.viewTransitions || 'boolean' == typeof value.viewTransitions)) return;
+    throw new Error('[ultramodern] redact must be a boolean or { viewTransitions?: boolean }. Use redact: false to keep real React.');
+}
+function usesRedact(config) {
+    validateRedactConfig(config.redact);
+    return false !== config.redact && !config.server?.rsc;
+}
+__webpack_require__.d(__webpack_exports__, {
+    usesRedact: ()=>usesRedact,
+    validateRedactConfig: ()=>validateRedactConfig
+});
+exports.usesRedact = __webpack_exports__.usesRedact;
+exports.validateRedactConfig = __webpack_exports__.validateRedactConfig;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "usesRedact",
+    "validateRedactConfig"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/cjs/native-composition/renderer-registration.js

@@ -53,7 +53,9 @@ const rendererRegistrations = {
             '@modern-js/runtime',
             '@modern-js/plugin-tanstack',
             '@modern-js/plugin-i18n',
-            '@tanstack/react-router'
+            '@tanstack/react-router',
+            '@tanstack/redact',
+            'rsbuild-redact-plugin'
         ],
         ownedExtensions: []
     },

package/dist/cjs/native-composition/renderer-selection.js

@@ -91,6 +91,7 @@ const REACT_CLI_PLUGIN_NAMES = [
     '@modern-js/plugin-document',
     '@modern-js/ultramodern-router-integration',
     '@modern-js/ultramodern-ssr-integration',
+    '@modern-js/ultramodern-redact-integration',
     '@modern-js/ultramodern-i18n-integration',
     '@modern-js/i18n-integration',
     '@modern-js/plugin-i18n',

package/dist/cjs/renderers/react/composition.js

@@ -62,6 +62,7 @@ const server_plugin_resolution_js_namespaceObject = require("../../native-compos
 const type_checker_js_namespaceObject = require("../../native-composition/type-checker.js");
 const external_build_metadata_js_namespaceObject = require("./build-metadata.js");
 const external_module_federation_recovery_plugin_js_namespaceObject = require("./module-federation-recovery-plugin.js");
+const external_redact_integration_plugin_js_namespaceObject = require("./redact-integration-plugin.js");
 const external_router_integration_plugin_js_namespaceObject = require("./router-integration-plugin.js");
 const external_rsc_disabled_plugin_js_namespaceObject = require("./rsc-disabled-plugin.js");
 const external_rsc_worker_integration_js_namespaceObject = require("./rsc-worker-integration.js");
@@ -118,6 +119,7 @@ const composeReactRenderer = (options = {})=>{
         (0, i18n_integration_namespaceObject.ultramodernI18nIntegrationPlugin)(),
         (0, external_router_integration_plugin_js_namespaceObject.ultramodernRouterIntegrationPlugin)(),
         (0, external_ssr_integration_plugin_js_namespaceObject.ultramodernSSRIntegrationPlugin)(),
+        (0, external_redact_integration_plugin_js_namespaceObject.ultramodernRedactIntegrationPlugin)(),
         (0, external_module_federation_recovery_plugin_js_namespaceObject.ultramodernModuleFederationRecoveryPlugin)(),
         federationRenderer.plugin,
         backend_federation_build_default()({

package/dist/cjs/renderers/react/module-federation.js

@@ -31,20 +31,28 @@ var __webpack_require__ = {};
 var __webpack_exports__ = {};
 __webpack_require__.r(__webpack_exports__);
 __webpack_require__.d(__webpack_exports__, {
-    resolveReactFederationCompatibility: ()=>resolveReactFederationCompatibility
+    resolveReactFederationCompatibility: ()=>resolveReactFederationCompatibility,
+    withReactRuntimeShared: ()=>withReactRuntimeShared
 });
 const external_node_module_namespaceObject = require("node:module");
 const renderer_contract_namespaceObject = require("@modern-js/federation-runtime/renderer-contract");
+const redact_config_js_namespaceObject = require("../../native-composition/redact-config.js");
 const renderer_installed_profile_js_namespaceObject = require("../../native-composition/renderer-installed-profile.js");
 const renderer_profile_js_namespaceObject = require("../../native-composition/renderer-profile.js");
-function resolveReactFederationCompatibility() {
+const external_redact_integration_plugin_js_namespaceObject = require("./redact-integration-plugin.js");
+function resolveReactFederationCompatibility(config = {}, require1 = (0, external_node_module_namespaceObject.createRequire)(__rslib_import_meta_url__)) {
     const metadata = (0, renderer_profile_js_namespaceObject.resolveRendererProfileMetadata)('react');
-    const runtimeFile = (0, external_node_module_namespaceObject.createRequire)(__rslib_import_meta_url__).resolve('@modern-js/runtime/cli');
-    const runtimeRequire = (0, external_node_module_namespaceObject.createRequire)(runtimeFile);
+    const redacted = (0, redact_config_js_namespaceObject.usesRedact)(config);
+    const runtimeRequire = redacted ? require1 : (0, external_node_module_namespaceObject.createRequire)(require1.resolve('@modern-js/runtime/cli'));
+    const specifier = redacted ? '@tanstack/redact' : 'react';
     const runtime = (0, renderer_installed_profile_js_namespaceObject.readRendererFrameworkPackage)({
-        specifier: 'react',
-        filename: runtimeRequire.resolve('react')
+        specifier,
+        filename: runtimeRequire.resolve(specifier)
     });
+    const effectiveRuntime = {
+        name: redacted ? specifier : runtime.name,
+        version: runtime.version
+    };
     const bootstrap = metadata.frameworkPackages.find((owner)=>'@modern-js/runtime' === owner.specifier);
     if (!bootstrap) throw (0, renderer_contract_namespaceObject.rendererFederationError)('the installed React bootstrap owner is absent.');
     const { renderer, protocolVersion, compiler, hydration, router } = metadata.profile;
@@ -53,22 +61,58 @@ function resolveReactFederationCompatibility() {
             renderer,
             protocolVersion,
             compiler,
-            hydration,
+            hydration: redacted ? effectiveRuntime : hydration,
             router
         },
-        runtime: {
-            name: runtime.name,
-            version: runtime.version
-        },
+        runtime: effectiveRuntime,
         bootstrap: {
             name: bootstrap.name,
             version: bootstrap.version
         }
     });
 }
+function withReactRuntimeShared(shared, compatibility, require1 = (0, external_node_module_namespaceObject.createRequire)(__rslib_import_meta_url__)) {
+    const result = {};
+    for (const entry of Array.isArray(shared) ? shared : [
+        shared
+    ])if ('string' == typeof entry) result[entry] = {};
+    else if (entry && 'object' == typeof entry) Object.assign(result, entry);
+    const redacted = '@tanstack/redact' === compatibility.runtime.name;
+    const aliases = redacted ? (0, external_redact_integration_plugin_js_namespaceObject.resolveRedactAliases)(require1) : {};
+    const reactSpelling = new Map();
+    for (const [request, target] of Object.entries(external_redact_integration_plugin_js_namespaceObject.REDACT_ALIASES))if (!reactSpelling.has(target)) reactSpelling.set(target, request);
+    const requests = redacted ? Object.keys(aliases).map((key)=>key.slice(0, -1)) : [
+        'react',
+        'react-dom',
+        'react-dom/client',
+        'react/jsx-runtime',
+        'react/jsx-dev-runtime'
+    ];
+    for (const request of requests){
+        const shareKey = redacted ? reactSpelling.get(external_redact_integration_plugin_js_namespaceObject.REDACT_ALIASES[request] ?? request) ?? request : request;
+        const version = !redacted && request.startsWith('react-dom') ? compatibility.profile.hydration.version : compatibility.runtime.version;
+        const previous = result[request];
+        if (previous && 'object' == typeof previous && 'shareKey' in previous && previous.shareKey !== request && previous.shareKey !== shareKey) throw (0, renderer_contract_namespaceObject.rendererFederationError)(`conflicting runtime shareKey for ${request}; React and Redact containers cannot mix.`);
+        result[request] = {
+            ...previous && 'object' == typeof previous ? previous : {},
+            ...redacted ? {
+                import: aliases[`${request}$`],
+                shareKey
+            } : {},
+            version,
+            requiredVersion: version,
+            strictVersion: true,
+            singleton: true,
+            treeShaking: false
+        };
+    }
+    return result;
+}
 exports.resolveReactFederationCompatibility = __webpack_exports__.resolveReactFederationCompatibility;
+exports.withReactRuntimeShared = __webpack_exports__.withReactRuntimeShared;
 for(var __rspack_i in __webpack_exports__)if (-1 === [
-    "resolveReactFederationCompatibility"
+    "resolveReactFederationCompatibility",
+    "withReactRuntimeShared"
 ].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
 Object.defineProperty(exports, '__esModule', {
     value: true