@module-federation/devtools 0.0.0-perf-devtools-20260106124142 → 0.0.0-perf-devtools-20260107043700

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.
@@ -0,0 +1,45 @@
1
+ .container_ee3c9 {
2
+ display: flex;
3
+ flex-direction: column;
4
+ gap: 4px;
5
+ }
6
+
7
+ .header_ee3c9 {
8
+ display: flex;
9
+ flex-wrap: wrap;
10
+ align-items: center;
11
+ gap: 8px;
12
+ }
13
+
14
+ .packageInfo_ee3c9 {
15
+ font-family: monospace;
16
+ font-size: 11px;
17
+ }
18
+
19
+ .providers_ee3c9 {
20
+ display: flex;
21
+ flex-wrap: wrap;
22
+ align-items: center;
23
+ gap: 4px;
24
+ font-size: 11px;
25
+ color: #374151; /* text-zinc-700 */
26
+ }
27
+
28
+ .label_ee3c9 {
29
+ color: #71717a; /* text-zinc-500 */
30
+ }
31
+
32
+ .providerTag_ee3c9 {
33
+ border-radius: 4px;
34
+ background-color: white;
35
+ padding: 2px 6px;
36
+ font-weight: 500;
37
+ color: #27272a; /* text-zinc-800 */
38
+ box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
39
+ }
40
+
41
+ .emptyText_ee3c9 {
42
+ font-size: 11px;
43
+ color: #71717a; /* text-zinc-500 */
44
+ margin: 0;
45
+ }
@@ -57,6 +57,7 @@ var import_lucide_react = require("lucide-react");
57
57
  var import_web_react = require("@arco-design/web-react");
58
58
  var import_share_utils = require("./share-utils");
59
59
  var import_FocusResultDisplay = __toESM(require("./FocusResultDisplay"));
60
+ var import_index = __toESM(require("./index.module"));
60
61
  const ALL_VALUE = "__all__";
61
62
  function loadedStatusLabel(status) {
62
63
  if (status === "loaded") {
@@ -189,9 +190,9 @@ function SharedDepsExplorer({
189
190
  {
190
191
  title: "Package / Version",
191
192
  width: "28%",
192
- render: (_, item) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col", children: [
193
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "break-all font-mono text-[11px] text-zinc-800", children: item.packageName }),
194
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mt-1 text-[11px] text-zinc-500", children: [
193
+ render: (_, item) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.cellCol, children: [
194
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.packageName, children: item.packageName }),
195
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.version, children: [
195
196
  "v",
196
197
  item.version
197
198
  ] })
@@ -200,12 +201,12 @@ function SharedDepsExplorer({
200
201
  {
201
202
  title: "Provider / Scope",
202
203
  width: "20%",
203
- render: (_, item) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col gap-1", children: [
204
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "truncate", title: item.from, children: [
204
+ render: (_, item) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.cellColGap, children: [
205
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: import_index.default.truncate, title: item.from, children: [
205
206
  "Provider: ",
206
207
  item.from
207
208
  ] }),
208
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "text-[11px] text-zinc-500", children: [
209
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: import_index.default.scopeText, children: [
209
210
  "scope: ",
210
211
  item.scope
211
212
  ] })
@@ -214,20 +215,20 @@ function SharedDepsExplorer({
214
215
  {
215
216
  title: "Status",
216
217
  width: "22%",
217
- render: (_, item) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col gap-1", children: [
218
+ render: (_, item) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.cellColGap, children: [
218
219
  ["loaded", "loading"].includes(item.loadedStatus) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
219
220
  import_web_react.Tag,
220
221
  {
221
222
  size: "small",
222
- className: `w-16 flex items-center justify-center loaded-status-tag`,
223
+ className: `${import_index.default.tagContainer} loaded-status-tag`,
223
224
  children: loadedStatusLabel(item.loadedStatus)
224
225
  }
225
226
  ) : null,
226
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mt-1 flex flex-wrap gap-1 text-[10px] text-zinc-500", children: [
227
- item.shareConfig.singleton && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Tag, { size: "small", className: "scale-90 origin-left", children: "singleton" }),
228
- item.shareConfig.eager && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Tag, { size: "small", className: "scale-90 origin-left", children: "eager" }),
229
- item.shareConfig.strictVersion && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Tag, { size: "small", className: "scale-90 origin-left", children: "strictVersion" }),
230
- item.shareConfig.requiredVersion && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_web_react.Tag, { size: "small", className: "scale-90 origin-left", children: [
227
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.configTags, children: [
228
+ item.shareConfig.singleton && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Tag, { size: "small", className: import_index.default.scale90, children: "singleton" }),
229
+ item.shareConfig.eager && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Tag, { size: "small", className: import_index.default.scale90, children: "eager" }),
230
+ item.shareConfig.strictVersion && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Tag, { size: "small", className: import_index.default.scale90, children: "strictVersion" }),
231
+ item.shareConfig.requiredVersion && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_web_react.Tag, { size: "small", className: import_index.default.scale90, children: [
231
232
  "req: ",
232
233
  item.shareConfig.requiredVersion
233
234
  ] })
@@ -242,15 +243,15 @@ function SharedDepsExplorer({
242
243
  {
243
244
  trigger: "click",
244
245
  position: "right",
245
- content: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "w-72", children: [
246
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "mb-1 text-xs font-medium", children: "Consumer List" }),
247
- item.useIn.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-[11px] text-zinc-500", children: "No applications are consuming this shared dependency version." }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ul", { className: "space-y-1 text-[11px] text-zinc-700", children: item.useIn.map((c) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("li", { className: "flex items-center gap-1", children: [
248
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "h-1.5 w-1.5 rounded-full bg-emerald-500" }),
249
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "break-all", children: c })
246
+ content: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.popoverContent, children: [
247
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.popoverTitle, children: "Consumer List" }),
248
+ item.useIn.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: import_index.default.scopeText, children: "No applications are consuming this shared dependency version." }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ul", { className: import_index.default.consumerList, children: item.useIn.map((c) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("li", { className: import_index.default.consumerItem, children: [
249
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: import_index.default.dot }),
250
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: import_index.default.packageName, children: c })
250
251
  ] }, c)) })
251
252
  ] }),
252
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Button, { size: "mini", type: "secondary", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center", children: [
253
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Network, { className: "h-3 w-3 mr-1" }),
253
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Button, { size: "mini", type: "secondary", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.btnContent, children: [
254
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Network, { className: import_index.default.mr1, size: 12 }),
254
255
  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [
255
256
  item.useIn.length || 0,
256
257
  " Apps"
@@ -268,35 +269,35 @@ function SharedDepsExplorer({
268
269
  }
269
270
  }
270
271
  ];
271
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: `flex flex-col gap-4 px-3 py-4 md:px-4 md:py-6 max-w-5xl`, children: [
272
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", { className: "space-y-2", children: [
273
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs font-semibold uppercase tracking-wide text-zinc-500", children: "Module Federation · Shared Dependencies" }),
274
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", { className: "text-3xl font-bold tracking-tight text-zinc-900", children: "Overview of Shared Dependencies Usage" })
272
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.container, children: [
273
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", { className: import_index.default.heroSection, children: [
274
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: import_index.default.heroSubtitle, children: "Module Federation · Shared Dependencies" }),
275
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", { className: import_index.default.heroTitle, children: "Overview of Shared Dependencies Usage" })
275
276
  ] }),
276
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("section", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3", children: [
277
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_web_react.Card, { className: "rounded-xl shadow-sm border-zinc-200 p-4", children: [
278
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex flex-row items-center justify-between pb-2", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-1", children: [
279
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-sm text-zinc-500", children: "Number of Providers" }),
280
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "text-2xl font-semibold flex items-center gap-2", children: [
281
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Server, { className: "h-5 w-5 text-zinc-400" }),
277
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("section", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.statsGrid, children: [
278
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_web_react.Card, { className: import_index.default.cardWithPadding, children: [
279
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.cardHeader, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.statSpace, children: [
280
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.statLabel, children: "Number of Providers" }),
281
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.statValue, children: [
282
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Server, { className: import_index.default.icon }),
282
283
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: stats.totalProviders })
283
284
  ] })
284
285
  ] }) }),
285
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs text-zinc-500", children: "Number of applications/build versions exposing shared dependencies." })
286
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: import_index.default.statDescription, children: "Number of applications/build versions exposing shared dependencies." })
286
287
  ] }),
287
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_web_react.Card, { className: "rounded-xl shadow-sm border-zinc-200 p-4", children: [
288
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex flex-row items-center justify-between pb-2", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-1", children: [
289
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-sm text-zinc-500", children: "Share Scope / Package" }),
290
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "text-2xl font-semibold flex items-center gap-2", children: [
291
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Layers, { className: "h-5 w-5 text-zinc-400" }),
288
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_web_react.Card, { className: import_index.default.cardWithPadding, children: [
289
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.cardHeader, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.statSpace, children: [
290
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.statLabel, children: "Share Scope / Package" }),
291
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.statValue, children: [
292
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Layers, { className: import_index.default.icon }),
292
293
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: stats.totalScopes }),
293
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-base text-zinc-400", children: "scope" })
294
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: import_index.default.statSubtext, children: "scope" })
294
295
  ] })
295
296
  ] }) }),
296
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between text-xs text-zinc-500 whitespace-nowrap", children: [
297
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "truncate mr-2", children: "Shared spaces under Scope dimension." }),
298
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "inline-flex items-center gap-1 flex-shrink-0", children: [
299
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Box, { className: "h-3 w-3" }),
297
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.cardFooter, children: [
298
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: `${import_index.default.truncate} ${import_index.default.mr2}`, children: "Shared spaces under Scope dimension." }),
299
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: import_index.default.badgeGroup, children: [
300
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Box, { className: import_index.default.iconSmall }),
300
301
  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [
301
302
  stats.totalPackages,
302
303
  " packages"
@@ -304,42 +305,42 @@ function SharedDepsExplorer({
304
305
  ] })
305
306
  ] })
306
307
  ] }),
307
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_web_react.Card, { className: "rounded-xl shadow-sm border-zinc-200 p-4", children: [
308
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex flex-row items-center justify-between pb-2", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-1", children: [
309
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-sm text-zinc-500", children: "Version Loading & Reuse" }),
310
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "text-2xl font-semibold flex items-center gap-2", children: [
311
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Package2, { className: "h-5 w-5 text-zinc-400" }),
308
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_web_react.Card, { className: import_index.default.cardWithPadding, children: [
309
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.cardHeader, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.statSpace, children: [
310
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.statLabel, children: "Version Loading & Reuse" }),
311
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.statValue, children: [
312
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Package2, { className: import_index.default.icon }),
312
313
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: stats.totalVersions })
313
314
  ] })
314
315
  ] }) }),
315
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex flex-col gap-1 text-xs text-zinc-500", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2", children: [
316
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Tag, { className: "flex items-center gap-1 loaded-status-tag", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center", children: [
317
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Network, { className: "h-3 w-3 mr-1" }),
316
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.statusTags, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.tagRow, children: [
317
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Tag, { className: `${import_index.default.tagContent} loaded-status-tag`, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.tagContent, children: [
318
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Network, { className: `${import_index.default.iconSmall} ${import_index.default.mr1}` }),
318
319
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Loaded" }),
319
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "font-semibold text-zinc-900 ml-1", children: stats.loadedCount })
320
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: import_index.default.tagValue, children: stats.loadedCount })
320
321
  ] }) }),
321
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Tag, { className: "flex items-center gap-1 reused-status-tag", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center", children: [
322
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Repeat, { className: "h-3 w-3 mr-1" }),
322
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Tag, { className: `${import_index.default.tagContent} reused-status-tag`, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.tagContent, children: [
323
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Repeat, { className: `${import_index.default.iconSmall} ${import_index.default.mr1}` }),
323
324
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Reused" }),
324
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "font-semibold text-zinc-900 ml-1", children: stats.reusedCount })
325
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: import_index.default.tagValue, children: stats.reusedCount })
325
326
  ] }) })
326
327
  ] }) })
327
328
  ] })
328
329
  ] }) }),
329
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("section", { className: "flex flex-col gap-4", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "space-y-4", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
330
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("section", { className: import_index.default.rightPanels, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.panelStack, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
330
331
  import_web_react.Card,
331
332
  {
332
- className: "rounded-xl shadow-sm border-zinc-200",
333
- title: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "text-base flex items-center gap-2", children: [
334
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Box, { className: "h-4 w-4 text-zinc-500" }),
333
+ className: import_index.default.card,
334
+ title: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.cardTitle, children: [
335
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Box, { className: import_index.default.iconMedium }),
335
336
  "Who provides the current shared: '",
336
337
  focusPackage,
337
338
  "'?"
338
339
  ] }),
339
340
  children: [
340
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "grid gap-3 md:grid-cols-2 mb-3 p-2", children: [
341
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-1", children: [
342
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-xs text-zinc-500", children: "Package Name" }),
341
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.controlsGrid, children: [
342
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.inputGroup, children: [
343
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.inputLabel, children: "Package Name" }),
343
344
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
344
345
  import_web_react.Select,
345
346
  {
@@ -350,13 +351,13 @@ function SharedDepsExplorer({
350
351
  setFocusVersion("");
351
352
  },
352
353
  placeholder: "Select Shared Dependency Package Name",
353
- className: "w-full",
354
+ className: import_index.default.fullWidth,
354
355
  children: filterOptions.packages.map((name) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Select.Option, { value: name, children: name }, name))
355
356
  }
356
357
  )
357
358
  ] }),
358
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-1", children: [
359
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-xs text-zinc-500", children: "Version (Optional, inferred if empty)" }),
359
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.inputGroup, children: [
360
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.inputLabel, children: "Version (Optional, inferred if empty)" }),
360
361
  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
361
362
  import_web_react.Select,
362
363
  {
@@ -364,7 +365,7 @@ function SharedDepsExplorer({
364
365
  value: focusVersion || ALL_VALUE,
365
366
  onChange: (value) => setFocusVersion(value === ALL_VALUE ? "" : value),
366
367
  placeholder: "All Versions",
367
- className: "w-full",
368
+ className: import_index.default.fullWidth,
368
369
  children: [
369
370
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Select.Option, { value: ALL_VALUE, children: "All Versions" }),
370
371
  focusVersionsForPackage.map((v) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Select.Option, { value: v, children: v }, v))
@@ -373,7 +374,7 @@ function SharedDepsExplorer({
373
374
  )
374
375
  ] })
375
376
  ] }),
376
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "rounded-md border border-dashed border-zinc-200 bg-zinc-50 px-3 py-2 text-xs", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
377
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.resultBox, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
377
378
  import_FocusResultDisplay.default,
378
379
  {
379
380
  focusResult,
@@ -387,50 +388,50 @@ function SharedDepsExplorer({
387
388
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("section", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
388
389
  import_web_react.Card,
389
390
  {
390
- className: "rounded-xl shadow-sm border-zinc-200",
391
- title: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "text-base flex items-center gap-2", children: [
392
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Search, { className: "h-4 w-4 text-zinc-500" }),
391
+ className: import_index.default.card,
392
+ title: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.cardTitle, children: [
393
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Search, { className: import_index.default.iconMedium }),
393
394
  "Filter / Search"
394
395
  ] }),
395
396
  children: [
396
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "grid gap-3 md:grid-cols-2 lg:grid-cols-3 mb-3", children: [
397
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-1 p-2", children: [
398
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-xs text-zinc-500", children: "Provider" }),
397
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.filterGrid, children: [
398
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: `${import_index.default.inputGroup} ${import_index.default.padding2}`, children: [
399
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.inputLabel, children: "Provider" }),
399
400
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
400
401
  import_web_react.Select,
401
402
  {
402
403
  value: selectedProvider || void 0,
403
404
  onChange: (value) => setSelectedProvider(value === ALL_VALUE ? "" : value),
404
405
  placeholder: "All Providers",
405
- className: "w-full",
406
+ className: import_index.default.fullWidth,
406
407
  allowClear: true,
407
408
  children: filterOptions.providers.map((p) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Select.Option, { value: p, children: p }, p))
408
409
  }
409
410
  )
410
411
  ] }),
411
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-1 p-2", children: [
412
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-xs text-zinc-500", children: "Package Name" }),
412
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: `${import_index.default.inputGroup} ${import_index.default.padding2}`, children: [
413
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.inputLabel, children: "Package Name" }),
413
414
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
414
415
  import_web_react.Select,
415
416
  {
416
417
  value: selectedPackage || void 0,
417
418
  onChange: (value) => setSelectedPackage(value === ALL_VALUE ? "" : value),
418
419
  placeholder: "All Packages",
419
- className: "w-full",
420
+ className: import_index.default.fullWidth,
420
421
  allowClear: true,
421
422
  children: filterOptions.packages.map((name) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Select.Option, { value: name, children: name }, name))
422
423
  }
423
424
  )
424
425
  ] }),
425
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-1 p-2", children: [
426
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-xs text-zinc-500", children: "Version" }),
426
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: `${import_index.default.inputGroup} ${import_index.default.padding2}`, children: [
427
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.inputLabel, children: "Version" }),
427
428
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
428
429
  import_web_react.Select,
429
430
  {
430
431
  value: selectedVersion || void 0,
431
432
  onChange: (value) => setSelectedVersion(value === ALL_VALUE ? "" : value),
432
433
  placeholder: "All Versions",
433
- className: "w-full",
434
+ className: import_index.default.fullWidth,
434
435
  disabled: !selectedPackage,
435
436
  allowClear: true,
436
437
  children: versionsForSelectedPackage.map((v) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Select.Option, { value: v, children: v }, v))
@@ -438,57 +439,57 @@ function SharedDepsExplorer({
438
439
  )
439
440
  ] })
440
441
  ] }),
441
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "grid gap-3 md:grid-cols-2 p-2", children: [
442
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-1", children: [
443
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-xs text-zinc-500", children: "Package Name Keyword (Fuzzy Match)" }),
442
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.searchGrid, children: [
443
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.inputGroup, children: [
444
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.inputLabel, children: "Package Name Keyword (Fuzzy Match)" }),
444
445
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
445
446
  import_web_react.Input,
446
447
  {
447
- prefix: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Search, { className: "text-zinc-400 h-3.5 w-3.5" }),
448
- className: "text-xs",
448
+ prefix: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Search, { className: import_index.default.iconMedium }),
449
+ className: import_index.default.searchInput,
449
450
  placeholder: "e.g., react / axios",
450
451
  value: searchText,
451
452
  onChange: (val) => setSearchText(val)
452
453
  }
453
454
  )
454
455
  ] }),
455
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex items-end justify-end gap-2 text-xs text-zinc-500", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [
456
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.matchCount, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [
456
457
  "Currently Matched Versions:",
457
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "font-semibold text-zinc-900 ml-1", children: filteredVersions.length })
458
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: import_index.default.matchValue, children: filteredVersions.length })
458
459
  ] }) })
459
460
  ] }),
460
- !hasData && loadingState === "loading" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "py-4 text-xs text-zinc-500", children: "Parsing shared dependency data..." }),
461
- loadingState === "error" && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "py-3 text-xs text-red-600", children: [
461
+ !hasData && loadingState === "loading" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.loadingText, children: "Parsing shared dependency data..." }),
462
+ loadingState === "error" && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.errorText, children: [
462
463
  "Failed to load shared dependency data:",
463
464
  " ",
464
465
  errorMessage != null ? errorMessage : "Unknown Error"
465
466
  ] }),
466
- hasData && Object.keys(tree).length === 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "py-3 text-xs text-zinc-500", children: "No matching shared dependency versions under current filter conditions, try relaxing the filter conditions." }),
467
- hasData && Object.keys(tree).length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "max-h-80 overflow-y-auto", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "space-y-2", style: { border: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Collapse, { children: Object.entries(tree).map(([provider, scopes]) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
467
+ hasData && Object.keys(tree).length === 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.noMatchText, children: "No matching shared dependency versions under current filter conditions, try relaxing the filter conditions." }),
468
+ hasData && Object.keys(tree).length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.treeContainer, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.collapseWrapper, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web_react.Collapse, { children: Object.entries(tree).map(([provider, scopes]) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
468
469
  import_web_react.Collapse.Item,
469
470
  {
470
471
  name: provider,
471
- header: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col items-start gap-1 text-left", children: [
472
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2 text-sm font-medium", children: [
473
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Server, { className: "h-3.5 w-3.5 text-zinc-500" }),
472
+ header: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.providerHeader, children: [
473
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.providerTitle, children: [
474
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Server, { className: import_index.default.iconMedium }),
474
475
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: provider })
475
476
  ] }),
476
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex flex-wrap gap-2 text-[10px] text-zinc-500", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [
477
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.providerMeta, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [
477
478
  "Scope Count: ",
478
479
  Object.keys(scopes).length
479
480
  ] }) })
480
481
  ] }),
481
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "space-y-4", children: Object.entries(scopes).map(([scopeName, packages]) => {
482
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.scopeList, children: Object.entries(scopes).map(([scopeName, packages]) => {
482
483
  const list = Object.values(packages).flat();
483
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-2", children: [
484
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2 text-xs font-medium text-zinc-600", children: [
485
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Layers, { className: "h-3 w-3 text-zinc-500" }),
484
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.scopeItem, children: [
485
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: import_index.default.scopeHeader, children: [
486
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Layers, { className: import_index.default.iconSmall }),
486
487
  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [
487
488
  "Scope: ",
488
489
  scopeName
489
490
  ] })
490
491
  ] }),
491
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "overflow-hidden rounded-md border border-zinc-200 bg-zinc-50/40", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
492
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: import_index.default.tableContainer, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
492
493
  import_web_react.Table,
493
494
  {
494
495
  columns,
@@ -0,0 +1,25 @@
1
+ "use strict";
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
6
+ var __export = (target, all) => {
7
+ for (var name in all)
8
+ __defProp(target, name, { get: all[name], enumerable: true });
9
+ };
10
+ var __copyProps = (to, from, except, desc) => {
11
+ if (from && typeof from === "object" || typeof from === "function") {
12
+ for (let key of __getOwnPropNames(from))
13
+ if (!__hasOwnProp.call(to, key) && key !== except)
14
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
+ }
16
+ return to;
17
+ };
18
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
+ var index_module_exports = {};
20
+ __export(index_module_exports, {
21
+ default: () => index_module_default
22
+ });
23
+ module.exports = __toCommonJS(index_module_exports);
24
+ var import_index_module = require("./index_module.css");
25
+ var index_module_default = { "container": "container_967de", "heroSection": "heroSection_967de", "heroSubtitle": "heroSubtitle_967de", "heroTitle": "heroTitle_967de", "statsGrid": "statsGrid_967de", "card": "card_967de", "cardWithPadding": "cardWithPadding_967de", "cardHeader": "cardHeader_967de", "statSpace": "statSpace_967de", "statLabel": "statLabel_967de", "statValue": "statValue_967de", "icon": "icon_967de", "iconSmall": "iconSmall_967de", "iconMedium": "iconMedium_967de", "statDescription": "statDescription_967de", "statSubtext": "statSubtext_967de", "cardFooter": "cardFooter_967de", "truncate": "truncate_967de", "mr2": "mr2_967de", "badgeGroup": "badgeGroup_967de", "statusTags": "statusTags_967de", "tagRow": "tagRow_967de", "tagContent": "tagContent_967de", "tagValue": "tagValue_967de", "mr1": "mr1_967de", "rightPanels": "rightPanels_967de", "panelStack": "panelStack_967de", "cardTitle": "cardTitle_967de", "controlsGrid": "controlsGrid_967de", "inputGroup": "inputGroup_967de", "inputLabel": "inputLabel_967de", "fullWidth": "fullWidth_967de", "resultBox": "resultBox_967de", "filterGrid": "filterGrid_967de", "padding2": "padding2_967de", "searchGrid": "searchGrid_967de", "searchInput": "searchInput_967de", "matchCount": "matchCount_967de", "matchValue": "matchValue_967de", "loadingText": "loadingText_967de", "errorText": "errorText_967de", "noMatchText": "noMatchText_967de", "treeContainer": "treeContainer_967de", "collapseWrapper": "collapseWrapper_967de", "providerHeader": "providerHeader_967de", "providerTitle": "providerTitle_967de", "providerMeta": "providerMeta_967de", "scopeList": "scopeList_967de", "scopeItem": "scopeItem_967de", "scopeHeader": "scopeHeader_967de", "tableContainer": "tableContainer_967de", "cellCol": "cellCol_967de", "packageName": "packageName_967de", "version": "version_967de", "cellColGap": "cellColGap_967de", "scopeText": "scopeText_967de", "tagContainer": "tagContainer_967de", "configTags": "configTags_967de", "scale90": "scale90_967de", "popoverContent": "popoverContent_967de", "popoverTitle": "popoverTitle_967de", "consumerList": "consumerList_967de", "consumerItem": "consumerItem_967de", "dot": "dot_967de", "btnContent": "btnContent_967de" };