npm - @module-federation/bridge-react - Versions diffs - 0.0.0-docs-remove-invalid-lark-link-20251205062649 - Mend

@module-federation/bridge-react 0.0.0-docs-remove-invalid-lark-link-20251205062649

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (112) hide show

package/CHANGELOG.md +728 -0
package/LICENSE +21 -0
package/README.md +131 -0
package/__tests__/bridge.spec.tsx +160 -0
package/__tests__/createLazyComponent.spec.tsx +209 -0
package/__tests__/prefetch.spec.ts +156 -0
package/__tests__/router.spec.tsx +82 -0
package/__tests__/setupTests.ts +8 -0
package/__tests__/util.ts +36 -0
package/dist/base.cjs.js +29 -0
package/dist/base.d.ts +311 -0
package/dist/base.es.js +30 -0
package/dist/bridge-base-CPSTBjEp.mjs +211 -0
package/dist/bridge-base-RStDxH71.js +226 -0
package/dist/createHelpers-B_L612IN.js +190 -0
package/dist/createHelpers-Ui5pt7je.mjs +191 -0
package/dist/data-fetch-server-middleware.cjs.js +163 -0
package/dist/data-fetch-server-middleware.d.ts +15 -0
package/dist/data-fetch-server-middleware.es.js +164 -0
package/dist/data-fetch-utils.cjs.js +24 -0
package/dist/data-fetch-utils.d.ts +81 -0
package/dist/data-fetch-utils.es.js +26 -0
package/dist/index-DRSBaSu3.js +45 -0
package/dist/index-DyQNwY2M.mjs +46 -0
package/dist/index.cjs.js +125 -0
package/dist/index.d.ts +299 -0
package/dist/index.es.js +109 -0
package/dist/index.esm-BWaKho-8.js +491 -0
package/dist/index.esm-CPwSeCvw.mjs +492 -0
package/dist/lazy-load-component-plugin-CSRkMmKF.js +521 -0
package/dist/lazy-load-component-plugin-DXqhuywC.mjs +522 -0
package/dist/lazy-load-component-plugin.cjs.js +6 -0
package/dist/lazy-load-component-plugin.d.ts +16 -0
package/dist/lazy-load-component-plugin.es.js +6 -0
package/dist/lazy-utils.cjs.js +24 -0
package/dist/lazy-utils.d.ts +149 -0
package/dist/lazy-utils.es.js +24 -0
package/dist/plugin.cjs.js +14 -0
package/dist/plugin.d.ts +22 -0
package/dist/plugin.es.js +14 -0
package/dist/prefetch-A3QkU5oZ.js +1272 -0
package/dist/prefetch-zMJL79zx.mjs +1273 -0
package/dist/router-v5.cjs.js +55 -0
package/dist/router-v5.d.ts +18 -0
package/dist/router-v5.es.js +32 -0
package/dist/router-v6.cjs.js +84 -0
package/dist/router-v6.d.ts +20 -0
package/dist/router-v6.es.js +61 -0
package/dist/router-v7.cjs.js +83 -0
package/dist/router-v7.d.ts +20 -0
package/dist/router-v7.es.js +61 -0
package/dist/router.cjs.js +82 -0
package/dist/router.d.ts +20 -0
package/dist/router.es.js +60 -0
package/dist/utils-dUgb9Jkm.mjs +2016 -0
package/dist/utils-tM9yE73c.js +2015 -0
package/dist/v18.cjs.js +15 -0
package/dist/v18.d.ts +114 -0
package/dist/v18.es.js +15 -0
package/dist/v19.cjs.js +15 -0
package/dist/v19.d.ts +115 -0
package/dist/v19.es.js +15 -0
package/jest.config.ts +21 -0
package/package.json +173 -0
package/project.json +23 -0
package/src/base.ts +50 -0
package/src/index.ts +50 -0
package/src/lazy/AwaitDataFetch.tsx +215 -0
package/src/lazy/constant.ts +30 -0
package/src/lazy/createLazyComponent.tsx +411 -0
package/src/lazy/data-fetch/cache.ts +291 -0
package/src/lazy/data-fetch/call-data-fetch.ts +13 -0
package/src/lazy/data-fetch/data-fetch-server-middleware.ts +196 -0
package/src/lazy/data-fetch/index.ts +16 -0
package/src/lazy/data-fetch/inject-data-fetch.ts +109 -0
package/src/lazy/data-fetch/prefetch.ts +112 -0
package/src/lazy/data-fetch/runtime-plugin.ts +115 -0
package/src/lazy/index.ts +35 -0
package/src/lazy/logger.ts +6 -0
package/src/lazy/types.ts +75 -0
package/src/lazy/utils.ts +372 -0
package/src/lazy/wrapNoSSR.tsx +10 -0
package/src/modern-app-env.d.ts +2 -0
package/src/plugins/lazy-load-component-plugin.spec.ts +21 -0
package/src/plugins/lazy-load-component-plugin.ts +57 -0
package/src/provider/context.tsx +4 -0
package/src/provider/plugin.ts +22 -0
package/src/provider/versions/bridge-base.tsx +150 -0
package/src/provider/versions/legacy.ts +87 -0
package/src/provider/versions/v18.ts +47 -0
package/src/provider/versions/v19.ts +48 -0
package/src/remote/RemoteAppWrapper.tsx +108 -0
package/src/remote/base-component/component.tsx +2 -0
package/src/remote/base-component/create.tsx +23 -0
package/src/remote/base-component/index.tsx +10 -0
package/src/remote/createHelpers.tsx +130 -0
package/src/remote/router-component/component.tsx +104 -0
package/src/remote/router-component/create.tsx +23 -0
package/src/remote/router-component/index.tsx +10 -0
package/src/router/default.tsx +73 -0
package/src/router/v5.tsx +43 -0
package/src/router/v6.tsx +74 -0
package/src/router/v7.tsx +75 -0
package/src/types.ts +147 -0
package/src/utils/index.ts +44 -0
package/src/v18.ts +9 -0
package/src/v19.ts +9 -0
package/tsconfig.json +42 -0
package/tsconfig.node.json +11 -0
package/tsconfig.spec.json +26 -0
package/vite.config.ts +112 -0
package/vitest.config.ts +27 -0

package/__tests__/router.spec.tsx ADDED Viewed

@@ -0,0 +1,82 @@
+// Test file for router
+import { render } from '@testing-library/react';
+import React from 'react';
+import {
+  Link,
+  Routes,
+  Route,
+  Outlet,
+  createBrowserRouter,
+} from 'react-router-dom';
+import { BrowserRouter, RouterProvider } from '../src/router/default';
+import { RouterContext } from '../src/provider/context';
+import { getHtml, getWindowImpl } from './util';
+describe('react router proxy', () => {
+  it('BrowserRouter not wraper context', async () => {
+    let { container } = render(
+      <RouterContext.Provider value={{ basename: '/test' } as any}>
+        <BrowserRouter basename="/" window={getWindowImpl('/test', false)}>
+          <ul>
+            <li>
+              <Link to="/">Home</Link>
+            </li>
+            <li>
+              <Link to="/detail">Detail</Link>
+            </li>
+          </ul>
+          <Routes>
+            <Route path="/" Component={() => <div>home page</div>} />
+            <Route path="/detail" Component={() => <div>detail page</div>} />
+          </Routes>
+        </BrowserRouter>
+      </RouterContext.Provider>,
+    );
+    expect(getHtml(container)).toMatch('home page');
+  });
+  it('RouterProvider', async () => {
+    function Layout() {
+      return (
+        <>
+          <ul>
+            <li>
+              <Link to="/">Home</Link>
+            </li>
+            <li>
+              <Link to="/detail">Detail</Link>
+            </li>
+          </ul>
+          <Outlet />
+        </>
+      );
+    }
+    const router = createBrowserRouter(
+      [
+        {
+          path: '/',
+          element: <Layout />,
+          children: [
+            {
+              index: true,
+              element: <div>home page</div>,
+            },
+            {
+              path: '/detail',
+              element: <div>detail page</div>,
+            },
+          ],
+        },
+      ],
+      {
+        window: getWindowImpl('/test', false),
+      },
+    );
+    let { container } = render(
+      <RouterContext.Provider value={{ basename: '/test' } as any}>
+        <RouterProvider router={router} />
+      </RouterContext.Provider>,
+    );
+    expect(getHtml(container)).toMatch('home page');
+  });
+});

package/__tests__/setupTests.ts ADDED Viewed

@@ -0,0 +1,8 @@
+// In vitest, you can use the setupFiles option in your configuration file to import any necessary setup files for your tests.
+// For example, if you want to use testing-library's custom matchers, you can import them in a setup file like this:
+import '@testing-library/jest-dom';
+// Fix TextEncoder/TextDecoder not defined in Node.js
+import { TextEncoder, TextDecoder } from 'util';
+global.TextEncoder = TextEncoder;
+global.TextDecoder = TextDecoder as any;

package/__tests__/util.ts ADDED Viewed

@@ -0,0 +1,36 @@
+import { JSDOM } from 'jsdom';
+import { prettyDOM } from '@testing-library/react';
+export async function sleep(time: number) {
+  return new Promise((resolve) => {
+    setTimeout(() => {
+      resolve(null);
+    }, time);
+  });
+}
+export function createContainer() {
+  const container = document.createElement('div');
+  container.setAttribute('id', 'container');
+  document.body.appendChild(container);
+  return {
+    clean: () => {
+      document.body.removeChild(container);
+    },
+    container,
+  };
+}
+export function getWindowImpl(initialUrl: string, isHash = false): Window {
+  // Need to use our own custom DOM in order to get a working history
+  const dom = new JSDOM(`<!DOCTYPE html>`, { url: 'http://localhost/' });
+  dom.window.history.replaceState(null, '', (isHash ? '#' : '') + initialUrl);
+  return dom.window as unknown as Window;
+}
+export function getHtml(container: HTMLElement) {
+  return prettyDOM(container, undefined, {
+    highlight: false,
+  });
+}

package/dist/base.cjs.js ADDED Viewed

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const createHelpers = require("./createHelpers-B_L612IN.js");
+const lazyLoadComponentPlugin = require("./lazy-load-component-plugin-CSRkMmKF.js");
+const lazyUtils = require("./utils-tM9yE73c.js");
+const dataFetchUtils = require("./data-fetch-utils.cjs.js");
+const prefetch = require("./prefetch-A3QkU5oZ.js");
+const createRemoteAppComponent = createHelpers.createRemoteAppComponentFactory(createHelpers.RemoteAppWrapper);
+const createRemoteComponent = createHelpers.createDeprecatedRemoteComponentFactory(
+  createRemoteAppComponent
+);
+exports.createBridgeComponent = createHelpers.createBridgeComponent;
+exports.autoFetchDataPlugin = lazyLoadComponentPlugin.autoFetchData;
+exports.collectSSRAssets = lazyLoadComponentPlugin.collectSSRAssets;
+exports.createLazyComponent = lazyLoadComponentPlugin.createLazyComponent;
+exports.lazyLoadComponentPlugin = lazyLoadComponentPlugin.lazyLoadComponentPlugin;
+exports.CacheSize = lazyUtils.CacheSize;
+exports.CacheTime = lazyUtils.CacheTime;
+exports.ERROR_TYPE = lazyUtils.ERROR_TYPE;
+exports.cache = lazyUtils.cache;
+exports.clearStore = lazyUtils.clearStore;
+exports.configureCache = lazyUtils.configureCache;
+exports.generateKey = lazyUtils.generateKey;
+exports.revalidateTag = lazyUtils.revalidateTag;
+exports.setSSREnv = lazyUtils.setSSREnv;
+exports.callDataFetch = dataFetchUtils.callDataFetch;
+exports.prefetch = prefetch.prefetch;
+exports.createRemoteAppComponent = createRemoteAppComponent;
+exports.createRemoteComponent = createRemoteComponent;

package/dist/base.d.ts ADDED Viewed

@@ -0,0 +1,311 @@
+import { default as default_2 } from 'react';
+import { ForwardRefExoticComponent } from 'react';
+import { getInstance } from '@module-federation/runtime';
+import { ModuleFederationRuntimePlugin } from '@module-federation/runtime';
+import * as React_2 from 'react';
+import { ReactNode } from 'react';
+import { RefAttributes } from 'react';
+export declare const autoFetchDataPlugin: () => ModuleFederationRuntimePlugin;
+export declare function cache<T>(fn: DataFetch<T>, options?: CacheOptions): DataFetch<T>;
+declare interface CacheConfig {
+    maxSize?: number;
+    unstable_shouldDisable?: ({ request, }: {
+        request: Request;
+    }) => boolean | Promise<boolean>;
+}
+declare interface CacheOptions {
+    tag?: string | string[];
+    maxAge?: number;
+    revalidate?: number;
+    getKey?: <Args extends any[]>(...args: Args) => string;
+    onCache?: (info: CacheStatsInfo) => boolean;
+}
+export declare const CacheSize: {
+    readonly KB: 1024;
+    readonly MB: number;
+    readonly GB: number;
+};
+export declare interface CacheStatsInfo {
+    status: CacheStatus;
+    key: string | symbol;
+    params: DataFetchParams;
+    result: any;
+}
+export declare type CacheStatus = 'hit' | 'stale' | 'miss';
+export declare const CacheTime: {
+    readonly SECOND: 1000;
+    readonly MINUTE: number;
+    readonly HOUR: number;
+    readonly DAY: number;
+    readonly WEEK: number;
+    readonly MONTH: number;
+};
+export declare function callDataFetch(): Promise<void>;
+export declare function clearStore(): void;
+export declare function collectSSRAssets(options: CollectSSRAssetsOptions): default_2.ReactNode[];
+export declare type CollectSSRAssetsOptions = {
+    id: string;
+    instance: ReturnType<typeof getInstance>;
+    injectScript?: boolean;
+    injectLink?: boolean;
+};
+export declare function configureCache(config: CacheConfig): void;
+export declare function createBridgeComponent<T = any>(bridgeInfo: Omit<ProviderFnParams<T>, 'createRoot'>): () => {
+    render(info: RenderParams): Promise<void>;
+    destroy(info: DestroyParams): void;
+};
+export declare function createLazyComponent<T, E extends keyof T>(options: CreateLazyComponentOptions<T, E>): (props: T[E] extends (...args: any) => any ? Parameters<T[E]>[0] extends undefined ? ReactKey : Parameters<T[E]>[0] & ReactKey : ReactKey) => default_2.JSX.Element;
+export declare type CreateLazyComponentOptions<T, E extends keyof T> = {
+    loader: () => Promise<T>;
+    instance: ReturnType<typeof getInstance>;
+    loading: default_2.ReactNode;
+    delayLoading?: number;
+    fallback: ReactNode | ((errorInfo: ErrorInfo) => ReactNode);
+    export?: E;
+    dataFetchParams?: DataFetchParams;
+    noSSR?: boolean;
+    injectScript?: boolean;
+    injectLink?: boolean;
+};
+export declare const createRemoteAppComponent: <T = Record<string, unknown>, E extends keyof T = keyof T>(info: LazyRemoteComponentInfo<T, E>) => ForwardRefExoticComponent<Omit<RemoteComponentProps_2<Record<string, unknown>>, "ref"> & RefAttributes<HTMLDivElement>>;
+/**
+ * @deprecated createRemoteComponent is deprecated, please use createRemoteAppComponent instead!
+ */
+export declare const createRemoteComponent: <T = Record<string, unknown>, E extends keyof T = keyof T>(info: LazyRemoteComponentInfo<T, E>) => any;
+export declare interface CreateRootOptions {
+    identifierPrefix?: string;
+    onRecoverableError?: (error: unknown, errorInfo: unknown) => void;
+}
+/**
+ * Options for creating a React root
+ */
+declare interface CreateRootOptions_2 {
+    identifierPrefix?: string;
+    onRecoverableError?: (error: unknown) => void;
+    transitionCallbacks?: unknown;
+}
+declare type DataFetch<T> = (params: DataFetchParams) => Promise<T>;
+export declare type DataFetchParams = {
+    isDowngrade: boolean;
+    _id?: string;
+} & Record<string, unknown>;
+/**
+ * Parameters for the destroy function
+ */
+export declare interface DestroyParams {
+    moduleName: string;
+    dom: HTMLElement;
+}
+export declare const ERROR_TYPE: {
+    DATA_FETCH: number;
+    LOAD_REMOTE: number;
+    UNKNOWN: number;
+};
+declare type ErrorInfo = {
+    error: Error;
+    errorType: number;
+    dataFetchMapKey?: string;
+};
+export declare function generateKey(dataFetchOptions: DataFetchParams): string;
+export declare function lazyLoadComponentPlugin(): ModuleFederationRuntimePlugin;
+export declare type LazyRemoteComponentInfo<T, _E extends keyof T> = RemoteComponentParams<T>;
+export declare type NoSSRRemoteInfo = {
+    name: string;
+    version: string;
+    ssrPublicPath: string;
+    ssrRemoteEntry: string;
+    globalName: string;
+};
+export declare function prefetch(options: PrefetchOptions): Promise<void>;
+declare type PrefetchOptions = {
+    id: string;
+    instance: ReturnType<typeof getInstance>;
+    dataFetchParams?: DataFetchParams;
+    preloadComponentResource?: boolean;
+};
+/**
+ * Parameters for the provider function
+ */
+export declare interface ProviderFnParams<T> {
+    rootComponent: React_2.ComponentType<T>;
+    render?: (App: React_2.ReactElement, id?: HTMLElement | string) => RootType | Promise<RootType>;
+    createRoot?: (container: Element | DocumentFragment, options?: CreateRootOptions_2) => Root_2;
+    /**
+     * Default options to pass to createRoot for React 18 and 19
+     * These options will be used when creating a root unless overridden by rootOptions in render params
+     * @example
+     * {
+     *   identifierPrefix: 'app-',
+     *   onRecoverableError: (err) => console.error(err)
+     * }
+     */
+    defaultRootOptions?: CreateRootOptions_2;
+}
+/**
+ * Parameters for the provider function
+ */
+export declare interface ProviderParams {
+    moduleName?: string;
+    basename?: string;
+    memoryRoute?: {
+        entryPath: string;
+        initialState?: Record<string, unknown>;
+    };
+    style?: React_2.CSSProperties;
+    className?: string;
+}
+declare type ReactKey = {
+    key?: default_2.Key | null;
+};
+/**
+ * Parameters for the remote component loader
+ */
+export declare interface RemoteComponentParams<T = Record<string, unknown>, E extends keyof T = keyof T> {
+    loader: () => Promise<T>;
+    loading: React_2.ReactNode;
+    fallback: React_2.ComponentType<{
+        error: Error;
+    }>;
+    export?: E;
+    props?: T;
+}
+/**
+ * Parameters for the remote component
+ */
+export declare interface RemoteComponentProps<T = Record<string, unknown>> {
+    props?: T;
+    fallback?: React_2.ComponentType<{
+        error: Error;
+    }>;
+    loading?: React_2.ReactNode;
+    [key: string]: unknown;
+}
+/**
+ * Parameters for the remote component
+ */
+declare interface RemoteComponentProps_2<T = Record<string, unknown>> {
+    props?: T;
+    fallback?: React_2.ComponentType<{
+        error: Error;
+    }>;
+    loading?: React_2.ReactNode;
+    [key: string]: unknown;
+}
+/**
+ * Interface for a remote module provider
+ */
+export declare interface RemoteModule {
+    provider: () => {
+        render: (info: RenderFnParams) => void;
+        destroy: (info: {
+            dom: any;
+        }) => void;
+    };
+}
+/**
+ * Parameters for the render function, extending ProviderParams
+ */
+export declare interface RenderFnParams extends ProviderParams {
+    dom: HTMLElement;
+    fallback?: React_2.ComponentType<{
+        error: Error;
+    }>;
+    [key: string]: unknown;
+}
+/**
+ * Parameters for the render function
+ */
+export declare interface RenderParams {
+    moduleName?: string;
+    basename?: string;
+    memoryRoute?: {
+        entryPath: string;
+        initialState?: Record<string, unknown>;
+    };
+    dom: HTMLElement;
+    /**
+     * Options to pass to createRoot for React 18 and 19
+     * @example
+     * {
+     *   identifierPrefix: 'app-',
+     *   onRecoverableError: (err) => console.error(err)
+     * }
+     */
+    rootOptions?: CreateRootOptions_2;
+    [key: string]: unknown;
+}
+export declare function revalidateTag(tag: string): void;
+export declare interface Root {
+    render(children: React.ReactNode): void;
+    unmount(): void;
+}
+/**
+ * Interface for a React root object
+ */
+declare interface Root_2 {
+    render(children: React_2.ReactNode): void;
+    unmount(): void;
+}
+/**
+ * Type for a root element, which can be either an HTMLElement or a React root
+ */
+export declare type RootType = HTMLElement | Root_2;
+export declare function setSSREnv({ fetchServerQuery, }: {
+    fetchServerQuery?: Record<string, unknown>;
+}): void;
+export { }
+declare module '@module-federation/runtime-core' {
+    interface ModuleFederation {
+        createLazyComponent<T, E extends keyof T>(options: Omit<CreateLazyComponentOptions<T, E>, 'instance'>): ReturnType<typeof createLazyComponent<T, E>>;
+        prefetch(options: Omit<PrefetchOptions, 'instance'>): ReturnType<typeof prefetch>;
+        collectSSRAssets(options: Omit<Parameters<typeof collectSSRAssets>[0], 'instance'>): ReturnType<typeof collectSSRAssets>;
+    }
+}

package/dist/base.es.js ADDED Viewed

@@ -0,0 +1,30 @@
+import { c as createDeprecatedRemoteComponentFactory, a as createRemoteAppComponentFactory, R as RemoteAppWrapper } from "./createHelpers-Ui5pt7je.mjs";
+import { b } from "./createHelpers-Ui5pt7je.mjs";
+import { b as b2, a, c, l } from "./lazy-load-component-plugin-DXqhuywC.mjs";
+import { C, a as a2, E, b as b3, d, c as c2, g, r, s } from "./utils-dUgb9Jkm.mjs";
+import { callDataFetch } from "./data-fetch-utils.es.js";
+import { p } from "./prefetch-zMJL79zx.mjs";
+const createRemoteAppComponent = createRemoteAppComponentFactory(RemoteAppWrapper);
+const createRemoteComponent = createDeprecatedRemoteComponentFactory(
+  createRemoteAppComponent
+);
+export {
+  C as CacheSize,
+  a2 as CacheTime,
+  E as ERROR_TYPE,
+  b2 as autoFetchDataPlugin,
+  b3 as cache,
+  callDataFetch,
+  d as clearStore,
+  a as collectSSRAssets,
+  c2 as configureCache,
+  b as createBridgeComponent,
+  c as createLazyComponent,
+  createRemoteAppComponent,
+  createRemoteComponent,
+  g as generateKey,
+  l as lazyLoadComponentPlugin,
+  p as prefetch,
+  r as revalidateTag,
+  s as setSSREnv
+};