@rsdoctor/components 1.3.13-beta.0 → 1.3.13-beta.1

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.
@@ -4,13 +4,13 @@ import core from "echarts-for-react/esm/core";
4
4
  import { TreemapChart } from "echarts/charts";
5
5
  import { TooltipComponent } from "echarts/components";
6
6
  import { CanvasRenderer } from "echarts/renderers";
7
- import { BUNDLE_ANALYZER_COLORS, COLOR_GROUPS } from "./constants.mjs";
8
7
  import { Checkbox, Input, Radio } from "antd";
9
8
  import { FullscreenExitOutlined, FullscreenOutlined, LeftOutlined, RightOutlined, SearchOutlined } from "@ant-design/icons";
10
9
  import { formatSize } from "../../utils/index.mjs";
11
10
  import { SDK } from "@rsdoctor/types";
12
11
  import { ServerAPIProvider } from "../Manifest/index.mjs";
13
12
  import treemap_module from "./treemap.module.mjs";
13
+ import { TREE_COLORS } from "./constants.mjs";
14
14
  import * as __WEBPACK_EXTERNAL_MODULE_echarts_core_d2845954__ from "echarts/core";
15
15
  __WEBPACK_EXTERNAL_MODULE_echarts_core_d2845954__.use([
16
16
  TreemapChart,
@@ -22,33 +22,41 @@ function hashString(str) {
22
22
  for(let i = 0; i < str.length; i++)hash = (hash << 5) + hash + str.charCodeAt(i);
23
23
  return hash >>> 0;
24
24
  }
25
+ function blendWithWhite(hex, ratio) {
26
+ const r = parseInt(hex.slice(1, 3), 16);
27
+ const g = parseInt(hex.slice(3, 5), 16);
28
+ const b = parseInt(hex.slice(5, 7), 16);
29
+ const blendedR = Math.round(r * ratio + 255 * (1 - ratio));
30
+ const blendedG = Math.round(g * ratio + 255 * (1 - ratio));
31
+ const blendedB = Math.round(b * ratio + 255 * (1 - ratio));
32
+ return `#${blendedR.toString(16).padStart(2, '0')}${blendedG.toString(16).padStart(2, '0')}${blendedB.toString(16).padStart(2, '0')}`;
33
+ }
25
34
  function getLevelOption() {
26
35
  return [
27
36
  {
28
37
  itemStyle: {
29
- gapWidth: 3,
30
- borderColor: '#eee'
31
- },
32
- upperLabel: {
33
- show: false
34
- }
35
- },
36
- {
37
- itemStyle: {
38
- borderWidth: 5,
38
+ borderWidth: 0,
39
39
  gapWidth: 2
40
40
  }
41
41
  },
42
42
  {
43
- colorSaturation: [
44
- 0.3,
45
- 0.9
46
- ],
47
43
  itemStyle: {
44
+ borderColorAlpha: [
45
+ 1,
46
+ 0.3
47
+ ],
48
48
  borderWidth: 5,
49
- gapWidth: 2,
50
- borderColorSaturation: 0.6,
51
- borderColor: '#eee'
49
+ gapWidth: 1
50
+ },
51
+ upperLabel: {
52
+ show: true,
53
+ color: '#555555',
54
+ height: 30
55
+ },
56
+ emphasis: {
57
+ itemStyle: {
58
+ borderColor: '#ccc'
59
+ }
52
60
  }
53
61
  }
54
62
  ];
@@ -66,10 +74,9 @@ const TreeMapInner = /*#__PURE__*/ memo(({ treeData, sizeType, style, onChartCli
66
74
  ]);
67
75
  useEffect(()=>{
68
76
  if (!treeData) return;
69
- function convert(node, colorGroup, level = 0) {
70
- const groupColors = BUNDLE_ANALYZER_COLORS[colorGroup];
71
- const _level = level;
72
- const children = node.children?.map((c)=>convert(c, colorGroup, _level + 1));
77
+ function convert(node, index = 0, level = 0, parentColor, siblingIndex = 0, siblingCount = 1) {
78
+ const baseColor = parentColor || TREE_COLORS[index % TREE_COLORS.length];
79
+ const children = node.children?.map((c, childIndex)=>convert(c, index, level + 1, baseColor, childIndex, node.children?.length || 0));
73
80
  let val = 0;
74
81
  if ('stat' === sizeType) val = node.sourceSize || 0;
75
82
  else if ('parsed' === sizeType) val = node.bundledSize || 0;
@@ -78,7 +85,14 @@ const TreeMapInner = /*#__PURE__*/ memo(({ treeData, sizeType, style, onChartCli
78
85
  if (!val && node.value) val = node.value;
79
86
  const nodeId = node.path ? hashString(node.path) : hashString(node.name || '');
80
87
  const isHighlighted = highlightNodeId === nodeId;
81
- console.log(level % groupColors.length - 1, groupColors, colorGroup);
88
+ const baseColorRatio = 0 === level ? 1 : Math.max(0.2, 1 - 0.2 * level);
89
+ const baseBorderRatio = 0 === level ? 1 : Math.max(0.3, 1 - 0.25 * level);
90
+ const siblingGradientRange = 0.15;
91
+ const siblingRatio = siblingCount > 1 ? 1 - siblingIndex / (siblingCount - 1) * siblingGradientRange : 1;
92
+ const colorRatio = baseColorRatio * siblingRatio;
93
+ const borderRatio = baseBorderRatio * siblingRatio;
94
+ const nodeColor = isHighlighted ? '#fff5f5' : 0 === level ? blendWithWhite(baseColor, 0.8) : blendWithWhite(baseColor, colorRatio);
95
+ const nodeBorderColor = isHighlighted ? '#ff4d4f' : 0 === level ? baseColor : blendWithWhite(baseColor, borderRatio);
82
96
  const result = {
83
97
  id: nodeId,
84
98
  name: node.name,
@@ -89,10 +103,11 @@ const TreeMapInner = /*#__PURE__*/ memo(({ treeData, sizeType, style, onChartCli
89
103
  gzipSize: node.gzipSize ?? ('gzip' === sizeType ? val : 0),
90
104
  itemStyle: {
91
105
  borderWidth: isHighlighted ? 4 : 1,
92
- gapWidth: 2,
93
- color: isHighlighted ? '#fff5f5' : groupColors[level % groupColors.length - 1],
94
- borderColor: isHighlighted ? '#ff4d4f' : groupColors[level % groupColors.length - 1],
95
- borderColorSaturation: isHighlighted ? 1 : 0.5
106
+ color: nodeColor,
107
+ borderColor: nodeBorderColor,
108
+ ...0 === level && {
109
+ gapWidth: 2
110
+ }
96
111
  }
97
112
  };
98
113
  if (children && children.length > 0) result.children = children;
@@ -105,12 +120,10 @@ const TreeMapInner = /*#__PURE__*/ memo(({ treeData, sizeType, style, onChartCli
105
120
  };
106
121
  return result;
107
122
  }
108
- const data = treeData.map((item, index)=>{
109
- const group = COLOR_GROUPS[index % COLOR_GROUPS.length];
110
- return convert(item, group, 1);
111
- }).filter((item)=>item.value > 0 || item.children && item.children.length > 0);
123
+ const data = treeData.map((item, index)=>convert(item, index, 0, void 0, index, treeData.length)).filter((item)=>item.value > 0 || item.children && item.children.length > 0);
112
124
  chartDataRef.current = data;
113
125
  setOption({
126
+ color: TREE_COLORS,
114
127
  title: {
115
128
  text: 'Rsdoctor TreeMap',
116
129
  left: 'center',
@@ -202,9 +215,6 @@ const TreeMapInner = /*#__PURE__*/ memo(({ treeData, sizeType, style, onChartCli
202
215
  4
203
216
  ]
204
217
  },
205
- itemStyle: {
206
- borderColor: '#fff'
207
- },
208
218
  levels: getLevelOption(),
209
219
  data: data,
210
220
  breadcrumb: {
@@ -1 +1 @@
1
- {"version":3,"file":"components/Charts/TreeMap.mjs","sources":["../../../src/components/Charts/TreeMap.tsx"],"sourcesContent":["import React, { useEffect, useState, memo, useMemo, useCallback } from 'react';\nimport EChartsReactCore from 'echarts-for-react/esm/core';\nimport * as echarts from 'echarts/core';\nimport { TreemapChart } from 'echarts/charts';\nimport { TooltipComponent } from 'echarts/components';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { BUNDLE_ANALYZER_COLORS, COLOR_GROUPS } from './constants';\nimport { Checkbox, Radio, Input } from 'antd';\nimport {\n LeftOutlined,\n RightOutlined,\n SearchOutlined,\n FullscreenOutlined,\n FullscreenExitOutlined,\n} from '@ant-design/icons';\nimport { formatSize } from 'src/utils';\nimport { SDK } from '@rsdoctor/types';\nimport { ServerAPIProvider } from 'src/components/Manifest';\nimport Styles from './treemap.module.scss';\n\necharts.use([TreemapChart, TooltipComponent, CanvasRenderer]);\n\nexport type TreeNode = {\n name: string;\n value?: number;\n children?: TreeNode[];\n path?: string;\n sourceSize?: number;\n bundledSize?: number;\n gzipSize?: number;\n};\n\nexport type SizeType = 'stat' | 'parsed' | 'gzip' | 'value';\n\ninterface TreeMapProps {\n treeData: TreeNode[];\n sizeType: SizeType;\n style?: React.CSSProperties;\n onChartClick?: (params: any) => void;\n highlightNodeId?: number;\n centerNodeId?: number;\n rootPath?: string;\n}\n\nfunction hashString(str: string): number {\n let hash = 5381;\n for (let i = 0; i < str.length; i++) {\n hash = (hash << 5) + hash + str.charCodeAt(i);\n }\n return hash >>> 0;\n}\n\nfunction getLevelOption() {\n return [\n {\n itemStyle: {\n gapWidth: 3,\n borderColor: '#eee',\n },\n upperLabel: {\n show: false,\n },\n },\n {\n itemStyle: {\n borderWidth: 5,\n gapWidth: 2,\n },\n },\n {\n colorSaturation: [0.3, 0.9],\n itemStyle: {\n borderWidth: 5,\n gapWidth: 2,\n borderColorSaturation: 0.6,\n borderColor: '#eee',\n },\n },\n ];\n}\n\nconst TreeMapInner: React.FC<TreeMapProps & { forwardedRef?: React.Ref<any> }> =\n memo(\n ({\n treeData,\n sizeType,\n style,\n onChartClick,\n forwardedRef,\n highlightNodeId,\n centerNodeId,\n rootPath,\n }) => {\n const [option, setOption] = useState<any>(null);\n const chartRef = React.useRef<any>(null);\n const chartDataRef = React.useRef<any[]>([]);\n\n useEffect(() => {\n if (forwardedRef && chartRef.current) {\n if (typeof forwardedRef === 'function') {\n forwardedRef(chartRef.current);\n } else {\n (forwardedRef as React.MutableRefObject<any>).current =\n chartRef.current;\n }\n }\n }, [forwardedRef, chartRef.current]);\n useEffect(() => {\n if (!treeData) return;\n function convert(\n node: TreeNode,\n colorGroup: keyof typeof BUNDLE_ANALYZER_COLORS,\n level = 0,\n ): any {\n const groupColors = BUNDLE_ANALYZER_COLORS[colorGroup];\n const _level = level;\n const children = node.children?.map((c) =>\n convert(c, colorGroup, _level + 1),\n );\n\n let val = 0;\n if (sizeType === 'stat') val = node.sourceSize || 0;\n else if (sizeType === 'parsed') val = node.bundledSize || 0;\n else if (sizeType === 'gzip') val = node.gzipSize || 0;\n else if (sizeType === 'value') val = node.value || 0;\n\n if (!val && node.value) val = node.value;\n\n const nodeId = node.path\n ? hashString(node.path)\n : hashString(node.name || '');\n const isHighlighted = highlightNodeId === nodeId;\n console.log(\n (level % groupColors.length) - 1,\n groupColors,\n colorGroup,\n );\n const result: any = {\n id: nodeId,\n name: node.name,\n value: val,\n path: node.path || node.name,\n sourceSize: node.sourceSize ?? (sizeType === 'stat' ? val : 0),\n bundledSize: node.bundledSize ?? (sizeType === 'parsed' ? val : 0),\n gzipSize: node.gzipSize ?? (sizeType === 'gzip' ? val : 0),\n itemStyle: {\n borderWidth: isHighlighted ? 4 : 1,\n gapWidth: 2,\n color: isHighlighted\n ? '#fff5f5'\n : groupColors[(level % groupColors.length) - 1],\n borderColor: isHighlighted\n ? '#ff4d4f'\n : groupColors[(level % groupColors.length) - 1],\n borderColorSaturation: isHighlighted ? 1 : 0.5,\n },\n };\n\n if (children && children.length > 0) {\n result.children = children;\n }\n\n if (isHighlighted) {\n result.emphasis = {\n itemStyle: {\n borderColor: '#ff4d4f',\n borderWidth: 4,\n color: '#fff5f5',\n },\n };\n }\n\n return result;\n }\n\n const data = treeData\n .map((item, index) => {\n const group = COLOR_GROUPS[index % COLOR_GROUPS.length];\n return convert(item, group, 1);\n })\n .filter(\n (item) =>\n item.value > 0 || (item.children && item.children.length > 0),\n );\n\n chartDataRef.current = data;\n\n setOption({\n title: {\n text: 'Rsdoctor TreeMap',\n left: 'center',\n top: 10,\n textStyle: {\n fontSize: 16,\n fontWeight: 'bold',\n color: 'rgba(0, 0, 0, 0.8)',\n },\n },\n tooltip: {\n padding: 10,\n backgroundColor: '#fff',\n borderColor: '#eee',\n borderWidth: 1,\n textStyle: {\n color: 'rgba(0, 0, 0, 0.8)',\n },\n confine: true,\n extraCssText: 'max-width: 450px; word-wrap: break-word;',\n position: function (\n pos: any,\n _params: any,\n _dom: any,\n _rect: any,\n size: any,\n ) {\n var obj = { top: pos[1] + 10 };\n if (pos[0] < size.viewSize[0] / 2) {\n (obj as any).left = pos[0] + 10;\n } else {\n (obj as any).right = size.viewSize[0] - pos[0] + 10;\n }\n return obj;\n },\n formatter: function (info: any) {\n const node = info.data || {};\n const name = node.name;\n let path = node.path || name;\n\n // Remove root path prefix if rootPath is provided\n if (rootPath && path) {\n const normalizedRoot = rootPath\n .replace(/\\\\/g, '/')\n .replace(/\\/$/, '');\n const normalizedPath = path.replace(/\\\\/g, '/');\n if (normalizedPath.startsWith(normalizedRoot + '/')) {\n path = normalizedPath.slice(normalizedRoot.length + 1);\n } else if (normalizedPath === normalizedRoot) {\n path = '';\n }\n }\n\n const sourceSize = node.sourceSize || node.value;\n const bundledSize = node.bundledSize;\n const gzipSize = node.gzipSize;\n\n function makeRow(label: string, value: string, color: string) {\n return `<div class=\"${Styles['tooltip-row']}\">\n <span class=\"${Styles['tooltip-label']}\" style=\"color: ${color};\">${label}</span>\n <span style=\"color: ${color};\">${value}</span>\n </div>`;\n }\n\n const rows = [];\n if (sourceSize !== undefined) {\n rows.push(\n makeRow('Stat size', formatSize(sourceSize), '#52c41a'),\n ); // Green\n }\n if (bundledSize !== undefined) {\n rows.push(\n makeRow('Parsed size', formatSize(bundledSize), '#fadb14'),\n ); // Yellow\n }\n if (gzipSize !== undefined) {\n rows.push(\n makeRow('Gzipped size', formatSize(gzipSize), '#1677ff'),\n ); // Blue\n }\n\n return `\n <div style=\"font-family: sans-serif; font-size: 12px; line-height: 1.5;\">\n <div style=\"margin-bottom: 6px; max-width: 400px; word-wrap: break-word; overflow-wrap: break-word; word-break: break-all; white-space: normal; color: rgba(0, 0, 0, 0.8);\">${echarts.format.encodeHTML(path)}</div>\n ${rows.join('')}\n </div>\n `;\n },\n },\n series: [\n {\n type: 'treemap',\n label: {\n show: true,\n formatter: '{b}',\n fontSize: 12,\n color: '#000',\n position: 'inside',\n fontWeight: 'normal',\n textBorderColor: '#fff',\n textBorderWidth: 2,\n padding: [4, 8, 4, 8],\n },\n upperLabel: {\n show: true,\n height: 30,\n color: '#000',\n fontSize: 12,\n fontWeight: 'normal',\n padding: [0, 0, 0, 4],\n },\n itemStyle: {\n borderColor: '#fff',\n },\n levels: getLevelOption(),\n data: data,\n breadcrumb: {\n show: true,\n left: 'center',\n top: 'bottom',\n height: 22,\n emptyItemWidth: 25,\n itemStyle: {\n color: '#999',\n borderColor: 'transparent',\n borderWidth: 0,\n borderRadius: 0,\n },\n emphasis: {\n itemStyle: {\n color: '#333',\n },\n },\n textStyle: {\n fontFamily: 'sans-serif',\n fontSize: 12,\n color: '#666',\n },\n },\n roam: true,\n nodeClick: false,\n zoomToNodeRatio: 0.5,\n animationDurationUpdate: 500,\n width: '100%',\n height: '100%',\n top: 40,\n bottom: 30,\n left: 0,\n right: 0,\n },\n ],\n });\n }, [treeData, sizeType, highlightNodeId, rootPath]);\n\n useEffect(() => {\n if (centerNodeId && chartRef.current && option) {\n const chartInstance = chartRef.current.getEchartsInstance();\n if (chartInstance) {\n const findNodeInfo = (\n data: any[],\n targetId: number,\n path: string[] = [],\n ): { name: string; path: string[] } | null => {\n for (const item of data) {\n const currentPath = [...path, item.name];\n if (item.id === targetId) {\n return { name: item.name, path: currentPath };\n }\n if (item.children) {\n const found = findNodeInfo(\n item.children,\n targetId,\n currentPath,\n );\n if (found) return found;\n }\n }\n return null;\n };\n\n setTimeout(() => {\n const nodeInfo = findNodeInfo(chartDataRef.current, centerNodeId);\n if (!nodeInfo) return;\n\n try {\n chartInstance.dispatchAction({\n type: 'highlight',\n seriesIndex: 0,\n name: nodeInfo.name,\n });\n } catch (e) {}\n\n const zoomStrategies: Array<() => void> = [\n () =>\n chartInstance.dispatchAction({\n type: 'treemapZoomToNode',\n seriesIndex: 0,\n targetNodeId: String(centerNodeId),\n }),\n () =>\n chartInstance.dispatchAction({\n type: 'treemapZoomToNode',\n seriesIndex: 0,\n name: nodeInfo.name,\n }),\n () =>\n chartInstance.dispatchAction({\n type: 'treemapZoomToNode',\n seriesIndex: 0,\n name: nodeInfo.path.join('/'),\n }),\n () =>\n nodeInfo.path.length > 0 &&\n chartInstance.dispatchAction({\n type: 'treemapZoomToNode',\n seriesIndex: 0,\n name: nodeInfo.path[nodeInfo.path.length - 1],\n }),\n ];\n\n for (const strategy of zoomStrategies) {\n try {\n strategy();\n return;\n } catch (e) {\n console.error(\n 'Failed to zoom to node with id:',\n centerNodeId,\n e,\n );\n }\n }\n\n console.warn('Failed to zoom to node with id:', centerNodeId);\n }, 200);\n }\n }\n }, [centerNodeId, option]);\n\n return option ? (\n <div className={Styles['chart-container']} style={style}>\n <EChartsReactCore\n ref={chartRef}\n option={option}\n echarts={echarts}\n onEvents={{\n click: (params: any) => {\n if (chartRef.current) {\n const instance = chartRef.current.getEchartsInstance();\n if (instance && params?.data?.id) {\n instance.dispatchAction({\n type: 'treemapZoomToNode',\n seriesIndex: 0,\n targetNodeId: String(params.data.id),\n });\n }\n }\n onChartClick?.(params);\n },\n }}\n style={{\n width: '100%',\n height: '100%',\n }}\n />\n </div>\n ) : null;\n },\n );\n\nexport const TreeMap = React.forwardRef<any, TreeMapProps>((props, ref) => (\n <TreeMapInner {...props} forwardedRef={ref} />\n));\n\nexport const AssetTreemapWithFilter: React.FC<{\n treeData: TreeNode[];\n onChartClick?: (params: any) => void;\n bundledSize?: boolean;\n}> = ({ treeData, onChartClick, bundledSize = true }) => {\n return (\n <ServerAPIProvider api={SDK.ServerAPI.API.GetProjectInfo}>\n {(projectInfo) => {\n return (\n <AssetTreemapWithFilterInner\n treeData={treeData}\n onChartClick={onChartClick}\n bundledSize={bundledSize}\n rootPath={projectInfo.root}\n />\n );\n }}\n </ServerAPIProvider>\n );\n};\n\nconst AssetTreemapWithFilterInner: React.FC<{\n treeData: TreeNode[];\n onChartClick?: (params: any) => void;\n bundledSize?: boolean;\n rootPath: string;\n}> = ({ treeData, onChartClick, bundledSize = true, rootPath }) => {\n const assetNames = useMemo(\n () => treeData.map((item) => item.name),\n [treeData],\n );\n\n const [checkedAssets, setCheckedAssets] = useState<string[]>(assetNames);\n const [collapsed, setCollapsed] = useState(false);\n const [sizeType, setSizeType] = useState<SizeType>(\n bundledSize ? 'parsed' : 'stat',\n );\n const [searchQuery, setSearchQuery] = useState('');\n const [isFullscreen, setIsFullscreen] = useState(false);\n const [highlightNodeId, setHighlightNodeId] = useState<number | undefined>();\n const [centerNodeId, setCenterNodeId] = useState<number | undefined>();\n\n const chartRef = React.useRef<any>(null);\n const containerRef = React.useRef<HTMLDivElement>(null);\n\n const enterFullscreen = useCallback(() => {\n if (containerRef.current) {\n containerRef.current\n .requestFullscreen()\n .then(() => setIsFullscreen(true))\n .catch((err) => console.error('Failed to enter fullscreen:', err));\n }\n }, []);\n\n const exitFullscreen = useCallback(() => {\n document\n .exitFullscreen()\n .then(() => setIsFullscreen(false))\n .catch((err) => console.error('Failed to exit fullscreen:', err));\n }, []);\n\n const toggleFullscreen = useCallback(() => {\n if (isFullscreen) {\n exitFullscreen();\n } else {\n enterFullscreen();\n }\n }, [isFullscreen, enterFullscreen, exitFullscreen]);\n\n useEffect(() => {\n const handleFullscreenChange = () => {\n setIsFullscreen(!!document.fullscreenElement);\n };\n document.addEventListener('fullscreenchange', handleFullscreenChange);\n return () => {\n document.removeEventListener('fullscreenchange', handleFullscreenChange);\n };\n }, []);\n\n const searchResults = useMemo(() => {\n if (!searchQuery.trim()) return [];\n\n const regex = new RegExp(searchQuery, 'i');\n const results: Array<{ path: string; nodeId: number }> = [];\n\n const collectMatchingPaths = (node: TreeNode) => {\n if (node.path && regex.test(node.path)) {\n const nodeId = hashString(node.path);\n results.push({ path: node.path, nodeId });\n }\n if (node.children) {\n node.children.forEach(collectMatchingPaths);\n }\n };\n\n treeData.forEach(collectMatchingPaths);\n return results;\n }, [treeData, searchQuery]);\n\n const filteredTreeData = useMemo(() => {\n let filtered = treeData.filter((item) => checkedAssets.includes(item.name));\n\n return filtered;\n }, [treeData, checkedAssets]);\n\n const handleSearchResultClick = useCallback((nodeId: number) => {\n setHighlightNodeId(nodeId);\n setCenterNodeId(nodeId);\n }, []);\n\n const removeRootPath = useCallback(\n (filepath: string): string => {\n if (!rootPath || !filepath) return filepath;\n const normalizedRoot = rootPath.replace(/\\\\/g, '/').replace(/\\/$/, '');\n const normalizedPath = filepath.replace(/\\\\/g, '/');\n\n if (normalizedPath.startsWith(normalizedRoot + '/')) {\n return normalizedPath.slice(normalizedRoot.length + 1);\n } else if (normalizedPath === normalizedRoot) {\n return '';\n }\n return filepath;\n },\n [rootPath],\n );\n\n const getSize = useCallback((node: TreeNode, type?: SizeType) => {\n if (type === 'stat') return node.sourceSize || 0;\n if (type === 'parsed') return node.bundledSize || 0;\n if (type === 'gzip') return node.gzipSize || 0;\n if (type === 'value') return node.value || 0;\n if (node.value) return node.value;\n return 0;\n }, []);\n\n const calculateNodeTotalSize = useCallback(\n (node: TreeNode, type: SizeType): number => {\n let size = getSize(node, type);\n\n if (node.children && node.children.length > 0) {\n const childrenSize = node.children.reduce(\n (sum, child) => sum + calculateNodeTotalSize(child, type),\n 0,\n );\n if (size === 0 || (!node.path && childrenSize > 0)) {\n size = childrenSize;\n }\n }\n\n return size;\n },\n [getSize],\n );\n\n const getChunkSize = useCallback(\n (name: string, type?: SizeType) => {\n const node = treeData.find((n) => n.name === name);\n if (!node) return 0;\n const sizeTypeToUse = type || sizeType;\n return calculateNodeTotalSize(node, sizeTypeToUse);\n },\n [treeData, sizeType, calculateNodeTotalSize],\n );\n\n return (\n <div className={Styles.treemap} ref={containerRef}>\n <button\n className={Styles['fullscreen-button']}\n onClick={toggleFullscreen}\n title={isFullscreen ? 'Exit fullscreen' : 'Enter fullscreen'}\n aria-label={isFullscreen ? 'Exit fullscreen' : 'Enter fullscreen'}\n >\n {isFullscreen ? <FullscreenExitOutlined /> : <FullscreenOutlined />}\n </button>\n\n <div className={`${Styles.sidebar} ${collapsed ? Styles.collapsed : ''}`}>\n <div\n className={`${Styles['sidebar-toggle']} ${collapsed ? Styles.collapsed : ''}`}\n onClick={() => setCollapsed(!collapsed)}\n >\n {collapsed ? <RightOutlined /> : <LeftOutlined />}\n </div>\n <div className={Styles['sidebar-content']}>\n <div>\n <h4>Treemap sizes</h4>\n <Radio.Group\n value={sizeType}\n onChange={(e) => setSizeType(e.target.value)}\n size=\"small\"\n buttonStyle=\"solid\"\n >\n <Radio.Button value=\"stat\">Stat</Radio.Button>\n <Radio.Button value=\"parsed\">Parsed</Radio.Button>\n <Radio.Button value=\"gzip\">Gzipped</Radio.Button>\n </Radio.Group>\n </div>\n\n <div>\n <h4>Search modules</h4>\n <Input\n placeholder=\"Enter regexp\"\n value={searchQuery}\n onChange={(e) => {\n setSearchQuery(e.target.value);\n setHighlightNodeId(undefined);\n setCenterNodeId(undefined);\n }}\n suffix={<SearchOutlined style={{ color: '#ccc' }} />}\n allowClear\n size=\"small\"\n />\n {searchQuery.trim() && searchResults.length > 0 && (\n <div className={Styles['search-results']}>\n <div className={Styles['search-results-header']}>\n Found {searchResults.length} file\n {searchResults.length > 1 ? 's' : ''}\n </div>\n <div className={Styles['search-results-list']}>\n {searchResults.map((result, index) => {\n const displayPath = removeRootPath(result.path);\n return (\n <div\n key={index}\n className={Styles['search-result-item']}\n onClick={() => handleSearchResultClick(result.nodeId)}\n title={result.path}\n >\n {displayPath || result.path}\n </div>\n );\n })}\n </div>\n </div>\n )}\n {searchQuery.trim() && searchResults.length === 0 && (\n <div className={Styles['search-results-empty']}>\n No files found matching \"{searchQuery}\"\n </div>\n )}\n </div>\n\n <div>\n <h4>Show chunks</h4>\n <Checkbox\n indeterminate={\n checkedAssets.length > 0 &&\n checkedAssets.length < assetNames.length\n }\n checked={checkedAssets.length === assetNames.length}\n onChange={(e) =>\n setCheckedAssets(e.target.checked ? assetNames : [])\n }\n className={Styles['all-none-checkbox']}\n >\n All\n </Checkbox>\n <div className={Styles['chunk-list']}>\n {assetNames.map((name) => (\n <div key={name} className={Styles['chunk-item']}>\n <Checkbox\n checked={checkedAssets.includes(name)}\n onChange={(e) => {\n if (e.target.checked) {\n setCheckedAssets([...checkedAssets, name]);\n } else {\n setCheckedAssets(\n checkedAssets.filter((a) => a !== name),\n );\n }\n }}\n >\n <span title={name}>{name}</span>\n </Checkbox>\n <span className={Styles['size-tag']}>\n {formatSize(getChunkSize(name, 'value'))}\n </span>\n </div>\n ))}\n </div>\n </div>\n </div>\n </div>\n\n <div className={Styles['chart-wrapper']}>\n <TreeMap\n ref={chartRef}\n treeData={filteredTreeData}\n sizeType={sizeType}\n onChartClick={onChartClick}\n highlightNodeId={highlightNodeId}\n centerNodeId={centerNodeId}\n rootPath={rootPath}\n style={{ width: '100%', height: '100%' }}\n />\n </div>\n </div>\n );\n};\n"],"names":["echarts","TreemapChart","TooltipComponent","CanvasRenderer","hashString","str","hash","i","getLevelOption","TreeMapInner","memo","treeData","sizeType","style","onChartClick","forwardedRef","highlightNodeId","centerNodeId","rootPath","option","setOption","useState","chartRef","React","chartDataRef","useEffect","convert","node","colorGroup","level","groupColors","BUNDLE_ANALYZER_COLORS","_level","children","c","val","nodeId","isHighlighted","console","result","data","item","index","group","COLOR_GROUPS","pos","_params","_dom","_rect","size","obj","info","name","path","normalizedRoot","normalizedPath","sourceSize","bundledSize","gzipSize","makeRow","label","value","color","Styles","rows","undefined","formatSize","chartInstance","findNodeInfo","targetId","currentPath","found","setTimeout","nodeInfo","e","zoomStrategies","String","strategy","EChartsReactCore","params","instance","TreeMap","props","ref","AssetTreemapWithFilter","ServerAPIProvider","SDK","projectInfo","AssetTreemapWithFilterInner","assetNames","useMemo","checkedAssets","setCheckedAssets","collapsed","setCollapsed","setSizeType","searchQuery","setSearchQuery","isFullscreen","setIsFullscreen","setHighlightNodeId","setCenterNodeId","containerRef","enterFullscreen","useCallback","err","exitFullscreen","document","toggleFullscreen","handleFullscreenChange","searchResults","regex","RegExp","results","collectMatchingPaths","filteredTreeData","filtered","handleSearchResultClick","removeRootPath","filepath","getSize","type","calculateNodeTotalSize","childrenSize","sum","child","getChunkSize","n","sizeTypeToUse","FullscreenExitOutlined","FullscreenOutlined","RightOutlined","LeftOutlined","Radio","Input","SearchOutlined","displayPath","Checkbox","a"],"mappings":"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"}
1
+ {"version":3,"file":"components/Charts/TreeMap.mjs","sources":["../../../src/components/Charts/TreeMap.tsx"],"sourcesContent":["import React, { useEffect, useState, memo, useMemo, useCallback } from 'react';\nimport EChartsReactCore from 'echarts-for-react/esm/core';\nimport * as echarts from 'echarts/core';\nimport { TreemapChart } from 'echarts/charts';\nimport { TooltipComponent } from 'echarts/components';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { Checkbox, Radio, Input } from 'antd';\nimport {\n LeftOutlined,\n RightOutlined,\n SearchOutlined,\n FullscreenOutlined,\n FullscreenExitOutlined,\n} from '@ant-design/icons';\nimport { formatSize } from 'src/utils';\nimport { SDK } from '@rsdoctor/types';\nimport { ServerAPIProvider } from 'src/components/Manifest';\nimport Styles from './treemap.module.scss';\nimport { TREE_COLORS } from './constants';\n\necharts.use([TreemapChart, TooltipComponent, CanvasRenderer]);\n\nexport type TreeNode = {\n name: string;\n value?: number;\n children?: TreeNode[];\n path?: string;\n sourceSize?: number;\n bundledSize?: number;\n gzipSize?: number;\n};\n\nexport type SizeType = 'stat' | 'parsed' | 'gzip' | 'value';\n\ninterface TreeMapProps {\n treeData: TreeNode[];\n sizeType: SizeType;\n style?: React.CSSProperties;\n onChartClick?: (params: any) => void;\n highlightNodeId?: number;\n centerNodeId?: number;\n rootPath?: string;\n}\n\nfunction hashString(str: string): number {\n let hash = 5381;\n for (let i = 0; i < str.length; i++) {\n hash = (hash << 5) + hash + str.charCodeAt(i);\n }\n return hash >>> 0;\n}\n\nfunction blendWithWhite(hex: string, ratio: number): string {\n const r = parseInt(hex.slice(1, 3), 16);\n const g = parseInt(hex.slice(3, 5), 16);\n const b = parseInt(hex.slice(5, 7), 16);\n\n const blendedR = Math.round(r * ratio + 255 * (1 - ratio));\n const blendedG = Math.round(g * ratio + 255 * (1 - ratio));\n const blendedB = Math.round(b * ratio + 255 * (1 - ratio));\n\n return `#${blendedR.toString(16).padStart(2, '0')}${blendedG.toString(16).padStart(2, '0')}${blendedB.toString(16).padStart(2, '0')}`;\n}\n\nfunction getLevelOption() {\n return [\n {\n itemStyle: {\n borderWidth: 0,\n gapWidth: 2,\n },\n },\n {\n itemStyle: {\n borderColorAlpha: [1, 0.3],\n borderWidth: 5,\n gapWidth: 1,\n },\n upperLabel: {\n show: true,\n color: '#555555',\n height: 30,\n },\n emphasis: {\n itemStyle: {\n borderColor: '#ccc',\n },\n },\n },\n ];\n}\n\nconst TreeMapInner: React.FC<TreeMapProps & { forwardedRef?: React.Ref<any> }> =\n memo(\n ({\n treeData,\n sizeType,\n style,\n onChartClick,\n forwardedRef,\n highlightNodeId,\n centerNodeId,\n rootPath,\n }) => {\n const [option, setOption] = useState<any>(null);\n const chartRef = React.useRef<any>(null);\n const chartDataRef = React.useRef<any[]>([]);\n\n useEffect(() => {\n if (forwardedRef && chartRef.current) {\n if (typeof forwardedRef === 'function') {\n forwardedRef(chartRef.current);\n } else {\n (forwardedRef as React.MutableRefObject<any>).current =\n chartRef.current;\n }\n }\n }, [forwardedRef, chartRef.current]);\n useEffect(() => {\n if (!treeData) return;\n function convert(\n node: TreeNode,\n index = 0,\n level = 0,\n parentColor?: string,\n siblingIndex = 0,\n siblingCount = 1,\n ): any {\n const baseColor =\n parentColor || TREE_COLORS[index % TREE_COLORS.length];\n\n const children = node.children?.map((c, childIndex) =>\n convert(\n c,\n index,\n level + 1,\n baseColor,\n childIndex,\n node.children?.length || 0,\n ),\n );\n\n let val = 0;\n if (sizeType === 'stat') val = node.sourceSize || 0;\n else if (sizeType === 'parsed') val = node.bundledSize || 0;\n else if (sizeType === 'gzip') val = node.gzipSize || 0;\n else if (sizeType === 'value') val = node.value || 0;\n\n if (!val && node.value) val = node.value;\n\n const nodeId = node.path\n ? hashString(node.path)\n : hashString(node.name || '');\n const isHighlighted = highlightNodeId === nodeId;\n\n const baseColorRatio =\n level === 0 ? 1 : Math.max(0.2, 1 - level * 0.2);\n const baseBorderRatio =\n level === 0 ? 1 : Math.max(0.3, 1 - level * 0.25);\n\n const siblingGradientRange = 0.15;\n const siblingRatio =\n siblingCount > 1\n ? 1 - (siblingIndex / (siblingCount - 1)) * siblingGradientRange\n : 1;\n\n const colorRatio = baseColorRatio * siblingRatio;\n const borderRatio = baseBorderRatio * siblingRatio;\n\n const nodeColor = isHighlighted\n ? '#fff5f5'\n : level === 0\n ? blendWithWhite(baseColor, 0.8)\n : blendWithWhite(baseColor, colorRatio);\n\n const nodeBorderColor = isHighlighted\n ? '#ff4d4f'\n : level === 0\n ? baseColor\n : blendWithWhite(baseColor, borderRatio);\n\n const result: any = {\n id: nodeId,\n name: node.name,\n value: val,\n path: node.path || node.name,\n sourceSize: node.sourceSize ?? (sizeType === 'stat' ? val : 0),\n bundledSize: node.bundledSize ?? (sizeType === 'parsed' ? val : 0),\n gzipSize: node.gzipSize ?? (sizeType === 'gzip' ? val : 0),\n itemStyle: {\n borderWidth: isHighlighted ? 4 : 1,\n color: nodeColor,\n borderColor: nodeBorderColor,\n ...(level === 0 && { gapWidth: 2 }),\n },\n };\n\n if (children && children.length > 0) {\n result.children = children;\n }\n\n if (isHighlighted) {\n result.emphasis = {\n itemStyle: {\n borderColor: '#ff4d4f',\n borderWidth: 4,\n color: '#fff5f5',\n },\n };\n }\n\n return result;\n }\n\n const data = treeData\n .map((item, index) =>\n convert(item, index, 0, undefined, index, treeData.length),\n )\n .filter(\n (item) =>\n item.value > 0 || (item.children && item.children.length > 0),\n );\n\n chartDataRef.current = data;\n\n setOption({\n color: TREE_COLORS,\n title: {\n text: 'Rsdoctor TreeMap',\n left: 'center',\n top: 10,\n textStyle: {\n fontSize: 16,\n fontWeight: 'bold',\n color: 'rgba(0, 0, 0, 0.8)',\n },\n },\n tooltip: {\n padding: 10,\n backgroundColor: '#fff',\n borderColor: '#eee',\n borderWidth: 1,\n textStyle: {\n color: 'rgba(0, 0, 0, 0.8)',\n },\n confine: true,\n extraCssText: 'max-width: 450px; word-wrap: break-word;',\n position: function (\n pos: any,\n _params: any,\n _dom: any,\n _rect: any,\n size: any,\n ) {\n var obj = { top: pos[1] + 10 };\n if (pos[0] < size.viewSize[0] / 2) {\n (obj as any).left = pos[0] + 10;\n } else {\n (obj as any).right = size.viewSize[0] - pos[0] + 10;\n }\n return obj;\n },\n formatter: function (info: any) {\n const node = info.data || {};\n const name = node.name;\n let path = node.path || name;\n\n if (rootPath && path) {\n const normalizedRoot = rootPath\n .replace(/\\\\/g, '/')\n .replace(/\\/$/, '');\n const normalizedPath = path.replace(/\\\\/g, '/');\n if (normalizedPath.startsWith(normalizedRoot + '/')) {\n path = normalizedPath.slice(normalizedRoot.length + 1);\n } else if (normalizedPath === normalizedRoot) {\n path = '';\n }\n }\n\n const sourceSize = node.sourceSize || node.value;\n const bundledSize = node.bundledSize;\n const gzipSize = node.gzipSize;\n\n function makeRow(label: string, value: string, color: string) {\n return `<div class=\"${Styles['tooltip-row']}\">\n <span class=\"${Styles['tooltip-label']}\" style=\"color: ${color};\">${label}</span>\n <span style=\"color: ${color};\">${value}</span>\n </div>`;\n }\n\n const rows = [];\n if (sourceSize !== undefined) {\n rows.push(\n makeRow('Stat size', formatSize(sourceSize), '#52c41a'),\n ); // Green\n }\n if (bundledSize !== undefined) {\n rows.push(\n makeRow('Parsed size', formatSize(bundledSize), '#fadb14'),\n ); // Yellow\n }\n if (gzipSize !== undefined) {\n rows.push(\n makeRow('Gzipped size', formatSize(gzipSize), '#1677ff'),\n ); // Blue\n }\n\n return `\n <div style=\"font-family: sans-serif; font-size: 12px; line-height: 1.5;\">\n <div style=\"margin-bottom: 6px; max-width: 400px; word-wrap: break-word; overflow-wrap: break-word; word-break: break-all; white-space: normal; color: rgba(0, 0, 0, 0.8);\">${echarts.format.encodeHTML(path)}</div>\n ${rows.join('')}\n </div>\n `;\n },\n },\n series: [\n {\n type: 'treemap',\n label: {\n show: true,\n formatter: '{b}',\n fontSize: 12,\n color: '#000',\n position: 'inside',\n fontWeight: 'normal',\n textBorderColor: '#fff',\n textBorderWidth: 2,\n padding: [4, 8, 4, 8],\n },\n upperLabel: {\n show: true,\n height: 30,\n color: '#000',\n fontSize: 12,\n fontWeight: 'normal',\n padding: [0, 0, 0, 4],\n },\n levels: getLevelOption(),\n data: data,\n breadcrumb: {\n show: true,\n left: 'center',\n top: 'bottom',\n height: 22,\n emptyItemWidth: 25,\n itemStyle: {\n color: '#999',\n borderColor: 'transparent',\n borderWidth: 0,\n borderRadius: 0,\n },\n emphasis: {\n itemStyle: {\n color: '#333',\n },\n },\n textStyle: {\n fontFamily: 'sans-serif',\n fontSize: 12,\n color: '#666',\n },\n },\n roam: true,\n nodeClick: false,\n zoomToNodeRatio: 0.5,\n animationDurationUpdate: 500,\n width: '100%',\n height: '100%',\n top: 40,\n bottom: 30,\n left: 0,\n right: 0,\n },\n ],\n });\n }, [treeData, sizeType, highlightNodeId, rootPath]);\n\n useEffect(() => {\n if (centerNodeId && chartRef.current && option) {\n const chartInstance = chartRef.current.getEchartsInstance();\n if (chartInstance) {\n const findNodeInfo = (\n data: any[],\n targetId: number,\n path: string[] = [],\n ): { name: string; path: string[] } | null => {\n for (const item of data) {\n const currentPath = [...path, item.name];\n if (item.id === targetId) {\n return { name: item.name, path: currentPath };\n }\n if (item.children) {\n const found = findNodeInfo(\n item.children,\n targetId,\n currentPath,\n );\n if (found) return found;\n }\n }\n return null;\n };\n\n setTimeout(() => {\n const nodeInfo = findNodeInfo(chartDataRef.current, centerNodeId);\n if (!nodeInfo) return;\n\n try {\n chartInstance.dispatchAction({\n type: 'highlight',\n seriesIndex: 0,\n name: nodeInfo.name,\n });\n } catch (e) {}\n\n const zoomStrategies: Array<() => void> = [\n () =>\n chartInstance.dispatchAction({\n type: 'treemapZoomToNode',\n seriesIndex: 0,\n targetNodeId: String(centerNodeId),\n }),\n () =>\n chartInstance.dispatchAction({\n type: 'treemapZoomToNode',\n seriesIndex: 0,\n name: nodeInfo.name,\n }),\n () =>\n chartInstance.dispatchAction({\n type: 'treemapZoomToNode',\n seriesIndex: 0,\n name: nodeInfo.path.join('/'),\n }),\n () =>\n nodeInfo.path.length > 0 &&\n chartInstance.dispatchAction({\n type: 'treemapZoomToNode',\n seriesIndex: 0,\n name: nodeInfo.path[nodeInfo.path.length - 1],\n }),\n ];\n\n for (const strategy of zoomStrategies) {\n try {\n strategy();\n return;\n } catch (e) {\n console.error(\n 'Failed to zoom to node with id:',\n centerNodeId,\n e,\n );\n }\n }\n\n console.warn('Failed to zoom to node with id:', centerNodeId);\n }, 200);\n }\n }\n }, [centerNodeId, option]);\n\n return option ? (\n <div className={Styles['chart-container']} style={style}>\n <EChartsReactCore\n ref={chartRef}\n option={option}\n echarts={echarts}\n onEvents={{\n click: (params: any) => {\n if (chartRef.current) {\n const instance = chartRef.current.getEchartsInstance();\n if (instance && params?.data?.id) {\n instance.dispatchAction({\n type: 'treemapZoomToNode',\n seriesIndex: 0,\n targetNodeId: String(params.data.id),\n });\n }\n }\n onChartClick?.(params);\n },\n }}\n style={{\n width: '100%',\n height: '100%',\n }}\n />\n </div>\n ) : null;\n },\n );\n\nexport const TreeMap = React.forwardRef<any, TreeMapProps>((props, ref) => (\n <TreeMapInner {...props} forwardedRef={ref} />\n));\n\nexport const AssetTreemapWithFilter: React.FC<{\n treeData: TreeNode[];\n onChartClick?: (params: any) => void;\n bundledSize?: boolean;\n}> = ({ treeData, onChartClick, bundledSize = true }) => {\n return (\n <ServerAPIProvider api={SDK.ServerAPI.API.GetProjectInfo}>\n {(projectInfo) => {\n return (\n <AssetTreemapWithFilterInner\n treeData={treeData}\n onChartClick={onChartClick}\n bundledSize={bundledSize}\n rootPath={projectInfo.root}\n />\n );\n }}\n </ServerAPIProvider>\n );\n};\n\nconst AssetTreemapWithFilterInner: React.FC<{\n treeData: TreeNode[];\n onChartClick?: (params: any) => void;\n bundledSize?: boolean;\n rootPath: string;\n}> = ({ treeData, onChartClick, bundledSize = true, rootPath }) => {\n const assetNames = useMemo(\n () => treeData.map((item) => item.name),\n [treeData],\n );\n\n const [checkedAssets, setCheckedAssets] = useState<string[]>(assetNames);\n const [collapsed, setCollapsed] = useState(false);\n const [sizeType, setSizeType] = useState<SizeType>(\n bundledSize ? 'parsed' : 'stat',\n );\n const [searchQuery, setSearchQuery] = useState('');\n const [isFullscreen, setIsFullscreen] = useState(false);\n const [highlightNodeId, setHighlightNodeId] = useState<number | undefined>();\n const [centerNodeId, setCenterNodeId] = useState<number | undefined>();\n\n const chartRef = React.useRef<any>(null);\n const containerRef = React.useRef<HTMLDivElement>(null);\n\n const enterFullscreen = useCallback(() => {\n if (containerRef.current) {\n containerRef.current\n .requestFullscreen()\n .then(() => setIsFullscreen(true))\n .catch((err) => console.error('Failed to enter fullscreen:', err));\n }\n }, []);\n\n const exitFullscreen = useCallback(() => {\n document\n .exitFullscreen()\n .then(() => setIsFullscreen(false))\n .catch((err) => console.error('Failed to exit fullscreen:', err));\n }, []);\n\n const toggleFullscreen = useCallback(() => {\n if (isFullscreen) {\n exitFullscreen();\n } else {\n enterFullscreen();\n }\n }, [isFullscreen, enterFullscreen, exitFullscreen]);\n\n useEffect(() => {\n const handleFullscreenChange = () => {\n setIsFullscreen(!!document.fullscreenElement);\n };\n document.addEventListener('fullscreenchange', handleFullscreenChange);\n return () => {\n document.removeEventListener('fullscreenchange', handleFullscreenChange);\n };\n }, []);\n\n const searchResults = useMemo(() => {\n if (!searchQuery.trim()) return [];\n\n const regex = new RegExp(searchQuery, 'i');\n const results: Array<{ path: string; nodeId: number }> = [];\n\n const collectMatchingPaths = (node: TreeNode) => {\n if (node.path && regex.test(node.path)) {\n const nodeId = hashString(node.path);\n results.push({ path: node.path, nodeId });\n }\n if (node.children) {\n node.children.forEach(collectMatchingPaths);\n }\n };\n\n treeData.forEach(collectMatchingPaths);\n return results;\n }, [treeData, searchQuery]);\n\n const filteredTreeData = useMemo(() => {\n let filtered = treeData.filter((item) => checkedAssets.includes(item.name));\n\n return filtered;\n }, [treeData, checkedAssets]);\n\n const handleSearchResultClick = useCallback((nodeId: number) => {\n setHighlightNodeId(nodeId);\n setCenterNodeId(nodeId);\n }, []);\n\n const removeRootPath = useCallback(\n (filepath: string): string => {\n if (!rootPath || !filepath) return filepath;\n const normalizedRoot = rootPath.replace(/\\\\/g, '/').replace(/\\/$/, '');\n const normalizedPath = filepath.replace(/\\\\/g, '/');\n\n if (normalizedPath.startsWith(normalizedRoot + '/')) {\n return normalizedPath.slice(normalizedRoot.length + 1);\n } else if (normalizedPath === normalizedRoot) {\n return '';\n }\n return filepath;\n },\n [rootPath],\n );\n\n const getSize = useCallback((node: TreeNode, type?: SizeType) => {\n if (type === 'stat') return node.sourceSize || 0;\n if (type === 'parsed') return node.bundledSize || 0;\n if (type === 'gzip') return node.gzipSize || 0;\n if (type === 'value') return node.value || 0;\n if (node.value) return node.value;\n return 0;\n }, []);\n\n const calculateNodeTotalSize = useCallback(\n (node: TreeNode, type: SizeType): number => {\n let size = getSize(node, type);\n\n if (node.children && node.children.length > 0) {\n const childrenSize = node.children.reduce(\n (sum, child) => sum + calculateNodeTotalSize(child, type),\n 0,\n );\n if (size === 0 || (!node.path && childrenSize > 0)) {\n size = childrenSize;\n }\n }\n\n return size;\n },\n [getSize],\n );\n\n const getChunkSize = useCallback(\n (name: string, type?: SizeType) => {\n const node = treeData.find((n) => n.name === name);\n if (!node) return 0;\n const sizeTypeToUse = type || sizeType;\n return calculateNodeTotalSize(node, sizeTypeToUse);\n },\n [treeData, sizeType, calculateNodeTotalSize],\n );\n\n return (\n <div className={Styles.treemap} ref={containerRef}>\n <button\n className={Styles['fullscreen-button']}\n onClick={toggleFullscreen}\n title={isFullscreen ? 'Exit fullscreen' : 'Enter fullscreen'}\n aria-label={isFullscreen ? 'Exit fullscreen' : 'Enter fullscreen'}\n >\n {isFullscreen ? <FullscreenExitOutlined /> : <FullscreenOutlined />}\n </button>\n\n <div className={`${Styles.sidebar} ${collapsed ? Styles.collapsed : ''}`}>\n <div\n className={`${Styles['sidebar-toggle']} ${collapsed ? Styles.collapsed : ''}`}\n onClick={() => setCollapsed(!collapsed)}\n >\n {collapsed ? <RightOutlined /> : <LeftOutlined />}\n </div>\n <div className={Styles['sidebar-content']}>\n <div>\n <h4>Treemap sizes</h4>\n <Radio.Group\n value={sizeType}\n onChange={(e) => setSizeType(e.target.value)}\n size=\"small\"\n buttonStyle=\"solid\"\n >\n <Radio.Button value=\"stat\">Stat</Radio.Button>\n <Radio.Button value=\"parsed\">Parsed</Radio.Button>\n <Radio.Button value=\"gzip\">Gzipped</Radio.Button>\n </Radio.Group>\n </div>\n\n <div>\n <h4>Search modules</h4>\n <Input\n placeholder=\"Enter regexp\"\n value={searchQuery}\n onChange={(e) => {\n setSearchQuery(e.target.value);\n setHighlightNodeId(undefined);\n setCenterNodeId(undefined);\n }}\n suffix={<SearchOutlined style={{ color: '#ccc' }} />}\n allowClear\n size=\"small\"\n />\n {searchQuery.trim() && searchResults.length > 0 && (\n <div className={Styles['search-results']}>\n <div className={Styles['search-results-header']}>\n Found {searchResults.length} file\n {searchResults.length > 1 ? 's' : ''}\n </div>\n <div className={Styles['search-results-list']}>\n {searchResults.map((result, index) => {\n const displayPath = removeRootPath(result.path);\n return (\n <div\n key={index}\n className={Styles['search-result-item']}\n onClick={() => handleSearchResultClick(result.nodeId)}\n title={result.path}\n >\n {displayPath || result.path}\n </div>\n );\n })}\n </div>\n </div>\n )}\n {searchQuery.trim() && searchResults.length === 0 && (\n <div className={Styles['search-results-empty']}>\n No files found matching \"{searchQuery}\"\n </div>\n )}\n </div>\n\n <div>\n <h4>Show chunks</h4>\n <Checkbox\n indeterminate={\n checkedAssets.length > 0 &&\n checkedAssets.length < assetNames.length\n }\n checked={checkedAssets.length === assetNames.length}\n onChange={(e) =>\n setCheckedAssets(e.target.checked ? assetNames : [])\n }\n className={Styles['all-none-checkbox']}\n >\n All\n </Checkbox>\n <div className={Styles['chunk-list']}>\n {assetNames.map((name) => (\n <div key={name} className={Styles['chunk-item']}>\n <Checkbox\n checked={checkedAssets.includes(name)}\n onChange={(e) => {\n if (e.target.checked) {\n setCheckedAssets([...checkedAssets, name]);\n } else {\n setCheckedAssets(\n checkedAssets.filter((a) => a !== name),\n );\n }\n }}\n >\n <span title={name}>{name}</span>\n </Checkbox>\n <span className={Styles['size-tag']}>\n {formatSize(getChunkSize(name, 'value'))}\n </span>\n </div>\n ))}\n </div>\n </div>\n </div>\n </div>\n\n <div className={Styles['chart-wrapper']}>\n <TreeMap\n ref={chartRef}\n treeData={filteredTreeData}\n sizeType={sizeType}\n onChartClick={onChartClick}\n highlightNodeId={highlightNodeId}\n centerNodeId={centerNodeId}\n rootPath={rootPath}\n style={{ width: '100%', height: '100%' }}\n />\n </div>\n </div>\n );\n};\n"],"names":["echarts","TreemapChart","TooltipComponent","CanvasRenderer","hashString","str","hash","i","blendWithWhite","hex","ratio","r","parseInt","g","b","blendedR","Math","blendedG","blendedB","getLevelOption","TreeMapInner","memo","treeData","sizeType","style","onChartClick","forwardedRef","highlightNodeId","centerNodeId","rootPath","option","setOption","useState","chartRef","React","chartDataRef","useEffect","convert","node","index","level","parentColor","siblingIndex","siblingCount","baseColor","TREE_COLORS","children","c","childIndex","val","nodeId","isHighlighted","baseColorRatio","baseBorderRatio","siblingGradientRange","siblingRatio","colorRatio","borderRatio","nodeColor","nodeBorderColor","result","data","item","undefined","pos","_params","_dom","_rect","size","obj","info","name","path","normalizedRoot","normalizedPath","sourceSize","bundledSize","gzipSize","makeRow","label","value","color","Styles","rows","formatSize","chartInstance","findNodeInfo","targetId","currentPath","found","setTimeout","nodeInfo","e","zoomStrategies","String","strategy","console","EChartsReactCore","params","instance","TreeMap","props","ref","AssetTreemapWithFilter","ServerAPIProvider","SDK","projectInfo","AssetTreemapWithFilterInner","assetNames","useMemo","checkedAssets","setCheckedAssets","collapsed","setCollapsed","setSizeType","searchQuery","setSearchQuery","isFullscreen","setIsFullscreen","setHighlightNodeId","setCenterNodeId","containerRef","enterFullscreen","useCallback","err","exitFullscreen","document","toggleFullscreen","handleFullscreenChange","searchResults","regex","RegExp","results","collectMatchingPaths","filteredTreeData","filtered","handleSearchResultClick","removeRootPath","filepath","getSize","type","calculateNodeTotalSize","childrenSize","sum","child","getChunkSize","n","sizeTypeToUse","FullscreenExitOutlined","FullscreenOutlined","RightOutlined","LeftOutlined","Radio","Input","SearchOutlined","displayPath","Checkbox","a"],"mappings":"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"}
@@ -7,14 +7,4 @@ export declare enum ChartTypes {
7
7
  Loader = 4,
8
8
  Normal = 5
9
9
  }
10
- export declare const BUNDLE_ANALYZER_COLORS: {
11
- readonly orange: readonly [string, string, string, string, string, string];
12
- readonly purple: readonly [string, string, string, string, string, string];
13
- readonly cyan: readonly [string, string, string, string, string, string];
14
- readonly green: readonly [string, string, string, string, string, string];
15
- readonly blue: readonly [string, string, string, string, string, string];
16
- readonly yellow: readonly [string, string, string, string, string, string];
17
- };
18
- type ColorGroup = keyof typeof BUNDLE_ANALYZER_COLORS;
19
- export declare const COLOR_GROUPS: ColorGroup[];
20
- export {};
10
+ export declare const TREE_COLORS: string[];
@@ -36,70 +36,19 @@ var constants_ChartTypes = /*#__PURE__*/ function(ChartTypes) {
36
36
  ChartTypes[ChartTypes["Normal"] = 5] = "Normal";
37
37
  return ChartTypes;
38
38
  }({});
39
- const BUNDLE_ANALYZER_COLORS = {
40
- orange: [
41
- hexToRgba('#faad14', 0.85),
42
- hexToRgba('#ffc53d', 0.6),
43
- hexToRgba('#ffd666', 0.55),
44
- hexToRgba('#ffe58f', 0.55),
45
- hexToRgba('#fff1b8', 0.55),
46
- hexToRgba('#fffbe6', 0.5)
47
- ],
48
- purple: [
49
- hexToRgba('#722ed1', 0.85),
50
- hexToRgba('#9254de', 0.7),
51
- hexToRgba('#b37feb', 0.65),
52
- hexToRgba('#d3adf7', 0.65),
53
- hexToRgba('#efdbff', 0.65),
54
- hexToRgba('#f9f0ff', 0.65)
55
- ],
56
- cyan: [
57
- hexToRgba('#36cfc9', 0.85),
58
- hexToRgba('#5cdbd3', 0.7),
59
- hexToRgba('#87e8de', 0.65),
60
- hexToRgba('#b5f5ec', 0.65),
61
- hexToRgba('#e6fffb', 0.65),
62
- hexToRgba('#e6fffb', 0.5)
63
- ],
64
- green: [
65
- hexToRgba('#a0d911', 0.85),
66
- hexToRgba('#bae637', 0.7),
67
- hexToRgba('#d3f261', 0.65),
68
- hexToRgba('#eaff8f', 0.65),
69
- hexToRgba('#f4ffb8', 0.65),
70
- hexToRgba('#fcffe6', 0.5)
71
- ],
72
- blue: [
73
- hexToRgba('#2f54eb', 0.85),
74
- hexToRgba('#597ef7', 0.7),
75
- hexToRgba('#85a5ff', 0.65),
76
- hexToRgba('#adc6ff', 0.65),
77
- hexToRgba('#d6e4ff', 0.65),
78
- hexToRgba('#f0f5ff', 0.5)
79
- ],
80
- yellow: [
81
- hexToRgba('#fadb14', 0.85),
82
- hexToRgba('#ffec3d', 0.7),
83
- hexToRgba('#fff566', 0.65),
84
- hexToRgba('#fffb8f', 0.65),
85
- hexToRgba('#ffffb8', 0.65),
86
- hexToRgba('#feffe6', 0.65)
87
- ]
88
- };
89
- function hexToRgba(hex, alpha = 0.65) {
90
- const r = parseInt(hex.slice(1, 3), 16);
91
- const g = parseInt(hex.slice(3, 5), 16);
92
- const b = parseInt(hex.slice(5, 7), 16);
93
- return `rgba(${r}, ${g}, ${b}, ${alpha})`;
94
- }
95
- const COLOR_GROUPS = [
96
- 'cyan',
97
- 'blue',
98
- 'orange',
99
- 'green',
100
- 'yellow',
101
- 'purple'
39
+ const TREE_COLORS = [
40
+ '#6F3FE1',
41
+ '#5781FD',
42
+ '#4DB1CB',
43
+ '#3EBD7C',
44
+ '#F7A925',
45
+ '#bda29a',
46
+ '#ca8622',
47
+ '#749f83',
48
+ '#6e7074',
49
+ '#546570',
50
+ '#c4ccd3'
102
51
  ];
103
- export { BUNDLE_ANALYZER_COLORS, COLOR_GROUPS, constants_ChartTypes as ChartTypes, PALETTE_COLORS };
52
+ export { constants_ChartTypes as ChartTypes, PALETTE_COLORS, TREE_COLORS };
104
53
 
105
54
  //# sourceMappingURL=constants.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"components/Charts/constants.mjs","sources":["../../../src/components/Charts/constants.ts"],"sourcesContent":["export const PALETTE_COLORS = [\n '#F2793D',\n '#F28B24',\n '#F2A200',\n '#F5CC00',\n '#F5E000',\n '#A3D900',\n '#66CC00',\n '#0AC419',\n '#0AC496',\n '#0AC7D1',\n '#00A8E0',\n '#1471F5',\n '#4060FF',\n '#7559FF',\n '#884DFF',\n '#A526FF',\n '#BA39E5',\n '#C700D9',\n '#D900B5',\n '#E50099',\n '#E52E6B',\n '#F24957',\n '#30B2F2',\n '#00BF70',\n '#5959FF',\n '#9F40FF',\n '#528BFF',\n];\n\nexport enum ChartTypes {\n Bootstrap,\n Compile,\n Done,\n Minify,\n Loader,\n Normal,\n}\n\nexport const BUNDLE_ANALYZER_COLORS = {\n orange: [\n hexToRgba('#faad14', 0.85), // gold-6\n hexToRgba('#ffc53d', 0.6), // gold-5\n hexToRgba('#ffd666', 0.55), // gold-4\n hexToRgba('#ffe58f', 0.55), // gold-3\n hexToRgba('#fff1b8', 0.55), // gold-2\n hexToRgba('#fffbe6', 0.5), // gold-1\n ],\n purple: [\n hexToRgba('#722ed1', 0.85), // purple-6\n hexToRgba('#9254de', 0.7), // purple-5\n hexToRgba('#b37feb', 0.65), // purple-4\n hexToRgba('#d3adf7', 0.65), // purple-3\n hexToRgba('#efdbff', 0.65), // purple-2\n hexToRgba('#f9f0ff', 0.65), // purple-1\n ],\n cyan: [\n hexToRgba('#36cfc9', 0.85), // cyan-5\n hexToRgba('#5cdbd3', 0.7), // cyan-4\n hexToRgba('#87e8de', 0.65), // cyan-3\n hexToRgba('#b5f5ec', 0.65), // cyan-2\n hexToRgba('#e6fffb', 0.65), // cyan-1\n hexToRgba('#e6fffb', 0.5), // cyan-0\n ],\n green: [\n hexToRgba('#a0d911', 0.85), // lime-6\n hexToRgba('#bae637', 0.7), // lime-5\n hexToRgba('#d3f261', 0.65), // lime-4\n hexToRgba('#eaff8f', 0.65), // lime-3\n hexToRgba('#f4ffb8', 0.65), // lime-2\n hexToRgba('#fcffe6', 0.5), // lime-1\n ],\n blue: [\n hexToRgba('#2f54eb', 0.85), // geekblue-6\n hexToRgba('#597ef7', 0.7), // geekblue-5\n hexToRgba('#85a5ff', 0.65), // geekblue-4\n hexToRgba('#adc6ff', 0.65), // geekblue-3\n hexToRgba('#d6e4ff', 0.65), // geekblue-2\n hexToRgba('#f0f5ff', 0.5), // geekblue-1\n ],\n yellow: [\n hexToRgba('#fadb14', 0.85), // yellow-6\n hexToRgba('#ffec3d', 0.7), // yellow-5\n hexToRgba('#fff566', 0.65), // yellow-4\n hexToRgba('#fffb8f', 0.65), // yellow-3\n hexToRgba('#ffffb8', 0.65), // yellow-2\n hexToRgba('#feffe6', 0.65), // yellow-1\n ],\n} as const;\n\nfunction hexToRgba(hex: string, alpha = 0.65) {\n const r = parseInt(hex.slice(1, 3), 16);\n const g = parseInt(hex.slice(3, 5), 16);\n const b = parseInt(hex.slice(5, 7), 16);\n return `rgba(${r}, ${g}, ${b}, ${alpha})`;\n}\n\ntype ColorGroup = keyof typeof BUNDLE_ANALYZER_COLORS;\nexport const COLOR_GROUPS: ColorGroup[] = [\n 'cyan',\n 'blue',\n 'orange',\n 'green',\n 'yellow',\n 'purple',\n];\n"],"names":["PALETTE_COLORS","ChartTypes","BUNDLE_ANALYZER_COLORS","hexToRgba","hex","alpha","r","parseInt","g","b","COLOR_GROUPS"],"mappings":"AAAO,MAAMA,iBAAiB;IAC5B;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;CACD;AAEM,IAAKC,uBAAUA,WAAAA,GAAAA,SAAVA,UAAU;;;;;;;WAAVA;;AASL,MAAMC,yBAAyB;IACpC,QAAQ;QACNC,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;KACtB;IACD,QAAQ;QACNA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;KACtB;IACD,MAAM;QACJA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;KACtB;IACD,OAAO;QACLA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;KACtB;IACD,MAAM;QACJA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;KACtB;IACD,QAAQ;QACNA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;QACrBA,UAAU,WAAW;KACtB;AACH;AAEA,SAASA,UAAUC,GAAW,EAAEC,QAAQ,IAAI;IAC1C,MAAMC,IAAIC,SAASH,IAAI,KAAK,CAAC,GAAG,IAAI;IACpC,MAAMI,IAAID,SAASH,IAAI,KAAK,CAAC,GAAG,IAAI;IACpC,MAAMK,IAAIF,SAASH,IAAI,KAAK,CAAC,GAAG,IAAI;IACpC,OAAO,CAAC,KAAK,EAAEE,EAAE,EAAE,EAAEE,EAAE,EAAE,EAAEC,EAAE,EAAE,EAAEJ,MAAM,CAAC,CAAC;AAC3C;AAGO,MAAMK,eAA6B;IACxC;IACA;IACA;IACA;IACA;IACA;CACD"}
1
+ {"version":3,"file":"components/Charts/constants.mjs","sources":["../../../src/components/Charts/constants.ts"],"sourcesContent":["export const PALETTE_COLORS = [\n '#F2793D',\n '#F28B24',\n '#F2A200',\n '#F5CC00',\n '#F5E000',\n '#A3D900',\n '#66CC00',\n '#0AC419',\n '#0AC496',\n '#0AC7D1',\n '#00A8E0',\n '#1471F5',\n '#4060FF',\n '#7559FF',\n '#884DFF',\n '#A526FF',\n '#BA39E5',\n '#C700D9',\n '#D900B5',\n '#E50099',\n '#E52E6B',\n '#F24957',\n '#30B2F2',\n '#00BF70',\n '#5959FF',\n '#9F40FF',\n '#528BFF',\n];\n\nexport enum ChartTypes {\n Bootstrap,\n Compile,\n Done,\n Minify,\n Loader,\n Normal,\n}\n\nexport const TREE_COLORS = [\n '#6F3FE1',\n '#5781FD',\n '#4DB1CB',\n '#3EBD7C',\n '#F7A925',\n '#bda29a',\n '#ca8622',\n '#749f83',\n '#6e7074',\n '#546570',\n '#c4ccd3',\n];\n"],"names":["PALETTE_COLORS","ChartTypes","TREE_COLORS"],"mappings":"AAAO,MAAMA,iBAAiB;IAC5B;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;CACD;AAEM,IAAKC,uBAAUA,WAAAA,GAAAA,SAAVA,UAAU;;;;;;;WAAVA;;AASL,MAAMC,cAAc;IACzB;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;CACD"}
@@ -1,23 +1,39 @@
1
1
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
2
2
  import { MinusCircleOutlined, PlusCircleOutlined, RightSquareOutlined } from "@ant-design/icons";
3
3
  import { Popover, Space, Typography } from "antd";
4
- import { useCallback } from "react";
4
+ import { useCallback, useEffect, useRef } from "react";
5
5
  import react_hyper_tree, { useTreeState } from "react-hyper-tree";
6
6
  import { ModuleGraphListContext } from "../../BundleSize/config.mjs";
7
7
  import "./fileTreeCom.css";
8
8
  import { getFileCom } from "../../../components/FileTree/index.mjs";
9
9
  const prefix = 'file-tree-com';
10
10
  const FileTree = (props)=>{
11
- const { treeData, needJumpto = false, defaultOpened = false, defaultOpenFather = 0 } = props;
11
+ const { treeData, needJumpto = false, defaultOpenFather = 0 } = props;
12
12
  const { required, handlers } = useTreeState({
13
13
  id: `${prefix}-tree`,
14
14
  data: treeData || [],
15
- defaultOpened,
15
+ defaultOpened: false,
16
16
  multipleSelect: false,
17
17
  refreshAsyncNodes: true
18
18
  });
19
+ const expandedNodes = useRef(new Set());
20
+ useEffect(()=>{
21
+ expandedNodes.current.clear();
22
+ }, [
23
+ treeData
24
+ ]);
19
25
  const renderNode = useCallback(({ node, onToggle })=>{
20
- defaultOpenFather && node.data.level < defaultOpenFather && node.setOpened(true);
26
+ if ('object' != typeof node.data || null === node.data || Array.isArray(node.data)) return null;
27
+ const hasChildren = 'function' == typeof node.data.getChildren || Array.isArray(node.data.children) && node.data.children.length > 0;
28
+ if (defaultOpenFather > 0 && 'number' == typeof node.data.level && node.data.level < defaultOpenFather && hasChildren) {
29
+ const nodeId = node.id;
30
+ if (!expandedNodes.current.has(nodeId)) {
31
+ expandedNodes.current.add(nodeId);
32
+ requestAnimationFrame(()=>{
33
+ handlers.setOpen(nodeId, true);
34
+ });
35
+ }
36
+ }
21
37
  const Icon = getFileCom(node.data.name);
22
38
  return /*#__PURE__*/ jsx("div", {
23
39
  className: `${prefix}-titles-box`,
@@ -33,15 +49,18 @@ const FileTree = (props)=>{
33
49
  onClick: onToggle,
34
50
  children: /*#__PURE__*/ jsxs(Space, {
35
51
  children: [
36
- !node.options.opened && node.data.children?.length ? /*#__PURE__*/ jsx(PlusCircleOutlined, {
37
- style: {
38
- color: 'lightblue'
39
- }
40
- }) : /*#__PURE__*/ jsx(MinusCircleOutlined, {
41
- style: {
42
- color: 'lightblue'
43
- }
44
- }),
52
+ (()=>{
53
+ const hasChildren = 'function' == typeof node.data.getChildren || Array.isArray(node.data.children) && node.data.children.length > 0;
54
+ return !node.options.opened && hasChildren ? /*#__PURE__*/ jsx(PlusCircleOutlined, {
55
+ style: {
56
+ color: 'lightblue'
57
+ }
58
+ }) : /*#__PURE__*/ jsx(MinusCircleOutlined, {
59
+ style: {
60
+ color: 'lightblue'
61
+ }
62
+ });
63
+ })(),
45
64
  Icon,
46
65
  /*#__PURE__*/ jsx(Popover, {
47
66
  content: /*#__PURE__*/ jsx(Fragment, {
@@ -78,7 +97,11 @@ const FileTree = (props)=>{
78
97
  })
79
98
  })
80
99
  }, node.data.name);
81
- }, []);
100
+ }, [
101
+ handlers,
102
+ defaultOpenFather,
103
+ needJumpto
104
+ ]);
82
105
  return /*#__PURE__*/ jsx(Fragment, {
83
106
  children: /*#__PURE__*/ jsx(react_hyper_tree, {
84
107
  ...required,
@@ -1 +1 @@
1
- {"version":3,"file":"pages/ModuleAnalyze/components/fileTreeCom.mjs","sources":["../../../../src/pages/ModuleAnalyze/components/fileTreeCom.tsx"],"sourcesContent":["import {\n MinusCircleOutlined,\n PlusCircleOutlined,\n RightSquareOutlined,\n} from '@ant-design/icons';\nimport { Popover, Space, Typography } from 'antd';\nimport React, { useCallback } from 'react';\nimport Tree, { DefaultNodeProps, useTreeState } from 'react-hyper-tree';\n\nimport { ModuleGraphListContext } from '../../BundleSize/config';\nimport { NewTreeNodeType } from '../utils/hooks';\nimport './fileTreeCom.scss';\nimport { getFileCom } from 'src/components/FileTree';\n\nconst prefix = 'file-tree-com';\n\ntype FileTreeProps = {\n treeData: NewTreeNodeType[];\n needCode?: boolean;\n needShowAllTree?: boolean;\n needJumpto?: boolean;\n defaultOpened?: boolean;\n defaultOpenFather?: number;\n cwd: string;\n selectedChunk?: string;\n};\n\nexport const FileTree: React.FC<FileTreeProps> = (props) => {\n const {\n treeData,\n needJumpto = false,\n defaultOpened = false,\n defaultOpenFather = 0,\n } = props;\n\n const { required, handlers } = useTreeState({\n id: `${prefix}-tree`,\n data: treeData || [],\n defaultOpened,\n multipleSelect: false,\n refreshAsyncNodes: true,\n });\n\n const renderNode = useCallback(({ node, onToggle }: DefaultNodeProps) => {\n defaultOpenFather &&\n node.data.level < defaultOpenFather &&\n node.setOpened(true);\n const Icon = getFileCom(node.data.name);\n\n return (\n <div className={`${prefix}-titles-box`} key={node.data.name}>\n <div className={`${prefix}-titles`}>\n <Space direction=\"vertical\">\n <div className={`${prefix}-node-title`}>\n <Space>\n <div onClick={onToggle}>\n <Space>\n {!node.options.opened && node.data.children?.length ? (\n <PlusCircleOutlined style={{ color: 'lightblue' }} />\n ) : (\n <MinusCircleOutlined style={{ color: 'lightblue' }} />\n )}\n {Icon}\n <Popover\n key={`${node.data.name}popover`}\n content={\n <>\n {node.data.__RESOURCEPATH__ ? (\n <Typography.Text\n key={`${node.data.name}-popover-path`}\n code\n >\n {node.data.__RESOURCEPATH__}\n </Typography.Text>\n ) : (\n <></>\n )}\n </>\n }\n title=\"INFO\"\n trigger=\"hover\"\n >\n <Typography.Text>{node.data.name}</Typography.Text>\n </Popover>\n </Space>\n </div>\n <Space>\n {needJumpto && (\n <ModuleGraphListContext.Consumer>\n {({ moduleJumpList, setModuleJumpList }) => {\n return (\n <RightSquareOutlined\n onClick={() => {\n const _list = [...moduleJumpList];\n _list.push(+node.id);\n setModuleJumpList(_list);\n }}\n />\n );\n }}\n </ModuleGraphListContext.Consumer>\n )}\n </Space>\n </Space>\n </div>\n </Space>\n </div>\n </div>\n );\n }, []);\n\n return (\n <>\n <Tree\n {...required}\n {...handlers}\n horizontalLineStyles={{\n stroke: '#c4c4c4',\n strokeWidth: 2,\n strokeDasharray: '1 1',\n }}\n verticalLineStyles={{\n stroke: '#c4c4c4',\n strokeWidth: 2,\n strokeDasharray: '1 1',\n }}\n draggable={false}\n depthGap={14}\n gapMode={'padding'}\n disableLines={false}\n disableTransitions={true}\n disableHorizontalLines={false}\n disableVerticalLines={false}\n verticalLineTopOffset={0}\n verticalLineOffset={5}\n renderNode={renderNode}\n />\n </>\n );\n};\n"],"names":["prefix","FileTree","props","treeData","needJumpto","defaultOpened","defaultOpenFather","required","handlers","useTreeState","renderNode","useCallback","node","onToggle","Icon","getFileCom","Space","PlusCircleOutlined","MinusCircleOutlined","Popover","Typography","ModuleGraphListContext","moduleJumpList","setModuleJumpList","RightSquareOutlined","_list","Tree"],"mappings":";;;;;;;;AAcA,MAAMA,SAAS;AAaR,MAAMC,WAAoC,CAACC;IAChD,MAAM,EACJC,QAAQ,EACRC,aAAa,KAAK,EAClBC,gBAAgB,KAAK,EACrBC,oBAAoB,CAAC,EACtB,GAAGJ;IAEJ,MAAM,EAAEK,QAAQ,EAAEC,QAAQ,EAAE,GAAGC,aAAa;QAC1C,IAAI,GAAGT,OAAO,KAAK,CAAC;QACpB,MAAMG,YAAY,EAAE;QACpBE;QACA,gBAAgB;QAChB,mBAAmB;IACrB;IAEA,MAAMK,aAAaC,YAAY,CAAC,EAAEC,IAAI,EAAEC,QAAQ,EAAoB;QAClEP,qBACEM,KAAK,IAAI,CAAC,KAAK,GAAGN,qBAClBM,KAAK,SAAS,CAAC;QACjB,MAAME,OAAOC,WAAWH,KAAK,IAAI,CAAC,IAAI;QAEtC,OAAO,WAAP,GACE,IAAC;YAAI,WAAW,GAAGZ,OAAO,WAAW,CAAC;sBACpC,kBAAC;gBAAI,WAAW,GAAGA,OAAO,OAAO,CAAC;0BAChC,kBAACgB,OAAKA;oBAAC,WAAU;8BACf,kBAAC;wBAAI,WAAW,GAAGhB,OAAO,WAAW,CAAC;kCACpC,mBAACgB,OAAKA;;8CACJ,IAAC;oCAAI,SAASH;8CACZ,mBAACG,OAAKA;;4CACH,CAACJ,KAAK,OAAO,CAAC,MAAM,IAAIA,KAAK,IAAI,CAAC,QAAQ,EAAE,SAAS,WAAT,GAC3C,IAACK,oBAAkBA;gDAAC,OAAO;oDAAE,OAAO;gDAAY;+DAEhD,IAACC,qBAAmBA;gDAAC,OAAO;oDAAE,OAAO;gDAAY;;4CAElDJ;0DACD,IAACK,SAAOA;gDAEN,uBACE;8DACGP,KAAK,IAAI,CAAC,gBAAgB,GAAG,WAAH,GACzB,IAACQ,WAAW,IAAI;wDAEd,MAAI;kEAEHR,KAAK,IAAI,CAAC,gBAAgB;uDAHtB,GAAGA,KAAK,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,kBAMvC;;gDAIN,OAAM;gDACN,SAAQ;0DAER,kBAACQ,WAAW,IAAI;8DAAER,KAAK,IAAI,CAAC,IAAI;;+CAlB3B,GAAGA,KAAK,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC;;;;8CAsBrC,IAACI,OAAKA;8CACHZ,cAAc,WAAdA,GACC,IAACiB,uBAAuB,QAAQ;kDAC7B,CAAC,EAAEC,cAAc,EAAEC,iBAAiB,EAAE,GAC9B,WAAP,GACE,IAACC,qBAAmBA;gDAClB,SAAS;oDACP,MAAMC,QAAQ;2DAAIH;qDAAe;oDACjCG,MAAM,IAAI,CAAC,CAACb,KAAK,EAAE;oDACnBW,kBAAkBE;gDACpB;;;;;;;;;WA9CuBb,KAAK,IAAI,CAAC,IAAI;IA2D/D,GAAG,EAAE;IAEL,OAAO,WAAP,GACE;kBACE,kBAACc,kBAAIA;YACF,GAAGnB,QAAQ;YACX,GAAGC,QAAQ;YACZ,sBAAsB;gBACpB,QAAQ;gBACR,aAAa;gBACb,iBAAiB;YACnB;YACA,oBAAoB;gBAClB,QAAQ;gBACR,aAAa;gBACb,iBAAiB;YACnB;YACA,WAAW;YACX,UAAU;YACV,SAAS;YACT,cAAc;YACd,oBAAoB;YACpB,wBAAwB;YACxB,sBAAsB;YACtB,uBAAuB;YACvB,oBAAoB;YACpB,YAAYE;;;AAIpB"}
1
+ {"version":3,"file":"pages/ModuleAnalyze/components/fileTreeCom.mjs","sources":["../../../../src/pages/ModuleAnalyze/components/fileTreeCom.tsx"],"sourcesContent":["import {\n MinusCircleOutlined,\n PlusCircleOutlined,\n RightSquareOutlined,\n} from '@ant-design/icons';\nimport { Popover, Space, Typography } from 'antd';\nimport React, { useCallback, useEffect, useRef } from 'react';\nimport Tree, { DefaultNodeProps, useTreeState } from 'react-hyper-tree';\n\nimport { ModuleGraphListContext } from '../../BundleSize/config';\nimport { NewTreeNodeType } from '../utils/hooks';\nimport './fileTreeCom.scss';\nimport { getFileCom } from 'src/components/FileTree';\n\nconst prefix = 'file-tree-com';\n\ntype FileTreeProps = {\n treeData: NewTreeNodeType[];\n needCode?: boolean;\n needShowAllTree?: boolean;\n needJumpto?: boolean;\n defaultOpened?: boolean;\n defaultOpenFather?: number;\n cwd: string;\n selectedChunk?: string;\n};\n\nexport const FileTree: React.FC<FileTreeProps> = (props) => {\n const { treeData, needJumpto = false, defaultOpenFather = 0 } = props;\n\n const { required, handlers } = useTreeState({\n id: `${prefix}-tree`,\n data: treeData || [],\n defaultOpened: false,\n multipleSelect: false,\n refreshAsyncNodes: true,\n });\n\n const expandedNodes = useRef<Set<string | number>>(new Set());\n\n useEffect(() => {\n expandedNodes.current.clear();\n }, [treeData]);\n\n const renderNode = useCallback(\n ({ node, onToggle }: DefaultNodeProps) => {\n if (\n typeof node.data !== 'object' ||\n node.data === null ||\n Array.isArray(node.data)\n ) {\n return null;\n }\n\n const hasChildren =\n typeof node.data.getChildren === 'function' ||\n (Array.isArray(node.data.children) && node.data.children.length > 0);\n\n if (\n defaultOpenFather > 0 &&\n typeof node.data.level === 'number' &&\n node.data.level < defaultOpenFather &&\n hasChildren\n ) {\n const nodeId = node.id;\n if (!expandedNodes.current.has(nodeId)) {\n expandedNodes.current.add(nodeId);\n requestAnimationFrame(() => {\n handlers.setOpen(nodeId, true);\n });\n }\n }\n\n const Icon = getFileCom(node.data.name);\n\n return (\n <div className={`${prefix}-titles-box`} key={node.data.name}>\n <div className={`${prefix}-titles`}>\n <Space direction=\"vertical\">\n <div className={`${prefix}-node-title`}>\n <Space>\n <div onClick={onToggle}>\n <Space>\n {(() => {\n const hasChildren =\n typeof node.data.getChildren === 'function' ||\n (Array.isArray(node.data.children) &&\n node.data.children.length > 0);\n return !node.options.opened && hasChildren ? (\n <PlusCircleOutlined style={{ color: 'lightblue' }} />\n ) : (\n <MinusCircleOutlined style={{ color: 'lightblue' }} />\n );\n })()}\n {Icon}\n <Popover\n key={`${node.data.name}popover`}\n content={\n <>\n {node.data.__RESOURCEPATH__ ? (\n <Typography.Text\n key={`${node.data.name}-popover-path`}\n code\n >\n {node.data.__RESOURCEPATH__}\n </Typography.Text>\n ) : (\n <></>\n )}\n </>\n }\n title=\"INFO\"\n trigger=\"hover\"\n >\n <Typography.Text>{node.data.name}</Typography.Text>\n </Popover>\n </Space>\n </div>\n <Space>\n {needJumpto && (\n <ModuleGraphListContext.Consumer>\n {({ moduleJumpList, setModuleJumpList }) => {\n return (\n <RightSquareOutlined\n onClick={() => {\n const _list = [...moduleJumpList];\n _list.push(+node.id);\n setModuleJumpList(_list);\n }}\n />\n );\n }}\n </ModuleGraphListContext.Consumer>\n )}\n </Space>\n </Space>\n </div>\n </Space>\n </div>\n </div>\n );\n },\n [handlers, defaultOpenFather, needJumpto],\n );\n\n return (\n <>\n <Tree\n {...required}\n {...handlers}\n horizontalLineStyles={{\n stroke: '#c4c4c4',\n strokeWidth: 2,\n strokeDasharray: '1 1',\n }}\n verticalLineStyles={{\n stroke: '#c4c4c4',\n strokeWidth: 2,\n strokeDasharray: '1 1',\n }}\n draggable={false}\n depthGap={14}\n gapMode={'padding'}\n disableLines={false}\n disableTransitions={true}\n disableHorizontalLines={false}\n disableVerticalLines={false}\n verticalLineTopOffset={0}\n verticalLineOffset={5}\n renderNode={renderNode}\n />\n </>\n );\n};\n"],"names":["prefix","FileTree","props","treeData","needJumpto","defaultOpenFather","required","handlers","useTreeState","expandedNodes","useRef","Set","useEffect","renderNode","useCallback","node","onToggle","Array","hasChildren","nodeId","requestAnimationFrame","Icon","getFileCom","Space","PlusCircleOutlined","MinusCircleOutlined","Popover","Typography","ModuleGraphListContext","moduleJumpList","setModuleJumpList","RightSquareOutlined","_list","Tree"],"mappings":"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"}
@@ -1,5 +1,8 @@
1
1
  import { SDK } from '@rsdoctor/types';
2
2
  import React from 'react';
3
+ export declare const BailoutReasonCard: React.FC<{
4
+ reasons?: string[];
5
+ }>;
3
6
  export declare const ModuleFilesTree: React.FC<{
4
7
  modules: SDK.ModuleData[];
5
8
  dependencies: SDK.DependencyData[];
@@ -1,6 +1,6 @@
1
- import { Fragment, jsx } from "react/jsx-runtime";
2
- import { Col, Empty, Popover, Tag } from "antd";
3
- import { useEffect, useState } from "react";
1
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
2
+ import { Card, Col, Empty, Popover, Typography } from "antd";
3
+ import { useEffect, useMemo, useState } from "react";
4
4
  import { Size } from "../../constants.mjs";
5
5
  import { FileTree } from "./components/fileTreeCom.mjs";
6
6
  import { clsNamePrefix } from "./constants.mjs";
@@ -8,6 +8,57 @@ import dependency from "./dependency.mjs";
8
8
  import { getImporteds } from "./utils/index.mjs";
9
9
  import { useCreateFileTreeData } from "./utils/hooks.mjs";
10
10
  import { TabList } from "./index.mjs";
11
+ const BailoutReasonCard = ({ reasons })=>{
12
+ if (!reasons || !reasons.length) return null;
13
+ return /*#__PURE__*/ jsxs(Card, {
14
+ className: `${clsNamePrefix}-bailout-card`,
15
+ bordered: false,
16
+ bodyStyle: {
17
+ padding: 20
18
+ },
19
+ children: [
20
+ /*#__PURE__*/ jsx(Typography.Text, {
21
+ strong: true,
22
+ className: `${clsNamePrefix}-bailout-card-title`,
23
+ children: "Bailout Reasons"
24
+ }),
25
+ /*#__PURE__*/ jsx("div", {
26
+ className: `${clsNamePrefix}-bailout-card-list`,
27
+ style: {
28
+ maxHeight: 156,
29
+ overflowY: 'auto'
30
+ },
31
+ children: reasons.map((reason, index)=>/*#__PURE__*/ jsxs("div", {
32
+ className: `${clsNamePrefix}-bailout-card-item`,
33
+ children: [
34
+ /*#__PURE__*/ jsx(Popover, {
35
+ content: reason,
36
+ trigger: "hover",
37
+ children: /*#__PURE__*/ jsx(Typography.Paragraph, {
38
+ ellipsis: {
39
+ rows: 1
40
+ },
41
+ className: `${clsNamePrefix}-bailout-card-text`,
42
+ style: {
43
+ marginBottom: 0
44
+ },
45
+ children: reason
46
+ })
47
+ }),
48
+ /*#__PURE__*/ jsxs(Typography.Text, {
49
+ type: "secondary",
50
+ className: `${clsNamePrefix}-bailout-card-meta`,
51
+ children: [
52
+ "#",
53
+ String(index + 1).padStart(2, '0')
54
+ ]
55
+ })
56
+ ]
57
+ }, `${reason}-${index}`))
58
+ })
59
+ ]
60
+ });
61
+ };
11
62
  const ModuleFilesTree = (props)=>{
12
63
  const { curModule, modules, dependencies, cwd, activeTabKey, selectedChunk = '' } = props;
13
64
  const [importedModules, setImportedModules] = useState([]);
@@ -19,19 +70,19 @@ const ModuleFilesTree = (props)=>{
19
70
  curModule,
20
71
  modules
21
72
  ]);
22
- return /*#__PURE__*/ jsx(Fragment, {
23
- children: activeTabKey === TabList[TabList.Reasons] ? /*#__PURE__*/ jsx(Fragment, {
24
- children: importedModules ? /*#__PURE__*/ jsx(FileTree, {
25
- cwd: cwd,
26
- treeData: fileStructures,
27
- needCode: true,
28
- needShowAllTree: true,
29
- needJumpto: true,
30
- selectedChunk: selectedChunk
31
- }) : /*#__PURE__*/ jsx(Empty, {
32
- className: `${clsNamePrefix}-empty`
33
- })
34
- }) : activeTabKey === TabList[TabList.Dependencies] ? /*#__PURE__*/ jsx("div", {
73
+ const mainContent = useMemo(()=>{
74
+ if (activeTabKey === TabList[TabList.Reasons]) return importedModules ? /*#__PURE__*/ jsx(FileTree, {
75
+ cwd: cwd,
76
+ treeData: fileStructures,
77
+ needCode: true,
78
+ needShowAllTree: true,
79
+ needJumpto: true,
80
+ selectedChunk: selectedChunk,
81
+ defaultOpenFather: 1
82
+ }) : /*#__PURE__*/ jsx(Empty, {
83
+ className: `${clsNamePrefix}-empty`
84
+ });
85
+ return /*#__PURE__*/ jsx("div", {
35
86
  className: `${clsNamePrefix}-file-tree`,
36
87
  style: {
37
88
  padding: Size.BasePadding / 2
@@ -49,26 +100,20 @@ const ModuleFilesTree = (props)=>{
49
100
  className: `${clsNamePrefix}-empty`
50
101
  })
51
102
  })
52
- }) : /*#__PURE__*/ jsx("div", {
53
- children: curModule.bailoutReason?.map((reason)=>/*#__PURE__*/ jsx("div", {
54
- style: {
55
- marginBottom: 10
56
- },
57
- children: /*#__PURE__*/ jsx(Tag, {
58
- children: /*#__PURE__*/ jsx(Popover, {
59
- content: reason,
60
- children: /*#__PURE__*/ jsx("span", {
61
- style: {
62
- display: 'inline-block'
63
- },
64
- children: reason.length > 120 ? `${reason.slice(0, 120)}...` : reason
65
- })
66
- })
67
- }, reason)
68
- }))
69
- })
103
+ });
104
+ }, [
105
+ activeTabKey,
106
+ curModule,
107
+ dependencies,
108
+ fileStructures,
109
+ importedModules,
110
+ cwd,
111
+ selectedChunk
112
+ ]);
113
+ return /*#__PURE__*/ jsx(Fragment, {
114
+ children: mainContent
70
115
  });
71
116
  };
72
- export { ModuleFilesTree };
117
+ export { BailoutReasonCard, ModuleFilesTree };
73
118
 
74
119
  //# sourceMappingURL=fileTree.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"pages/ModuleAnalyze/fileTree.mjs","sources":["../../../src/pages/ModuleAnalyze/fileTree.tsx"],"sourcesContent":["import { SDK } from '@rsdoctor/types';\nimport { Col, Empty, Tag, Popover } from 'antd';\nimport React, { useEffect, useState } from 'react';\nimport { Size } from 'src/constants';\nimport { FileTree } from './components/fileTreeCom';\nimport { clsNamePrefix } from './constants';\nimport DependencyTree from './dependency';\nimport { getImporteds } from './utils';\nimport { useCreateFileTreeData } from './utils/hooks';\nimport { TabList } from './index';\n\nexport const ModuleFilesTree: React.FC<{\n modules: SDK.ModuleData[];\n dependencies: SDK.DependencyData[];\n curModule: SDK.ModuleData;\n cwd: string;\n selectedChunk: string;\n activeTabKey: string;\n}> = (props) => {\n const {\n curModule,\n modules,\n dependencies,\n cwd,\n activeTabKey,\n selectedChunk = '',\n } = props;\n const [importedModules, setImportedModules] = useState(\n [] as SDK.ModuleData[],\n );\n\n const { data: fileStructures } = useCreateFileTreeData(\n modules,\n importedModules,\n curModule,\n );\n\n useEffect(() => {\n const importeds = getImporteds(curModule, modules);\n setImportedModules(importeds);\n }, [curModule, modules]);\n\n return (\n <>\n {activeTabKey === TabList[TabList.Reasons] ? (\n <>\n {importedModules ? (\n <FileTree\n cwd={cwd}\n treeData={fileStructures}\n needCode={true}\n needShowAllTree={true}\n needJumpto={true}\n selectedChunk={selectedChunk}\n />\n ) : (\n <Empty className={`${clsNamePrefix}-empty`} />\n )}\n </>\n ) : activeTabKey === TabList[TabList.Dependencies] ? (\n <div\n className={`${clsNamePrefix}-file-tree`}\n style={{ padding: Size.BasePadding / 2 }}\n >\n <Col span={24} style={{ marginTop: Size.BasePadding / 2 }}>\n {curModule ? (\n <DependencyTree\n module={curModule}\n dependencies={dependencies}\n cwd={cwd}\n />\n ) : (\n <Empty className={`${clsNamePrefix}-empty`} />\n )}\n </Col>\n </div>\n ) : (\n <div>\n {curModule.bailoutReason?.map((reason) => (\n <div style={{ marginBottom: 10 }}>\n <Tag key={reason}>\n <Popover content={reason}>\n <span style={{ display: 'inline-block' }}>\n {reason.length > 120\n ? `${reason.slice(0, 120)}...`\n : reason}\n </span>\n </Popover>\n </Tag>\n </div>\n ))}\n </div>\n )}\n </>\n );\n};\n"],"names":["ModuleFilesTree","props","curModule","modules","dependencies","cwd","activeTabKey","selectedChunk","importedModules","setImportedModules","useState","fileStructures","useCreateFileTreeData","useEffect","importeds","getImporteds","TabList","FileTree","Empty","clsNamePrefix","Size","Col","DependencyTree","reason","Tag","Popover"],"mappings":";;;;;;;;;;AAWO,MAAMA,kBAOR,CAACC;IACJ,MAAM,EACJC,SAAS,EACTC,OAAO,EACPC,YAAY,EACZC,GAAG,EACHC,YAAY,EACZC,gBAAgB,EAAE,EACnB,GAAGN;IACJ,MAAM,CAACO,iBAAiBC,mBAAmB,GAAGC,SAC5C,EAAE;IAGJ,MAAM,EAAE,MAAMC,cAAc,EAAE,GAAGC,sBAC/BT,SACAK,iBACAN;IAGFW,UAAU;QACR,MAAMC,YAAYC,aAAab,WAAWC;QAC1CM,mBAAmBK;IACrB,GAAG;QAACZ;QAAWC;KAAQ;IAEvB,OAAO,WAAP,GACE;kBACGG,iBAAiBU,OAAO,CAACA,QAAQ,OAAO,CAAC,GAAG,WAAH,GACxC;sBACGR,kBAAkB,WAAlBA,GACC,IAACS,UAAQA;gBACP,KAAKZ;gBACL,UAAUM;gBACV,UAAU;gBACV,iBAAiB;gBACjB,YAAY;gBACZ,eAAeJ;+BAGjB,IAACW,OAAKA;gBAAC,WAAW,GAAGC,cAAc,MAAM,CAAC;;aAG5Cb,iBAAiBU,OAAO,CAACA,QAAQ,YAAY,CAAC,GAAG,WAAH,GAChD,IAAC;YACC,WAAW,GAAGG,cAAc,UAAU,CAAC;YACvC,OAAO;gBAAE,SAASC,KAAK,WAAW,GAAG;YAAE;sBAEvC,kBAACC,KAAGA;gBAAC,MAAM;gBAAI,OAAO;oBAAE,WAAWD,KAAK,WAAW,GAAG;gBAAE;0BACrDlB,YAAY,WAAZA,GACC,IAACoB,YAAcA;oBACb,QAAQpB;oBACR,cAAcE;oBACd,KAAKC;mCAGP,IAACa,OAAKA;oBAAC,WAAW,GAAGC,cAAc,MAAM,CAAC;;;2BAKhD,IAAC;sBACEjB,UAAU,aAAa,EAAE,IAAI,CAACqB,SAAAA,WAAAA,GAC7B,IAAC;oBAAI,OAAO;wBAAE,cAAc;oBAAG;8BAC7B,kBAACC,KAAGA;kCACF,kBAACC,SAAOA;4BAAC,SAASF;sCAChB,kBAAC;gCAAK,OAAO;oCAAE,SAAS;gCAAe;0CACpCA,OAAO,MAAM,GAAG,MACb,GAAGA,OAAO,KAAK,CAAC,GAAG,KAAK,GAAG,CAAC,GAC5BA;;;uBALAA;;;;AAexB"}
1
+ {"version":3,"file":"pages/ModuleAnalyze/fileTree.mjs","sources":["../../../src/pages/ModuleAnalyze/fileTree.tsx"],"sourcesContent":["import { SDK } from '@rsdoctor/types';\nimport { Card, Col, Empty, Popover, Typography } from 'antd';\nimport React, { useEffect, useMemo, useState } from 'react';\nimport { Size } from 'src/constants';\nimport { FileTree } from './components/fileTreeCom';\nimport { clsNamePrefix } from './constants';\nimport DependencyTree from './dependency';\nimport { getImporteds } from './utils';\nimport { useCreateFileTreeData } from './utils/hooks';\nimport { TabList } from './index';\n\nexport const BailoutReasonCard: React.FC<{ reasons?: string[] }> = ({\n reasons,\n}) => {\n if (!reasons || !reasons.length) {\n return null;\n }\n return (\n <Card\n className={`${clsNamePrefix}-bailout-card`}\n bordered={false}\n bodyStyle={{ padding: 20 }}\n >\n <Typography.Text strong className={`${clsNamePrefix}-bailout-card-title`}>\n Bailout Reasons\n </Typography.Text>\n <div\n className={`${clsNamePrefix}-bailout-card-list`}\n style={{ maxHeight: 156, overflowY: 'auto' }}\n >\n {reasons.map((reason, index) => (\n <div\n className={`${clsNamePrefix}-bailout-card-item`}\n key={`${reason}-${index}`}\n >\n <Popover content={reason} trigger=\"hover\">\n <Typography.Paragraph\n ellipsis={{ rows: 1 }}\n className={`${clsNamePrefix}-bailout-card-text`}\n style={{ marginBottom: 0 }}\n >\n {reason}\n </Typography.Paragraph>\n </Popover>\n <Typography.Text\n type=\"secondary\"\n className={`${clsNamePrefix}-bailout-card-meta`}\n >\n #{String(index + 1).padStart(2, '0')}\n </Typography.Text>\n </div>\n ))}\n </div>\n </Card>\n );\n};\n\nexport const ModuleFilesTree: React.FC<{\n modules: SDK.ModuleData[];\n dependencies: SDK.DependencyData[];\n curModule: SDK.ModuleData;\n cwd: string;\n selectedChunk: string;\n activeTabKey: string;\n}> = (props) => {\n const {\n curModule,\n modules,\n dependencies,\n cwd,\n activeTabKey,\n selectedChunk = '',\n } = props;\n const [importedModules, setImportedModules] = useState(\n [] as SDK.ModuleData[],\n );\n\n const { data: fileStructures } = useCreateFileTreeData(\n modules,\n importedModules,\n curModule,\n );\n\n useEffect(() => {\n const importeds = getImporteds(curModule, modules);\n setImportedModules(importeds);\n }, [curModule, modules]);\n\n const mainContent = useMemo(() => {\n if (activeTabKey === TabList[TabList.Reasons]) {\n return importedModules ? (\n <FileTree\n cwd={cwd}\n treeData={fileStructures}\n needCode={true}\n needShowAllTree={true}\n needJumpto={true}\n selectedChunk={selectedChunk}\n defaultOpenFather={1}\n />\n ) : (\n <Empty className={`${clsNamePrefix}-empty`} />\n );\n }\n\n return (\n <div\n className={`${clsNamePrefix}-file-tree`}\n style={{ padding: Size.BasePadding / 2 }}\n >\n <Col span={24} style={{ marginTop: Size.BasePadding / 2 }}>\n {curModule ? (\n <DependencyTree\n module={curModule}\n dependencies={dependencies}\n cwd={cwd}\n />\n ) : (\n <Empty className={`${clsNamePrefix}-empty`} />\n )}\n </Col>\n </div>\n );\n }, [\n activeTabKey,\n curModule,\n dependencies,\n fileStructures,\n importedModules,\n cwd,\n selectedChunk,\n ]);\n\n return <>{mainContent}</>;\n};\n"],"names":["BailoutReasonCard","reasons","Card","clsNamePrefix","Typography","reason","index","Popover","String","ModuleFilesTree","props","curModule","modules","dependencies","cwd","activeTabKey","selectedChunk","importedModules","setImportedModules","useState","fileStructures","useCreateFileTreeData","useEffect","importeds","getImporteds","mainContent","useMemo","TabList","FileTree","Empty","Size","Col","DependencyTree"],"mappings":";;;;;;;;;;AAWO,MAAMA,oBAAsD,CAAC,EAClEC,OAAO,EACR;IACC,IAAI,CAACA,WAAW,CAACA,QAAQ,MAAM,EAC7B,OAAO;IAET,OAAO,WAAP,GACE,KAACC,MAAIA;QACH,WAAW,GAAGC,cAAc,aAAa,CAAC;QAC1C,UAAU;QACV,WAAW;YAAE,SAAS;QAAG;;0BAEzB,IAACC,WAAW,IAAI;gBAAC,QAAM;gBAAC,WAAW,GAAGD,cAAc,mBAAmB,CAAC;0BAAE;;0BAG1E,IAAC;gBACC,WAAW,GAAGA,cAAc,kBAAkB,CAAC;gBAC/C,OAAO;oBAAE,WAAW;oBAAK,WAAW;gBAAO;0BAE1CF,QAAQ,GAAG,CAAC,CAACI,QAAQC,QAAAA,WAAAA,GACpB,KAAC;wBACC,WAAW,GAAGH,cAAc,kBAAkB,CAAC;;0CAG/C,IAACI,SAAOA;gCAAC,SAASF;gCAAQ,SAAQ;0CAChC,kBAACD,WAAW,SAAS;oCACnB,UAAU;wCAAE,MAAM;oCAAE;oCACpB,WAAW,GAAGD,cAAc,kBAAkB,CAAC;oCAC/C,OAAO;wCAAE,cAAc;oCAAE;8CAExBE;;;0CAGL,KAACD,WAAW,IAAI;gCACd,MAAK;gCACL,WAAW,GAAGD,cAAc,kBAAkB,CAAC;;oCAChD;oCACGK,OAAOF,QAAQ,GAAG,QAAQ,CAAC,GAAG;;;;uBAf7B,GAAGD,OAAO,CAAC,EAAEC,OAAO;;;;AAsBrC;AAEO,MAAMG,kBAOR,CAACC;IACJ,MAAM,EACJC,SAAS,EACTC,OAAO,EACPC,YAAY,EACZC,GAAG,EACHC,YAAY,EACZC,gBAAgB,EAAE,EACnB,GAAGN;IACJ,MAAM,CAACO,iBAAiBC,mBAAmB,GAAGC,SAC5C,EAAE;IAGJ,MAAM,EAAE,MAAMC,cAAc,EAAE,GAAGC,sBAC/BT,SACAK,iBACAN;IAGFW,UAAU;QACR,MAAMC,YAAYC,aAAab,WAAWC;QAC1CM,mBAAmBK;IACrB,GAAG;QAACZ;QAAWC;KAAQ;IAEvB,MAAMa,cAAcC,QAAQ;QAC1B,IAAIX,iBAAiBY,OAAO,CAACA,QAAQ,OAAO,CAAC,EAC3C,OAAOV,kBAAkB,WAAlBA,GACL,IAACW,UAAQA;YACP,KAAKd;YACL,UAAUM;YACV,UAAU;YACV,iBAAiB;YACjB,YAAY;YACZ,eAAeJ;YACf,mBAAmB;2BAGrB,IAACa,OAAKA;YAAC,WAAW,GAAG1B,cAAc,MAAM,CAAC;;QAI9C,OAAO,WAAP,GACE,IAAC;YACC,WAAW,GAAGA,cAAc,UAAU,CAAC;YACvC,OAAO;gBAAE,SAAS2B,KAAK,WAAW,GAAG;YAAE;sBAEvC,kBAACC,KAAGA;gBAAC,MAAM;gBAAI,OAAO;oBAAE,WAAWD,KAAK,WAAW,GAAG;gBAAE;0BACrDnB,YAAY,WAAZA,GACC,IAACqB,YAAcA;oBACb,QAAQrB;oBACR,cAAcE;oBACd,KAAKC;mCAGP,IAACe,OAAKA;oBAAC,WAAW,GAAG1B,cAAc,MAAM,CAAC;;;;IAKpD,GAAG;QACDY;QACAJ;QACAE;QACAO;QACAH;QACAH;QACAE;KACD;IAED,OAAO,WAAP,GAAO;kBAAGS;;AACZ"}
@@ -16,5 +16,52 @@
16
16
  line-height: 30px;
17
17
  }
18
18
 
19
+ .module-analyze-bailout-card {
20
+ box-shadow: none;
21
+ background: #fff;
22
+ border: 1px solid #0505050f;
23
+ border-radius: 8px;
24
+ margin-top: 16px;
25
+ margin-bottom: 24px;
26
+ }
27
+
28
+ .module-analyze-bailout-card-title {
29
+ color: #1c1f23cc;
30
+ margin-bottom: 12px;
31
+ font-size: 14px;
32
+ font-weight: 600;
33
+ display: inline-block;
34
+ }
35
+
36
+ .module-analyze-bailout-card-list {
37
+ flex-direction: column;
38
+ gap: 8px;
39
+ display: flex;
40
+ }
41
+
42
+ .module-analyze-bailout-card-item {
43
+ border-bottom: 1px solid #161a2314;
44
+ justify-content: space-between;
45
+ align-items: center;
46
+ padding: 6px 0;
47
+ display: flex;
48
+ }
49
+
50
+ .module-analyze-bailout-card-item:last-child {
51
+ border-bottom: none;
52
+ }
53
+
54
+ .module-analyze-bailout-card-text {
55
+ color: #1c1f23cc;
56
+ max-width: calc(100% - 70px);
57
+ font-size: 12px;
58
+ font-weight: 400;
59
+ }
60
+
61
+ .module-analyze-bailout-card-meta {
62
+ color: #1c1f2373;
63
+ font-size: 12px;
64
+ }
65
+
19
66
 
20
67
  /*# sourceMappingURL=index.css.map */
@@ -1 +1 @@
1
- {"version":3,"sources":["webpack://./src/pages/ModuleAnalyze/index.scss"],"names":[],"mappings":"AADA;EAEE,aAAa;EACb,gBAAgB;AAClB;;AAEA;EACE,eAAe;AACjB;;AAEA;EACE,sBAAsB;EACtB,aAAa;AACf;;AAEA;EACE,iBAAiB;AACnB","sourcesContent":[".module-analyze-file-tree{width:\"100%\";min-height:50em}.module-analyze-file-tree .module-analyze-empty{margin-top:20%}.module-analyze-box{display:flex;flex-direction:column}.file-tree-com-titles-box{line-height:30px}"],"sourceRoot":""}
1
+ {"version":3,"sources":["webpack://./src/pages/ModuleAnalyze/index.scss"],"names":[],"mappings":"AADA;EAEE,aAAa;EACb,gBAAgB;AAClB;;AAEA;EACE,eAAe;AACjB;;AAEA;EACE,sBAAsB;EACtB,aAAa;AACf;;AAEA;EACE,iBAAiB;AACnB;;AAEA;EACE,gBAAgB;EAChB,gBAAgB;EAChB,2BAA2B;EAC3B,kBAAkB;EAClB,gBAAgB;EAChB,mBAAmB;AACrB;;AAEA;EACE,gBAAgB;EAChB,mBAAmB;EACnB,eAAe;EACf,gBAAgB;EAChB,qBAAqB;AACvB;;AAEA;EACE,sBAAsB;EACtB,QAAQ;EACR,aAAa;AACf;;AAEA;EACE,kCAAkC;EAClC,8BAA8B;EAC9B,mBAAmB;EACnB,cAAc;EACd,aAAa;AACf;;AAEA;EACE,mBAAmB;AACrB;;AAEA;EACE,gBAAgB;EAChB,4BAA4B;EAC5B,eAAe;EACf,gBAAgB;AAClB;;AAEA;EACE,gBAAgB;EAChB,eAAe;AACjB","sourcesContent":[".module-analyze-file-tree{width:\"100%\";min-height:50em}.module-analyze-file-tree .module-analyze-empty{margin-top:20%}.module-analyze-box{display:flex;flex-direction:column}.file-tree-com-titles-box{line-height:30px}.module-analyze-bailout-card{margin-top:16px;border-radius:8px;border:1px solid rgba(5,5,5,.06);box-shadow:none;background:#fff;margin-bottom:24px}.module-analyze-bailout-card-title{display:inline-block;font-size:14px;margin-bottom:12px;color:rgba(28,31,35,.8);font-weight:600}.module-analyze-bailout-card-list{display:flex;flex-direction:column;gap:8px}.module-analyze-bailout-card-item{display:flex;align-items:center;justify-content:space-between;padding:6px 0;border-bottom:1px solid rgba(22,26,35,.08)}.module-analyze-bailout-card-item:last-child{border-bottom:none}.module-analyze-bailout-card-text{max-width:calc(100% - 70px);font-weight:400;font-size:12px;color:rgba(28,31,35,.8)}.module-analyze-bailout-card-meta{font-size:12px;color:rgba(28,31,35,.45)}"],"sourceRoot":""}
@@ -3,8 +3,7 @@ import React from 'react';
3
3
  import './index.scss';
4
4
  export declare enum TabList {
5
5
  Reasons = 0,
6
- Dependencies = 1,
7
- BailoutReason = 2
6
+ Dependencies = 1
8
7
  }
9
8
  export declare const ModuleAnalyzeComponent: React.FC<{
10
9
  modules: SDK.ModuleData[];
@@ -1,18 +1,17 @@
1
- import { jsx, jsxs } from "react/jsx-runtime";
1
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
2
2
  import { SDK } from "@rsdoctor/types";
3
- import { Badge, Card, Col, Drawer, Popover, Row, Space, Typography } from "antd";
3
+ import { Badge, Card, Drawer, Popover, Space, Typography } from "antd";
4
4
  import { useState } from "react";
5
5
  import { ServerAPIProvider } from "../../components/Manifest/index.mjs";
6
6
  import { getShortPath } from "../../utils/index.mjs";
7
7
  import { ModuleGraphListContext } from "../BundleSize/config.mjs";
8
- import { ModuleFilesTree } from "./fileTree.mjs";
8
+ import { BailoutReasonCard, ModuleFilesTree } from "./fileTree.mjs";
9
9
  import "./index.css";
10
10
  import { drawerWidth } from "../../constants.mjs";
11
11
  import { LeftSquareOutlined, QuestionCircleOutlined, RightSquareTwoTone } from "@ant-design/icons";
12
12
  var ModuleAnalyze_TabList = /*#__PURE__*/ function(TabList) {
13
13
  TabList[TabList["Reasons"] = 0] = "Reasons";
14
14
  TabList[TabList["Dependencies"] = 1] = "Dependencies";
15
- TabList[TabList["BailoutReason"] = 2] = "BailoutReason";
16
15
  return TabList;
17
16
  }({});
18
17
  const tabslist = [
@@ -23,10 +22,6 @@ const tabslist = [
23
22
  {
24
23
  key: ModuleAnalyze_TabList[1],
25
24
  label: ModuleAnalyze_TabList[1]
26
- },
27
- {
28
- key: ModuleAnalyze_TabList[2],
29
- label: ModuleAnalyze_TabList[2]
30
25
  }
31
26
  ];
32
27
  const ModuleAnalyzeComponent = ({ modules, cwd, moduleId, show, setShow })=>{
@@ -61,65 +56,74 @@ const ModuleAnalyzeComponent = ({ modules, cwd, moduleId, show, setShow })=>{
61
56
  api: SDK.ServerAPI.API.GetAllChunkGraph,
62
57
  body: {},
63
58
  children: (_chunks)=>/*#__PURE__*/ jsx(ModuleGraphListContext.Consumer, {
64
- children: ({ moduleJumpList, setModuleJumpList })=>/*#__PURE__*/ jsx(Card, {
65
- style: {
66
- minHeight: 400
67
- },
68
- tabList: tabslist,
69
- activeTabKey: activeTabKey,
70
- tabProps: {
71
- size: 'small',
72
- style: {
73
- fontSize: 12
74
- }
75
- },
76
- onTabChange: (k)=>setActiveTabKey(k),
77
- styles: {
78
- title: {
79
- paddingTop: 0
80
- }
81
- },
82
- title: /*#__PURE__*/ jsxs(Space, {
83
- style: {
84
- padding: '10px 0px'
85
- },
86
- children: [
87
- /*#__PURE__*/ jsx(LeftSquareOutlined, {
88
- onClick: ()=>{
89
- const _list = [
90
- ...moduleJumpList.slice(0, -1)
91
- ];
92
- setModuleJumpList(_list);
59
+ children: ({ moduleJumpList, setModuleJumpList })=>/*#__PURE__*/ jsxs(Fragment, {
60
+ children: [
61
+ /*#__PURE__*/ jsx("div", {
62
+ style: {
63
+ marginTop: 16
64
+ },
65
+ children: /*#__PURE__*/ jsx(BailoutReasonCard, {
66
+ reasons: module.bailoutReason
67
+ })
68
+ }),
69
+ /*#__PURE__*/ jsx(Card, {
70
+ style: {
71
+ minHeight: 400
72
+ },
73
+ tabList: tabslist,
74
+ activeTabKey: activeTabKey,
75
+ tabProps: {
76
+ size: 'small',
77
+ style: {
78
+ fontSize: 12
93
79
  }
94
- }),
95
- /*#__PURE__*/ jsx(Typography.Text, {
96
- children: "Current Module Imported Reasons Tree"
97
- }),
98
- /*#__PURE__*/ jsx(Popover, {
99
- content: /*#__PURE__*/ jsx("div", {
100
- children: /*#__PURE__*/ jsxs("div", {
101
- children: [
102
- /*#__PURE__*/ jsx(Badge, {
103
- status: "success",
104
- text: " "
105
- }),
106
- /*#__PURE__*/ jsx(RightSquareTwoTone, {}),
107
- /*#__PURE__*/ jsx(Typography.Text, {
108
- children: ': Jump button, click to jump to the Module dependency analysis page of this module.'
80
+ },
81
+ onTabChange: (k)=>setActiveTabKey(k),
82
+ styles: {
83
+ title: {
84
+ paddingTop: 0
85
+ }
86
+ },
87
+ title: /*#__PURE__*/ jsxs(Space, {
88
+ style: {
89
+ padding: '10px 0px'
90
+ },
91
+ children: [
92
+ /*#__PURE__*/ jsx(LeftSquareOutlined, {
93
+ onClick: ()=>{
94
+ const _list = [
95
+ ...moduleJumpList.slice(0, -1)
96
+ ];
97
+ setModuleJumpList(_list);
98
+ }
99
+ }),
100
+ /*#__PURE__*/ jsx(Typography.Text, {
101
+ style: {
102
+ fontSize: 14,
103
+ color: 'rgba(28, 31, 35, 0.8)'
104
+ },
105
+ children: "Current Module Imported Reasons Tree"
106
+ }),
107
+ /*#__PURE__*/ jsx(Popover, {
108
+ content: /*#__PURE__*/ jsx("div", {
109
+ children: /*#__PURE__*/ jsxs("div", {
110
+ children: [
111
+ /*#__PURE__*/ jsx(Badge, {
112
+ status: "success",
113
+ text: " "
114
+ }),
115
+ /*#__PURE__*/ jsx(RightSquareTwoTone, {}),
116
+ /*#__PURE__*/ jsx(Typography.Text, {
117
+ children: ': Jump button, click to jump to the Module dependency analysis page of this module.'
118
+ })
119
+ ]
109
120
  })
110
- ]
121
+ }),
122
+ title: "Usage",
123
+ children: /*#__PURE__*/ jsx(QuestionCircleOutlined, {})
111
124
  })
112
- }),
113
- title: "Usage",
114
- children: /*#__PURE__*/ jsx(QuestionCircleOutlined, {})
115
- })
116
- ]
117
- }),
118
- children: /*#__PURE__*/ jsx(Row, {
119
- justify: "start",
120
- align: "middle",
121
- children: /*#__PURE__*/ jsx(Col, {
122
- span: 24,
125
+ ]
126
+ }),
123
127
  children: /*#__PURE__*/ jsx(ModuleFilesTree, {
124
128
  curModule: module,
125
129
  modules: modules,
@@ -129,7 +133,7 @@ const ModuleAnalyzeComponent = ({ modules, cwd, moduleId, show, setShow })=>{
129
133
  activeTabKey: activeTabKey
130
134
  })
131
135
  })
132
- })
136
+ ]
133
137
  })
134
138
  })
135
139
  })
@@ -1 +1 @@
1
- {"version":3,"file":"pages/ModuleAnalyze/index.mjs","sources":["../../../src/pages/ModuleAnalyze/index.tsx"],"sourcesContent":["import { SDK } from '@rsdoctor/types';\nimport {\n Badge,\n Card,\n Col,\n Drawer,\n Popover,\n Row,\n Space,\n Typography,\n} from 'antd';\nimport React, { useState } from 'react';\nimport { ServerAPIProvider } from 'src/components/Manifest';\nimport { getShortPath } from 'src/utils';\nimport { ModuleGraphListContext } from '../BundleSize/config';\nimport { ModuleFilesTree } from './fileTree';\nimport './index.scss';\nimport { drawerWidth } from '../../constants';\nimport {\n LeftSquareOutlined,\n QuestionCircleOutlined,\n RightSquareTwoTone,\n} from '@ant-design/icons';\n\nexport enum TabList {\n Reasons,\n Dependencies,\n BailoutReason,\n}\n\nconst tabslist = [\n {\n key: TabList[TabList.Reasons],\n label: TabList[TabList.Reasons],\n },\n {\n key: TabList[TabList.Dependencies],\n label: TabList[TabList.Dependencies],\n },\n {\n key: TabList[TabList.BailoutReason],\n label: TabList[TabList.BailoutReason],\n },\n] as unknown as { key: string; label: string }[];\n\nexport const ModuleAnalyzeComponent: React.FC<{\n modules: SDK.ModuleData[];\n cwd: string;\n moduleId: string | number;\n show: boolean;\n setShow: (arg: boolean) => void;\n}> = ({ modules, cwd, moduleId, show, setShow }) => {\n const [selectedChunk, _setSelectedChunk] = useState('' as string);\n const [activeTabKey, setActiveTabKey] = useState(TabList[TabList.Reasons]);\n\n return (\n <ServerAPIProvider\n api={SDK.ServerAPI.API.GetModuleDetails}\n body={{ moduleId: +moduleId }}\n >\n {({ module, dependencies }) => {\n return (\n <Drawer\n title={\n <div className=\"module-analyze-box\">\n <Typography.Text>{getShortPath(module.path)}</Typography.Text>\n <Typography.Text\n style={{ fontSize: 12, color: 'rgba(0, 0, 0, 0.45)' }}\n >\n {`Current Module: ${module.path}`}\n </Typography.Text>\n </div>\n }\n open={show}\n maskClosable\n width={drawerWidth * 0.8}\n onClose={() => setShow(false)}\n >\n <ServerAPIProvider\n api={SDK.ServerAPI.API.GetAllChunkGraph}\n body={{}}\n >\n {(_chunks) => {\n return (\n <ModuleGraphListContext.Consumer>\n {({ moduleJumpList, setModuleJumpList }) => {\n return (\n <Card\n style={{ minHeight: 400 }}\n tabList={tabslist}\n activeTabKey={activeTabKey}\n tabProps={{\n size: 'small',\n style: {\n fontSize: 12,\n },\n }}\n onTabChange={(k) => setActiveTabKey(k)}\n styles={{\n title: { paddingTop: 0 },\n }}\n title={\n <Space style={{ padding: '10px 0px' }}>\n <LeftSquareOutlined\n onClick={() => {\n const _list = [\n ...moduleJumpList.slice(0, -1),\n ];\n setModuleJumpList(_list);\n }}\n />\n <Typography.Text>\n Current Module Imported Reasons Tree\n </Typography.Text>\n <Popover\n content={\n <div>\n <div>\n <Badge status=\"success\" text=\" \" />\n <RightSquareTwoTone />\n <Typography.Text>\n {\n ': Jump button, click to jump to the Module dependency analysis page of this module.'\n }\n </Typography.Text>\n </div>\n </div>\n }\n title=\"Usage\"\n >\n <QuestionCircleOutlined />\n </Popover>\n </Space>\n }\n >\n <Row justify=\"start\" align=\"middle\">\n <Col span={24}>\n <ModuleFilesTree\n curModule={module}\n modules={modules}\n dependencies={dependencies}\n cwd={cwd}\n selectedChunk={selectedChunk}\n activeTabKey={activeTabKey}\n />\n </Col>\n </Row>\n </Card>\n );\n }}\n </ModuleGraphListContext.Consumer>\n );\n }}\n </ServerAPIProvider>\n </Drawer>\n );\n }}\n </ServerAPIProvider>\n );\n};\n"],"names":["TabList","tabslist","ModuleAnalyzeComponent","modules","cwd","moduleId","show","setShow","selectedChunk","_setSelectedChunk","useState","activeTabKey","setActiveTabKey","ServerAPIProvider","SDK","module","dependencies","Drawer","Typography","getShortPath","drawerWidth","_chunks","ModuleGraphListContext","moduleJumpList","setModuleJumpList","Card","k","Space","LeftSquareOutlined","_list","Popover","Badge","RightSquareTwoTone","QuestionCircleOutlined","Row","Col","ModuleFilesTree"],"mappings":";;;;;;;;;;;AAwBO,IAAKA,wBAAOA,WAAAA,GAAAA,SAAPA,OAAO;;;;WAAPA;;AAMZ,MAAMC,WAAW;IACf;QACE,KAAKD,qBAAO,CAAC,EAAgB;QAC7B,OAAOA,qBAAO,CAAC,EAAgB;IACjC;IACA;QACE,KAAKA,qBAAO,CAAC,EAAqB;QAClC,OAAOA,qBAAO,CAAC,EAAqB;IACtC;IACA;QACE,KAAKA,qBAAO,CAAC,EAAsB;QACnC,OAAOA,qBAAO,CAAC,EAAsB;IACvC;CACD;AAEM,MAAME,yBAMR,CAAC,EAAEC,OAAO,EAAEC,GAAG,EAAEC,QAAQ,EAAEC,IAAI,EAAEC,OAAO,EAAE;IAC7C,MAAM,CAACC,eAAeC,kBAAkB,GAAGC,SAAS;IACpD,MAAM,CAACC,cAAcC,gBAAgB,GAAGF,SAASV,qBAAO,CAAC,EAAgB;IAEzE,OAAO,WAAP,GACE,IAACa,mBAAiBA;QAChB,KAAKC,IAAI,SAAS,CAAC,GAAG,CAAC,gBAAgB;QACvC,MAAM;YAAE,UAAU,CAACT;QAAS;kBAE3B,CAAC,EAAEU,MAAM,EAAEC,YAAY,EAAE,GACjB,WAAP,GACE,IAACC,QAAMA;gBACL,qBACE,KAAC;oBAAI,WAAU;;sCACb,IAACC,WAAW,IAAI;sCAAEC,aAAaJ,OAAO,IAAI;;sCAC1C,IAACG,WAAW,IAAI;4BACd,OAAO;gCAAE,UAAU;gCAAI,OAAO;4BAAsB;sCAEnD,CAAC,gBAAgB,EAAEH,OAAO,IAAI,EAAE;;;;gBAIvC,MAAMT;gBACN,cAAY;gBACZ,OAAOc,AAAc,MAAdA;gBACP,SAAS,IAAMb,QAAQ;0BAEvB,kBAACM,mBAAiBA;oBAChB,KAAKC,IAAI,SAAS,CAAC,GAAG,CAAC,gBAAgB;oBACvC,MAAM,CAAC;8BAEN,CAACO,UACO,WAAP,GACE,IAACC,uBAAuB,QAAQ;sCAC7B,CAAC,EAAEC,cAAc,EAAEC,iBAAiB,EAAE,GAC9B,WAAP,GACE,IAACC,MAAIA;oCACH,OAAO;wCAAE,WAAW;oCAAI;oCACxB,SAASxB;oCACT,cAAcU;oCACd,UAAU;wCACR,MAAM;wCACN,OAAO;4CACL,UAAU;wCACZ;oCACF;oCACA,aAAa,CAACe,IAAMd,gBAAgBc;oCACpC,QAAQ;wCACN,OAAO;4CAAE,YAAY;wCAAE;oCACzB;oCACA,qBACE,KAACC,OAAKA;wCAAC,OAAO;4CAAE,SAAS;wCAAW;;0DAClC,IAACC,oBAAkBA;gDACjB,SAAS;oDACP,MAAMC,QAAQ;2DACTN,eAAe,KAAK,CAAC,GAAG;qDAC5B;oDACDC,kBAAkBK;gDACpB;;0DAEF,IAACX,WAAW,IAAI;0DAAC;;0DAGjB,IAACY,SAAOA;gDACN,uBACE,IAAC;8DACC,mBAAC;;0EACC,IAACC,OAAKA;gEAAC,QAAO;gEAAU,MAAK;;0EAC7B,IAACC,oBAAkBA,CAAAA;0EACnB,IAACd,WAAW,IAAI;0EAEZ;;;;;gDAMV,OAAM;0DAEN,kBAACe,wBAAsBA,CAAAA;;;;8CAK7B,kBAACC,KAAGA;wCAAC,SAAQ;wCAAQ,OAAM;kDACzB,kBAACC,KAAGA;4CAAC,MAAM;sDACT,kBAACC,iBAAeA;gDACd,WAAWrB;gDACX,SAASZ;gDACT,cAAca;gDACd,KAAKZ;gDACL,eAAeI;gDACf,cAAcG;;;;;;;;;AAgB9C"}
1
+ {"version":3,"file":"pages/ModuleAnalyze/index.mjs","sources":["../../../src/pages/ModuleAnalyze/index.tsx"],"sourcesContent":["import { SDK } from '@rsdoctor/types';\nimport { Badge, Card, Drawer, Popover, Space, Typography } from 'antd';\nimport React, { useState } from 'react';\nimport { ServerAPIProvider } from 'src/components/Manifest';\nimport { getShortPath } from 'src/utils';\nimport { ModuleGraphListContext } from '../BundleSize/config';\nimport { ModuleFilesTree, BailoutReasonCard } from './fileTree';\nimport './index.scss';\nimport { drawerWidth } from '../../constants';\nimport {\n LeftSquareOutlined,\n QuestionCircleOutlined,\n RightSquareTwoTone,\n} from '@ant-design/icons';\n\nexport enum TabList {\n Reasons,\n Dependencies,\n}\n\nconst tabslist = [\n {\n key: TabList[TabList.Reasons],\n label: TabList[TabList.Reasons],\n },\n {\n key: TabList[TabList.Dependencies],\n label: TabList[TabList.Dependencies],\n },\n] as unknown as { key: string; label: string }[];\n\nexport const ModuleAnalyzeComponent: React.FC<{\n modules: SDK.ModuleData[];\n cwd: string;\n moduleId: string | number;\n show: boolean;\n setShow: (arg: boolean) => void;\n}> = ({ modules, cwd, moduleId, show, setShow }) => {\n const [selectedChunk, _setSelectedChunk] = useState('' as string);\n const [activeTabKey, setActiveTabKey] = useState(TabList[TabList.Reasons]);\n\n return (\n <ServerAPIProvider\n api={SDK.ServerAPI.API.GetModuleDetails}\n body={{ moduleId: +moduleId }}\n >\n {({ module, dependencies }) => {\n return (\n <Drawer\n title={\n <div className=\"module-analyze-box\">\n <Typography.Text>{getShortPath(module.path)}</Typography.Text>\n <Typography.Text\n style={{ fontSize: 12, color: 'rgba(0, 0, 0, 0.45)' }}\n >\n {`Current Module: ${module.path}`}\n </Typography.Text>\n </div>\n }\n open={show}\n maskClosable\n width={drawerWidth * 0.8}\n onClose={() => setShow(false)}\n >\n <ServerAPIProvider\n api={SDK.ServerAPI.API.GetAllChunkGraph}\n body={{}}\n >\n {(_chunks) => {\n return (\n <ModuleGraphListContext.Consumer>\n {({ moduleJumpList, setModuleJumpList }) => {\n return (\n <>\n <div style={{ marginTop: 16 }}>\n <BailoutReasonCard reasons={module.bailoutReason} />\n </div>\n <Card\n style={{ minHeight: 400 }}\n tabList={tabslist}\n activeTabKey={activeTabKey}\n tabProps={{\n size: 'small',\n style: {\n fontSize: 12,\n },\n }}\n onTabChange={(k) => setActiveTabKey(k)}\n styles={{\n title: { paddingTop: 0 },\n }}\n title={\n <Space style={{ padding: '10px 0px' }}>\n <LeftSquareOutlined\n onClick={() => {\n const _list = [\n ...moduleJumpList.slice(0, -1),\n ];\n setModuleJumpList(_list);\n }}\n />\n <Typography.Text\n style={{\n fontSize: 14,\n color: 'rgba(28, 31, 35, 0.8)',\n }}\n >\n Current Module Imported Reasons Tree\n </Typography.Text>\n <Popover\n content={\n <div>\n <div>\n <Badge status=\"success\" text=\" \" />\n <RightSquareTwoTone />\n <Typography.Text>\n {\n ': Jump button, click to jump to the Module dependency analysis page of this module.'\n }\n </Typography.Text>\n </div>\n </div>\n }\n title=\"Usage\"\n >\n <QuestionCircleOutlined />\n </Popover>\n </Space>\n }\n >\n <ModuleFilesTree\n curModule={module}\n modules={modules}\n dependencies={dependencies}\n cwd={cwd}\n selectedChunk={selectedChunk}\n activeTabKey={activeTabKey}\n />\n </Card>\n </>\n );\n }}\n </ModuleGraphListContext.Consumer>\n );\n }}\n </ServerAPIProvider>\n </Drawer>\n );\n }}\n </ServerAPIProvider>\n );\n};\n"],"names":["TabList","tabslist","ModuleAnalyzeComponent","modules","cwd","moduleId","show","setShow","selectedChunk","_setSelectedChunk","useState","activeTabKey","setActiveTabKey","ServerAPIProvider","SDK","module","dependencies","Drawer","Typography","getShortPath","drawerWidth","_chunks","ModuleGraphListContext","moduleJumpList","setModuleJumpList","BailoutReasonCard","Card","k","Space","LeftSquareOutlined","_list","Popover","Badge","RightSquareTwoTone","QuestionCircleOutlined","ModuleFilesTree"],"mappings":";;;;;;;;;;;AAeO,IAAKA,wBAAOA,WAAAA,GAAAA,SAAPA,OAAO;;;WAAPA;;AAKZ,MAAMC,WAAW;IACf;QACE,KAAKD,qBAAO,CAAC,EAAgB;QAC7B,OAAOA,qBAAO,CAAC,EAAgB;IACjC;IACA;QACE,KAAKA,qBAAO,CAAC,EAAqB;QAClC,OAAOA,qBAAO,CAAC,EAAqB;IACtC;CACD;AAEM,MAAME,yBAMR,CAAC,EAAEC,OAAO,EAAEC,GAAG,EAAEC,QAAQ,EAAEC,IAAI,EAAEC,OAAO,EAAE;IAC7C,MAAM,CAACC,eAAeC,kBAAkB,GAAGC,SAAS;IACpD,MAAM,CAACC,cAAcC,gBAAgB,GAAGF,SAASV,qBAAO,CAAC,EAAgB;IAEzE,OAAO,WAAP,GACE,IAACa,mBAAiBA;QAChB,KAAKC,IAAI,SAAS,CAAC,GAAG,CAAC,gBAAgB;QACvC,MAAM;YAAE,UAAU,CAACT;QAAS;kBAE3B,CAAC,EAAEU,MAAM,EAAEC,YAAY,EAAE,GACjB,WAAP,GACE,IAACC,QAAMA;gBACL,qBACE,KAAC;oBAAI,WAAU;;sCACb,IAACC,WAAW,IAAI;sCAAEC,aAAaJ,OAAO,IAAI;;sCAC1C,IAACG,WAAW,IAAI;4BACd,OAAO;gCAAE,UAAU;gCAAI,OAAO;4BAAsB;sCAEnD,CAAC,gBAAgB,EAAEH,OAAO,IAAI,EAAE;;;;gBAIvC,MAAMT;gBACN,cAAY;gBACZ,OAAOc,AAAc,MAAdA;gBACP,SAAS,IAAMb,QAAQ;0BAEvB,kBAACM,mBAAiBA;oBAChB,KAAKC,IAAI,SAAS,CAAC,GAAG,CAAC,gBAAgB;oBACvC,MAAM,CAAC;8BAEN,CAACO,UACO,WAAP,GACE,IAACC,uBAAuB,QAAQ;sCAC7B,CAAC,EAAEC,cAAc,EAAEC,iBAAiB,EAAE,GAC9B,WAAP,GACE;;sDACE,IAAC;4CAAI,OAAO;gDAAE,WAAW;4CAAG;sDAC1B,kBAACC,mBAAiBA;gDAAC,SAASV,OAAO,aAAa;;;sDAElD,IAACW,MAAIA;4CACH,OAAO;gDAAE,WAAW;4CAAI;4CACxB,SAASzB;4CACT,cAAcU;4CACd,UAAU;gDACR,MAAM;gDACN,OAAO;oDACL,UAAU;gDACZ;4CACF;4CACA,aAAa,CAACgB,IAAMf,gBAAgBe;4CACpC,QAAQ;gDACN,OAAO;oDAAE,YAAY;gDAAE;4CACzB;4CACA,qBACE,KAACC,OAAKA;gDAAC,OAAO;oDAAE,SAAS;gDAAW;;kEAClC,IAACC,oBAAkBA;wDACjB,SAAS;4DACP,MAAMC,QAAQ;mEACTP,eAAe,KAAK,CAAC,GAAG;6DAC5B;4DACDC,kBAAkBM;wDACpB;;kEAEF,IAACZ,WAAW,IAAI;wDACd,OAAO;4DACL,UAAU;4DACV,OAAO;wDACT;kEACD;;kEAGD,IAACa,SAAOA;wDACN,uBACE,IAAC;sEACC,mBAAC;;kFACC,IAACC,OAAKA;wEAAC,QAAO;wEAAU,MAAK;;kFAC7B,IAACC,oBAAkBA,CAAAA;kFACnB,IAACf,WAAW,IAAI;kFAEZ;;;;;wDAMV,OAAM;kEAEN,kBAACgB,wBAAsBA,CAAAA;;;;sDAK7B,kBAACC,iBAAeA;gDACd,WAAWpB;gDACX,SAASZ;gDACT,cAAca;gDACd,KAAKZ;gDACL,eAAeI;gDACf,cAAcG;;;;;;;;;AAe5C"}
@@ -13,14 +13,14 @@ function useCreateFileTreeData(modules, importedModules, curModule) {
13
13
  name: getShortPath(imported.path),
14
14
  __RESOURCEPATH__: imported.path,
15
15
  id: imported.id,
16
- level: 1,
16
+ level: 0,
17
17
  chunks: imported.chunks,
18
18
  size: formatSize(imported.size.parsedSize),
19
19
  kind: imported.kind,
20
20
  concatModules: imported.concatenationModules,
21
21
  fatherPath: getShortPath(curModule.path),
22
22
  dependencies: imported.dependencies,
23
- getChildren: ()=>getLeafs(imported, modules, curModule),
23
+ getChildren: ()=>getLeafs(imported, modules, curModule, 0),
24
24
  children: imported.imported
25
25
  })));
26
26
  return {
@@ -31,21 +31,22 @@ function useCreateFileTreeData(modules, importedModules, curModule) {
31
31
  curModule
32
32
  ]);
33
33
  }
34
- function getLeafs(imported, modules, fatherModule) {
34
+ function getLeafs(imported, modules, fatherModule, parentLevel) {
35
35
  const leafModules = getImporteds(imported, modules);
36
+ const currentLevel = parentLevel + 1;
36
37
  const leafs = leafModules?.map((_imported, index)=>({
37
38
  key: `0-${index}`,
38
39
  name: getShortPath(_imported.path),
39
40
  __RESOURCEPATH__: _imported.path,
40
41
  id: _imported.id,
41
- level: 1,
42
+ level: currentLevel,
42
43
  size: formatSize(_imported.size.parsedSize),
43
44
  kind: _imported.kind,
44
45
  chunks: _imported.chunks,
45
46
  concatModules: _imported.concatenationModules,
46
47
  fatherPath: getShortPath(fatherModule.path),
47
48
  dependencies: _imported.dependencies,
48
- getChildren: ()=>getLeafs(_imported, modules, imported),
49
+ getChildren: ()=>getLeafs(_imported, modules, imported, currentLevel),
49
50
  children: _imported.imported
50
51
  }));
51
52
  return leafs;
@@ -1 +1 @@
1
- {"version":3,"file":"pages/ModuleAnalyze/utils/hooks.mjs","sources":["../../../../src/pages/ModuleAnalyze/utils/hooks.tsx"],"sourcesContent":["import { SDK } from '@rsdoctor/types';\nimport { useMemo } from 'react';\nimport { formatSize, getShortPath } from 'src/utils';\nimport { getImporteds } from '.';\nimport { Lodash } from '@rsdoctor/utils/common';\n\nexport type NewTreeNodeType = {\n __RESOURCEPATH__: string;\n id: number;\n key: string;\n name: string;\n level: number;\n kind: number;\n size?: string;\n concatModules: number[] | undefined;\n chunks?: string[];\n getChildren?: () => NewTreeNodeType[];\n dependencies?: number[];\n fatherPath?: string;\n children?: number[];\n needExpand?: boolean | string;\n};\n\nexport function useCreateFileTreeData(\n modules: SDK.ModuleData[],\n importedModules: SDK.ModuleData[],\n curModule: SDK.ModuleData,\n): { data: NewTreeNodeType[] } {\n return useMemo(() => {\n if (!importedModules || !importedModules?.length) {\n return { filterData: [], data: [] };\n }\n const root = Lodash.compact(\n importedModules?.map((imported, index) => {\n return {\n key: `0-${index}`,\n name: getShortPath(imported.path),\n __RESOURCEPATH__: imported.path,\n id: imported.id,\n level: 1,\n chunks: imported.chunks,\n size: formatSize(imported.size.parsedSize),\n kind: imported.kind,\n concatModules: imported.concatenationModules,\n fatherPath: getShortPath(curModule.path),\n dependencies: imported.dependencies,\n getChildren: () => getLeafs(imported, modules, curModule),\n children: imported.imported,\n };\n }),\n );\n // getAllTreeData(root, modules, 2, importedModules);\n return {\n data: root,\n };\n }, [importedModules, curModule]);\n}\n\nfunction getLeafs(\n imported: SDK.ModuleData,\n modules: SDK.ModuleData[],\n fatherModule: SDK.ModuleData,\n) {\n const leafModules = getImporteds(imported, modules);\n\n const leafs = leafModules?.map((_imported, index) => {\n return {\n key: `0-${index}`,\n name: getShortPath(_imported.path),\n __RESOURCEPATH__: _imported.path,\n id: _imported.id,\n level: 1,\n size: formatSize(_imported.size.parsedSize),\n kind: _imported.kind,\n chunks: _imported.chunks,\n concatModules: _imported.concatenationModules,\n fatherPath: getShortPath(fatherModule.path),\n dependencies: _imported.dependencies,\n getChildren: () => getLeafs(_imported, modules, imported),\n children: _imported.imported,\n };\n });\n return leafs;\n}\n\nexport function getContactMainModulePath(\n concatModules: number[],\n modules: SDK.ModuleData[],\n): string[] {\n const concatModulesPath = concatModules?.map(\n (cm) => modules.filter((m) => m.id === cm)?.[0],\n );\n return concatModulesPath?.map((m) => m.path);\n}\n"],"names":["useCreateFileTreeData","modules","importedModules","curModule","useMemo","root","Lodash","imported","index","getShortPath","formatSize","getLeafs","fatherModule","leafModules","getImporteds","leafs","_imported","getContactMainModulePath","concatModules","concatModulesPath","cm","m"],"mappings":";;;;AAuBO,SAASA,sBACdC,OAAyB,EACzBC,eAAiC,EACjCC,SAAyB;IAEzB,OAAOC,QAAQ;QACb,IAAI,CAACF,mBAAmB,CAACA,iBAAiB,QACxC,OAAO;YAAE,YAAY,EAAE;YAAE,MAAM,EAAE;QAAC;QAEpC,MAAMG,OAAOC,OAAO,OAAO,CACzBJ,iBAAiB,IAAI,CAACK,UAAUC,QACvB;gBACL,KAAK,CAAC,EAAE,EAAEA,OAAO;gBACjB,MAAMC,aAAaF,SAAS,IAAI;gBAChC,kBAAkBA,SAAS,IAAI;gBAC/B,IAAIA,SAAS,EAAE;gBACf,OAAO;gBACP,QAAQA,SAAS,MAAM;gBACvB,MAAMG,WAAWH,SAAS,IAAI,CAAC,UAAU;gBACzC,MAAMA,SAAS,IAAI;gBACnB,eAAeA,SAAS,oBAAoB;gBAC5C,YAAYE,aAAaN,UAAU,IAAI;gBACvC,cAAcI,SAAS,YAAY;gBACnC,aAAa,IAAMI,SAASJ,UAAUN,SAASE;gBAC/C,UAAUI,SAAS,QAAQ;YAC7B;QAIJ,OAAO;YACL,MAAMF;QACR;IACF,GAAG;QAACH;QAAiBC;KAAU;AACjC;AAEA,SAASQ,SACPJ,QAAwB,EACxBN,OAAyB,EACzBW,YAA4B;IAE5B,MAAMC,cAAcC,aAAaP,UAAUN;IAE3C,MAAMc,QAAQF,aAAa,IAAI,CAACG,WAAWR,QAClC;YACL,KAAK,CAAC,EAAE,EAAEA,OAAO;YACjB,MAAMC,aAAaO,UAAU,IAAI;YACjC,kBAAkBA,UAAU,IAAI;YAChC,IAAIA,UAAU,EAAE;YAChB,OAAO;YACP,MAAMN,WAAWM,UAAU,IAAI,CAAC,UAAU;YAC1C,MAAMA,UAAU,IAAI;YACpB,QAAQA,UAAU,MAAM;YACxB,eAAeA,UAAU,oBAAoB;YAC7C,YAAYP,aAAaG,aAAa,IAAI;YAC1C,cAAcI,UAAU,YAAY;YACpC,aAAa,IAAML,SAASK,WAAWf,SAASM;YAChD,UAAUS,UAAU,QAAQ;QAC9B;IAEF,OAAOD;AACT;AAEO,SAASE,yBACdC,aAAuB,EACvBjB,OAAyB;IAEzB,MAAMkB,oBAAoBD,eAAe,IACvC,CAACE,KAAOnB,QAAQ,MAAM,CAAC,CAACoB,IAAMA,EAAE,EAAE,KAAKD,KAAK,CAAC,EAAE;IAEjD,OAAOD,mBAAmB,IAAI,CAACE,IAAMA,EAAE,IAAI;AAC7C"}
1
+ {"version":3,"file":"pages/ModuleAnalyze/utils/hooks.mjs","sources":["../../../../src/pages/ModuleAnalyze/utils/hooks.tsx"],"sourcesContent":["import { SDK } from '@rsdoctor/types';\nimport { useMemo } from 'react';\nimport { formatSize, getShortPath } from 'src/utils';\nimport { getImporteds } from '.';\nimport { Lodash } from '@rsdoctor/utils/common';\n\nexport type NewTreeNodeType = {\n __RESOURCEPATH__: string;\n id: number;\n key: string;\n name: string;\n level: number;\n kind: number;\n size?: string;\n concatModules: number[] | undefined;\n chunks?: string[];\n getChildren?: () => NewTreeNodeType[];\n dependencies?: number[];\n fatherPath?: string;\n children?: number[];\n needExpand?: boolean | string;\n};\n\nexport function useCreateFileTreeData(\n modules: SDK.ModuleData[],\n importedModules: SDK.ModuleData[],\n curModule: SDK.ModuleData,\n): { data: NewTreeNodeType[] } {\n return useMemo(() => {\n if (!importedModules || !importedModules?.length) {\n return { filterData: [], data: [] };\n }\n const root = Lodash.compact(\n importedModules?.map((imported, index) => {\n return {\n key: `0-${index}`,\n name: getShortPath(imported.path),\n __RESOURCEPATH__: imported.path,\n id: imported.id,\n level: 0,\n chunks: imported.chunks,\n size: formatSize(imported.size.parsedSize),\n kind: imported.kind,\n concatModules: imported.concatenationModules,\n fatherPath: getShortPath(curModule.path),\n dependencies: imported.dependencies,\n getChildren: () => getLeafs(imported, modules, curModule, 0),\n children: imported.imported,\n };\n }),\n );\n // getAllTreeData(root, modules, 2, importedModules);\n return {\n data: root,\n };\n }, [importedModules, curModule]);\n}\n\nfunction getLeafs(\n imported: SDK.ModuleData,\n modules: SDK.ModuleData[],\n fatherModule: SDK.ModuleData,\n parentLevel: number,\n) {\n const leafModules = getImporteds(imported, modules);\n const currentLevel = parentLevel + 1;\n\n const leafs = leafModules?.map((_imported, index) => {\n return {\n key: `0-${index}`,\n name: getShortPath(_imported.path),\n __RESOURCEPATH__: _imported.path,\n id: _imported.id,\n level: currentLevel,\n size: formatSize(_imported.size.parsedSize),\n kind: _imported.kind,\n chunks: _imported.chunks,\n concatModules: _imported.concatenationModules,\n fatherPath: getShortPath(fatherModule.path),\n dependencies: _imported.dependencies,\n getChildren: () => getLeafs(_imported, modules, imported, currentLevel),\n children: _imported.imported,\n };\n });\n return leafs;\n}\n\nexport function getContactMainModulePath(\n concatModules: number[],\n modules: SDK.ModuleData[],\n): string[] {\n const concatModulesPath = concatModules?.map(\n (cm) => modules.filter((m) => m.id === cm)?.[0],\n );\n return concatModulesPath?.map((m) => m.path);\n}\n"],"names":["useCreateFileTreeData","modules","importedModules","curModule","useMemo","root","Lodash","imported","index","getShortPath","formatSize","getLeafs","fatherModule","parentLevel","leafModules","getImporteds","currentLevel","leafs","_imported","getContactMainModulePath","concatModules","concatModulesPath","cm","m"],"mappings":";;;;AAuBO,SAASA,sBACdC,OAAyB,EACzBC,eAAiC,EACjCC,SAAyB;IAEzB,OAAOC,QAAQ;QACb,IAAI,CAACF,mBAAmB,CAACA,iBAAiB,QACxC,OAAO;YAAE,YAAY,EAAE;YAAE,MAAM,EAAE;QAAC;QAEpC,MAAMG,OAAOC,OAAO,OAAO,CACzBJ,iBAAiB,IAAI,CAACK,UAAUC,QACvB;gBACL,KAAK,CAAC,EAAE,EAAEA,OAAO;gBACjB,MAAMC,aAAaF,SAAS,IAAI;gBAChC,kBAAkBA,SAAS,IAAI;gBAC/B,IAAIA,SAAS,EAAE;gBACf,OAAO;gBACP,QAAQA,SAAS,MAAM;gBACvB,MAAMG,WAAWH,SAAS,IAAI,CAAC,UAAU;gBACzC,MAAMA,SAAS,IAAI;gBACnB,eAAeA,SAAS,oBAAoB;gBAC5C,YAAYE,aAAaN,UAAU,IAAI;gBACvC,cAAcI,SAAS,YAAY;gBACnC,aAAa,IAAMI,SAASJ,UAAUN,SAASE,WAAW;gBAC1D,UAAUI,SAAS,QAAQ;YAC7B;QAIJ,OAAO;YACL,MAAMF;QACR;IACF,GAAG;QAACH;QAAiBC;KAAU;AACjC;AAEA,SAASQ,SACPJ,QAAwB,EACxBN,OAAyB,EACzBW,YAA4B,EAC5BC,WAAmB;IAEnB,MAAMC,cAAcC,aAAaR,UAAUN;IAC3C,MAAMe,eAAeH,cAAc;IAEnC,MAAMI,QAAQH,aAAa,IAAI,CAACI,WAAWV,QAClC;YACL,KAAK,CAAC,EAAE,EAAEA,OAAO;YACjB,MAAMC,aAAaS,UAAU,IAAI;YACjC,kBAAkBA,UAAU,IAAI;YAChC,IAAIA,UAAU,EAAE;YAChB,OAAOF;YACP,MAAMN,WAAWQ,UAAU,IAAI,CAAC,UAAU;YAC1C,MAAMA,UAAU,IAAI;YACpB,QAAQA,UAAU,MAAM;YACxB,eAAeA,UAAU,oBAAoB;YAC7C,YAAYT,aAAaG,aAAa,IAAI;YAC1C,cAAcM,UAAU,YAAY;YACpC,aAAa,IAAMP,SAASO,WAAWjB,SAASM,UAAUS;YAC1D,UAAUE,UAAU,QAAQ;QAC9B;IAEF,OAAOD;AACT;AAEO,SAASE,yBACdC,aAAuB,EACvBnB,OAAyB;IAEzB,MAAMoB,oBAAoBD,eAAe,IACvC,CAACE,KAAOrB,QAAQ,MAAM,CAAC,CAACsB,IAAMA,EAAE,EAAE,KAAKD,KAAK,CAAC,EAAE;IAEjD,OAAOD,mBAAmB,IAAI,CAACE,IAAMA,EAAE,IAAI;AAC7C"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rsdoctor/components",
3
- "version": "1.3.13-beta.0",
3
+ "version": "1.3.13-beta.1",
4
4
  "license": "MIT",
5
5
  "types": "dist/index.d.ts",
6
6
  "repository": {
@@ -74,9 +74,9 @@
74
74
  "react-router-dom": "6.4.3",
75
75
  "socket.io-client": "4.8.1",
76
76
  "url-parse": "1.5.10",
77
- "@rsdoctor/graph": "1.3.13-beta.0",
78
- "@rsdoctor/utils": "1.3.13-beta.0",
79
- "@rsdoctor/types": "1.3.13-beta.0"
77
+ "@rsdoctor/utils": "1.3.13-beta.1",
78
+ "@rsdoctor/graph": "1.3.13-beta.1",
79
+ "@rsdoctor/types": "1.3.13-beta.1"
80
80
  },
81
81
  "peerDependencies": {
82
82
  "react": ">=18.3.1",