remote-reload-utils 0.0.11 → 0.0.13

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 (10) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/README.md +3 -3
  3. package/dist/components/{RemoteModuleCard.d.ts → RemoteModuleProvider.d.ts} +19 -8
  4. package/dist/components/SuspenseLoader.d.ts +1 -1
  5. package/dist/components/index.d.ts +2 -2
  6. package/dist/event-bus/index.d.ts +1 -1
  7. package/dist/index.d.ts +2 -2
  8. package/dist/main.cjs +20 -13
  9. package/dist/main.js +11 -10
  10. package/package.json +2 -1
package/CHANGELOG.md CHANGED
@@ -7,6 +7,20 @@
7
7
 
8
8
  ## [未发布]
9
9
 
10
+ ## [0.0.13] - 2026-03-17
11
+
12
+ ### Release
13
+
14
+ - Published version 0.0.13 with patch bump
15
+
16
+
17
+ ## [0.0.12] - 2026-03-16
18
+
19
+ ### Release
20
+
21
+ - Published version 0.0.12 with patch bump
22
+
23
+
10
24
  ## [0.0.11] - 2026-03-16
11
25
 
12
26
  ### Release
@@ -137,6 +151,10 @@
137
151
 
138
152
  | 版本 | 日期 | 主要变更 |
139
153
  |------|------|----------|
154
+ | 0.0.13 | 2026-03-17 | patch 版本发布 |
155
+ |------|------|----------|
156
+ | 0.0.12 | 2026-03-16 | patch 版本发布 |
157
+ |------|------|----------|
140
158
  | 0.0.11 | 2026-03-16 | patch 版本发布 |
141
159
  |------|------|----------|
142
160
  | 0.0.10 | 2026-03-15 | patch 版本发布 |
package/README.md CHANGED
@@ -58,13 +58,13 @@ useEffect(() => {
58
58
  #### 2. 使用 React 组件加载远程模块
59
59
 
60
60
  ```tsx
61
- import { RemoteModuleCard, ErrorBoundary, lazyRemote } from 'remote-reload-utils';
61
+ import { RemoteModuleProvider, ErrorBoundary, lazyRemote } from 'remote-reload-utils';
62
62
  import React, { Suspense } from 'react';
63
63
 
64
- // 方式一：使用 RemoteModuleCard 组件（推荐）
64
+ // 方式一：使用 RemoteModuleProvider 组件（推荐）
65
65
  function App() {
66
66
  return (
67
- <RemoteModuleCard
67
+ <RemoteModuleProvider
68
68
  pkg="@myorg/remote-app"
69
69
  version="^1.0.0"
70
70
  moduleName="Dashboard"
package/dist/components/{RemoteModuleCard.d.ts → RemoteModuleProvider.d.ts} RENAMED
@@ -34,16 +34,27 @@ interface ModuleState {
34
34
  component: React.ComponentType<any> | null;
35
35
  }
36
36
  /**
37
- * 内部 Hook：加载远程模块
37
+ * Hook 选项：加载远程模块
38
38
  */
39
- export declare function useRemoteModule({ pkg, version, moduleName, scopeName, onError, onLoad, }: RemoteModuleCardProps): ModuleState;
39
+ export interface UseRemoteModuleOptions {
40
+ pkg: string;
41
+ version: string;
42
+ moduleName: string;
43
+ scopeName: string;
44
+ onError?: (error: Error) => void;
45
+ onLoad?: (component: React.ComponentType<any>) => void;
46
+ retryKey?: number;
47
+ }
48
+ /**
49
+ * Hook：加载远程模块
50
+ */
51
+ export declare function useRemoteModule({ pkg, version, moduleName, scopeName, onError, onLoad, retryKey, }: UseRemoteModuleOptions): ModuleState;
40
52
  /**
41
- * 内部组件：纯内容渲染（不含 Suspense/ErrorBoundary）
53
+ * 远程模块渲染器：纯内容渲染（不含 Suspense/ErrorBoundary）
42
54
  */
43
- export declare function RemoteModuleCardContent({ pkg, version, moduleName, scopeName, loadingFallback, errorFallback, componentProps, className, style, onError, onLoad, }: RemoteModuleCardProps): import("react/jsx-runtime").JSX.Element | null;
55
+ export declare function RemoteModuleRenderer({ pkg, version, moduleName, scopeName, loadingFallback, errorFallback, componentProps, className, style, onError, onLoad, }: RemoteModuleCardProps): import("react/jsx-runtime").JSX.Element | null;
44
56
  /**
45
- * 远程模块卡片组件
46
- * 负责加载和渲染远程模块，内置 Suspense 和 ErrorBoundary 支持
57
+ * 远程模块提供者：带 Suspense 和 ErrorBoundary 的完整组件
47
58
  *
48
59
  * @features
49
60
  * - 自动加载远程模块
@@ -54,7 +65,7 @@ export declare function RemoteModuleCardContent({ pkg, version, moduleName, scop
54
65
  *
55
66
  * @example
56
67
  * ```tsx
57
- * <RemoteModuleCard
68
+ * <RemoteModuleProvider
58
69
  * pkg="@myorg/remote-app"
59
70
  * version="^1.0.0"
60
71
  * moduleName="Dashboard"
@@ -80,5 +91,5 @@ export declare function RemoteModuleCardContent({ pkg, version, moduleName, scop
80
91
  * </Suspense>
81
92
  * ```
82
93
  */
83
- export declare function RemoteModuleCard(props: RemoteModuleCardProps): import("react/jsx-runtime").JSX.Element;
94
+ export declare function RemoteModuleProvider(props: RemoteModuleCardProps): import("react/jsx-runtime").JSX.Element;
84
95
  export {};
package/dist/components/SuspenseLoader.d.ts CHANGED
@@ -58,7 +58,7 @@ export declare function lazyRemote(options: LazyRemoteOptions): React.LazyExotic
58
58
  * // 与 ErrorBoundary 配合使用
59
59
  * <ErrorBoundary fallback={(error) => <div>Error: {error.message}</div>}>
60
60
  * <SuspenseRemote fallback={<Spinner />}>
61
- * <RemoteModuleCard pkg="@myorg/remote-app" version="^1.0.0" moduleName="Dashboard" scopeName="myorg" />
61
+ * <RemoteModuleProvider pkg="@myorg/remote-app" version="^1.0.0" moduleName="Dashboard" scopeName="myorg" />
62
62
  * </SuspenseRemote>
63
63
  * </ErrorBoundary>
64
64
  * ```
package/dist/components/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  export { ErrorBoundary } from './ErrorBoundary';
2
2
  export type { ErrorBoundaryProps } from './ErrorBoundary';
3
- export { RemoteModuleCard } from './RemoteModuleCard';
4
- export type { RemoteModuleCardProps } from './RemoteModuleCard';
3
+ export { RemoteModuleProvider, RemoteModuleRenderer, useRemoteModule } from './RemoteModuleProvider';
4
+ export type { RemoteModuleCardProps, UseRemoteModuleOptions } from './RemoteModuleProvider';
5
5
  export { lazyRemote, SuspenseRemote, SuspenseRemoteLoader, withRemote, useRemoteModuleHook, } from './SuspenseLoader';
6
6
  export type { LazyRemoteOptions, SuspenseRemoteProps, SuspenseRemoteWithPropsProps } from './SuspenseLoader';
package/dist/event-bus/index.d.ts CHANGED
@@ -13,7 +13,7 @@ interface EventEmitterOptions {
13
13
  once?: boolean;
14
14
  filter?: (data: any, meta: EventMeta) => boolean;
15
15
  }
16
- declare class EventBusClass {
16
+ export declare class EventBusClass {
17
17
  private listeners;
18
18
  private eventHistory;
19
19
  private maxHistorySize;
package/dist/index.d.ts CHANGED
@@ -8,5 +8,5 @@ export { checkRemoteHealth, checkModuleLoadable, getRemoteHealthReport, formatHe
8
8
  export { eventBus, createEventBus, } from './event-bus';
9
9
  export type { LoadRemoteOptions, VersionCache, PreloadOptions, PreloadCacheItem, PreloadStatus, } from './types';
10
10
  export { fallbackPlugin } from './plugins/fallback';
11
- export { ErrorBoundary, RemoteModuleCard, lazyRemote, SuspenseRemote, SuspenseRemoteLoader, withRemote, useRemoteModuleHook, } from './components';
12
- export type { ErrorBoundaryProps, RemoteModuleCardProps, LazyRemoteOptions, SuspenseRemoteProps, SuspenseRemoteWithPropsProps, } from './components';
11
+ export { ErrorBoundary, RemoteModuleProvider, RemoteModuleRenderer, useRemoteModule, lazyRemote, SuspenseRemote, SuspenseRemoteLoader, withRemote, useRemoteModuleHook, } from './components';
12
+ export type { ErrorBoundaryProps, RemoteModuleCardProps, UseRemoteModuleOptions, LazyRemoteOptions, SuspenseRemoteProps, SuspenseRemoteWithPropsProps, } from './components';
package/dist/main.cjs CHANGED
@@ -52,8 +52,9 @@ __webpack_require__.d(__webpack_exports__, {
52
52
  tryLoadRemote: ()=>tryLoadRemote,
53
53
  getVersionCache: ()=>getVersionCache,
54
54
  eventBus: ()=>eventBus,
55
- loadRemoteMultiVersion: ()=>loadRemoteMultiVersion,
55
+ RemoteModuleRenderer: ()=>RemoteModuleRenderer,
56
56
  clearPreloadCache: ()=>clearPreloadCache,
57
+ loadRemoteMultiVersion: ()=>loadRemoteMultiVersion,
57
58
  getRemoteHealthReport: ()=>getRemoteHealthReport,
58
59
  checkModuleLoadable: ()=>checkModuleLoadable,
59
60
  getStableVersions: ()=>getStableVersions,
@@ -66,6 +67,8 @@ __webpack_require__.d(__webpack_exports__, {
66
67
  getCompatibleReactVersions: ()=>getCompatibleReactVersions,
67
68
  SuspenseRemote: ()=>SuspenseRemote,
68
69
  unloadRemote: ()=>unloadRemote,
70
+ useRemoteModule: ()=>useRemoteModule,
71
+ RemoteModuleProvider: ()=>RemoteModuleProvider,
69
72
  cancelPreload: ()=>cancelPreload,
70
73
  findCompatibleVersion: ()=>findCompatibleVersion,
71
74
  getLoadedRemotes: ()=>getLoadedRemotes,
@@ -73,7 +76,6 @@ __webpack_require__.d(__webpack_exports__, {
73
76
  preloadRemote: ()=>preloadRemote,
74
77
  satisfiesVersion: ()=>satisfiesVersion,
75
78
  formatHealthStatus: ()=>formatHealthStatus,
76
- RemoteModuleCard: ()=>RemoteModuleCard,
77
79
  unloadAll: ()=>unloadAll,
78
80
  setVersionCache: ()=>setVersionCache,
79
81
  lazyRemote: ()=>lazyRemote,
@@ -824,7 +826,7 @@ class ErrorBoundary extends external_react_default().Component {
824
826
  return this.props.children;
825
827
  }
826
828
  }
827
- function useRemoteModule({ pkg, version, moduleName, scopeName, onError, onLoad }) {
829
+ function useRemoteModule({ pkg, version, moduleName, scopeName, onError, onLoad, retryKey = 0 }) {
828
830
  const [moduleState, setModuleState] = (0, external_react_namespaceObject.useState)({
829
831
  loading: true,
830
832
  error: null,
@@ -878,11 +880,12 @@ function useRemoteModule({ pkg, version, moduleName, scopeName, onError, onLoad
878
880
  moduleName,
879
881
  scopeName,
880
882
  onError,
881
- onLoad
883
+ onLoad,
884
+ retryKey
882
885
  ]);
883
886
  return moduleState;
884
887
  }
885
- function RemoteModuleCardContent({ pkg, version, moduleName, scopeName, loadingFallback, errorFallback, componentProps, className, style, onError, onLoad }) {
888
+ function RemoteModuleRenderer({ pkg, version, moduleName, scopeName, loadingFallback, errorFallback, componentProps, className, style, onError, onLoad }) {
886
889
  const moduleState = useRemoteModule({
887
890
  pkg,
888
891
  version,
@@ -891,12 +894,12 @@ function RemoteModuleCardContent({ pkg, version, moduleName, scopeName, loadingF
891
894
  onError,
892
895
  onLoad
893
896
  });
894
- const [retryCount, setRetryCount] = (0, external_react_namespaceObject.useState)(0);
897
+ const [retryKey, setRetryKey] = (0, external_react_namespaceObject.useState)(0);
895
898
  const handleRetry = (0, external_react_namespaceObject.useCallback)(()=>{
896
- setRetryCount((prev)=>prev + 1);
899
+ setRetryKey((prev)=>prev + 1);
897
900
  }, []);
898
901
  (0, external_react_namespaceObject.useEffect)(()=>{}, [
899
- retryCount
902
+ retryKey
900
903
  ]);
901
904
  if (moduleState.loading) return /*#__PURE__*/ external_react_default().createElement("div", {
902
905
  className: className,
@@ -936,18 +939,18 @@ function RemoteModuleCardContent({ pkg, version, moduleName, scopeName, loadingF
936
939
  style: style
937
940
  }, /*#__PURE__*/ external_react_default().createElement(Component, componentProps));
938
941
  }
939
- function RemoteModuleCard(props) {
942
+ function RemoteModuleProvider(props) {
940
943
  const { disableErrorBoundary, errorFallback, loadingFallback, errorBoundaryOptions } = props;
941
944
  if (disableErrorBoundary) return /*#__PURE__*/ external_react_default().createElement(external_react_namespaceObject.Suspense, {
942
945
  fallback: loadingFallback || /*#__PURE__*/ external_react_default().createElement("div", null, "Loading...")
943
- }, /*#__PURE__*/ external_react_default().createElement(RemoteModuleCardContent, props));
946
+ }, /*#__PURE__*/ external_react_default().createElement(RemoteModuleRenderer, props));
944
947
  return /*#__PURE__*/ external_react_default().createElement(ErrorBoundary, {
945
948
  fallback: errorFallback,
946
949
  onError: errorBoundaryOptions?.onError,
947
950
  onReset: errorBoundaryOptions?.onReset
948
951
  }, /*#__PURE__*/ external_react_default().createElement(external_react_namespaceObject.Suspense, {
949
952
  fallback: loadingFallback || /*#__PURE__*/ external_react_default().createElement("div", null, "Loading...")
950
- }, /*#__PURE__*/ external_react_default().createElement(RemoteModuleCardContent, props)));
953
+ }, /*#__PURE__*/ external_react_default().createElement(RemoteModuleRenderer, props)));
951
954
  }
952
955
  function lazyRemote(options) {
953
956
  const { pkg, version = 'latest', moduleName, scopeName, maxRetries = 3, retryDelay = 1000 } = options;
@@ -1059,7 +1062,8 @@ function useRemoteModuleHook(options) {
1059
1062
  };
1060
1063
  }
1061
1064
  exports.ErrorBoundary = __webpack_exports__.ErrorBoundary;
1062
- exports.RemoteModuleCard = __webpack_exports__.RemoteModuleCard;
1065
+ exports.RemoteModuleProvider = __webpack_exports__.RemoteModuleProvider;
1066
+ exports.RemoteModuleRenderer = __webpack_exports__.RemoteModuleRenderer;
1063
1067
  exports.SuspenseRemote = __webpack_exports__.SuspenseRemote;
1064
1068
  exports.SuspenseRemoteLoader = __webpack_exports__.SuspenseRemoteLoader;
1065
1069
  exports.buildCdnUrls = __webpack_exports__.buildCdnUrls;
@@ -1103,11 +1107,13 @@ exports.sortVersions = __webpack_exports__.sortVersions;
1103
1107
  exports.tryLoadRemote = __webpack_exports__.tryLoadRemote;
1104
1108
  exports.unloadAll = __webpack_exports__.unloadAll;
1105
1109
  exports.unloadRemote = __webpack_exports__.unloadRemote;
1110
+ exports.useRemoteModule = __webpack_exports__.useRemoteModule;
1106
1111
  exports.useRemoteModuleHook = __webpack_exports__.useRemoteModuleHook;
1107
1112
  exports.withRemote = __webpack_exports__.withRemote;
1108
1113
  for(var __webpack_i__ in __webpack_exports__)if (-1 === [
1109
1114
  "ErrorBoundary",
1110
- "RemoteModuleCard",
1115
+ "RemoteModuleProvider",
1116
+ "RemoteModuleRenderer",
1111
1117
  "SuspenseRemote",
1112
1118
  "SuspenseRemoteLoader",
1113
1119
  "buildCdnUrls",
@@ -1151,6 +1157,7 @@ for(var __webpack_i__ in __webpack_exports__)if (-1 === [
1151
1157
  "tryLoadRemote",
1152
1158
  "unloadAll",
1153
1159
  "unloadRemote",
1160
+ "useRemoteModule",
1154
1161
  "useRemoteModuleHook",
1155
1162
  "withRemote"
1156
1163
  ].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
package/dist/main.js CHANGED
@@ -740,7 +740,7 @@ class ErrorBoundary extends react.Component {
740
740
  return this.props.children;
741
741
  }
742
742
  }
743
- function useRemoteModule({ pkg, version, moduleName, scopeName, onError, onLoad }) {
743
+ function useRemoteModule({ pkg, version, moduleName, scopeName, onError, onLoad, retryKey = 0 }) {
744
744
  const [moduleState, setModuleState] = useState({
745
745
  loading: true,
746
746
  error: null,
@@ -794,11 +794,12 @@ function useRemoteModule({ pkg, version, moduleName, scopeName, onError, onLoad
794
794
  moduleName,
795
795
  scopeName,
796
796
  onError,
797
- onLoad
797
+ onLoad,
798
+ retryKey
798
799
  ]);
799
800
  return moduleState;
800
801
  }
801
- function RemoteModuleCardContent({ pkg, version, moduleName, scopeName, loadingFallback, errorFallback, componentProps, className, style, onError, onLoad }) {
802
+ function RemoteModuleRenderer({ pkg, version, moduleName, scopeName, loadingFallback, errorFallback, componentProps, className, style, onError, onLoad }) {
802
803
  const moduleState = useRemoteModule({
803
804
  pkg,
804
805
  version,
@@ -807,12 +808,12 @@ function RemoteModuleCardContent({ pkg, version, moduleName, scopeName, loadingF
807
808
  onError,
808
809
  onLoad
809
810
  });
810
- const [retryCount, setRetryCount] = useState(0);
811
+ const [retryKey, setRetryKey] = useState(0);
811
812
  const handleRetry = useCallback(()=>{
812
- setRetryCount((prev)=>prev + 1);
813
+ setRetryKey((prev)=>prev + 1);
813
814
  }, []);
814
815
  useEffect(()=>{}, [
815
- retryCount
816
+ retryKey
816
817
  ]);
817
818
  if (moduleState.loading) return /*#__PURE__*/ react.createElement("div", {
818
819
  className: className,
@@ -852,18 +853,18 @@ function RemoteModuleCardContent({ pkg, version, moduleName, scopeName, loadingF
852
853
  style: style
853
854
  }, /*#__PURE__*/ react.createElement(Component, componentProps));
854
855
  }
855
- function RemoteModuleCard(props) {
856
+ function RemoteModuleProvider(props) {
856
857
  const { disableErrorBoundary, errorFallback, loadingFallback, errorBoundaryOptions } = props;
857
858
  if (disableErrorBoundary) return /*#__PURE__*/ react.createElement(Suspense, {
858
859
  fallback: loadingFallback || /*#__PURE__*/ react.createElement("div", null, "Loading...")
859
- }, /*#__PURE__*/ react.createElement(RemoteModuleCardContent, props));
860
+ }, /*#__PURE__*/ react.createElement(RemoteModuleRenderer, props));
860
861
  return /*#__PURE__*/ react.createElement(ErrorBoundary, {
861
862
  fallback: errorFallback,
862
863
  onError: errorBoundaryOptions?.onError,
863
864
  onReset: errorBoundaryOptions?.onReset
864
865
  }, /*#__PURE__*/ react.createElement(Suspense, {
865
866
  fallback: loadingFallback || /*#__PURE__*/ react.createElement("div", null, "Loading...")
866
- }, /*#__PURE__*/ react.createElement(RemoteModuleCardContent, props)));
867
+ }, /*#__PURE__*/ react.createElement(RemoteModuleRenderer, props)));
867
868
  }
868
869
  function lazyRemote(options) {
869
870
  const { pkg, version = 'latest', moduleName, scopeName, maxRetries = 3, retryDelay = 1000 } = options;
@@ -974,4 +975,4 @@ function useRemoteModuleHook(options) {
974
975
  error: state.error
975
976
  };
976
977
  }
977
- export { ErrorBoundary, RemoteModuleCard, SuspenseRemote, SuspenseRemoteLoader, buildCdnUrls, buildFinalUrls, cancelPreload, checkModuleLoadable, checkRemoteHealth, checkVersionCompatibility, clearPreloadCache, compareVersions, createEventBus, eventBus, extractMajorVersion, fallbackPlugin, fetchAvailableVersions, fetchLatestVersion, findCompatibleVersion, formatHealthStatus, getCompatibleReactVersions, getFinalSharedConfig, getLatestVersion, getLoadedRemotes, getPreloadStatus, getRemoteHealthReport, getStableVersions, getVersionCache, isPrerelease, isRemoteLoaded, lazyRemote, loadReactVersion, loadRemoteMultiVersion, parseVersion, preloadRemote, preloadRemoteList, registerLoadedModule, registerRemoteInstance, resolveFinalVersion, satisfiesVersion, setVersionCache, sortVersions, tryLoadRemote, unloadAll, unloadRemote, useRemoteModuleHook, withRemote };
978
+ export { ErrorBoundary, RemoteModuleProvider, RemoteModuleRenderer, SuspenseRemote, SuspenseRemoteLoader, buildCdnUrls, buildFinalUrls, cancelPreload, checkModuleLoadable, checkRemoteHealth, checkVersionCompatibility, clearPreloadCache, compareVersions, createEventBus, eventBus, extractMajorVersion, fallbackPlugin, fetchAvailableVersions, fetchLatestVersion, findCompatibleVersion, formatHealthStatus, getCompatibleReactVersions, getFinalSharedConfig, getLatestVersion, getLoadedRemotes, getPreloadStatus, getRemoteHealthReport, getStableVersions, getVersionCache, isPrerelease, isRemoteLoaded, lazyRemote, loadReactVersion, loadRemoteMultiVersion, parseVersion, preloadRemote, preloadRemoteList, registerLoadedModule, registerRemoteInstance, resolveFinalVersion, satisfiesVersion, setVersionCache, sortVersions, tryLoadRemote, unloadAll, unloadRemote, useRemoteModule, useRemoteModuleHook, withRemote };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "remote-reload-utils",
3
- "version": "0.0.11",
3
+ "version": "0.0.13",
4
4
  "type": "module",
5
5
  "description": "Utilities for remote reload in Module Federation & React Component",
6
6
  "exports": {
@@ -51,6 +51,7 @@
51
51
  "@types/react-dom": "^18.2.0",
52
52
  "@vitest/ui": "^2.1.8",
53
53
  "base-biome-config": "0.0.8",
54
+ "happy-dom": "^20.8.4",
54
55
  "rsbuild-plugin-publint": "^0.3.3",
55
56
  "typescript": "^5.9.2",
56
57
  "vitest": "^2.1.8"