@module-federation/devtools 0.0.0-perf-devtools-20260107043700 → 0.0.0-perf-website-code-usage-20260914033703

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 (203) hide show
  1. package/README.md +3 -0
  2. package/dist/es/App.css +6 -5
  3. package/dist/es/App.js +211 -63
  4. package/dist/es/App.module.js +1 -1
  5. package/dist/es/App_module.css +41 -39
  6. package/dist/es/component/DependencyGraph/index.js +11 -12
  7. package/dist/es/component/DependencyGraph/index_module.css +20 -17
  8. package/dist/es/component/DependencyGraphItem/index.js +23 -10
  9. package/dist/es/component/DependencyGraphItem/index_module.css +7 -7
  10. package/dist/es/component/Form/index.js +24 -31
  11. package/dist/es/component/Form/index.module.js +1 -1
  12. package/dist/es/component/Form/index_module.css +22 -25
  13. package/dist/es/component/LanguageSwitch.js +50 -0
  14. package/dist/es/component/Layout/index.js +27 -10
  15. package/dist/es/component/Layout/index_module.css +7 -7
  16. package/dist/es/component/LoadingTrace/index.js +944 -0
  17. package/dist/es/component/LoadingTrace/index.module.js +5 -0
  18. package/dist/es/component/LoadingTrace/index_module.css +876 -0
  19. package/dist/es/component/ModuleInfo/index.js +65 -41
  20. package/dist/es/component/ModuleInfo/index_module.css +12 -11
  21. package/dist/es/component/SharedDepsExplorer/FocusResultDisplay.js +5 -3
  22. package/dist/es/component/SharedDepsExplorer/FocusResultDisplay_module.css +5 -5
  23. package/dist/es/component/SharedDepsExplorer/index.js +223 -96
  24. package/dist/es/component/SharedDepsExplorer/index_module.css +12 -2
  25. package/dist/es/component/SharedDepsExplorer/share-utils.js +21 -5
  26. package/dist/es/component/ThemeToggle.js +19 -0
  27. package/dist/es/component/ThemeToggle.module.js +5 -0
  28. package/dist/es/component/ThemeToggle_module.css +12 -0
  29. package/dist/es/hooks/useDevtoolsTheme.js +77 -0
  30. package/dist/es/i18n/index.js +688 -0
  31. package/dist/es/utils/chrome/fast-refresh.js +297 -173
  32. package/dist/es/utils/chrome/index.js +42 -22
  33. package/dist/es/utils/chrome/messages.js +7 -1
  34. package/dist/es/utils/chrome/observability-plugin.js +93 -0
  35. package/dist/es/utils/chrome/observability-shared.js +99 -0
  36. package/dist/es/utils/chrome/observability.js +208 -0
  37. package/dist/es/utils/chrome/override-remote.js +7 -0
  38. package/dist/es/utils/chrome/post-message-listener.js +22 -4
  39. package/dist/es/utils/chrome/post-message-start.js +4 -10
  40. package/dist/es/utils/chrome/post-message.js +12 -3
  41. package/dist/es/utils/chrome/resolve-basic-proxy-core.js +4 -0
  42. package/dist/es/utils/chrome/safe-post-message.js +124 -0
  43. package/dist/es/utils/chrome/snapshot-plugin.js +2 -36
  44. package/dist/es/utils/data/index.js +5 -25
  45. package/dist/es/utils/sdk/graph.js +25 -11
  46. package/dist/es/vendor/basic-proxy-core.js +155 -0
  47. package/dist/es/worker/index.js +27 -8
  48. package/dist/lib/App.css +6 -5
  49. package/dist/lib/App.js +208 -64
  50. package/dist/lib/App.module.js +1 -2
  51. package/dist/lib/App_module.css +41 -39
  52. package/dist/lib/component/DependencyGraph/index.js +11 -13
  53. package/dist/lib/component/DependencyGraph/index.module.js +0 -1
  54. package/dist/lib/component/DependencyGraph/index_module.css +20 -17
  55. package/dist/lib/component/DependencyGraphItem/index.js +23 -11
  56. package/dist/lib/component/DependencyGraphItem/index.module.js +0 -1
  57. package/dist/lib/component/DependencyGraphItem/index_module.css +7 -7
  58. package/dist/lib/component/Form/index.js +24 -32
  59. package/dist/lib/component/Form/index.module.js +1 -2
  60. package/dist/lib/component/Form/index_module.css +22 -25
  61. package/dist/lib/component/LanguageSwitch.js +79 -0
  62. package/dist/lib/component/Layout/index.js +27 -11
  63. package/dist/lib/component/Layout/index.module.js +0 -1
  64. package/dist/lib/component/Layout/index_module.css +7 -7
  65. package/dist/lib/component/LoadingTrace/index.js +953 -0
  66. package/dist/lib/component/LoadingTrace/index.module.js +24 -0
  67. package/dist/lib/component/LoadingTrace/index_module.css +876 -0
  68. package/dist/lib/component/ModuleInfo/index.js +65 -42
  69. package/dist/lib/component/ModuleInfo/index.module.js +0 -1
  70. package/dist/lib/component/ModuleInfo/index_module.css +12 -11
  71. package/dist/lib/component/SharedDepsExplorer/FocusResultDisplay.js +5 -4
  72. package/dist/lib/component/SharedDepsExplorer/FocusResultDisplay.module.js +0 -1
  73. package/dist/lib/component/SharedDepsExplorer/FocusResultDisplay_module.css +5 -5
  74. package/dist/lib/component/SharedDepsExplorer/index.js +217 -95
  75. package/dist/lib/component/SharedDepsExplorer/index.module.js +0 -1
  76. package/dist/lib/component/SharedDepsExplorer/index_module.css +12 -2
  77. package/dist/lib/component/SharedDepsExplorer/share-utils.js +21 -6
  78. package/dist/lib/component/ThemeToggle.js +48 -0
  79. package/dist/lib/component/ThemeToggle.module.js +24 -0
  80. package/dist/lib/component/ThemeToggle_module.css +12 -0
  81. package/dist/lib/hooks/useDevtoolsTheme.js +100 -0
  82. package/dist/lib/i18n/index.js +721 -0
  83. package/dist/lib/init.js +0 -1
  84. package/dist/lib/template/constant.js +0 -1
  85. package/dist/lib/template/index.js +0 -1
  86. package/dist/lib/utils/chrome/fast-refresh.js +250 -136
  87. package/dist/lib/utils/chrome/index.js +43 -23
  88. package/dist/lib/utils/chrome/messages.js +11 -3
  89. package/dist/lib/utils/chrome/observability-plugin.js +85 -0
  90. package/dist/lib/utils/chrome/observability-shared.js +125 -0
  91. package/dist/lib/utils/chrome/observability.js +233 -0
  92. package/dist/lib/utils/chrome/override-remote.js +20 -0
  93. package/dist/lib/utils/chrome/post-message-init.js +0 -1
  94. package/dist/lib/utils/chrome/post-message-listener.js +19 -5
  95. package/dist/lib/utils/chrome/post-message-start.js +4 -11
  96. package/dist/lib/utils/chrome/post-message.js +12 -4
  97. package/dist/lib/utils/chrome/resolve-basic-proxy-core.js +27 -0
  98. package/dist/lib/utils/chrome/safe-post-message.js +147 -0
  99. package/dist/lib/utils/chrome/snapshot-plugin.js +5 -47
  100. package/dist/lib/utils/chrome/storage.js +0 -1
  101. package/dist/lib/utils/data/index.js +6 -29
  102. package/dist/lib/utils/index.js +0 -1
  103. package/dist/lib/utils/sdk/graph.js +25 -12
  104. package/dist/lib/utils/sdk/index.js +0 -1
  105. package/dist/lib/utils/types/common.js +0 -1
  106. package/dist/lib/utils/types/index.js +0 -1
  107. package/dist/lib/vendor/basic-proxy-core.js +147 -0
  108. package/dist/lib/worker/index.js +27 -9
  109. package/dist/types/App.css +13 -0
  110. package/dist/types/App.js +519 -0
  111. package/dist/types/App.module.js +24 -0
  112. package/dist/types/App_module.css +307 -0
  113. package/dist/types/component/DependencyGraph/index.js +225 -0
  114. package/dist/types/component/DependencyGraph/index.module.js +24 -0
  115. package/dist/types/component/DependencyGraph/index_module.css +100 -0
  116. package/dist/types/component/DependencyGraphItem/index.js +124 -0
  117. package/dist/types/component/DependencyGraphItem/index.module.js +24 -0
  118. package/dist/types/component/DependencyGraphItem/index_module.css +95 -0
  119. package/dist/types/component/Form/index.js +372 -0
  120. package/dist/types/component/Form/index.module.js +24 -0
  121. package/dist/types/component/Form/index_module.css +198 -0
  122. package/dist/types/component/LanguageSwitch.js +79 -0
  123. package/dist/types/component/Layout/index.js +471 -0
  124. package/dist/types/component/Layout/index.module.js +24 -0
  125. package/dist/types/component/Layout/index_module.css +68 -0
  126. package/dist/types/component/LoadingTrace/index.js +953 -0
  127. package/dist/types/component/LoadingTrace/index.module.js +24 -0
  128. package/dist/types/component/LoadingTrace/index_module.css +876 -0
  129. package/dist/types/component/ModuleInfo/index.js +342 -0
  130. package/dist/types/component/ModuleInfo/index.module.js +24 -0
  131. package/dist/types/component/ModuleInfo/index_module.css +184 -0
  132. package/dist/types/component/SharedDepsExplorer/FocusResultDisplay.js +64 -0
  133. package/dist/types/component/SharedDepsExplorer/FocusResultDisplay.module.js +24 -0
  134. package/dist/types/component/SharedDepsExplorer/FocusResultDisplay_module.css +45 -0
  135. package/dist/types/component/SharedDepsExplorer/index.js +635 -0
  136. package/dist/types/component/SharedDepsExplorer/index.module.js +24 -0
  137. package/dist/types/component/SharedDepsExplorer/index_module.css +467 -0
  138. package/dist/types/component/SharedDepsExplorer/share-utils.js +252 -0
  139. package/dist/types/component/ThemeToggle.js +48 -0
  140. package/dist/types/component/ThemeToggle.module.js +24 -0
  141. package/dist/types/component/ThemeToggle_module.css +12 -0
  142. package/dist/types/hooks/useDevtoolsTheme.js +100 -0
  143. package/dist/types/i18n/index.js +721 -0
  144. package/dist/types/init.js +8 -0
  145. package/dist/types/src/App.d.ts +1 -1
  146. package/dist/types/src/component/DependencyGraph/index.d.ts +1 -1
  147. package/dist/types/src/component/DependencyGraphItem/index.d.ts +1 -1
  148. package/dist/types/src/component/Form/index.d.ts +1 -1
  149. package/dist/types/src/component/LanguageSwitch.d.ts +2 -0
  150. package/dist/types/src/component/Layout/index.d.ts +1 -1
  151. package/dist/types/src/component/LoadingTrace/index.d.ts +6 -0
  152. package/dist/types/src/component/ModuleInfo/index.d.ts +1 -1
  153. package/dist/types/src/component/SharedDepsExplorer/index.d.ts +1 -1
  154. package/dist/types/src/component/SharedDepsExplorer/share-utils.d.ts +3 -2
  155. package/dist/types/src/component/ThemeToggle.d.ts +8 -0
  156. package/dist/types/src/hooks/useDevtoolsTheme.d.ts +2 -0
  157. package/dist/types/src/i18n/index.d.ts +5 -0
  158. package/dist/types/src/template/constant.d.ts +1 -1
  159. package/dist/types/src/utils/chrome/index.d.ts +2 -1
  160. package/dist/types/src/utils/chrome/messages.d.ts +3 -0
  161. package/dist/types/src/utils/chrome/observability-plugin.d.ts +1 -0
  162. package/dist/types/src/utils/chrome/observability-shared.d.ts +41 -0
  163. package/dist/types/src/utils/chrome/observability.d.ts +110 -0
  164. package/dist/types/src/utils/chrome/override-remote.d.ts +1 -0
  165. package/dist/types/src/utils/chrome/post-message-listener.d.ts +1 -0
  166. package/dist/types/src/utils/chrome/post-message-start.d.ts +1 -1
  167. package/dist/types/src/utils/chrome/resolve-basic-proxy-core.d.ts +6 -0
  168. package/dist/types/src/utils/chrome/safe-post-message.d.ts +1 -0
  169. package/dist/types/src/utils/chrome/snapshot-plugin.d.ts +0 -3
  170. package/dist/types/src/utils/data/index.d.ts +1 -2
  171. package/dist/types/src/utils/sdk/graph.d.ts +1 -1
  172. package/dist/types/src/utils/sdk/index.d.ts +2 -2
  173. package/dist/types/stories/index.stories.d.ts +2 -1
  174. package/dist/types/template/constant.js +84 -0
  175. package/dist/types/template/index.js +21 -0
  176. package/dist/types/utils/chrome/fast-refresh.js +329 -0
  177. package/dist/types/utils/chrome/index.js +321 -0
  178. package/dist/types/utils/chrome/messages.js +39 -0
  179. package/dist/types/utils/chrome/observability-plugin.js +85 -0
  180. package/dist/types/utils/chrome/observability-shared.js +125 -0
  181. package/dist/types/utils/chrome/observability.js +233 -0
  182. package/dist/types/utils/chrome/override-remote.js +20 -0
  183. package/dist/types/utils/chrome/post-message-init.js +5 -0
  184. package/dist/types/utils/chrome/post-message-listener.js +36 -0
  185. package/dist/types/utils/chrome/post-message-start.js +10 -0
  186. package/dist/types/utils/chrome/post-message.js +91 -0
  187. package/dist/types/utils/chrome/resolve-basic-proxy-core.js +27 -0
  188. package/dist/types/utils/chrome/safe-post-message.js +147 -0
  189. package/dist/types/utils/chrome/snapshot-plugin.js +17 -0
  190. package/dist/types/utils/chrome/storage.js +71 -0
  191. package/dist/types/utils/data/index.js +83 -0
  192. package/dist/types/utils/index.js +27 -0
  193. package/dist/types/utils/sdk/graph.js +213 -0
  194. package/dist/types/utils/sdk/index.js +104 -0
  195. package/dist/types/utils/types/common.js +15 -0
  196. package/dist/types/utils/types/index.js +21 -0
  197. package/dist/types/vendor/basic-proxy-core.js +147 -0
  198. package/dist/types/worker/index.js +175 -0
  199. package/install-deps.bash +7 -3
  200. package/package.json +47 -28
  201. package/dist/es/utils/data/snapshot.js +0 -82
  202. package/dist/lib/utils/data/snapshot.js +0 -107
  203. package/dist/types/src/utils/data/snapshot.d.ts +0 -3
@@ -0,0 +1,519 @@
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
9
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
10
+ var __spreadValues = (a, b) => {
11
+ for (var prop in b || (b = {}))
12
+ if (__hasOwnProp.call(b, prop))
13
+ __defNormalProp(a, prop, b[prop]);
14
+ if (__getOwnPropSymbols)
15
+ for (var prop of __getOwnPropSymbols(b)) {
16
+ if (__propIsEnum.call(b, prop))
17
+ __defNormalProp(a, prop, b[prop]);
18
+ }
19
+ return a;
20
+ };
21
+ var __export = (target, all) => {
22
+ for (var name in all)
23
+ __defProp(target, name, { get: all[name], enumerable: true });
24
+ };
25
+ var __copyProps = (to, from, except, desc) => {
26
+ if (from && typeof from === "object" || typeof from === "function") {
27
+ for (let key of __getOwnPropNames(from))
28
+ if (!__hasOwnProp.call(to, key) && key !== except)
29
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
30
+ }
31
+ return to;
32
+ };
33
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
34
+ // If the importer is in node compatibility mode or this is not an ESM
35
+ // file that has been converted to a CommonJS file using a Babel-
36
+ // compatible transform (i.e. "__esModule" has not been set), then set
37
+ // "default" to the CommonJS "module.exports" for node compatibility.
38
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
39
+ mod
40
+ ));
41
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
42
+ var __async = (__this, __arguments, generator) => {
43
+ return new Promise((resolve, reject) => {
44
+ var fulfilled = (value) => {
45
+ try {
46
+ step(generator.next(value));
47
+ } catch (e) {
48
+ reject(e);
49
+ }
50
+ };
51
+ var rejected = (value) => {
52
+ try {
53
+ step(generator.throw(value));
54
+ } catch (e) {
55
+ reject(e);
56
+ }
57
+ };
58
+ var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
59
+ step((generator = generator.apply(__this, __arguments)).next());
60
+ });
61
+ };
62
+ var App_exports = {};
63
+ __export(App_exports, {
64
+ default: () => App_default
65
+ });
66
+ module.exports = __toCommonJS(App_exports);
67
+ var import_jsx_runtime = require("react/jsx-runtime");
68
+ var import_react = require("react");
69
+ var import_react_19_adapter = require("@arco-design/web-react/es/_util/react-19-adapter");
70
+ var import_App = require("./App.css");
71
+ var import_web_react = require("@arco-design/web-react");
72
+ var import_react_i18next = require("react-i18next");
73
+ var import_init = require("./init");
74
+ var import_icon = require("@arco-design/web-react/icon");
75
+ var import_Layout = __toESM(require("./component/Layout"));
76
+ var import_DependencyGraph = __toESM(require("./component/DependencyGraph"));
77
+ var import_ModuleInfo = __toESM(require("./component/ModuleInfo"));
78
+ var import_SharedDepsExplorer = __toESM(require("./component/SharedDepsExplorer"));
79
+ var import_LoadingTrace = __toESM(require("./component/LoadingTrace"));
80
+ var import_LanguageSwitch = __toESM(require("./component/LanguageSwitch"));
81
+ var import_ThemeToggle = __toESM(require("./component/ThemeToggle"));
82
+ var import_utils = require("./utils");
83
+ var import_messages = require("./utils/chrome/messages");
84
+ var import_useDevtoolsTheme = require("./hooks/useDevtoolsTheme");
85
+ var import_i18n = __toESM(require("./i18n"));
86
+ var import_arco = require("@arco-design/web-react/dist/css/arco.css");
87
+ var import_App2 = __toESM(require("./App.module"));
88
+ var import_ThemeToggle2 = __toESM(require("./component/ThemeToggle.module"));
89
+ const cloneModuleInfo = (info) => {
90
+ try {
91
+ return (0, import_utils.normalizeModuleInfoPayload)(info);
92
+ } catch (error) {
93
+ console.warn("[MF Devtools] cloneModuleInfo failed", error);
94
+ return {};
95
+ }
96
+ };
97
+ const normalizeShareValue = (target, seen = /* @__PURE__ */ new WeakSet()) => {
98
+ if (typeof target === "function") {
99
+ const name = target.name ? `: ${target.name}` : "";
100
+ return `[Function${name}]`;
101
+ }
102
+ if (!target || typeof target !== "object") {
103
+ return target;
104
+ }
105
+ if (seen.has(target)) {
106
+ return "[Circular]";
107
+ }
108
+ seen.add(target);
109
+ if (target instanceof Map) {
110
+ const mapped = {};
111
+ target.forEach((value, key) => {
112
+ mapped[String(key)] = normalizeShareValue(value, seen);
113
+ });
114
+ return mapped;
115
+ }
116
+ if (target instanceof Set) {
117
+ const setItems = [];
118
+ target.forEach((value) => {
119
+ setItems.push(normalizeShareValue(value, seen));
120
+ });
121
+ return setItems;
122
+ }
123
+ if (Array.isArray(target)) {
124
+ return target.map((item) => normalizeShareValue(item, seen));
125
+ }
126
+ return Object.keys(target).reduce((memo, key) => {
127
+ memo[key] = normalizeShareValue(target[key], seen);
128
+ return memo;
129
+ }, {});
130
+ };
131
+ const buildShareSnapshot = (share) => {
132
+ const normalize = (value) => {
133
+ try {
134
+ return normalizeShareValue(value);
135
+ } catch (error) {
136
+ console.warn("[MF Devtools] normalize share snapshot failed", error);
137
+ return normalizeShareValue(value);
138
+ }
139
+ };
140
+ const scopes = normalize(share || {});
141
+ return scopes;
142
+ };
143
+ const NAV_ITEMS = [
144
+ { key: "moduleInfo", i18nKey: "app.nav.moduleInfo" },
145
+ { key: "proxy", i18nKey: "app.nav.proxy" },
146
+ { key: "dependency", i18nKey: "app.nav.dependency" },
147
+ { key: "share", i18nKey: "app.nav.share" },
148
+ { key: "loadingTrace", i18nKey: "app.nav.loadingTrace" },
149
+ { key: "performance", i18nKey: "app.nav.performance" }
150
+ ];
151
+ const THEME_STORAGE_KEY = "mf-devtools-theme";
152
+ const InnerApp = (props) => {
153
+ const {
154
+ versionList,
155
+ setVersionList,
156
+ getVersion,
157
+ handleSnapshot,
158
+ handleProxyAddress,
159
+ customValueValidate,
160
+ headerSlot
161
+ } = props;
162
+ const autoTheme = (0, import_useDevtoolsTheme.useDevtoolsTheme)();
163
+ const [userTheme, setUserTheme] = (0, import_react.useState)(null);
164
+ const effectiveTheme = userTheme != null ? userTheme : autoTheme;
165
+ const { t } = (0, import_react_i18next.useTranslation)();
166
+ const [moduleInfo, setModuleInfo] = (0, import_react.useState)(
167
+ () => {
168
+ var _a;
169
+ return cloneModuleInfo(((_a = window.__FEDERATION__) == null ? void 0 : _a.moduleInfo) || {});
170
+ }
171
+ );
172
+ const [shareInfo, setShareInfo] = (0, import_react.useState)(
173
+ () => {
174
+ var _a;
175
+ return buildShareSnapshot((_a = window.__FEDERATION__) == null ? void 0 : _a.__SHARE__);
176
+ }
177
+ );
178
+ const [inspectedTab, setInspectedTab] = (0, import_react.useState)(
179
+ window.targetTab
180
+ );
181
+ const [inspectedTabRefreshKey, setInspectedTabRefreshKey] = (0, import_react.useState)(0);
182
+ const [activePanel, setActivePanel] = (0, import_react.useState)("proxy");
183
+ const [selectedModuleId, setSelectedModuleId] = (0, import_react.useState)(null);
184
+ const [refreshing, setRefreshing] = (0, import_react.useState)(false);
185
+ const panelSyncReadyRef = (0, import_react.useRef)(false);
186
+ const applyModuleUpdate = (0, import_react.useCallback)((info) => {
187
+ var _a;
188
+ setModuleInfo(cloneModuleInfo(info));
189
+ const shareSnapshot = buildShareSnapshot(
190
+ (_a = window.__FEDERATION__) == null ? void 0 : _a.__SHARE__
191
+ );
192
+ setShareInfo(shareSnapshot);
193
+ panelSyncReadyRef.current = true;
194
+ }, []);
195
+ const { producer, consumers } = (0, import_react.useMemo)(
196
+ () => (0, import_utils.separateType)(moduleInfo),
197
+ [moduleInfo]
198
+ );
199
+ const moduleKeys = (0, import_react.useMemo)(() => Object.keys(moduleInfo || {}), [moduleInfo]);
200
+ const moduleCount = moduleKeys.length;
201
+ const consumerCount = (0, import_react.useMemo)(
202
+ () => Object.keys(consumers || {}).length,
203
+ [consumers]
204
+ );
205
+ const hasModule = moduleCount > 0 || process.env.NODE_ENV === "development";
206
+ (0, import_react.useEffect)(() => {
207
+ var _a;
208
+ if (typeof window === "undefined") {
209
+ return;
210
+ }
211
+ let cancelled = false;
212
+ const applyTheme = (value) => {
213
+ if (cancelled) {
214
+ return;
215
+ }
216
+ if (value === "light" || value === "dark") {
217
+ setUserTheme(value);
218
+ }
219
+ };
220
+ try {
221
+ const stored = window.localStorage.getItem(THEME_STORAGE_KEY);
222
+ if (stored === "light" || stored === "dark") {
223
+ applyTheme(stored);
224
+ return;
225
+ }
226
+ } catch (error) {
227
+ console.warn("[MF Devtools] read theme from localStorage failed", error);
228
+ }
229
+ try {
230
+ const chromeObj = window.chrome;
231
+ const storage = (_a = chromeObj == null ? void 0 : chromeObj.storage) == null ? void 0 : _a.sync;
232
+ if (storage && typeof storage.get === "function") {
233
+ storage.get([THEME_STORAGE_KEY], (result) => {
234
+ applyTheme(result == null ? void 0 : result[THEME_STORAGE_KEY]);
235
+ });
236
+ }
237
+ } catch (error) {
238
+ console.warn(
239
+ "[MF Devtools] read theme from chrome.storage.sync failed",
240
+ error
241
+ );
242
+ }
243
+ return () => {
244
+ cancelled = true;
245
+ };
246
+ }, []);
247
+ (0, import_react.useEffect)(() => {
248
+ if (typeof document === "undefined") {
249
+ return;
250
+ }
251
+ const { body } = document;
252
+ if (!body) {
253
+ return;
254
+ }
255
+ if (effectiveTheme === "dark") {
256
+ body.setAttribute("arco-theme", "dark");
257
+ } else {
258
+ body.removeAttribute("arco-theme");
259
+ }
260
+ return () => {
261
+ body.removeAttribute("arco-theme");
262
+ };
263
+ }, [effectiveTheme]);
264
+ (0, import_react.useEffect)(() => {
265
+ if (!moduleKeys.length) {
266
+ setSelectedModuleId(null);
267
+ return;
268
+ }
269
+ if (!selectedModuleId || !moduleKeys.includes(selectedModuleId)) {
270
+ setSelectedModuleId(moduleKeys[0]);
271
+ }
272
+ }, [moduleKeys, selectedModuleId]);
273
+ (0, import_react.useEffect)(() => {
274
+ const bootstrap = () => __async(void 0, null, function* () {
275
+ const tab = yield (0, import_utils.syncActiveTab)();
276
+ setInspectedTab(tab || void 0);
277
+ const detach = yield (0, import_utils.getGlobalModuleInfo)(
278
+ (info) => applyModuleUpdate(info)
279
+ );
280
+ panelSyncReadyRef.current = true;
281
+ return detach;
282
+ });
283
+ const cleanupPromise = bootstrap();
284
+ return () => {
285
+ cleanupPromise.then((cleanup) => cleanup == null ? void 0 : cleanup());
286
+ };
287
+ }, [applyModuleUpdate]);
288
+ (0, import_react.useEffect)(() => {
289
+ const updateActiveTab = (tabId, options) => __async(void 0, null, function* () {
290
+ var _a, _b;
291
+ const tab = yield (0, import_utils.syncActiveTab)(tabId);
292
+ setInspectedTab(tab || void 0);
293
+ if ((options == null ? void 0 : options.status) === "loading") {
294
+ setInspectedTabRefreshKey((key) => key + 1);
295
+ return;
296
+ }
297
+ if ((_a = window.__FEDERATION__) == null ? void 0 : _a.moduleInfo) {
298
+ applyModuleUpdate(cloneModuleInfo((_b = window.__FEDERATION__) == null ? void 0 : _b.moduleInfo));
299
+ }
300
+ yield (0, import_utils.refreshModuleInfo)();
301
+ });
302
+ const onMessage = (message, _sender, _sendResponse) => {
303
+ if ((message == null ? void 0 : message.type) === import_messages.MESSAGE_ACTIVE_TAB_CHANGED) {
304
+ updateActiveTab(message.tabId, { status: message.status });
305
+ }
306
+ };
307
+ chrome.runtime.onMessage.addListener(onMessage);
308
+ const onActivated = (activeInfo) => {
309
+ updateActiveTab(activeInfo.tabId);
310
+ };
311
+ chrome.tabs.onActivated.addListener(onActivated);
312
+ return () => {
313
+ chrome.runtime.onMessage.removeListener(onMessage);
314
+ chrome.tabs.onActivated.removeListener(onActivated);
315
+ };
316
+ }, [applyModuleUpdate]);
317
+ const handleRefresh = () => __async(void 0, null, function* () {
318
+ var _a, _b;
319
+ if (refreshing) {
320
+ return;
321
+ }
322
+ setRefreshing(true);
323
+ try {
324
+ yield (0, import_utils.refreshModuleInfo)();
325
+ if ((_a = window.__FEDERATION__) == null ? void 0 : _a.moduleInfo) {
326
+ applyModuleUpdate(cloneModuleInfo((_b = window.__FEDERATION__) == null ? void 0 : _b.moduleInfo));
327
+ }
328
+ } finally {
329
+ setRefreshing(false);
330
+ }
331
+ });
332
+ const handleThemeToggle = () => {
333
+ var _a;
334
+ const current = effectiveTheme;
335
+ const next = current === "dark" ? "light" : "dark";
336
+ setUserTheme(next);
337
+ if (typeof window !== "undefined") {
338
+ try {
339
+ window.localStorage.setItem(THEME_STORAGE_KEY, next);
340
+ } catch (error) {
341
+ console.warn(
342
+ "[MF Devtools] persist theme to localStorage failed",
343
+ error
344
+ );
345
+ }
346
+ try {
347
+ const chromeObj = window.chrome;
348
+ const storage = (_a = chromeObj == null ? void 0 : chromeObj.storage) == null ? void 0 : _a.sync;
349
+ if (storage && typeof storage.set === "function") {
350
+ storage.set({ [THEME_STORAGE_KEY]: next });
351
+ }
352
+ } catch (error) {
353
+ console.warn(
354
+ "[MF Devtools] persist theme to chrome.storage.sync failed",
355
+ error
356
+ );
357
+ }
358
+ }
359
+ };
360
+ const resetModuleInfo = (0, import_react.useCallback)(() => {
361
+ var _a;
362
+ const origin = ((_a = window.__FEDERATION__) == null ? void 0 : _a.originModuleInfo) || {};
363
+ applyModuleUpdate(cloneModuleInfo(origin));
364
+ }, [applyModuleUpdate]);
365
+ (0, import_react.useEffect)(() => {
366
+ const shouldAutoSync = activePanel === "proxy" || activePanel === "dependency" || activePanel === "share";
367
+ if (!shouldAutoSync || !panelSyncReadyRef.current) {
368
+ return;
369
+ }
370
+ let cancelled = false;
371
+ const syncPanelData = () => __async(void 0, null, function* () {
372
+ var _a, _b;
373
+ yield (0, import_utils.refreshModuleInfo)();
374
+ if (cancelled) {
375
+ return;
376
+ }
377
+ if ((_a = window.__FEDERATION__) == null ? void 0 : _a.moduleInfo) {
378
+ applyModuleUpdate(cloneModuleInfo((_b = window.__FEDERATION__) == null ? void 0 : _b.moduleInfo));
379
+ }
380
+ });
381
+ void syncPanelData();
382
+ return () => {
383
+ cancelled = true;
384
+ };
385
+ }, [activePanel, applyModuleUpdate]);
386
+ const renderContent = () => {
387
+ var _a;
388
+ switch (activePanel) {
389
+ case "moduleInfo":
390
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
391
+ import_ModuleInfo.default,
392
+ {
393
+ moduleInfo,
394
+ selectedModuleId,
395
+ onSelectModule: (id) => setSelectedModuleId(id)
396
+ }
397
+ );
398
+ case "proxy":
399
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
400
+ import_Layout.default,
401
+ {
402
+ moduleInfo,
403
+ versionList,
404
+ setVersionList,
405
+ getVersion,
406
+ handleSnapshot,
407
+ handleProxyAddress,
408
+ customValueValidate,
409
+ headerSlot,
410
+ onModuleInfoChange: applyModuleUpdate,
411
+ onModuleInfoReset: resetModuleInfo,
412
+ tabId: inspectedTab == null ? void 0 : inspectedTab.id
413
+ }
414
+ );
415
+ case "dependency":
416
+ return hasModule ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_DependencyGraph.default, { snapshot: moduleInfo }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_App2.default.emptyState, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
417
+ import_web_react.Empty,
418
+ {
419
+ description: t("common.empty.noModuleInfo"),
420
+ className: import_App2.default.empty
421
+ }
422
+ ) });
423
+ case "share":
424
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
425
+ import_SharedDepsExplorer.default,
426
+ {
427
+ shareData: JSON.parse(
428
+ JSON.stringify((_a = window.__FEDERATION__) == null ? void 0 : _a.__SHARE__)
429
+ )
430
+ }
431
+ );
432
+ case "loadingTrace":
433
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
434
+ import_LoadingTrace.default,
435
+ {
436
+ tabId: inspectedTab == null ? void 0 : inspectedTab.id,
437
+ resetKey: inspectedTabRefreshKey
438
+ }
439
+ );
440
+ case "performance":
441
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_App2.default.placeholder, children: t("app.performance.placeholder") });
442
+ default:
443
+ return null;
444
+ }
445
+ };
446
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
447
+ "div",
448
+ {
449
+ className: `${import_App2.default.shell} ${import_App2.default.overrideArco} ${effectiveTheme === "dark" ? "arco-theme-dark" : ""}`,
450
+ children: [
451
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("aside", { className: import_App2.default.sidebar, children: NAV_ITEMS.map((item) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
452
+ "button",
453
+ {
454
+ type: "button",
455
+ className: `${import_App2.default.tabItem} ${activePanel === item.key ? import_App2.default.activeTab : ""}`,
456
+ onClick: () => setActivePanel(item.key),
457
+ children: t(item.i18nKey)
458
+ },
459
+ item.key
460
+ )) }),
461
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", { className: import_App2.default.panel, children: [
462
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("header", { className: import_App2.default.header, children: [
463
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_App2.default.headerTop, children: [
464
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_App2.default.branding, children: [
465
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: import_App2.default.logo, children: t("app.header.title") }),
466
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: import_App2.default.subtitle, children: t("app.header.subtitle") })
467
+ ] }),
468
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_App2.default.headerActions, children: [
469
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_LanguageSwitch.default, {}),
470
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
471
+ import_ThemeToggle.default,
472
+ {
473
+ theme: effectiveTheme,
474
+ onToggle: handleThemeToggle
475
+ }
476
+ ),
477
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Tooltip, { content: t("app.header.refresh.tooltip"), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
478
+ import_web_react.Button,
479
+ {
480
+ size: "default",
481
+ icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.IconRefresh, {}),
482
+ loading: refreshing,
483
+ onClick: handleRefresh,
484
+ className: import_ThemeToggle2.default.themeToggle
485
+ }
486
+ ) })
487
+ ] })
488
+ ] }),
489
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_App2.default.meta, children: [
490
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_App2.default.scope, children: [
491
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: import_App2.default.scopeLabel, children: t("app.header.scope.label") }),
492
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Tag, { className: "common-tag", children: (inspectedTab == null ? void 0 : inspectedTab.title) || t("app.header.scope.waiting") })
493
+ ] }),
494
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_App2.default.stats, children: [
495
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_App2.default.statBlock, children: [
496
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: import_App2.default.statValue, children: moduleCount }),
497
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: import_App2.default.statLabel, children: t("app.header.stats.modules") })
498
+ ] }),
499
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_App2.default.statBlock, children: [
500
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: import_App2.default.statValue, children: producer.length }),
501
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: import_App2.default.statLabel, children: t("app.header.stats.remotes") })
502
+ ] }),
503
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_App2.default.statBlock, children: [
504
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: import_App2.default.statValue, children: consumerCount }),
505
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: import_App2.default.statLabel, children: t("app.header.stats.consumers") })
506
+ ] })
507
+ ] })
508
+ ] })
509
+ ] }),
510
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_App2.default.body, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_App2.default.content, children: renderContent() }) })
511
+ ] })
512
+ ]
513
+ }
514
+ );
515
+ };
516
+ const App = (props) => {
517
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_i18next.I18nextProvider, { i18n: import_i18n.default, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(InnerApp, __spreadValues({}, props)) });
518
+ };
519
+ var App_default = App;
@@ -0,0 +1,24 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
+ var __getOwnPropNames = Object.getOwnPropertyNames;
4
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
5
+ var __export = (target, all) => {
6
+ for (var name in all)
7
+ __defProp(target, name, { get: all[name], enumerable: true });
8
+ };
9
+ var __copyProps = (to, from, except, desc) => {
10
+ if (from && typeof from === "object" || typeof from === "function") {
11
+ for (let key of __getOwnPropNames(from))
12
+ if (!__hasOwnProp.call(to, key) && key !== except)
13
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
14
+ }
15
+ return to;
16
+ };
17
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
18
+ var App_module_exports = {};
19
+ __export(App_module_exports, {
20
+ default: () => App_module_default
21
+ });
22
+ module.exports = __toCommonJS(App_module_exports);
23
+ var import_App_module = require("./App_module.css");
24
+ var App_module_default = { "shell": "shell_ae2ee", "sidebar": "sidebar_ae2ee", "tabItem": "tabItem_ae2ee", "activeTab": "activeTab_ae2ee", "panel": "panel_ae2ee", "header": "header_ae2ee", "headerTop": "headerTop_ae2ee", "branding": "branding_ae2ee", "logo": "logo_ae2ee", "subtitle": "subtitle_ae2ee", "meta": "meta_ae2ee", "scope": "scope_ae2ee", "scopeLabel": "scopeLabel_ae2ee", "stats": "stats_ae2ee", "statBlock": "statBlock_ae2ee", "statValue": "statValue_ae2ee", "statLabel": "statLabel_ae2ee", "body": "body_ae2ee", "content": "content_ae2ee", "emptyState": "emptyState_ae2ee", "empty": "empty_ae2ee", "placeholder": "placeholder_ae2ee", "overrideArco": "overrideArco_ae2ee" };