@rsdoctor/components 1.5.3 → 1.5.5
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.
- package/dist/common/imgs/connection-point.mjs +1 -1
- package/dist/common/imgs/rsdoctor-navbar.mjs +1 -1
- package/dist/common/imgs/webpack.mjs +1 -1
- package/dist/common/svg/bundle-size.mjs +1 -1
- package/dist/common/svg/cursor.mjs +1 -1
- package/dist/common/svg/error.mjs +1 -1
- package/dist/common/svg/file-css.mjs +1 -1
- package/dist/common/svg/file-html.mjs +1 -1
- package/dist/common/svg/file-image.mjs +1 -1
- package/dist/common/svg/file-js.mjs +1 -1
- package/dist/common/svg/file-unknown.mjs +1 -1
- package/dist/common/svg/file.mjs +1 -1
- package/dist/common/svg/files/css.mjs +1 -1
- package/dist/common/svg/files/html.mjs +1 -1
- package/dist/common/svg/files/image.mjs +1 -1
- package/dist/common/svg/files/js.mjs +1 -1
- package/dist/common/svg/files/unkown-file.mjs +1 -1
- package/dist/common/svg/loader/input.mjs +1 -1
- package/dist/common/svg/loader/output.mjs +1 -1
- package/dist/common/svg/loader/step.mjs +1 -1
- package/dist/common/svg/navbar/bundle-size-active.mjs +1 -1
- package/dist/common/svg/navbar/bundle-size-inactive.mjs +1 -1
- package/dist/common/svg/navbar/compile-analysis-active.mjs +1 -1
- package/dist/common/svg/navbar/compile-analysis-inactive.mjs +1 -1
- package/dist/common/svg/navbar/overall-active.mjs +1 -1
- package/dist/common/svg/navbar/overall-inactive.mjs +1 -1
- package/dist/common/svg/output.mjs +1 -1
- package/dist/common/svg/source-size.mjs +1 -1
- package/dist/common/svg/source.mjs +1 -1
- package/dist/common/svg/total-size.mjs +1 -1
- package/dist/common/svg/trae.mjs +1 -1
- package/dist/common/svg/version.mjs +1 -1
- package/dist/common/svg/vscode.mjs +1 -1
- package/dist/components/Alert/change.mjs.map +1 -1
- package/dist/components/Alert/ecma-version-check.mjs +1 -1
- package/dist/components/Alert/ecma-version-check.mjs.map +1 -1
- package/dist/components/Alert/ecma-version-check.module.mjs +1 -1
- package/dist/components/Alert/package-relation.module.mjs +1 -1
- package/dist/components/Alert/view.mjs.map +1 -1
- package/dist/components/Alerts/bundle-alert.mjs +50 -2
- package/dist/components/Alerts/bundle-alert.mjs.map +1 -1
- package/dist/components/Alerts/bundle-alert.module.mjs +1 -1
- package/dist/components/Alerts/collapse-cjs-require.d.ts +6 -0
- package/dist/components/Alerts/collapse-cjs-require.mjs +142 -0
- package/dist/components/Alerts/collapse-cjs-require.mjs.map +1 -0
- package/dist/components/Alerts/collapse-cross-chunks.mjs +2 -23
- package/dist/components/Alerts/collapse-cross-chunks.mjs.map +1 -1
- package/dist/components/Alerts/collapse-esm-cjs.d.ts +6 -0
- package/dist/components/Alerts/collapse-esm-cjs.mjs +231 -0
- package/dist/components/Alerts/collapse-esm-cjs.mjs.map +1 -0
- package/dist/components/Alerts/collapse-module-mixed-chunks.mjs +2 -23
- package/dist/components/Alerts/collapse-module-mixed-chunks.mjs.map +1 -1
- package/dist/components/Alerts/collapse-shared.d.ts +9 -0
- package/dist/components/Alerts/collapse-shared.mjs +90 -0
- package/dist/components/Alerts/collapse-shared.mjs.map +1 -0
- package/dist/components/Alerts/collapse-side-effects-only-imports.d.ts +6 -0
- package/dist/components/Alerts/collapse-side-effects-only-imports.mjs +131 -0
- package/dist/components/Alerts/collapse-side-effects-only-imports.mjs.map +1 -0
- package/dist/components/Alerts/collapse.mjs +2 -23
- package/dist/components/Alerts/collapse.mjs.map +1 -1
- package/dist/components/Alerts/collapse.module.mjs +1 -1
- package/dist/components/Alerts/list.module.mjs +1 -1
- package/dist/components/Alerts/overlay.mjs.map +1 -1
- package/dist/components/Alerts/overlay.module.mjs +1 -1
- package/dist/components/Card/diff.mjs.map +1 -1
- package/dist/components/Card/index.mjs +1 -1
- package/dist/components/Card/size.mjs +2 -2
- package/dist/components/Card/size.mjs.map +1 -1
- package/dist/components/Card/size.module.mjs +1 -1
- package/dist/components/Charts/TimelineCharts/index.mjs +1 -1
- package/dist/components/Charts/TimelineCharts/index.mjs.map +1 -1
- package/dist/components/Charts/TreeMap.mjs +1 -1
- package/dist/components/Charts/TreeMap.mjs.map +1 -1
- package/dist/components/Charts/constants.mjs +1 -1
- package/dist/components/Charts/loader.mjs +2 -2
- package/dist/components/Charts/loader.mjs.map +1 -1
- package/dist/components/Charts/treemap.module.mjs +1 -1
- package/dist/components/Configuration/builder.module.mjs +1 -1
- package/dist/components/FileTree/css.mjs +1 -1
- package/dist/components/FileTree/html.mjs +1 -1
- package/dist/components/FileTree/image.mjs +1 -1
- package/dist/components/FileTree/index.mjs +1 -1
- package/dist/components/FileTree/index.mjs.map +1 -1
- package/dist/components/FileTree/js.mjs +1 -1
- package/dist/components/FileTree/unkown-file.mjs +1 -1
- package/dist/components/Keyword/style.module.mjs +1 -1
- package/dist/components/Layout/bundle-size-icon.mjs +1 -1
- package/dist/components/Layout/compile-icon.mjs +1 -1
- package/dist/components/Layout/index.mjs.map +1 -1
- package/dist/components/Layout/overall-icon.mjs +1 -1
- package/dist/components/Layout/project-info-context.mjs.map +1 -1
- package/dist/components/Loader/Analysis/input.mjs +1 -1
- package/dist/components/Loader/Analysis/output.mjs +1 -1
- package/dist/components/Loader/Analysis/style.module.mjs +1 -1
- package/dist/components/Loader/executions.mjs.map +1 -1
- package/dist/components/Loader/step.mjs +1 -1
- package/dist/components/Manifest/api.mjs.map +1 -1
- package/dist/components/Overall/DataSummary.module.mjs +1 -1
- package/dist/components/Overall/bundle.mjs +1 -1
- package/dist/components/Overall/bundle.mjs.map +1 -1
- package/dist/components/Overall/bundle.module.mjs +1 -1
- package/dist/components/Overall/card.module.mjs +1 -1
- package/dist/components/Overall/compile.mjs.map +1 -1
- package/dist/components/Overall/compile.module.mjs +1 -1
- package/dist/components/Overall/help-center.module.mjs +1 -1
- package/dist/components/Overall/list.module.mjs +1 -1
- package/dist/components/Overall/overview.mjs +2 -1
- package/dist/components/Overall/overview.module.mjs +1 -1
- package/dist/components/Overall/project.module.mjs +1 -1
- package/dist/components/Resolver/analysis.mjs +2 -2
- package/dist/components/Resolver/analysis.mjs.map +1 -1
- package/dist/components/Select/index.mjs.map +1 -1
- package/dist/components/Status/failed.mjs.map +1 -1
- package/dist/components/TextDrawer/duplicate.mjs.map +1 -1
- package/dist/components/TextDrawer/index.mjs +1 -1
- package/dist/components/base/CodeViewer/index.mjs +2 -2
- package/dist/components/base/CodeViewer/index.mjs.map +1 -1
- package/dist/components/base/CodeViewer/index.module.mjs +1 -1
- package/dist/components/base/DiffViewer/index.mjs +2 -2
- package/dist/components/base/DiffViewer/index.mjs.map +1 -1
- package/dist/components/base/DiffViewer/index.module.mjs +1 -1
- package/dist/components/index.mjs +1 -2
- package/dist/config.mjs.map +1 -1
- package/dist/constants.mjs +1 -1
- package/dist/pages/BundleSize/components/asset.mjs +2 -2
- package/dist/pages/BundleSize/components/asset.mjs.map +1 -1
- package/dist/pages/BundleSize/components/card.module.mjs +1 -1
- package/dist/pages/BundleSize/components/cards.mjs +2 -2
- package/dist/pages/BundleSize/components/cards.mjs.map +1 -1
- package/dist/pages/BundleSize/components/index.mjs +1 -1
- package/dist/pages/BundleSize/components/index.mjs.map +1 -1
- package/dist/pages/BundleSize/components/index.module.mjs +1 -1
- package/dist/pages/BundleSize/components/search-modal.mjs +1 -1
- package/dist/pages/BundleSize/components/search-modal.mjs.map +1 -1
- package/dist/pages/BundleSize/config.mjs.map +1 -1
- package/dist/pages/BundleSize/constants.mjs +1 -1
- package/dist/pages/BundleSize/index.mjs +1 -1
- package/dist/pages/ModuleAnalyze/constants.mjs +1 -1
- package/dist/pages/ModuleAnalyze/dependency.mjs +1 -1
- package/dist/pages/ModuleResolve/index.mjs +1 -1
- package/dist/pages/Overall/index.mjs +1 -1
- package/dist/pages/Overall/index.module.mjs +1 -1
- package/dist/pages/Resources/BundleDiff/DiffContainer/assets.mjs.map +1 -1
- package/dist/pages/Resources/BundleDiff/DiffContainer/changes.mjs.map +1 -1
- package/dist/pages/Resources/BundleDiff/DiffContainer/modules.mjs.map +1 -1
- package/dist/pages/Resources/BundleDiff/DiffContainer/packages.mjs.map +1 -1
- package/dist/pages/Resources/BundleDiff/constants.mjs.map +1 -1
- package/dist/pages/Resources/BundleDiff/index.mjs +2 -2
- package/dist/pages/Resources/RuleIndex/index.mjs +1 -1
- package/dist/pages/TreeShaking/index.mjs +1 -1
- package/dist/pages/TreeShaking/open-tag.mjs +1 -1
- package/dist/pages/TreeShaking/table.mjs.map +1 -1
- package/dist/pages/Uploader/index.mjs +1 -1
- package/dist/pages/WebpackLoaders/Analysis/index.mjs +2 -2
- package/dist/pages/WebpackLoaders/Analysis/index.mjs.map +1 -1
- package/dist/pages/WebpackLoaders/Overall/index.mjs +1 -1
- package/dist/pages/WebpackPlugins/index.mjs +1 -1
- package/dist/pages/index.mjs +1 -1
- package/dist/utils/i18n/cn.mjs +1 -1
- package/dist/utils/i18n/en.mjs +1 -1
- package/dist/utils/i18n/index.mjs +1 -1
- package/dist/utils/loader.mjs +1 -1
- package/dist/utils/loader.mjs.map +1 -1
- package/dist/utils/string.d.ts +1 -0
- package/dist/utils/string.mjs +6 -1
- package/dist/utils/string.mjs.map +1 -1
- package/dist/utils/time.mjs +1 -1
- package/dist/utils/time.mjs.map +1 -1
- package/package.json +9 -9
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components/Charts/TimelineCharts/index.mjs","sources":["../../../../src/components/Charts/TimelineCharts/index.tsx"],"sourcesContent":["import React, { useState, useEffect, memo } from 'react';\nimport ReactEChartsCore from 'echarts-for-react/esm/core';\nimport * as echarts from 'echarts/core';\nimport { CustomChart } from 'echarts/charts';\nimport {\n TooltipComponent,\n GridComponent,\n DataZoomComponent,\n} from 'echarts/components';\nimport { CanvasRenderer } from 'echarts/renderers';\n\nimport dayjs from 'dayjs';\nimport { ChartProps, DurationMetric, ITraceEventData } from '../types';\nimport { groupBy } from 'es-toolkit/compat';\nimport { ChartTypes, PALETTE_COLORS } from '../constants';\n\ninterface CoordSysType {\n x: number;\n y: number;\n width: number;\n height: number;\n}\ntype LoaderType = {\n name: string;\n value: number[];\n itemStyle: { normal: { color: string; opacity?: number } };\n ext?: Record<string, any>;\n};\n\nconst LINE_HEIGHT = 60;\n\nexport const TimelineCom: React.FC<{\n loaderData?: DurationMetric[];\n pluginsData?: ITraceEventData[];\n formatterFn: Function;\n chartType?: ChartTypes;\n exts?: { endTimestamp: number; startTimestamp: number };\n}> = memo(\n ({\n loaderData,\n pluginsData,\n formatterFn,\n chartType = ChartTypes.Normal,\n exts = null,\n }) => {\n const data: LoaderType[] = [];\n let categories: string[] = [];\n const [optionsData, setOptionsData] = useState({});\n\n // Register the required components\n echarts.use([\n CustomChart,\n TooltipComponent,\n GridComponent,\n DataZoomComponent,\n CanvasRenderer,\n ]);\n\n useEffect(() => {\n if (!loaderData) return;\n const _categories: string[] = [];\n loaderData.forEach((_l) => {\n _categories.unshift(_l.n + ' total');\n _categories.unshift(_l.n);\n });\n\n // Generate mock data\n loaderData.forEach(function (_loaderData, _i) {\n data.push({\n name: _loaderData.n + ' total',\n value: [\n _categories.indexOf(_loaderData.n + ' total'),\n _loaderData.s,\n _loaderData.e,\n _loaderData.e - _loaderData.s,\n ],\n itemStyle: {\n normal: {\n color: PALETTE_COLORS[Math.floor(Math.random() * 27)],\n opacity: 0.25,\n },\n },\n });\n\n if (!_loaderData?.c) return;\n for (let l = 0; l < _loaderData?.c?.length; l++) {\n data.push({\n name: _loaderData.n,\n value: [\n _categories.indexOf(_loaderData.n),\n _loaderData.c[l].s,\n _loaderData.c[l].e,\n _loaderData.c[l].e - _loaderData.c[l].s,\n ],\n itemStyle: {\n normal: {\n color: PALETTE_COLORS[Math.floor(Math.random() * 27)],\n opacity: 0.25,\n },\n },\n ext: _loaderData.c[l].ext as ChartProps['loaders'][0],\n });\n }\n });\n\n categories = _categories.map((val, i) => {\n if (i % 2 !== 0) {\n return val.replace(' total', '');\n } else {\n return '';\n }\n });\n }, [loaderData]);\n\n useEffect(() => {\n if (!pluginsData) return;\n\n const _pluginsData = groupBy(pluginsData, (e: ITraceEventData) => e.pid);\n\n Object.keys(_pluginsData)\n .reverse()\n .forEach(function (key, i) {\n _pluginsData[key].forEach((_plugin, _i) => {\n data.push({\n name: String(_plugin.pid),\n value: [\n i,\n _plugin.args.s,\n _plugin.args.e,\n _plugin.args.e - _plugin.args.s,\n ],\n itemStyle: {\n normal: {\n color: PALETTE_COLORS[Math.floor(Math.random() * 27)],\n opacity: 0.25,\n },\n },\n ext: _plugin,\n });\n });\n categories.push(String(key.charAt(0).toUpperCase() + key.slice(1)));\n });\n }, [pluginsData]);\n\n useEffect(() => {\n function renderItem(\n params: { coordSys: CoordSysType },\n api: {\n value: (arg0: number) => number;\n coord: (arg0: number[]) => any;\n size: (arg0: number[]) => number[];\n style: () => string;\n },\n ) {\n const categoryIndex = api.value(0);\n const start = api.coord([api.value(1), categoryIndex]);\n const end = api.coord([api.value(2), categoryIndex]);\n const height = api.size([0, 1])[1] * 0.3;\n\n const rectShape = echarts.graphic.clipRectByRect(\n {\n x: start[0],\n y:\n chartType === ChartTypes.Loader\n ? start[1] - (categoryIndex % 2 !== 0 ? 0 : height * 2)\n : start[1],\n width: end[0] - start[0] || 5,\n height: height,\n },\n {\n x: params.coordSys.x,\n y: params.coordSys.y,\n width: params.coordSys.width,\n height: params.coordSys.height,\n },\n );\n return (\n rectShape && {\n type: 'rect',\n transition: ['shape'],\n shape: rectShape,\n style: api.style(),\n enterFrom: {\n style: { opacity: 0 },\n x: 0,\n },\n }\n );\n }\n\n const option = {\n tooltip: {\n formatter: (raw: any) => {\n return formatterFn(raw);\n },\n },\n dataZoom: [\n {\n type: 'slider',\n filterMode: 'weakFilter',\n showDataShadow: false,\n top: -10,\n },\n {\n type: 'inside',\n filterMode: 'weakFilter',\n },\n ],\n grid: {\n top: 10,\n left: 0,\n bottom: 10,\n right: 0,\n height:\n categories.length > (chartType === ChartTypes.Loader ? 6 : 3)\n ? 'auto'\n : categories.length * LINE_HEIGHT,\n containLabel: true,\n },\n xAxis: {\n interval:\n exts?.endTimestamp && exts?.startTimestamp\n ? Math.floor((exts.endTimestamp - exts.startTimestamp) / 8)\n : null,\n position: 'top',\n splitLine: {\n show: true,\n },\n scale: true,\n axisLine: {\n show: false,\n },\n axisLabel: {\n formatter(val: number) {\n return dayjs(val as number).format('HH:mm:ss:SSS');\n },\n },\n },\n yAxis: {\n type: 'category',\n splitLine: {\n show: false,\n },\n axisLabel: {\n inside: true,\n lineHeight: 20,\n width: 100,\n fontSize: 12,\n color: '#000',\n verticalAlign: 'bottom',\n },\n axisLine: {\n show: false,\n },\n axisTick: {\n show: false,\n },\n data: categories,\n },\n series: [\n {\n type: 'custom',\n renderItem,\n itemStyle: {\n opacity: 0.8,\n },\n encode: {\n x: [1, 2],\n y: 0,\n },\n data,\n },\n ],\n };\n setOptionsData(option);\n }, [loaderData, pluginsData, exts]);\n\n return (\n <ReactEChartsCore\n option={optionsData}\n echarts={echarts}\n style={{\n width: '100%',\n minHeight:\n chartType === ChartTypes.Loader\n ? '500px'\n : chartType === ChartTypes.Minify\n ? '100px'\n : '200px',\n maxHeight: chartType === ChartTypes.Minify ? '100px' : '1000px',\n border: '1px solid #eee',\n borderRadius: '10px',\n }}\n />\n );\n },\n);\n"],"names":["LINE_HEIGHT","TimelineCom","memo","loaderData","pluginsData","formatterFn","chartType","ChartTypes","exts","data","categories","optionsData","setOptionsData","useState","echarts","CustomChart","TooltipComponent","GridComponent","DataZoomComponent","CanvasRenderer","useEffect","_categories","_l","_loaderData","_i","PALETTE_COLORS","Math","l","val","i","_pluginsData","groupBy","e","Object","key","_plugin","String","renderItem","params","api","categoryIndex","start","end","height","rectShape","option","raw","dayjs","ReactEChartsCore"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"components/Charts/TimelineCharts/index.mjs","sources":["../../../../src/components/Charts/TimelineCharts/index.tsx"],"sourcesContent":["import React, { useState, useEffect, memo } from 'react';\nimport ReactEChartsCore from 'echarts-for-react/esm/core';\nimport * as echarts from 'echarts/core';\nimport { CustomChart } from 'echarts/charts';\nimport {\n TooltipComponent,\n GridComponent,\n DataZoomComponent,\n} from 'echarts/components';\nimport { CanvasRenderer } from 'echarts/renderers';\n\nimport dayjs from 'dayjs';\nimport { ChartProps, DurationMetric, ITraceEventData } from '../types';\nimport { groupBy } from 'es-toolkit/compat';\nimport { ChartTypes, PALETTE_COLORS } from '../constants';\n\ninterface CoordSysType {\n x: number;\n y: number;\n width: number;\n height: number;\n}\ntype LoaderType = {\n name: string;\n value: number[];\n itemStyle: { normal: { color: string; opacity?: number } };\n ext?: Record<string, any>;\n};\n\nconst LINE_HEIGHT = 60;\n\nexport const TimelineCom: React.FC<{\n loaderData?: DurationMetric[];\n pluginsData?: ITraceEventData[];\n formatterFn: Function;\n chartType?: ChartTypes;\n exts?: { endTimestamp: number; startTimestamp: number };\n}> = memo(\n ({\n loaderData,\n pluginsData,\n formatterFn,\n chartType = ChartTypes.Normal,\n exts = null,\n }) => {\n const data: LoaderType[] = [];\n let categories: string[] = [];\n const [optionsData, setOptionsData] = useState({});\n\n // Register the required components\n echarts.use([\n CustomChart,\n TooltipComponent,\n GridComponent,\n DataZoomComponent,\n CanvasRenderer,\n ]);\n\n useEffect(() => {\n if (!loaderData) return;\n const _categories: string[] = [];\n loaderData.forEach((_l) => {\n _categories.unshift(_l.n + ' total');\n _categories.unshift(_l.n);\n });\n\n // Generate mock data\n loaderData.forEach(function (_loaderData, _i) {\n data.push({\n name: _loaderData.n + ' total',\n value: [\n _categories.indexOf(_loaderData.n + ' total'),\n _loaderData.s,\n _loaderData.e,\n _loaderData.e - _loaderData.s,\n ],\n itemStyle: {\n normal: {\n color: PALETTE_COLORS[Math.floor(Math.random() * 27)],\n opacity: 0.25,\n },\n },\n });\n\n if (!_loaderData?.c) return;\n for (let l = 0; l < _loaderData?.c?.length; l++) {\n data.push({\n name: _loaderData.n,\n value: [\n _categories.indexOf(_loaderData.n),\n _loaderData.c[l].s,\n _loaderData.c[l].e,\n _loaderData.c[l].e - _loaderData.c[l].s,\n ],\n itemStyle: {\n normal: {\n color: PALETTE_COLORS[Math.floor(Math.random() * 27)],\n opacity: 0.25,\n },\n },\n ext: _loaderData.c[l].ext as ChartProps['loaders'][0],\n });\n }\n });\n\n categories = _categories.map((val, i) => {\n if (i % 2 !== 0) {\n return val.replace(' total', '');\n } else {\n return '';\n }\n });\n }, [loaderData]);\n\n useEffect(() => {\n if (!pluginsData) return;\n\n const _pluginsData = groupBy(pluginsData, (e: ITraceEventData) => e.pid);\n\n Object.keys(_pluginsData)\n .reverse()\n .forEach(function (key, i) {\n _pluginsData[key].forEach((_plugin, _i) => {\n data.push({\n name: String(_plugin.pid),\n value: [\n i,\n _plugin.args.s,\n _plugin.args.e,\n _plugin.args.e - _plugin.args.s,\n ],\n itemStyle: {\n normal: {\n color: PALETTE_COLORS[Math.floor(Math.random() * 27)],\n opacity: 0.25,\n },\n },\n ext: _plugin,\n });\n });\n categories.push(String(key.charAt(0).toUpperCase() + key.slice(1)));\n });\n }, [pluginsData]);\n\n useEffect(() => {\n function renderItem(\n params: { coordSys: CoordSysType },\n api: {\n value: (arg0: number) => number;\n coord: (arg0: number[]) => any;\n size: (arg0: number[]) => number[];\n style: () => string;\n },\n ) {\n const categoryIndex = api.value(0);\n const start = api.coord([api.value(1), categoryIndex]);\n const end = api.coord([api.value(2), categoryIndex]);\n const height = api.size([0, 1])[1] * 0.3;\n\n const rectShape = echarts.graphic.clipRectByRect(\n {\n x: start[0],\n y:\n chartType === ChartTypes.Loader\n ? start[1] - (categoryIndex % 2 !== 0 ? 0 : height * 2)\n : start[1],\n width: end[0] - start[0] || 5,\n height: height,\n },\n {\n x: params.coordSys.x,\n y: params.coordSys.y,\n width: params.coordSys.width,\n height: params.coordSys.height,\n },\n );\n return (\n rectShape && {\n type: 'rect',\n transition: ['shape'],\n shape: rectShape,\n style: api.style(),\n enterFrom: {\n style: { opacity: 0 },\n x: 0,\n },\n }\n );\n }\n\n const option = {\n tooltip: {\n formatter: (raw: any) => {\n return formatterFn(raw);\n },\n },\n dataZoom: [\n {\n type: 'slider',\n filterMode: 'weakFilter',\n showDataShadow: false,\n top: -10,\n },\n {\n type: 'inside',\n filterMode: 'weakFilter',\n },\n ],\n grid: {\n top: 10,\n left: 0,\n bottom: 10,\n right: 0,\n height:\n categories.length > (chartType === ChartTypes.Loader ? 6 : 3)\n ? 'auto'\n : categories.length * LINE_HEIGHT,\n containLabel: true,\n },\n xAxis: {\n interval:\n exts?.endTimestamp && exts?.startTimestamp\n ? Math.floor((exts.endTimestamp - exts.startTimestamp) / 8)\n : null,\n position: 'top',\n splitLine: {\n show: true,\n },\n scale: true,\n axisLine: {\n show: false,\n },\n axisLabel: {\n formatter(val: number) {\n return dayjs(val as number).format('HH:mm:ss:SSS');\n },\n },\n },\n yAxis: {\n type: 'category',\n splitLine: {\n show: false,\n },\n axisLabel: {\n inside: true,\n lineHeight: 20,\n width: 100,\n fontSize: 12,\n color: '#000',\n verticalAlign: 'bottom',\n },\n axisLine: {\n show: false,\n },\n axisTick: {\n show: false,\n },\n data: categories,\n },\n series: [\n {\n type: 'custom',\n renderItem,\n itemStyle: {\n opacity: 0.8,\n },\n encode: {\n x: [1, 2],\n y: 0,\n },\n data,\n },\n ],\n };\n setOptionsData(option);\n }, [loaderData, pluginsData, exts]);\n\n return (\n <ReactEChartsCore\n option={optionsData}\n echarts={echarts}\n style={{\n width: '100%',\n minHeight:\n chartType === ChartTypes.Loader\n ? '500px'\n : chartType === ChartTypes.Minify\n ? '100px'\n : '200px',\n maxHeight: chartType === ChartTypes.Minify ? '100px' : '1000px',\n border: '1px solid #eee',\n borderRadius: '10px',\n }}\n />\n );\n },\n);\n"],"names":["LINE_HEIGHT","TimelineCom","memo","loaderData","pluginsData","formatterFn","chartType","ChartTypes","exts","data","categories","optionsData","setOptionsData","useState","echarts","CustomChart","TooltipComponent","GridComponent","DataZoomComponent","CanvasRenderer","useEffect","_categories","_l","_loaderData","_i","PALETTE_COLORS","Math","l","val","i","_pluginsData","groupBy","e","Object","key","_plugin","String","renderItem","params","api","categoryIndex","start","end","height","rectShape","option","raw","dayjs","ReactEChartsCore"],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import react, { memo, useCallback, useEffect, useMemo, useState } from "react";
|
|
3
3
|
import core from "echarts-for-react/esm/core";
|
|
4
|
+
import * as __rspack_external_echarts_core_d2845954 from "echarts/core";
|
|
4
5
|
import { TreemapChart } from "echarts/charts";
|
|
5
6
|
import { TitleComponent, TooltipComponent } from "echarts/components";
|
|
6
7
|
import { CanvasRenderer } from "echarts/renderers";
|
|
@@ -12,7 +13,6 @@ import { ServerAPIProvider } from "../Manifest/index.mjs";
|
|
|
12
13
|
import { ModuleAnalyzeComponent } from "../../pages/ModuleAnalyze/index.mjs";
|
|
13
14
|
import treemap_module from "./treemap.module.mjs";
|
|
14
15
|
import { TREE_COLORS } from "./constants.mjs";
|
|
15
|
-
import * as __rspack_external_echarts_core_d2845954 from "echarts/core";
|
|
16
16
|
__rspack_external_echarts_core_d2845954.use([
|
|
17
17
|
TreemapChart,
|
|
18
18
|
TooltipComponent,
|
|
@@ -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, type TreemapSeriesOption } from 'echarts/charts';\nimport {\n TooltipComponent,\n TitleComponent,\n type TooltipComponentOption,\n type TitleComponentOption,\n} from 'echarts/components';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { Alert, Checkbox, Radio, Input } from 'antd';\nimport {\n LeftOutlined,\n RightOutlined,\n SearchOutlined,\n FullscreenOutlined,\n FullscreenExitOutlined,\n} from '@ant-design/icons';\nimport type { ComposeOption, EChartsType } from 'echarts/core';\nimport { formatSize } from 'src/utils';\nimport { SDK } from '@rsdoctor/types';\nimport { ServerAPIProvider } from 'src/components/Manifest';\nimport { ModuleAnalyzeComponent } from '../../pages/ModuleAnalyze';\nimport Styles from './treemap.module.scss';\nimport { TREE_COLORS } from './constants';\nimport type {\n CallbackDataParams,\n ECElementEvent,\n} from 'echarts/types/dist/shared';\n\ntype TreeMapOption = ComposeOption<\n TreemapSeriesOption | TooltipComponentOption | TitleComponentOption\n>;\n\ntype TreemapDataNode = NonNullable<TreemapSeriesOption['data']>[number] & {\n path?: string;\n sourceSize?: number;\n bundledSize?: number;\n gzipSize?: number;\n moduleId?: string | number;\n};\n\necharts.use([TreemapChart, TooltipComponent, TitleComponent, 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 id?: string | 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: ECElementEvent) => 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 getLuminance(hex: string): number {\n const r = parseInt(hex.slice(1, 3), 16) / 255;\n const g = parseInt(hex.slice(3, 5), 16) / 255;\n const b = parseInt(hex.slice(5, 7), 16) / 255;\n\n const [rs, gs, bs] = [r, g, b].map((val) => {\n return val <= 0.03928 ? val / 12.92 : Math.pow((val + 0.055) / 1.055, 2.4);\n });\n\n return 0.2126 * rs + 0.7152 * gs + 0.0722 * bs;\n}\n\nfunction isDarkColor(hex: string): boolean {\n return getLuminance(hex) < 0.4;\n}\n\nfunction getLevelOption() {\n return [\n {\n itemStyle: {\n borderWidth: 0,\n gapWidth: 4,\n gapColor: '#ffffff',\n },\n },\n {\n itemStyle: {\n borderColorAlpha: [1, 0.3],\n borderWidth: 5,\n gapWidth: 4,\n gapColor: '#ffffff',\n },\n upperLabel: {\n show: true,\n color: '#ffffff',\n fontSize: 12,\n height: 30,\n },\n },\n ];\n}\n\nexport const TreeMap: React.FC<TreeMapProps> = memo(\n ({\n treeData,\n sizeType,\n style,\n onChartClick,\n highlightNodeId,\n centerNodeId,\n rootPath,\n }) => {\n const [option, setOption] = useState<TreeMapOption | null>(null);\n const chartRef = React.useRef<EChartsReactCore | null>(null);\n const chartDataRef = React.useRef<TreemapDataNode[]>([]);\n const clickTimeoutRef = React.useRef<number | null>(null);\n\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 chunkPath?: string,\n ): TreemapDataNode {\n const baseColor =\n parentColor || TREE_COLORS[index % TREE_COLORS.length];\n\n // For level 0 (chunk level), use the chunk's path/name as chunkPath\n const currentChunkPath =\n level === 0 ? node.path || node.name || '' : chunkPath || '';\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 currentChunkPath,\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 // Include chunk path in nodeId for non-root nodes to ensure uniqueness across chunks\n const nodeIdString =\n level === 0\n ? node.path || node.name || ''\n : `${currentChunkPath}::${node.path || node.name || ''}`;\n const nodeId = hashString(nodeIdString);\n const isHighlighted = highlightNodeId === nodeId;\n\n const baseColorRatio =\n level === 0 ? 1 : Math.max(0.35, 1 - level * 0.15);\n const baseBorderRatio =\n level === 0 ? 1 : Math.max(0.4, 1 - level * 0.15);\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 isDark = isDarkColor(nodeColor);\n const textColor = isDark ? '#ffffff' : '#000000';\n const textBorderColor = isDark\n ? 'rgba(255, 255, 255, 0.2)'\n : 'rgba(0, 0, 0, 0.1)';\n\n const result: TreemapDataNode = {\n id: nodeId,\n name: node.name,\n value: val,\n path: node.path || node.name,\n sourceSize:\n node.sourceSize ?? (sizeType === 'stat' ? val : undefined),\n bundledSize:\n node.bundledSize ?? (sizeType === 'parsed' ? val : undefined),\n gzipSize: node.gzipSize ?? (sizeType === 'gzip' ? val : undefined),\n moduleId: node.id,\n itemStyle: {\n borderWidth: isHighlighted ? 4 : 1,\n color: nodeColor,\n borderColor: nodeBorderColor,\n ...(level === 0 && { gapWidth: 2 }),\n },\n label: {\n show: true,\n color: textColor,\n textBorderColor: textBorderColor,\n textBorderWidth: 1,\n },\n upperLabel:\n level === 0\n ? undefined\n : {\n show: true,\n color: textColor,\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 } else {\n // Keep the same color on hover/click to prevent color change\n result.emphasis = {\n itemStyle: {\n color: nodeColor,\n borderColor: nodeBorderColor,\n borderWidth: isHighlighted ? 4 : 1,\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, undefined),\n )\n .filter(\n (item) =>\n (typeof item.value === 'number' ? item.value > 0 : false) ||\n (item.children && item.children.length > 0),\n );\n\n chartDataRef.current = data;\n\n setOption({\n color: TREE_COLORS,\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 (pos, _params, _dom, _rect, size) {\n const obj: { top: number; left?: number; right?: number } = {\n top: pos[1] + 10,\n };\n if (pos[0] < size.viewSize[0] / 2) {\n obj.left = pos[0] + 10;\n } else {\n obj.right = size.viewSize[0] - pos[0] + 10;\n }\n return obj;\n } as TooltipComponentOption['position'],\n formatter: function (\n info: CallbackDataParams & { data?: TreemapDataNode },\n ) {\n const node = info.data || {};\n let path =\n typeof node.path === 'string'\n ? node.path\n : typeof node.name === 'string'\n ? node.name\n : String(node.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 =\n typeof node.sourceSize === 'number' && node.sourceSize > 0\n ? node.sourceSize\n : typeof node.value === 'number' &&\n node.value > 0 &&\n sizeType === 'stat'\n ? node.value\n : undefined;\n const bundledSize =\n typeof node.bundledSize === 'number' && node.bundledSize > 0\n ? node.bundledSize\n : undefined;\n const gzipSize =\n typeof node.gzipSize === 'number' && node.gzipSize > 0\n ? node.gzipSize\n : undefined;\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 && sourceSize > 0) {\n rows.push(\n makeRow('Stat size', formatSize(sourceSize), '#52c41a'),\n );\n }\n if (bundledSize !== undefined && bundledSize > 0) {\n rows.push(\n makeRow('Parsed size', formatSize(bundledSize), '#d96420'),\n );\n }\n if (gzipSize !== undefined && gzipSize > 0) {\n rows.push(\n makeRow('Gzipped size', formatSize(gzipSize), '#1677ff'),\n );\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 } as TooltipComponentOption,\n series: [\n {\n type: 'treemap',\n itemStyle: {\n gapColor: '#ffffff',\n },\n label: {\n show: true,\n formatter: '{b}',\n fontSize: 12,\n position: 'inside',\n fontWeight: 'normal',\n textBorderWidth: 1,\n padding: [4, 8, 4, 8],\n },\n upperLabel: {\n show: true,\n height: 30,\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.7,\n animationDurationUpdate: 500,\n width: '100%',\n height: '100%',\n top: -10,\n bottom: 30,\n left: 0,\n right: 0,\n zoomLimit: {\n min: 0.5,\n max: 5,\n },\n } as TreemapSeriesOption,\n ],\n });\n }, [treeData, sizeType, highlightNodeId, rootPath]);\n\n useEffect(() => {\n if (centerNodeId && chartRef.current && option) {\n const chartInstance =\n chartRef.current.getEchartsInstance() as unknown as EChartsType;\n if (chartInstance) {\n const findNodeInfo = (\n data: TreemapDataNode[],\n targetId: number,\n path: string[] = [],\n ): { name: string; path: string[] } | null => {\n for (const item of data) {\n const itemName =\n typeof item.name === 'string'\n ? item.name\n : String(item.name ?? '');\n const currentPath = [...path, itemName];\n if (item.id === targetId) {\n return { name: itemName, 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 const nodeName = nodeInfo.name;\n\n try {\n chartInstance.dispatchAction({\n type: 'highlight',\n seriesIndex: 0,\n name: nodeName,\n });\n } catch (e) {\n console.error('Failed to highlight node with name:', nodeName, e);\n }\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: nodeName,\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 useEffect(() => {\n return () => {\n if (clickTimeoutRef.current) {\n window.clearTimeout(clickTimeoutRef.current);\n }\n };\n }, []);\n\n return option ? (\n <div className={Styles['chart-container']} style={style}>\n <Alert\n message=\"If parsed size lacks detailed module information, you can enable sourceMap when RSDOCTOR = true. This is because Rsdoctor relies on SourceMap to obtain Parsed Size. Rspack provides SourceMap information to Rsdoctor by default without affecting the build output.\"\n type=\"info\"\n showIcon\n style={{ marginBottom: 0 }}\n />\n <EChartsReactCore\n ref={chartRef}\n option={option}\n echarts={echarts}\n onEvents={{\n click: (params: ECElementEvent) => {\n // Delay to differentiate from double-click; only zoom on single click\n if (clickTimeoutRef.current) {\n window.clearTimeout(clickTimeoutRef.current);\n }\n clickTimeoutRef.current = window.setTimeout(() => {\n if (chartRef.current) {\n const instance =\n chartRef.current.getEchartsInstance() as unknown as EChartsType;\n const data = params?.data as TreemapDataNode | undefined;\n if (instance && data?.id !== undefined) {\n instance.dispatchAction({\n type: 'treemapZoomToNode',\n seriesIndex: 0,\n targetNodeId: String(data.id),\n });\n }\n }\n }, 180);\n },\n dblclick: (params: ECElementEvent) => {\n // Double click: cancel pending single-click action and trigger analyze\n if (clickTimeoutRef.current) {\n window.clearTimeout(clickTimeoutRef.current);\n clickTimeoutRef.current = null;\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 AssetTreemapWithFilter: React.FC<{\n treeData: TreeNode[];\n onChartClick?: (params: ECElementEvent) => 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: ECElementEvent) => 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 const [moduleId, setModuleId] = useState<string | number>('');\n const [showAnalyze, setShowAnalyze] = useState(false);\n const [chunkSearchQuery, setChunkSearchQuery] = useState('');\n\n const containerRef = React.useRef<HTMLDivElement>(null);\n\n const handleChartClick = useCallback(\n (params: ECElementEvent) => {\n onChartClick?.(params);\n const data = params.data as TreemapDataNode | undefined;\n const moduleId = data?.moduleId;\n if (moduleId !== undefined) {\n setModuleId(moduleId);\n setShowAnalyze(true);\n }\n },\n [onChartClick],\n );\n\n const enterFullscreen = useCallback(() => {\n if (containerRef.current) {\n const el = containerRef.current as HTMLElement & {\n webkitRequestFullscreen?: () => void;\n mozRequestFullScreen?: () => void;\n msRequestFullscreen?: () => void;\n };\n if (el.requestFullscreen) {\n el.requestFullscreen()\n .then(() => setIsFullscreen(true))\n .catch((err: unknown) =>\n console.error('Failed to enter fullscreen:', err),\n );\n } else if (el.webkitRequestFullscreen) {\n try {\n el.webkitRequestFullscreen();\n setIsFullscreen(true);\n } catch (err) {\n console.error('Failed to enter fullscreen (webkit):', err);\n }\n } else if (el.mozRequestFullScreen) {\n try {\n el.mozRequestFullScreen();\n setIsFullscreen(true);\n } catch (err) {\n console.error('Failed to enter fullscreen (moz):', err);\n }\n } else if (el.msRequestFullscreen) {\n try {\n el.msRequestFullscreen();\n setIsFullscreen(true);\n } catch (err) {\n console.error('Failed to enter fullscreen (ms):', err);\n }\n } else {\n console.error('Fullscreen API is not supported in this browser.');\n }\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 filteredTreeData = useMemo(() => {\n let filtered = treeData.filter((item) => checkedAssets.includes(item.name));\n\n if (chunkSearchQuery.trim()) {\n const searchLower = chunkSearchQuery.toLowerCase();\n filtered = filtered.filter((item) =>\n item.name.toLowerCase().includes(searchLower),\n );\n }\n\n return filtered;\n }, [treeData, checkedAssets, chunkSearchQuery]);\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, chunkPath?: string) => {\n // For chunk level (root of filteredTreeData), use its path/name as chunkPath\n const currentChunkPath = chunkPath || node.path || node.name || '';\n\n if (node.path && regex.test(node.path)) {\n // Use the same nodeId calculation as in convert function\n const nodeIdString = chunkPath\n ? `${chunkPath}::${node.path}`\n : node.path;\n const nodeId = hashString(nodeIdString);\n results.push({ path: node.path, nodeId });\n }\n if (node.children) {\n node.children.forEach((child) =>\n collectMatchingPaths(child, currentChunkPath),\n );\n }\n };\n\n filteredTreeData.forEach((chunk) => collectMatchingPaths(chunk));\n return results;\n }, [filteredTreeData, searchQuery]);\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>Show chunks</h4>\n <Input\n placeholder=\"Search chunks\"\n value={chunkSearchQuery}\n onChange={(e) => setChunkSearchQuery(e.target.value)}\n suffix={<SearchOutlined style={{ color: '#ccc' }} />}\n allowClear\n size=\"small\"\n style={{ marginBottom: 8 }}\n />\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\n className={Styles['chunk-list']}\n style={{ maxHeight: 180, overflowY: 'auto' }}\n >\n {assetNames\n .filter((name) =>\n name.toLowerCase().includes(chunkSearchQuery.toLowerCase()),\n )\n .map((name) => (\n <div\n key={name}\n className={Styles['chunk-item']}\n style={{ height: 15, lineHeight: '15px' }}\n >\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\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 </div>\n </div>\n\n <div className={Styles['chart-wrapper']}>\n <TreeMap\n treeData={filteredTreeData}\n sizeType={sizeType}\n onChartClick={handleChartClick}\n highlightNodeId={highlightNodeId}\n centerNodeId={centerNodeId}\n rootPath={rootPath}\n style={{ width: '100%', height: '100%' }}\n />\n {moduleId ? (\n <ServerAPIProvider\n api={SDK.ServerAPI.API.GetAllModuleGraph}\n body={{}}\n >\n {(modules) => (\n <ModuleAnalyzeComponent\n cwd={rootPath}\n moduleId={moduleId}\n modules={modules}\n show={showAnalyze}\n setShow={setShowAnalyze}\n />\n )}\n </ServerAPIProvider>\n ) : null}\n </div>\n </div>\n );\n};\n"],"names":["echarts","TreemapChart","TooltipComponent","TitleComponent","CanvasRenderer","hashString","str","hash","i","blendWithWhite","hex","ratio","r","parseInt","g","b","blendedR","Math","blendedG","blendedB","getLuminance","rs","gs","bs","val","isDarkColor","getLevelOption","TreeMap","memo","treeData","sizeType","style","onChartClick","highlightNodeId","centerNodeId","rootPath","option","setOption","useState","chartRef","React","chartDataRef","clickTimeoutRef","useEffect","convert","node","index","level","parentColor","siblingIndex","siblingCount","chunkPath","baseColor","TREE_COLORS","currentChunkPath","children","c","childIndex","nodeIdString","nodeId","isHighlighted","baseColorRatio","baseBorderRatio","siblingGradientRange","siblingRatio","colorRatio","borderRatio","nodeColor","nodeBorderColor","isDark","textColor","textBorderColor","result","undefined","data","item","pos","_params","_dom","_rect","size","obj","info","path","String","normalizedRoot","normalizedPath","sourceSize","bundledSize","gzipSize","makeRow","label","value","color","Styles","rows","formatSize","chartInstance","findNodeInfo","targetId","itemName","currentPath","found","setTimeout","nodeInfo","nodeName","e","console","zoomStrategies","strategy","window","Alert","EChartsReactCore","params","instance","AssetTreemapWithFilter","ServerAPIProvider","SDK","projectInfo","AssetTreemapWithFilterInner","assetNames","useMemo","checkedAssets","setCheckedAssets","collapsed","setCollapsed","setSizeType","searchQuery","setSearchQuery","isFullscreen","setIsFullscreen","setHighlightNodeId","setCenterNodeId","moduleId","setModuleId","showAnalyze","setShowAnalyze","chunkSearchQuery","setChunkSearchQuery","containerRef","handleChartClick","useCallback","enterFullscreen","el","err","exitFullscreen","document","toggleFullscreen","handleFullscreenChange","filteredTreeData","filtered","searchLower","searchResults","regex","RegExp","results","collectMatchingPaths","child","chunk","handleSearchResultClick","removeRootPath","filepath","getSize","type","calculateNodeTotalSize","childrenSize","sum","getChunkSize","name","n","sizeTypeToUse","FullscreenExitOutlined","FullscreenOutlined","RightOutlined","LeftOutlined","Radio","Input","SearchOutlined","Checkbox","a","displayPath","modules","ModuleAnalyzeComponent"],"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, type TreemapSeriesOption } from 'echarts/charts';\nimport {\n TooltipComponent,\n TitleComponent,\n type TooltipComponentOption,\n type TitleComponentOption,\n} from 'echarts/components';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { Alert, Checkbox, Radio, Input } from 'antd';\nimport {\n LeftOutlined,\n RightOutlined,\n SearchOutlined,\n FullscreenOutlined,\n FullscreenExitOutlined,\n} from '@ant-design/icons';\nimport type { ComposeOption, EChartsType } from 'echarts/core';\nimport { formatSize } from 'src/utils';\nimport { SDK } from '@rsdoctor/types';\nimport { ServerAPIProvider } from 'src/components/Manifest';\nimport { ModuleAnalyzeComponent } from '../../pages/ModuleAnalyze';\nimport Styles from './treemap.module.scss';\nimport { TREE_COLORS } from './constants';\nimport type {\n CallbackDataParams,\n ECElementEvent,\n} from 'echarts/types/dist/shared';\n\ntype TreeMapOption = ComposeOption<\n TreemapSeriesOption | TooltipComponentOption | TitleComponentOption\n>;\n\ntype TreemapDataNode = NonNullable<TreemapSeriesOption['data']>[number] & {\n path?: string;\n sourceSize?: number;\n bundledSize?: number;\n gzipSize?: number;\n moduleId?: string | number;\n};\n\necharts.use([TreemapChart, TooltipComponent, TitleComponent, 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 id?: string | 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: ECElementEvent) => 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 getLuminance(hex: string): number {\n const r = parseInt(hex.slice(1, 3), 16) / 255;\n const g = parseInt(hex.slice(3, 5), 16) / 255;\n const b = parseInt(hex.slice(5, 7), 16) / 255;\n\n const [rs, gs, bs] = [r, g, b].map((val) => {\n return val <= 0.03928 ? val / 12.92 : Math.pow((val + 0.055) / 1.055, 2.4);\n });\n\n return 0.2126 * rs + 0.7152 * gs + 0.0722 * bs;\n}\n\nfunction isDarkColor(hex: string): boolean {\n return getLuminance(hex) < 0.4;\n}\n\nfunction getLevelOption() {\n return [\n {\n itemStyle: {\n borderWidth: 0,\n gapWidth: 4,\n gapColor: '#ffffff',\n },\n },\n {\n itemStyle: {\n borderColorAlpha: [1, 0.3],\n borderWidth: 5,\n gapWidth: 4,\n gapColor: '#ffffff',\n },\n upperLabel: {\n show: true,\n color: '#ffffff',\n fontSize: 12,\n height: 30,\n },\n },\n ];\n}\n\nexport const TreeMap: React.FC<TreeMapProps> = memo(\n ({\n treeData,\n sizeType,\n style,\n onChartClick,\n highlightNodeId,\n centerNodeId,\n rootPath,\n }) => {\n const [option, setOption] = useState<TreeMapOption | null>(null);\n const chartRef = React.useRef<EChartsReactCore | null>(null);\n const chartDataRef = React.useRef<TreemapDataNode[]>([]);\n const clickTimeoutRef = React.useRef<number | null>(null);\n\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 chunkPath?: string,\n ): TreemapDataNode {\n const baseColor =\n parentColor || TREE_COLORS[index % TREE_COLORS.length];\n\n // For level 0 (chunk level), use the chunk's path/name as chunkPath\n const currentChunkPath =\n level === 0 ? node.path || node.name || '' : chunkPath || '';\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 currentChunkPath,\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 // Include chunk path in nodeId for non-root nodes to ensure uniqueness across chunks\n const nodeIdString =\n level === 0\n ? node.path || node.name || ''\n : `${currentChunkPath}::${node.path || node.name || ''}`;\n const nodeId = hashString(nodeIdString);\n const isHighlighted = highlightNodeId === nodeId;\n\n const baseColorRatio =\n level === 0 ? 1 : Math.max(0.35, 1 - level * 0.15);\n const baseBorderRatio =\n level === 0 ? 1 : Math.max(0.4, 1 - level * 0.15);\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 isDark = isDarkColor(nodeColor);\n const textColor = isDark ? '#ffffff' : '#000000';\n const textBorderColor = isDark\n ? 'rgba(255, 255, 255, 0.2)'\n : 'rgba(0, 0, 0, 0.1)';\n\n const result: TreemapDataNode = {\n id: nodeId,\n name: node.name,\n value: val,\n path: node.path || node.name,\n sourceSize:\n node.sourceSize ?? (sizeType === 'stat' ? val : undefined),\n bundledSize:\n node.bundledSize ?? (sizeType === 'parsed' ? val : undefined),\n gzipSize: node.gzipSize ?? (sizeType === 'gzip' ? val : undefined),\n moduleId: node.id,\n itemStyle: {\n borderWidth: isHighlighted ? 4 : 1,\n color: nodeColor,\n borderColor: nodeBorderColor,\n ...(level === 0 && { gapWidth: 2 }),\n },\n label: {\n show: true,\n color: textColor,\n textBorderColor: textBorderColor,\n textBorderWidth: 1,\n },\n upperLabel:\n level === 0\n ? undefined\n : {\n show: true,\n color: textColor,\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 } else {\n // Keep the same color on hover/click to prevent color change\n result.emphasis = {\n itemStyle: {\n color: nodeColor,\n borderColor: nodeBorderColor,\n borderWidth: isHighlighted ? 4 : 1,\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, undefined),\n )\n .filter(\n (item) =>\n (typeof item.value === 'number' ? item.value > 0 : false) ||\n (item.children && item.children.length > 0),\n );\n\n chartDataRef.current = data;\n\n setOption({\n color: TREE_COLORS,\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 (pos, _params, _dom, _rect, size) {\n const obj: { top: number; left?: number; right?: number } = {\n top: pos[1] + 10,\n };\n if (pos[0] < size.viewSize[0] / 2) {\n obj.left = pos[0] + 10;\n } else {\n obj.right = size.viewSize[0] - pos[0] + 10;\n }\n return obj;\n } as TooltipComponentOption['position'],\n formatter: function (\n info: CallbackDataParams & { data?: TreemapDataNode },\n ) {\n const node = info.data || {};\n let path =\n typeof node.path === 'string'\n ? node.path\n : typeof node.name === 'string'\n ? node.name\n : String(node.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 =\n typeof node.sourceSize === 'number' && node.sourceSize > 0\n ? node.sourceSize\n : typeof node.value === 'number' &&\n node.value > 0 &&\n sizeType === 'stat'\n ? node.value\n : undefined;\n const bundledSize =\n typeof node.bundledSize === 'number' && node.bundledSize > 0\n ? node.bundledSize\n : undefined;\n const gzipSize =\n typeof node.gzipSize === 'number' && node.gzipSize > 0\n ? node.gzipSize\n : undefined;\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 && sourceSize > 0) {\n rows.push(\n makeRow('Stat size', formatSize(sourceSize), '#52c41a'),\n );\n }\n if (bundledSize !== undefined && bundledSize > 0) {\n rows.push(\n makeRow('Parsed size', formatSize(bundledSize), '#d96420'),\n );\n }\n if (gzipSize !== undefined && gzipSize > 0) {\n rows.push(\n makeRow('Gzipped size', formatSize(gzipSize), '#1677ff'),\n );\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 } as TooltipComponentOption,\n series: [\n {\n type: 'treemap',\n itemStyle: {\n gapColor: '#ffffff',\n },\n label: {\n show: true,\n formatter: '{b}',\n fontSize: 12,\n position: 'inside',\n fontWeight: 'normal',\n textBorderWidth: 1,\n padding: [4, 8, 4, 8],\n },\n upperLabel: {\n show: true,\n height: 30,\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.7,\n animationDurationUpdate: 500,\n width: '100%',\n height: '100%',\n top: -10,\n bottom: 30,\n left: 0,\n right: 0,\n zoomLimit: {\n min: 0.5,\n max: 5,\n },\n } as TreemapSeriesOption,\n ],\n });\n }, [treeData, sizeType, highlightNodeId, rootPath]);\n\n useEffect(() => {\n if (centerNodeId && chartRef.current && option) {\n const chartInstance =\n chartRef.current.getEchartsInstance() as unknown as EChartsType;\n if (chartInstance) {\n const findNodeInfo = (\n data: TreemapDataNode[],\n targetId: number,\n path: string[] = [],\n ): { name: string; path: string[] } | null => {\n for (const item of data) {\n const itemName =\n typeof item.name === 'string'\n ? item.name\n : String(item.name ?? '');\n const currentPath = [...path, itemName];\n if (item.id === targetId) {\n return { name: itemName, 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 const nodeName = nodeInfo.name;\n\n try {\n chartInstance.dispatchAction({\n type: 'highlight',\n seriesIndex: 0,\n name: nodeName,\n });\n } catch (e) {\n console.error('Failed to highlight node with name:', nodeName, e);\n }\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: nodeName,\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 useEffect(() => {\n return () => {\n if (clickTimeoutRef.current) {\n window.clearTimeout(clickTimeoutRef.current);\n }\n };\n }, []);\n\n return option ? (\n <div className={Styles['chart-container']} style={style}>\n <Alert\n message=\"If parsed size lacks detailed module information, you can enable sourceMap when RSDOCTOR = true. This is because Rsdoctor relies on SourceMap to obtain Parsed Size. Rspack provides SourceMap information to Rsdoctor by default without affecting the build output.\"\n type=\"info\"\n showIcon\n style={{ marginBottom: 0 }}\n />\n <EChartsReactCore\n ref={chartRef}\n option={option}\n echarts={echarts}\n onEvents={{\n click: (params: ECElementEvent) => {\n // Delay to differentiate from double-click; only zoom on single click\n if (clickTimeoutRef.current) {\n window.clearTimeout(clickTimeoutRef.current);\n }\n clickTimeoutRef.current = window.setTimeout(() => {\n if (chartRef.current) {\n const instance =\n chartRef.current.getEchartsInstance() as unknown as EChartsType;\n const data = params?.data as TreemapDataNode | undefined;\n if (instance && data?.id !== undefined) {\n instance.dispatchAction({\n type: 'treemapZoomToNode',\n seriesIndex: 0,\n targetNodeId: String(data.id),\n });\n }\n }\n }, 180);\n },\n dblclick: (params: ECElementEvent) => {\n // Double click: cancel pending single-click action and trigger analyze\n if (clickTimeoutRef.current) {\n window.clearTimeout(clickTimeoutRef.current);\n clickTimeoutRef.current = null;\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 AssetTreemapWithFilter: React.FC<{\n treeData: TreeNode[];\n onChartClick?: (params: ECElementEvent) => 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: ECElementEvent) => 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 const [moduleId, setModuleId] = useState<string | number>('');\n const [showAnalyze, setShowAnalyze] = useState(false);\n const [chunkSearchQuery, setChunkSearchQuery] = useState('');\n\n const containerRef = React.useRef<HTMLDivElement>(null);\n\n const handleChartClick = useCallback(\n (params: ECElementEvent) => {\n onChartClick?.(params);\n const data = params.data as TreemapDataNode | undefined;\n const moduleId = data?.moduleId;\n if (moduleId !== undefined) {\n setModuleId(moduleId);\n setShowAnalyze(true);\n }\n },\n [onChartClick],\n );\n\n const enterFullscreen = useCallback(() => {\n if (containerRef.current) {\n const el = containerRef.current as HTMLElement & {\n webkitRequestFullscreen?: () => void;\n mozRequestFullScreen?: () => void;\n msRequestFullscreen?: () => void;\n };\n if (el.requestFullscreen) {\n el.requestFullscreen()\n .then(() => setIsFullscreen(true))\n .catch((err: unknown) =>\n console.error('Failed to enter fullscreen:', err),\n );\n } else if (el.webkitRequestFullscreen) {\n try {\n el.webkitRequestFullscreen();\n setIsFullscreen(true);\n } catch (err) {\n console.error('Failed to enter fullscreen (webkit):', err);\n }\n } else if (el.mozRequestFullScreen) {\n try {\n el.mozRequestFullScreen();\n setIsFullscreen(true);\n } catch (err) {\n console.error('Failed to enter fullscreen (moz):', err);\n }\n } else if (el.msRequestFullscreen) {\n try {\n el.msRequestFullscreen();\n setIsFullscreen(true);\n } catch (err) {\n console.error('Failed to enter fullscreen (ms):', err);\n }\n } else {\n console.error('Fullscreen API is not supported in this browser.');\n }\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 filteredTreeData = useMemo(() => {\n let filtered = treeData.filter((item) => checkedAssets.includes(item.name));\n\n if (chunkSearchQuery.trim()) {\n const searchLower = chunkSearchQuery.toLowerCase();\n filtered = filtered.filter((item) =>\n item.name.toLowerCase().includes(searchLower),\n );\n }\n\n return filtered;\n }, [treeData, checkedAssets, chunkSearchQuery]);\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, chunkPath?: string) => {\n // For chunk level (root of filteredTreeData), use its path/name as chunkPath\n const currentChunkPath = chunkPath || node.path || node.name || '';\n\n if (node.path && regex.test(node.path)) {\n // Use the same nodeId calculation as in convert function\n const nodeIdString = chunkPath\n ? `${chunkPath}::${node.path}`\n : node.path;\n const nodeId = hashString(nodeIdString);\n results.push({ path: node.path, nodeId });\n }\n if (node.children) {\n node.children.forEach((child) =>\n collectMatchingPaths(child, currentChunkPath),\n );\n }\n };\n\n filteredTreeData.forEach((chunk) => collectMatchingPaths(chunk));\n return results;\n }, [filteredTreeData, searchQuery]);\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>Show chunks</h4>\n <Input\n placeholder=\"Search chunks\"\n value={chunkSearchQuery}\n onChange={(e) => setChunkSearchQuery(e.target.value)}\n suffix={<SearchOutlined style={{ color: '#ccc' }} />}\n allowClear\n size=\"small\"\n style={{ marginBottom: 8 }}\n />\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\n className={Styles['chunk-list']}\n style={{ maxHeight: 180, overflowY: 'auto' }}\n >\n {assetNames\n .filter((name) =>\n name.toLowerCase().includes(chunkSearchQuery.toLowerCase()),\n )\n .map((name) => (\n <div\n key={name}\n className={Styles['chunk-item']}\n style={{ height: 15, lineHeight: '15px' }}\n >\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\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 </div>\n </div>\n\n <div className={Styles['chart-wrapper']}>\n <TreeMap\n treeData={filteredTreeData}\n sizeType={sizeType}\n onChartClick={handleChartClick}\n highlightNodeId={highlightNodeId}\n centerNodeId={centerNodeId}\n rootPath={rootPath}\n style={{ width: '100%', height: '100%' }}\n />\n {moduleId ? (\n <ServerAPIProvider\n api={SDK.ServerAPI.API.GetAllModuleGraph}\n body={{}}\n >\n {(modules) => (\n <ModuleAnalyzeComponent\n cwd={rootPath}\n moduleId={moduleId}\n modules={modules}\n show={showAnalyze}\n setShow={setShowAnalyze}\n />\n )}\n </ServerAPIProvider>\n ) : null}\n </div>\n </div>\n );\n};\n"],"names":["echarts","TreemapChart","TooltipComponent","TitleComponent","CanvasRenderer","hashString","str","hash","i","blendWithWhite","hex","ratio","r","parseInt","g","b","blendedR","Math","blendedG","blendedB","getLuminance","rs","gs","bs","val","isDarkColor","getLevelOption","TreeMap","memo","treeData","sizeType","style","onChartClick","highlightNodeId","centerNodeId","rootPath","option","setOption","useState","chartRef","React","chartDataRef","clickTimeoutRef","useEffect","convert","node","index","level","parentColor","siblingIndex","siblingCount","chunkPath","baseColor","TREE_COLORS","currentChunkPath","children","c","childIndex","nodeIdString","nodeId","isHighlighted","baseColorRatio","baseBorderRatio","siblingGradientRange","siblingRatio","colorRatio","borderRatio","nodeColor","nodeBorderColor","isDark","textColor","textBorderColor","result","undefined","data","item","pos","_params","_dom","_rect","size","obj","info","path","String","normalizedRoot","normalizedPath","sourceSize","bundledSize","gzipSize","makeRow","label","value","color","Styles","rows","formatSize","chartInstance","findNodeInfo","targetId","itemName","currentPath","found","setTimeout","nodeInfo","nodeName","e","console","zoomStrategies","strategy","window","Alert","EChartsReactCore","params","instance","AssetTreemapWithFilter","ServerAPIProvider","SDK","projectInfo","AssetTreemapWithFilterInner","assetNames","useMemo","checkedAssets","setCheckedAssets","collapsed","setCollapsed","setSizeType","searchQuery","setSearchQuery","isFullscreen","setIsFullscreen","setHighlightNodeId","setCenterNodeId","moduleId","setModuleId","showAnalyze","setShowAnalyze","chunkSearchQuery","setChunkSearchQuery","containerRef","handleChartClick","useCallback","enterFullscreen","el","err","exitFullscreen","document","toggleFullscreen","handleFullscreenChange","filteredTreeData","filtered","searchLower","searchResults","regex","RegExp","results","collectMatchingPaths","child","chunk","handleSearchResultClick","removeRootPath","filepath","getSize","type","calculateNodeTotalSize","childrenSize","sum","getChunkSize","name","n","sizeTypeToUse","FullscreenExitOutlined","FullscreenOutlined","RightOutlined","LeftOutlined","Radio","Input","SearchOutlined","Checkbox","a","displayPath","modules","ModuleAnalyzeComponent"],"mappings":"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"}
|
|
@@ -64,8 +64,8 @@ const LoaderExecutionsChart = ({ loaders, cwd })=>{
|
|
|
64
64
|
formatterFn: formatterForLoader,
|
|
65
65
|
chartType: ChartTypes.Loader,
|
|
66
66
|
exts: {
|
|
67
|
-
startTimestamp,
|
|
68
|
-
endTimestamp
|
|
67
|
+
startTimestamp: startTimestamp,
|
|
68
|
+
endTimestamp: endTimestamp
|
|
69
69
|
}
|
|
70
70
|
})
|
|
71
71
|
}) : /*#__PURE__*/ jsx(Empty, {})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components/Charts/loader.mjs","sources":["../../../src/components/Charts/loader.tsx"],"sourcesContent":["import React, {\n useCallback,\n useMemo,\n useRef,\n useEffect,\n useState,\n} from 'react';\nimport { groupBy } from 'es-toolkit/compat';\nimport { Empty } from 'antd';\nimport './loader.scss';\nimport { useTheme } from 'src/utils/manifest';\nimport { findLoaderTotalTiming } from 'src/utils/loader';\nimport { beautifyPath } from 'src/utils/file';\nimport { TimelineCom } from './TimelineCharts';\nimport { ChartProps, DurationMetric } from './types';\nimport {\n renderTotalLoadersTooltip,\n getTooltipHtmlForLoader,\n useDebounceHook,\n} from './utils';\nimport { ChartTypes } from './constants';\nlet startTimestamp = 0;\nlet endTimestamp = 0;\n\nexport const LoaderExecutionsChart: React.FC<ChartProps> = ({\n loaders,\n cwd,\n}) => {\n const { isDark } = useTheme();\n const ref = useRef(null);\n const [data, setData] = useState([] as DurationMetric[]);\n const durationMetricData = useDebounceHook(data, 200);\n // const [endTimestamp, setEndTimestamp] = useState(0);\n\n const groupByLoader = useMemo(\n () => groupBy(loaders, (e) => e.loader),\n [loaders],\n );\n\n const formatterForLoader = useCallback((raw: any) => {\n const { name, data } = raw;\n const loaderName = name.replace(' total', '');\n if (data?.ext) {\n return getTooltipHtmlForLoader(data.ext as (typeof loaders)[0]);\n }\n\n return renderTotalLoadersTooltip(loaderName, loaders, cwd);\n }, []);\n\n useEffect(() => {\n const _data = Object.keys(groupByLoader).map<DurationMetric>(\n (loaderName) => {\n const list = groupByLoader[loaderName] || [];\n const { start, end } = findLoaderTotalTiming(list);\n\n if (start < startTimestamp || startTimestamp === 0) {\n startTimestamp = start;\n }\n\n if (end > endTimestamp || endTimestamp === 0) {\n endTimestamp = end;\n }\n\n return {\n p: loaderName,\n n: loaderName,\n s: start,\n e: end,\n c: list.map((e) => {\n return {\n p: loaderName,\n // n: loaderName,\n n: beautifyPath(e.resource, cwd),\n s: e.startAt,\n e: e.endAt,\n ext: e,\n };\n }),\n };\n },\n );\n setData(_data);\n }, [groupByLoader]);\n\n return (\n <>\n {data?.length ? (\n <div\n className={[\n 'loader-chart-container',\n isDark ? 'loader-chart-container_dark' : '',\n ]\n .join(' ')\n .trim()}\n ref={ref}\n style={{ width: '100%' }}\n >\n <TimelineCom\n loaderData={durationMetricData}\n formatterFn={formatterForLoader}\n chartType={ChartTypes.Loader}\n exts={{ startTimestamp, endTimestamp }}\n />\n </div>\n ) : (\n <Empty />\n )}\n </>\n );\n};\n"],"names":["startTimestamp","endTimestamp","LoaderExecutionsChart","loaders","cwd","isDark","useTheme","ref","useRef","data","setData","useState","durationMetricData","useDebounceHook","groupByLoader","useMemo","groupBy","e","formatterForLoader","useCallback","raw","name","loaderName","getTooltipHtmlForLoader","renderTotalLoadersTooltip","useEffect","_data","Object","list","start","end","findLoaderTotalTiming","beautifyPath","TimelineCom","ChartTypes","Empty"],"mappings":";;;;;;;;;;;AAqBA,IAAIA,iBAAiB;AACrB,IAAIC,eAAe;AAEZ,MAAMC,wBAA8C,CAAC,EAC1DC,OAAO,EACPC,GAAG,EACJ;IACC,MAAM,EAAEC,MAAM,EAAE,GAAGC;IACnB,MAAMC,MAAMC,OAAO;IACnB,MAAM,CAACC,MAAMC,QAAQ,GAAGC,SAAS,EAAE;IACnC,MAAMC,qBAAqBC,gBAAgBJ,MAAM;IAGjD,MAAMK,gBAAgBC,QACpB,IAAMC,QAAQb,SAAS,CAACc,IAAMA,EAAE,MAAM,GACtC;QAACd;KAAQ;IAGX,MAAMe,qBAAqBC,YAAY,CAACC;QACtC,MAAM,EAAEC,IAAI,EAAEZ,IAAI,EAAE,GAAGW;QACvB,MAAME,aAAaD,KAAK,OAAO,CAAC,UAAU;QAC1C,IAAIZ,MAAM,KACR,OAAOc,wBAAwBd,KAAK,GAAG;QAGzC,OAAOe,0BAA0BF,YAAYnB,SAASC;IACxD,GAAG,EAAE;IAELqB,UAAU;QACR,MAAMC,QAAQC,OAAO,IAAI,CAACb,eAAe,GAAG,CAC1C,CAACQ;YACC,MAAMM,OAAOd,aAAa,CAACQ,WAAW,IAAI,EAAE;YAC5C,MAAM,EAAEO,KAAK,EAAEC,GAAG,EAAE,GAAGC,sBAAsBH;YAE7C,IAAIC,QAAQ7B,kBAAkBA,AAAmB,MAAnBA,gBAC5BA,iBAAiB6B;YAGnB,IAAIC,MAAM7B,gBAAgBA,AAAiB,MAAjBA,cACxBA,eAAe6B;YAGjB,OAAO;gBACL,GAAGR;gBACH,GAAGA;gBACH,GAAGO;gBACH,GAAGC;gBACH,GAAGF,KAAK,GAAG,CAAC,CAACX,IACJ;wBACL,GAAGK;wBAEH,GAAGU,aAAaf,EAAE,QAAQ,EAAEb;wBAC5B,GAAGa,EAAE,OAAO;wBACZ,GAAGA,EAAE,KAAK;wBACV,KAAKA;oBACP;YAEJ;QACF;QAEFP,QAAQgB;IACV,GAAG;QAACZ;KAAc;IAElB,OAAO,WAAP,GACE;kBACGL,MAAM,SAAS,WAAT,GACL,IAAC;YACC,WAAW;gBACT;gBACAJ,SAAS,gCAAgC;aAC1C,CACE,IAAI,CAAC,KACL,IAAI;YACP,KAAKE;YACL,OAAO;gBAAE,OAAO;YAAO;sBAEvB,kBAAC0B,aAAWA;gBACV,YAAYrB;gBACZ,aAAaM;gBACb,WAAWgB,WAAW,MAAM;gBAC5B,MAAM;oBAAElC;oBAAgBC;gBAAa;;2BAIzC,IAACkC,OAAKA,CAAAA;;AAId"}
|
|
1
|
+
{"version":3,"file":"components/Charts/loader.mjs","sources":["../../../src/components/Charts/loader.tsx"],"sourcesContent":["import React, {\n useCallback,\n useMemo,\n useRef,\n useEffect,\n useState,\n} from 'react';\nimport { groupBy } from 'es-toolkit/compat';\nimport { Empty } from 'antd';\nimport './loader.scss';\nimport { useTheme } from 'src/utils/manifest';\nimport { findLoaderTotalTiming } from 'src/utils/loader';\nimport { beautifyPath } from 'src/utils/file';\nimport { TimelineCom } from './TimelineCharts';\nimport { ChartProps, DurationMetric } from './types';\nimport {\n renderTotalLoadersTooltip,\n getTooltipHtmlForLoader,\n useDebounceHook,\n} from './utils';\nimport { ChartTypes } from './constants';\nlet startTimestamp = 0;\nlet endTimestamp = 0;\n\nexport const LoaderExecutionsChart: React.FC<ChartProps> = ({\n loaders,\n cwd,\n}) => {\n const { isDark } = useTheme();\n const ref = useRef(null);\n const [data, setData] = useState([] as DurationMetric[]);\n const durationMetricData = useDebounceHook(data, 200);\n // const [endTimestamp, setEndTimestamp] = useState(0);\n\n const groupByLoader = useMemo(\n () => groupBy(loaders, (e) => e.loader),\n [loaders],\n );\n\n const formatterForLoader = useCallback((raw: any) => {\n const { name, data } = raw;\n const loaderName = name.replace(' total', '');\n if (data?.ext) {\n return getTooltipHtmlForLoader(data.ext as (typeof loaders)[0]);\n }\n\n return renderTotalLoadersTooltip(loaderName, loaders, cwd);\n }, []);\n\n useEffect(() => {\n const _data = Object.keys(groupByLoader).map<DurationMetric>(\n (loaderName) => {\n const list = groupByLoader[loaderName] || [];\n const { start, end } = findLoaderTotalTiming(list);\n\n if (start < startTimestamp || startTimestamp === 0) {\n startTimestamp = start;\n }\n\n if (end > endTimestamp || endTimestamp === 0) {\n endTimestamp = end;\n }\n\n return {\n p: loaderName,\n n: loaderName,\n s: start,\n e: end,\n c: list.map((e) => {\n return {\n p: loaderName,\n // n: loaderName,\n n: beautifyPath(e.resource, cwd),\n s: e.startAt,\n e: e.endAt,\n ext: e,\n };\n }),\n };\n },\n );\n setData(_data);\n }, [groupByLoader]);\n\n return (\n <>\n {data?.length ? (\n <div\n className={[\n 'loader-chart-container',\n isDark ? 'loader-chart-container_dark' : '',\n ]\n .join(' ')\n .trim()}\n ref={ref}\n style={{ width: '100%' }}\n >\n <TimelineCom\n loaderData={durationMetricData}\n formatterFn={formatterForLoader}\n chartType={ChartTypes.Loader}\n exts={{ startTimestamp, endTimestamp }}\n />\n </div>\n ) : (\n <Empty />\n )}\n </>\n );\n};\n"],"names":["startTimestamp","endTimestamp","LoaderExecutionsChart","loaders","cwd","isDark","useTheme","ref","useRef","data","setData","useState","durationMetricData","useDebounceHook","groupByLoader","useMemo","groupBy","e","formatterForLoader","useCallback","raw","name","loaderName","getTooltipHtmlForLoader","renderTotalLoadersTooltip","useEffect","_data","Object","list","start","end","findLoaderTotalTiming","beautifyPath","TimelineCom","ChartTypes","Empty"],"mappings":";;;;;;;;;;;AAqBA,IAAIA,iBAAiB;AACrB,IAAIC,eAAe;AAEZ,MAAMC,wBAA8C,CAAC,EAC1DC,OAAO,EACPC,GAAG,EACJ;IACC,MAAM,EAAEC,MAAM,EAAE,GAAGC;IACnB,MAAMC,MAAMC,OAAO;IACnB,MAAM,CAACC,MAAMC,QAAQ,GAAGC,SAAS,EAAE;IACnC,MAAMC,qBAAqBC,gBAAgBJ,MAAM;IAGjD,MAAMK,gBAAgBC,QACpB,IAAMC,QAAQb,SAAS,CAACc,IAAMA,EAAE,MAAM,GACtC;QAACd;KAAQ;IAGX,MAAMe,qBAAqBC,YAAY,CAACC;QACtC,MAAM,EAAEC,IAAI,EAAEZ,IAAI,EAAE,GAAGW;QACvB,MAAME,aAAaD,KAAK,OAAO,CAAC,UAAU;QAC1C,IAAIZ,MAAM,KACR,OAAOc,wBAAwBd,KAAK,GAAG;QAGzC,OAAOe,0BAA0BF,YAAYnB,SAASC;IACxD,GAAG,EAAE;IAELqB,UAAU;QACR,MAAMC,QAAQC,OAAO,IAAI,CAACb,eAAe,GAAG,CAC1C,CAACQ;YACC,MAAMM,OAAOd,aAAa,CAACQ,WAAW,IAAI,EAAE;YAC5C,MAAM,EAAEO,KAAK,EAAEC,GAAG,EAAE,GAAGC,sBAAsBH;YAE7C,IAAIC,QAAQ7B,kBAAkBA,AAAmB,MAAnBA,gBAC5BA,iBAAiB6B;YAGnB,IAAIC,MAAM7B,gBAAgBA,AAAiB,MAAjBA,cACxBA,eAAe6B;YAGjB,OAAO;gBACL,GAAGR;gBACH,GAAGA;gBACH,GAAGO;gBACH,GAAGC;gBACH,GAAGF,KAAK,GAAG,CAAC,CAACX,IACJ;wBACL,GAAGK;wBAEH,GAAGU,aAAaf,EAAE,QAAQ,EAAEb;wBAC5B,GAAGa,EAAE,OAAO;wBACZ,GAAGA,EAAE,KAAK;wBACV,KAAKA;oBACP;YAEJ;QACF;QAEFP,QAAQgB;IACV,GAAG;QAACZ;KAAc;IAElB,OAAO,WAAP,GACE;kBACGL,MAAM,SAAS,WAAT,GACL,IAAC;YACC,WAAW;gBACT;gBACAJ,SAAS,gCAAgC;aAC1C,CACE,IAAI,CAAC,KACL,IAAI;YACP,KAAKE;YACL,OAAO;gBAAE,OAAO;YAAO;sBAEvB,kBAAC0B,aAAWA;gBACV,YAAYrB;gBACZ,aAAaM;gBACb,WAAWgB,WAAW,MAAM;gBAC5B,MAAM;oBAAElC,gBAAAA;oBAAgBC,cAAAA;gBAAa;;2BAIzC,IAACkC,OAAKA,CAAAA;;AAId"}
|
|
@@ -11,7 +11,7 @@ import unkown_file from "../../common/svg/files/unkown-file.mjs";
|
|
|
11
11
|
import "./index.css";
|
|
12
12
|
import { useTheme } from "../../utils/index.mjs";
|
|
13
13
|
import path from "path";
|
|
14
|
-
const { useToken } = theme;
|
|
14
|
+
const { useToken: useToken } = theme;
|
|
15
15
|
function getFileType(filename) {
|
|
16
16
|
const extension = path.extname(filename).slice(1).toLowerCase();
|
|
17
17
|
switch(extension){
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components/FileTree/index.mjs","sources":["../../../src/components/FileTree/index.tsx"],"sourcesContent":["import React from 'react';\nimport { Space, theme } from 'antd';\nimport {\n FileOutlined,\n FolderOpenTwoTone,\n FolderTwoTone,\n RightOutlined,\n} from '@ant-design/icons';\nimport Tree, { TreeProps } from 'rc-tree';\nimport CSSIcon from 'src/common/svg/files/css.svg';\nimport HtmlIcon from 'src/common/svg/files/html.svg';\nimport IMGIcon from 'src/common/svg/files/image.svg';\nimport JSIcon from 'src/common/svg/files/js.svg';\nimport FileIcon from 'src/common/svg/files/unkown-file.svg';\n\nimport './index.sass';\nimport { useTheme } from '../../utils';\nimport path from 'path';\n\nconst { useToken } = theme;\n\nfunction getFileType(filename: string) {\n const extension = path.extname(filename).slice(1).toLowerCase();\n\n switch (extension) {\n case 'js':\n case 'jsx':\n case 'ts':\n case 'mjs':\n case 'cjs':\n case 'mts':\n case 'cts':\n return <JSIcon />;\n case 'tsx':\n return <FileIcon />;\n case 'css':\n case 'scss':\n case 'sass':\n case 'less':\n case 'styl':\n case 'stylus':\n return <CSSIcon />;\n case 'html':\n return <HtmlIcon />;\n case 'png':\n case 'jpg':\n case 'jpeg':\n case 'gif':\n case 'svg':\n case 'bmp':\n case 'webp':\n case 'ico':\n case 'apng':\n case 'avif':\n case 'tif':\n case 'tiff':\n case 'jfif':\n case 'pjpeg':\n case 'pjp':\n return <IMGIcon />;\n default:\n return <FileIcon />;\n }\n}\n\nexport function getFileCom(filename: string) {\n const fileIcon = getFileType(filename);\n return <div className=\"file-icon\">{fileIcon}</div>;\n}\n\nexport const FileTree: React.FC<Partial<TreeProps>> = (props) => {\n const { isDark } = useTheme();\n\n const { token } = useToken();\n const color = isDark ? token.colorWhite : token.colorText;\n const style = { fontSize: token.fontSize };\n\n return (\n <Tree\n checkable={false}\n selectable={true}\n switcherIcon={({ data, expanded }) => {\n if (data?.children) {\n return (\n <Space style={{ color }}>\n <RightOutlined\n twoToneColor={color}\n className={`file-tree-switcher-arrow ${expanded ? 'file-tree-switcher-arrow-expand' : ''}`}\n style={style}\n />\n {expanded ? <FolderOpenTwoTone /> : <FolderTwoTone />}\n </Space>\n );\n }\n if (data?.key && typeof data.key === 'string') {\n return getFileCom(data.key);\n }\n return <FileOutlined />;\n }}\n expandAction=\"click\"\n {...props}\n />\n );\n};\n"],"names":["useToken","theme","getFileType","filename","extension","path","JSIcon","FileIcon","CSSIcon","HtmlIcon","IMGIcon","getFileCom","fileIcon","FileTree","props","isDark","useTheme","token","color","style","Tree","data","expanded","Space","RightOutlined","FolderOpenTwoTone","FolderTwoTone","FileOutlined"],"mappings":";;;;;;;;;;;;;AAmBA,MAAM,EAAEA,QAAQ,EAAE,GAAGC;AAErB,SAASC,YAAYC,QAAgB;IACnC,MAAMC,YAAYC,KAAK,OAAO,CAACF,UAAU,KAAK,CAAC,GAAG,WAAW;IAE7D,OAAQC;QACN,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;YACH,OAAO,WAAP,GAAO,IAACE,IAAMA,CAAAA;QAChB,KAAK;YACH,OAAO,WAAP,GAAO,IAACC,aAAQA,CAAAA;QAClB,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;YACH,OAAO,WAAP,GAAO,IAACC,KAAOA,CAAAA;QACjB,KAAK;YACH,OAAO,WAAP,GAAO,IAACC,MAAQA,CAAAA;QAClB,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;YACH,OAAO,WAAP,GAAO,IAACC,aAAOA,CAAAA;QACjB;YACE,OAAO,WAAP,GAAO,IAACH,aAAQA,CAAAA;IACpB;AACF;AAEO,SAASI,WAAWR,QAAgB;IACzC,MAAMS,WAAWV,YAAYC;IAC7B,OAAO,WAAP,GAAO,IAAC;QAAI,WAAU;kBAAaS;;AACrC;AAEO,MAAMC,WAAyC,CAACC;IACrD,MAAM,EAAEC,MAAM,EAAE,GAAGC;IAEnB,MAAM,EAAEC,KAAK,EAAE,GAAGjB;IAClB,MAAMkB,QAAQH,SAASE,MAAM,UAAU,GAAGA,MAAM,SAAS;IACzD,MAAME,QAAQ;QAAE,UAAUF,MAAM,QAAQ;IAAC;IAEzC,OAAO,WAAP,GACE,IAACG,SAAIA;QACH,WAAW;QACX,YAAY;QACZ,cAAc,CAAC,EAAEC,IAAI,EAAEC,QAAQ,EAAE;YAC/B,IAAID,MAAM,UACR,OAAO,WAAP,GACE,KAACE,OAAKA;gBAAC,OAAO;oBAAEL;gBAAM;;kCACpB,IAACM,eAAaA;wBACZ,cAAcN;wBACd,WAAW,CAAC,yBAAyB,EAAEI,WAAW,oCAAoC,IAAI;wBAC1F,OAAOH;;oBAERG,WAAW,WAAXA,GAAW,IAACG,mBAAiBA,CAAAA,KAAAA,WAAAA,GAAM,IAACC,eAAaA,CAAAA;;;YAIxD,IAAIL,MAAM,OAAO,AAAoB,YAApB,OAAOA,KAAK,GAAG,EAC9B,OAAOV,WAAWU,KAAK,GAAG;YAE5B,OAAO,WAAP,GAAO,IAACM,cAAYA,CAAAA;QACtB;QACA,cAAa;QACZ,GAAGb,KAAK;;AAGf"}
|
|
1
|
+
{"version":3,"file":"components/FileTree/index.mjs","sources":["../../../src/components/FileTree/index.tsx"],"sourcesContent":["import React from 'react';\nimport { Space, theme } from 'antd';\nimport {\n FileOutlined,\n FolderOpenTwoTone,\n FolderTwoTone,\n RightOutlined,\n} from '@ant-design/icons';\nimport Tree, { TreeProps } from 'rc-tree';\nimport CSSIcon from 'src/common/svg/files/css.svg';\nimport HtmlIcon from 'src/common/svg/files/html.svg';\nimport IMGIcon from 'src/common/svg/files/image.svg';\nimport JSIcon from 'src/common/svg/files/js.svg';\nimport FileIcon from 'src/common/svg/files/unkown-file.svg';\n\nimport './index.sass';\nimport { useTheme } from '../../utils';\nimport path from 'path';\n\nconst { useToken } = theme;\n\nfunction getFileType(filename: string) {\n const extension = path.extname(filename).slice(1).toLowerCase();\n\n switch (extension) {\n case 'js':\n case 'jsx':\n case 'ts':\n case 'mjs':\n case 'cjs':\n case 'mts':\n case 'cts':\n return <JSIcon />;\n case 'tsx':\n return <FileIcon />;\n case 'css':\n case 'scss':\n case 'sass':\n case 'less':\n case 'styl':\n case 'stylus':\n return <CSSIcon />;\n case 'html':\n return <HtmlIcon />;\n case 'png':\n case 'jpg':\n case 'jpeg':\n case 'gif':\n case 'svg':\n case 'bmp':\n case 'webp':\n case 'ico':\n case 'apng':\n case 'avif':\n case 'tif':\n case 'tiff':\n case 'jfif':\n case 'pjpeg':\n case 'pjp':\n return <IMGIcon />;\n default:\n return <FileIcon />;\n }\n}\n\nexport function getFileCom(filename: string) {\n const fileIcon = getFileType(filename);\n return <div className=\"file-icon\">{fileIcon}</div>;\n}\n\nexport const FileTree: React.FC<Partial<TreeProps>> = (props) => {\n const { isDark } = useTheme();\n\n const { token } = useToken();\n const color = isDark ? token.colorWhite : token.colorText;\n const style = { fontSize: token.fontSize };\n\n return (\n <Tree\n checkable={false}\n selectable={true}\n switcherIcon={({ data, expanded }) => {\n if (data?.children) {\n return (\n <Space style={{ color }}>\n <RightOutlined\n twoToneColor={color}\n className={`file-tree-switcher-arrow ${expanded ? 'file-tree-switcher-arrow-expand' : ''}`}\n style={style}\n />\n {expanded ? <FolderOpenTwoTone /> : <FolderTwoTone />}\n </Space>\n );\n }\n if (data?.key && typeof data.key === 'string') {\n return getFileCom(data.key);\n }\n return <FileOutlined />;\n }}\n expandAction=\"click\"\n {...props}\n />\n );\n};\n"],"names":["useToken","theme","getFileType","filename","extension","path","JSIcon","FileIcon","CSSIcon","HtmlIcon","IMGIcon","getFileCom","fileIcon","FileTree","props","isDark","useTheme","token","color","style","Tree","data","expanded","Space","RightOutlined","FolderOpenTwoTone","FolderTwoTone","FileOutlined"],"mappings":";;;;;;;;;;;;;AAmBA,MAAM,EAAEA,UAAAA,QAAQ,EAAE,GAAGC;AAErB,SAASC,YAAYC,QAAgB;IACnC,MAAMC,YAAYC,KAAK,OAAO,CAACF,UAAU,KAAK,CAAC,GAAG,WAAW;IAE7D,OAAQC;QACN,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;YACH,OAAO,WAAP,GAAO,IAACE,IAAMA,CAAAA;QAChB,KAAK;YACH,OAAO,WAAP,GAAO,IAACC,aAAQA,CAAAA;QAClB,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;YACH,OAAO,WAAP,GAAO,IAACC,KAAOA,CAAAA;QACjB,KAAK;YACH,OAAO,WAAP,GAAO,IAACC,MAAQA,CAAAA;QAClB,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;QACL,KAAK;YACH,OAAO,WAAP,GAAO,IAACC,aAAOA,CAAAA;QACjB;YACE,OAAO,WAAP,GAAO,IAACH,aAAQA,CAAAA;IACpB;AACF;AAEO,SAASI,WAAWR,QAAgB;IACzC,MAAMS,WAAWV,YAAYC;IAC7B,OAAO,WAAP,GAAO,IAAC;QAAI,WAAU;kBAAaS;;AACrC;AAEO,MAAMC,WAAyC,CAACC;IACrD,MAAM,EAAEC,MAAM,EAAE,GAAGC;IAEnB,MAAM,EAAEC,KAAK,EAAE,GAAGjB;IAClB,MAAMkB,QAAQH,SAASE,MAAM,UAAU,GAAGA,MAAM,SAAS;IACzD,MAAME,QAAQ;QAAE,UAAUF,MAAM,QAAQ;IAAC;IAEzC,OAAO,WAAP,GACE,IAACG,SAAIA;QACH,WAAW;QACX,YAAY;QACZ,cAAc,CAAC,EAAEC,IAAI,EAAEC,QAAQ,EAAE;YAC/B,IAAID,MAAM,UACR,OAAO,WAAP,GACE,KAACE,OAAKA;gBAAC,OAAO;oBAAEL;gBAAM;;kCACpB,IAACM,eAAaA;wBACZ,cAAcN;wBACd,WAAW,CAAC,yBAAyB,EAAEI,WAAW,oCAAoC,IAAI;wBAC1F,OAAOH;;oBAERG,WAAW,WAAXA,GAAW,IAACG,mBAAiBA,CAAAA,KAAAA,WAAAA,GAAM,IAACC,eAAaA,CAAAA;;;YAIxD,IAAIL,MAAM,OAAO,AAAoB,YAApB,OAAOA,KAAK,GAAG,EAC9B,OAAOV,WAAWU,KAAK,GAAG;YAE5B,OAAO,WAAP,GAAO,IAACM,cAAYA,CAAAA;QACtB;QACA,cAAa;QACZ,GAAGb,KAAK;;AAGf"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components/Layout/index.mjs","sources":["../../../src/components/Layout/index.tsx"],"sourcesContent":["import { PropsWithChildren, useContext, useEffect, useState } from 'react';\nimport { FloatButton, Layout as L } from 'antd';\nimport { Language, MAIN_BG, Size } from '../../constants';\nimport { Header } from './header';\nimport {\n useLocale,\n useI18n,\n getFirstVisitFromStorage,\n setFirstVisitToStorage,\n getLanguage,\n useUrlQuery,\n getEnableRoutesFromUrlQuery,\n} from '../../utils';\nimport { Progress } from './progress';\nimport { ConfigContext } from '../../config';\nimport { SDK } from '@rsdoctor/types';\nimport { ServerAPIProvider } from '../Manifest';\nimport { ProjectInfoContext } from './project-info-context';\n\nexport interface LayoutProps {\n children: JSX.Element;\n}\n\nconst TitleUpdater: React.FC<{\n name?: string;\n}> = ({ name }) => {\n useEffect(() => {\n if (name) {\n document.title = `Rsdoctor - ${name}`;\n } else {\n document.title = 'Rsdoctor';\n }\n }, [name]);\n\n return null;\n};\n\nexport const Layout = (props: PropsWithChildren<LayoutProps>): JSX.Element => {\n const locale = useLocale();\n const { i18n } = useI18n();\n const { children } = props;\n const query = useUrlQuery();\n const [enableRoutes, setEnableRoutes] = useState<string[] | undefined>(\n () => getEnableRoutesFromUrlQuery() || undefined,\n );\n\n useEffect(() => {\n let currentLocale = locale;\n // Check if the user is visiting the site for the first time\n const visited = getFirstVisitFromStorage();\n if (!visited) {\n setFirstVisitToStorage('1');\n const targetLang = window.navigator.language.split('-')[0];\n const userLang = getLanguage(targetLang);\n\n if (Object.values(Language).includes(userLang)) {\n currentLocale = userLang;\n }\n }\n\n if (i18n.language !== currentLocale) {\n i18n.changeLanguage(currentLocale);\n }\n }, [locale]);\n\n // Listen for enableRoutes changes in URL query parameters\n useEffect(() => {\n const newEnableRoutes = getEnableRoutesFromUrlQuery();\n setEnableRoutes(newEnableRoutes || undefined);\n }, [query]);\n\n const ctx = useContext(ConfigContext);\n\n return (\n <ServerAPIProvider\n api={SDK.ServerAPI.API.GetProjectInfo}\n showSkeleton={false}\n >\n {(project) => (\n <ProjectInfoContext.Provider value={{ project }}>\n <L>\n <TitleUpdater name={project?.name} />\n {!ctx.embedded ? <Header enableRoutes={enableRoutes} /> : null}\n <Progress />\n <L.Content\n style={{\n height: '100%',\n minHeight: '100vh',\n padding: Size.BasePadding,\n marginTop: !ctx.embedded ? Size.NavBarHeight : 0,\n background: MAIN_BG,\n }}\n >\n {children}\n <FloatButton.BackTop />\n </L.Content>\n </L>\n </ProjectInfoContext.Provider>\n )}\n </ServerAPIProvider>\n );\n};\n"],"names":["TitleUpdater","name","useEffect","document","Layout","props","locale","useLocale","i18n","useI18n","children","query","useUrlQuery","enableRoutes","setEnableRoutes","useState","getEnableRoutesFromUrlQuery","undefined","currentLocale","visited","getFirstVisitFromStorage","setFirstVisitToStorage","targetLang","window","userLang","getLanguage","Object","Language","newEnableRoutes","ctx","useContext","ConfigContext","ServerAPIProvider","SDK","project","ProjectInfoContext","L","Header","Progress","Size","MAIN_BG","FloatButton"],"mappings":";;;;;;;;;;;AAuBA,MAAMA,eAED,CAAC,EAAEC,IAAI,EAAE;IACZC,UAAU;QACR,IAAID,MACFE,SAAS,KAAK,GAAG,CAAC,WAAW,EAAEF,MAAM;aAErCE,SAAS,KAAK,GAAG;IAErB,GAAG;QAACF;KAAK;IAET,OAAO;AACT;AAEO,MAAMG,gBAAS,CAACC;IACrB,MAAMC,SAASC;IACf,MAAM,EAAEC,IAAI,EAAE,GAAGC;IACjB,MAAM,EAAEC,QAAQ,EAAE,GAAGL;IACrB,MAAMM,QAAQC;IACd,MAAM,CAACC,cAAcC,gBAAgB,GAAGC,SACtC,IAAMC,iCAAiCC;IAGzCf,UAAU;QACR,IAAIgB,gBAAgBZ;QAEpB,MAAMa,UAAUC;QAChB,IAAI,CAACD,SAAS;YACZE,uBAAuB;YACvB,MAAMC,aAAaC,OAAO,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE;YAC1D,MAAMC,WAAWC,YAAYH;YAE7B,IAAII,OAAO,MAAM,CAACC,UAAU,QAAQ,CAACH,WACnCN,gBAAgBM;QAEpB;QAEA,IAAIhB,KAAK,QAAQ,KAAKU,eACpBV,KAAK,cAAc,CAACU;IAExB,GAAG;QAACZ;KAAO;IAGXJ,UAAU;QACR,MAAM0B,kBAAkBZ;QACxBF,gBAAgBc,mBAAmBX;IACrC,GAAG;QAACN;KAAM;IAEV,MAAMkB,MAAMC,WAAWC;IAEvB,OAAO,WAAP,GACE,IAACC,mBAAiBA;QAChB,KAAKC,IAAI,SAAS,CAAC,GAAG,CAAC,cAAc;QACrC,cAAc;kBAEb,CAACC,UAAAA,WAAAA,GACA,IAACC,mBAAmB,QAAQ;gBAAC,OAAO;oBAAED;gBAAQ;0BAC5C,mBAACE,QAACA;;sCACA,IAACpC,
|
|
1
|
+
{"version":3,"file":"components/Layout/index.mjs","sources":["../../../src/components/Layout/index.tsx"],"sourcesContent":["import { PropsWithChildren, useContext, useEffect, useState } from 'react';\nimport { FloatButton, Layout as L } from 'antd';\nimport { Language, MAIN_BG, Size } from '../../constants';\nimport { Header } from './header';\nimport {\n useLocale,\n useI18n,\n getFirstVisitFromStorage,\n setFirstVisitToStorage,\n getLanguage,\n useUrlQuery,\n getEnableRoutesFromUrlQuery,\n} from '../../utils';\nimport { Progress } from './progress';\nimport { ConfigContext } from '../../config';\nimport { SDK } from '@rsdoctor/types';\nimport { ServerAPIProvider } from '../Manifest';\nimport { ProjectInfoContext } from './project-info-context';\n\nexport interface LayoutProps {\n children: JSX.Element;\n}\n\nconst TitleUpdater: React.FC<{\n name?: string;\n}> = ({ name }) => {\n useEffect(() => {\n if (name) {\n document.title = `Rsdoctor - ${name}`;\n } else {\n document.title = 'Rsdoctor';\n }\n }, [name]);\n\n return null;\n};\n\nexport const Layout = (props: PropsWithChildren<LayoutProps>): JSX.Element => {\n const locale = useLocale();\n const { i18n } = useI18n();\n const { children } = props;\n const query = useUrlQuery();\n const [enableRoutes, setEnableRoutes] = useState<string[] | undefined>(\n () => getEnableRoutesFromUrlQuery() || undefined,\n );\n\n useEffect(() => {\n let currentLocale = locale;\n // Check if the user is visiting the site for the first time\n const visited = getFirstVisitFromStorage();\n if (!visited) {\n setFirstVisitToStorage('1');\n const targetLang = window.navigator.language.split('-')[0];\n const userLang = getLanguage(targetLang);\n\n if (Object.values(Language).includes(userLang)) {\n currentLocale = userLang;\n }\n }\n\n if (i18n.language !== currentLocale) {\n i18n.changeLanguage(currentLocale);\n }\n }, [locale]);\n\n // Listen for enableRoutes changes in URL query parameters\n useEffect(() => {\n const newEnableRoutes = getEnableRoutesFromUrlQuery();\n setEnableRoutes(newEnableRoutes || undefined);\n }, [query]);\n\n const ctx = useContext(ConfigContext);\n\n return (\n <ServerAPIProvider\n api={SDK.ServerAPI.API.GetProjectInfo}\n showSkeleton={false}\n >\n {(project) => (\n <ProjectInfoContext.Provider value={{ project }}>\n <L>\n <TitleUpdater name={project?.name} />\n {!ctx.embedded ? <Header enableRoutes={enableRoutes} /> : null}\n <Progress />\n <L.Content\n style={{\n height: '100%',\n minHeight: '100vh',\n padding: Size.BasePadding,\n marginTop: !ctx.embedded ? Size.NavBarHeight : 0,\n background: MAIN_BG,\n }}\n >\n {children}\n <FloatButton.BackTop />\n </L.Content>\n </L>\n </ProjectInfoContext.Provider>\n )}\n </ServerAPIProvider>\n );\n};\n"],"names":["TitleUpdater","name","useEffect","document","Layout","props","locale","useLocale","i18n","useI18n","children","query","useUrlQuery","enableRoutes","setEnableRoutes","useState","getEnableRoutesFromUrlQuery","undefined","currentLocale","visited","getFirstVisitFromStorage","setFirstVisitToStorage","targetLang","window","userLang","getLanguage","Object","Language","newEnableRoutes","ctx","useContext","ConfigContext","ServerAPIProvider","SDK","project","ProjectInfoContext","L","Header","Progress","Size","MAIN_BG","FloatButton"],"mappings":";;;;;;;;;;;AAuBA,MAAMA,eAED,CAAC,EAAEC,IAAI,EAAE;IACZC,UAAU;QACR,IAAID,MACFE,SAAS,KAAK,GAAG,CAAC,WAAW,EAAEF,MAAM;aAErCE,SAAS,KAAK,GAAG;IAErB,GAAG;QAACF;KAAK;IAET,OAAO;AACT;AAEO,MAAMG,gBAAS,CAACC;IACrB,MAAMC,SAASC;IACf,MAAM,EAAEC,IAAI,EAAE,GAAGC;IACjB,MAAM,EAAEC,QAAQ,EAAE,GAAGL;IACrB,MAAMM,QAAQC;IACd,MAAM,CAACC,cAAcC,gBAAgB,GAAGC,SACtC,IAAMC,iCAAiCC;IAGzCf,UAAU;QACR,IAAIgB,gBAAgBZ;QAEpB,MAAMa,UAAUC;QAChB,IAAI,CAACD,SAAS;YACZE,uBAAuB;YACvB,MAAMC,aAAaC,OAAO,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE;YAC1D,MAAMC,WAAWC,YAAYH;YAE7B,IAAII,OAAO,MAAM,CAACC,UAAU,QAAQ,CAACH,WACnCN,gBAAgBM;QAEpB;QAEA,IAAIhB,KAAK,QAAQ,KAAKU,eACpBV,KAAK,cAAc,CAACU;IAExB,GAAG;QAACZ;KAAO;IAGXJ,UAAU;QACR,MAAM0B,kBAAkBZ;QACxBF,gBAAgBc,mBAAmBX;IACrC,GAAG;QAACN;KAAM;IAEV,MAAMkB,MAAMC,WAAWC;IAEvB,OAAO,WAAP,GACE,IAACC,mBAAiBA;QAChB,KAAKC,IAAI,SAAS,CAAC,GAAG,CAAC,cAAc;QACrC,cAAc;kBAEb,CAACC,UAAAA,WAAAA,GACA,IAACC,mBAAmB,QAAQ;gBAAC,OAAO;oBAAED;gBAAQ;0BAC5C,mBAACE,QAACA;;sCACA,IAACpC,cAAYA;4BAAC,MAAMkC,SAAS;;wBAC3BL,IAAI,QAAQ,GAA4C,OAAzC,WAAH,GAAG,IAACQ,QAAMA;4BAAC,cAAcxB;;sCACvC,IAACyB,UAAQA,CAAAA;sCACT,KAACF,OAAAA,OAAS;4BACR,OAAO;gCACL,QAAQ;gCACR,WAAW;gCACX,SAASG,KAAK,WAAW;gCACzB,WAAW,AAACV,IAAI,QAAQ,GAAuB,IAApBU,KAAK,YAAY;gCAC5C,YAAYC;4BACd;;gCAEC9B;8CACD,IAAC+B,YAAY,OAAO;;;;;;;AAOlC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components/Layout/project-info-context.mjs","sources":["../../../src/components/Layout/project-info-context.tsx"],"sourcesContent":["import { createContext, useContext } from 'react';\nimport { SDK } from '@rsdoctor/types';\n\nexport interface ProjectInfoContextValue {\n project: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetProjectInfo> | null;\n}\n\nexport const ProjectInfoContext = createContext<ProjectInfoContextValue>({\n project: null,\n});\n\nexport function useProjectInfo() {\n return useContext(ProjectInfoContext);\n}\n"],"names":["ProjectInfoContext","createContext","useProjectInfo","useContext"],"mappings":";AAOO,MAAMA,qBAAqB,
|
|
1
|
+
{"version":3,"file":"components/Layout/project-info-context.mjs","sources":["../../../src/components/Layout/project-info-context.tsx"],"sourcesContent":["import { createContext, useContext } from 'react';\nimport { SDK } from '@rsdoctor/types';\n\nexport interface ProjectInfoContextValue {\n project: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetProjectInfo> | null;\n}\n\nexport const ProjectInfoContext = createContext<ProjectInfoContextValue>({\n project: null,\n});\n\nexport function useProjectInfo() {\n return useContext(ProjectInfoContext);\n}\n"],"names":["ProjectInfoContext","createContext","useProjectInfo","useContext"],"mappings":";AAOO,MAAMA,qBAAqB,WAAHA,GAAGC,cAAuC;IACvE,SAAS;AACX;AAEO,SAASC;IACd,OAAOC,WAAWH;AACpB"}
|