@rsdoctor/components 1.5.3 → 1.5.4
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 +37 -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-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/time.mjs +1 -1
- package/dist/utils/time.mjs.map +1 -1
- package/package.json +8 -8
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components/Alerts/collapse.mjs","sources":["../../../src/components/Alerts/collapse.tsx"],"sourcesContent":["import { ReactNode } from 'react';\nimport { Collapse, Typography, Divider, Space, Tabs, Tag, Tooltip } from 'antd';\nimport Icon from '@ant-design/icons';\nimport { sumBy } from 'es-toolkit/compat';\n\nimport Overview from '../Overall/overview';\nimport { TextDrawer } from '../TextDrawer';\nimport { Title } from '../Title';\nimport { Size } from '../../constants';\nimport { formatSize } from '../../utils';\nimport BundleSizeSvg from '../../common/svg/bundle-size.svg';\nimport SourceSizeSvg from '../../common/svg/source-size.svg';\nimport TotalSizeSvg from '../../common/svg/total-size.svg';\nimport VersionSvg from '../../common/svg/version.svg';\n\nimport type { Rule } from '@rsdoctor/types';\n\nimport type { AlertProps } from '../Alert/types';\n\nimport styles from './collapse.module.scss';\n\nconst { Paragraph, Text } = Typography;\nconst { innerWidth } = window;\n\nconst LabelComponent = (props: {\n title: string | ReactNode;\n description: string;\n extra: ReactNode;\n}) => {\n const { title, description, extra } = props;\n return (\n <div className={styles.label}>\n <div className={styles.labelContent}>\n <div>{title}</div>\n <div>{description}</div>\n </div>\n <div>{extra}</div>\n </div>\n );\n};\n\nexport const AlertCollapse = (props: {\n data: Array<Rule.RuleStoreDataItem>;\n extraData: Omit<AlertProps, 'data'>;\n}) => {\n const { data, extraData } = props;\n\n const items = data\n .map((d) => {\n const data = d as Rule.PackageRelationDiffRuleStoreData;\n const { packages } = data;\n const totalSize = sumBy(packages, (e) => e.targetSize.sourceSize);\n\n return {\n totalSize,\n data,\n };\n })\n .sort((a, b) => {\n return b.totalSize - a.totalSize;\n })\n .map(({ data, totalSize }) => {\n const { packages } = data;\n const totalSizeStr = formatSize(totalSize);\n const { name } = packages.find((e) => !!e.target.name)!.target;\n const versions = packages.map((item) => item.target.version);\n\n const ChildComponent = () => {\n return packages.map((pkg, idx) => {\n const version = pkg.target.version;\n const root = pkg.target.root;\n const sizeStr = formatSize(pkg.targetSize.sourceSize);\n const parsedSizeStr = pkg.targetSize.parsedSize\n ? formatSize(pkg.targetSize.parsedSize)\n : null;\n\n return (\n <div className={styles.collapseContainer}>\n <Overview\n style={{ backgroundColor: '#fff' }}\n title={\n <Text\n style={{ width: innerWidth > 1500 ? 900 : 700 }}\n ellipsis={{\n tooltip: root,\n }}\n >\n {root}\n </Text>\n }\n description={\n <div className={styles.collapseChild}>\n <div>\n <div className={styles.attribute}>Version</div>\n <div className={styles.iconContainer}>\n <Icon\n style={{ fontSize: '18px' }}\n component={VersionSvg}\n />\n <span className={styles.data}>v{version}</span>\n </div>\n </div>\n <div>\n <div className={styles.attribute}>Source size</div>\n <div className={styles.iconContainer}>\n <Icon\n style={{ fontSize: '18px' }}\n component={SourceSizeSvg}\n />\n <span className={styles.data}>{sizeStr}</span>\n </div>\n </div>\n <div>\n <div className={styles.attribute}>Bundle size</div>\n <div className={styles.iconContainer}>\n <Icon\n style={{ fontSize: '18px' }}\n component={BundleSizeSvg}\n />\n <Tooltip\n title={`The bundle size of \"${name}\" is ${sizeStr}, this is after bundled, concatenated module cannot get bundled size. `}\n >\n <span className={styles.data}>\n {parsedSizeStr || 'CONCATENATED'}\n </span>\n </Tooltip>\n </div>\n </div>\n </div>\n }\n icon={\n <Paragraph\n style={{ position: 'relative', top: '-10px' }}\n copyable={{ text: root }}\n />\n }\n />\n {idx !== packages.length - 1 ? (\n <Divider style={{ margin: '10px 0' }} />\n ) : null}\n </div>\n );\n });\n };\n\n return {\n key: name,\n label: (\n <LabelComponent\n title={\n <Tag style={{ backgroundColor: '#EAEDF1', borderRadius: '2px' }}>\n <span className={styles.pkgName}>{name}</span>\n </Tag>\n }\n description={`${packages.length} versions was found`}\n extra={\n <div className={styles.extraContainer}>\n <div className={styles.iconContainer}>\n <Icon style={{ fontSize: '18px' }} component={TotalSizeSvg} />\n <span className={styles.data}>{totalSizeStr}</span>\n </div>\n {packages && packages.length > 0 ? (\n <TextDrawer\n text=\"Show Relations\"\n buttonProps={{ size: 'small' }}\n drawerProps={{ title: data.title, width: '60%' }}\n >\n <Space\n direction=\"vertical\"\n className=\"alert-space\"\n style={{ width: '100%' }}\n >\n <Space\n style={{\n marginBottom: Size.BasePadding / 2,\n width: '100%',\n }}\n >\n <Title\n text={\n <Tag style={{ backgroundColor: '#EAEDF1' }}>\n {name}\n </Tag>\n }\n upperFirst={false}\n />\n <Typography.Text strong>\n {versions.length}\n </Typography.Text>\n <Typography.Text> versions found</Typography.Text>\n </Space>\n <Tabs\n size=\"middle\"\n items={\n packages.map((pkg) => {\n const { target, targetSize } = pkg;\n return {\n label: (\n <Space className={styles.drawerLabelTitle}>\n <div>v{target.version}</div>\n <Tag className={styles.drawerLabelSize}>\n {formatSize(targetSize.sourceSize)}\n </Tag>\n </Space>\n ),\n key: `${target.root}${target.name}${target.version}`,\n children:\n extraData.getPackageRelationContentComponent({\n data,\n package: pkg,\n }),\n };\n })!\n }\n />\n </Space>\n </TextDrawer>\n ) : null}\n </div>\n }\n />\n ),\n children: <ChildComponent />,\n };\n });\n\n return (\n <Collapse\n style={{ width: '100%' }}\n defaultActiveKey={['E1001']}\n items={items}\n />\n );\n};\n"],"names":["Paragraph","Text","Typography","innerWidth","window","LabelComponent","props","title","description","extra","styles","AlertCollapse","data","extraData","items","d","packages","totalSize","sumBy","e","a","b","totalSizeStr","formatSize","name","versions","item","ChildComponent","pkg","idx","version","root","sizeStr","parsedSizeStr","Overview","Icon","VersionSvg","SourceSizeSvg","BundleSizeSvg","Tooltip","Divider","Tag","TotalSizeSvg","TextDrawer","Space","Size","Title","Tabs","target","targetSize","Collapse"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"components/Alerts/collapse.mjs","sources":["../../../src/components/Alerts/collapse.tsx"],"sourcesContent":["import { Collapse, Typography, Divider, Space, Tabs, Tag, Tooltip } from 'antd';\nimport Icon from '@ant-design/icons';\nimport { sumBy } from 'es-toolkit/compat';\n\nimport Overview from '../Overall/overview';\nimport { TextDrawer } from '../TextDrawer';\nimport { Title } from '../Title';\nimport { Size } from '../../constants';\nimport { formatSize } from '../../utils';\nimport BundleSizeSvg from '../../common/svg/bundle-size.svg';\nimport SourceSizeSvg from '../../common/svg/source-size.svg';\nimport TotalSizeSvg from '../../common/svg/total-size.svg';\nimport VersionSvg from '../../common/svg/version.svg';\n\nimport type { Rule } from '@rsdoctor/types';\n\nimport type { AlertProps } from '../Alert/types';\n\nimport styles from './collapse.module.scss';\nimport { LabelComponent } from './collapse-shared';\n\nconst { Paragraph, Text } = Typography;\nconst { innerWidth } = window;\n\nexport const AlertCollapse = (props: {\n data: Array<Rule.RuleStoreDataItem>;\n extraData: Omit<AlertProps, 'data'>;\n}) => {\n const { data, extraData } = props;\n\n const items = data\n .map((d) => {\n const data = d as Rule.PackageRelationDiffRuleStoreData;\n const { packages } = data;\n const totalSize = sumBy(packages, (e) => e.targetSize.sourceSize);\n\n return {\n totalSize,\n data,\n };\n })\n .sort((a, b) => {\n return b.totalSize - a.totalSize;\n })\n .map(({ data, totalSize }) => {\n const { packages } = data;\n const totalSizeStr = formatSize(totalSize);\n const { name } = packages.find((e) => !!e.target.name)!.target;\n const versions = packages.map((item) => item.target.version);\n\n const ChildComponent = () => {\n return packages.map((pkg, idx) => {\n const version = pkg.target.version;\n const root = pkg.target.root;\n const sizeStr = formatSize(pkg.targetSize.sourceSize);\n const parsedSizeStr = pkg.targetSize.parsedSize\n ? formatSize(pkg.targetSize.parsedSize)\n : null;\n\n return (\n <div className={styles.collapseContainer}>\n <Overview\n style={{ backgroundColor: '#fff' }}\n title={\n <Text\n style={{ width: innerWidth > 1500 ? 900 : 700 }}\n ellipsis={{\n tooltip: root,\n }}\n >\n {root}\n </Text>\n }\n description={\n <div className={styles.collapseChild}>\n <div>\n <div className={styles.attribute}>Version</div>\n <div className={styles.iconContainer}>\n <Icon\n style={{ fontSize: '18px' }}\n component={VersionSvg}\n />\n <span className={styles.data}>v{version}</span>\n </div>\n </div>\n <div>\n <div className={styles.attribute}>Source size</div>\n <div className={styles.iconContainer}>\n <Icon\n style={{ fontSize: '18px' }}\n component={SourceSizeSvg}\n />\n <span className={styles.data}>{sizeStr}</span>\n </div>\n </div>\n <div>\n <div className={styles.attribute}>Bundle size</div>\n <div className={styles.iconContainer}>\n <Icon\n style={{ fontSize: '18px' }}\n component={BundleSizeSvg}\n />\n <Tooltip\n title={`The bundle size of \"${name}\" is ${sizeStr}, this is after bundled, concatenated module cannot get bundled size. `}\n >\n <span className={styles.data}>\n {parsedSizeStr || 'CONCATENATED'}\n </span>\n </Tooltip>\n </div>\n </div>\n </div>\n }\n icon={\n <Paragraph\n style={{ position: 'relative', top: '-10px' }}\n copyable={{ text: root }}\n />\n }\n />\n {idx !== packages.length - 1 ? (\n <Divider style={{ margin: '10px 0' }} />\n ) : null}\n </div>\n );\n });\n };\n\n return {\n key: name,\n label: (\n <LabelComponent\n title={\n <Tag style={{ backgroundColor: '#EAEDF1', borderRadius: '2px' }}>\n <span className={styles.pkgName}>{name}</span>\n </Tag>\n }\n description={`${packages.length} versions was found`}\n extra={\n <div className={styles.extraContainer}>\n <div className={styles.iconContainer}>\n <Icon style={{ fontSize: '18px' }} component={TotalSizeSvg} />\n <span className={styles.data}>{totalSizeStr}</span>\n </div>\n {packages && packages.length > 0 ? (\n <TextDrawer\n text=\"Show Relations\"\n buttonProps={{ size: 'small' }}\n drawerProps={{ title: data.title, width: '60%' }}\n >\n <Space\n direction=\"vertical\"\n className=\"alert-space\"\n style={{ width: '100%' }}\n >\n <Space\n style={{\n marginBottom: Size.BasePadding / 2,\n width: '100%',\n }}\n >\n <Title\n text={\n <Tag style={{ backgroundColor: '#EAEDF1' }}>\n {name}\n </Tag>\n }\n upperFirst={false}\n />\n <Typography.Text strong>\n {versions.length}\n </Typography.Text>\n <Typography.Text> versions found</Typography.Text>\n </Space>\n <Tabs\n size=\"middle\"\n items={\n packages.map((pkg) => {\n const { target, targetSize } = pkg;\n return {\n label: (\n <Space className={styles.drawerLabelTitle}>\n <div>v{target.version}</div>\n <Tag className={styles.drawerLabelSize}>\n {formatSize(targetSize.sourceSize)}\n </Tag>\n </Space>\n ),\n key: `${target.root}${target.name}${target.version}`,\n children:\n extraData.getPackageRelationContentComponent({\n data,\n package: pkg,\n }),\n };\n })!\n }\n />\n </Space>\n </TextDrawer>\n ) : null}\n </div>\n }\n />\n ),\n children: <ChildComponent />,\n };\n });\n\n return (\n <Collapse\n style={{ width: '100%' }}\n defaultActiveKey={['E1001']}\n items={items}\n />\n );\n};\n"],"names":["Paragraph","Text","Typography","innerWidth","window","AlertCollapse","props","data","extraData","items","d","packages","totalSize","sumBy","e","a","b","totalSizeStr","formatSize","name","versions","item","ChildComponent","pkg","idx","version","root","sizeStr","parsedSizeStr","styles","Overview","Icon","VersionSvg","SourceSizeSvg","BundleSizeSvg","Tooltip","Divider","LabelComponent","Tag","TotalSizeSvg","TextDrawer","Space","Size","Title","Tabs","target","targetSize","Collapse"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components/Alerts/overlay.mjs","sources":["../../../src/components/Alerts/overlay.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { SDK } from '@rsdoctor/types';\nimport {\n Alert,\n Button,\n Col,\n Collapse,\n Row,\n Tag,\n Typography,\n Badge,\n} from 'antd';\nimport {\n BugOutlined,\n CloseCircleOutlined,\n DownOutlined,\n RightOutlined,\n} from '@ant-design/icons';\nimport Dialog from 'rc-dialog';\nimport Ansi from 'ansi-to-react';\n\nimport { withServerAPI } from '../Manifest';\nimport { Size, Color } from '../../constants';\n\nimport styles from './overlay.module.scss';\n\nimport 'rc-dialog/assets/index.css';\n\nfunction getOverlayAlertsMessage(\n alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>,\n) {\n let warns = 0;\n let errors = 0;\n\n alerts.forEach((item) => {\n if (item.level === 'warn') {\n warns++;\n } else {\n errors++;\n }\n });\n\n const suffixText =\n warns !== 0 && errors !== 0 ? 'problems' : warns === 0 ? 'errors' : 'warns';\n\n const fontSize = 16;\n\n return {\n title: `${alerts.length} compiled ${suffixText}`,\n detail: (\n <Typography.Text strong style={{ color: '#fff', marginBottom: 0 }}>\n <Typography.Text style={{ color: 'inherit', fontSize }}>\n Compiled with\n </Typography.Text>\n <Typography.Text strong style={{ color: Color.Red, fontSize }}>\n {' '}\n {errors} {errors === 1 ? 'error' : 'errors'}{' '}\n </Typography.Text>\n <Typography.Text style={{ color: 'inherit', fontSize }}>\n and\n </Typography.Text>\n <Typography.Text strong style={{ color: Color.Yellow, fontSize }}>\n {' '}\n {warns} {warns === 1 ? 'warning' : 'warnings'}\n </Typography.Text>\n </Typography.Text>\n ),\n warns,\n errors,\n };\n}\n\nexport const OverlayAlertsModal: React.FC<{\n alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>;\n open: boolean;\n onClose(): void;\n}> = ({ alerts = [], open, onClose }) => {\n if (!alerts.length) return null;\n\n return (\n <Dialog\n visible={open}\n onClose={() => onClose()}\n style={{ width: '100%', height: '100%', margin: 0, zIndex: 1000 }}\n closable={false}\n modalRender={(e) => {\n return React.cloneElement(e as React.ReactElement, {\n style: {\n background: 'rgba(0, 0, 0, 0.7)',\n color: '#fff',\n height: '100%',\n overflow: 'scroll',\n borderRadius: 0,\n },\n });\n }}\n >\n <Row justify=\"space-between\" align=\"middle\">\n {getOverlayAlertsMessage(alerts).detail}\n <Button\n onClick={() => onClose()}\n type=\"text\"\n style={{ color: '#fff' }}\n size=\"large\"\n icon={<CloseCircleOutlined />}\n ></Button>\n </Row>\n <Row gutter={[0, Size.BasePadding]}>\n {alerts.map((e) => {\n return (\n <Col\n span={24}\n key={e.id}\n style={{\n whiteSpace: 'pre-wrap',\n lineHeight: `16px`,\n fontSize: 14,\n }}\n >\n <Collapse\n ghost\n style={{ background: '#000' }}\n defaultActiveKey={[e.id]}\n expandIcon={(e) => {\n return e.isActive ? (\n <DownOutlined style={{ color: '#fff' }} />\n ) : (\n <RightOutlined style={{ color: '#fff' }} />\n );\n }}\n >\n <Collapse.Panel\n header={\n <div style={{ color: '#fff' }}>\n {e.level === 'warn' ? (\n <Tag color={Color.Yellow}>WARNING</Tag>\n ) : (\n <Tag color={Color.Red}>ERROR</Tag>\n )}\n <Ansi>{e.description || e.title}</Ansi>\n </div>\n }\n key={e.id}\n >\n <div style={{ color: '#fff' }}>\n <Ansi>{e.stack}</Ansi>\n </div>\n </Collapse.Panel>\n </Collapse>\n </Col>\n );\n })}\n </Row>\n </Dialog>\n );\n};\n\nexport const OverlayAlertsTips: React.FC<{\n alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>;\n defaultOpen?: boolean;\n}> = ({ alerts = [], defaultOpen = alerts.length > 0 }) => {\n if (!alerts.length) return null;\n\n const [open, setOpen] = useState(defaultOpen);\n\n return (\n <React.Fragment>\n <Alert\n banner\n message={React.cloneElement(getOverlayAlertsMessage(alerts).detail, {\n style: {\n color: '#000',\n },\n })}\n icon={<BugOutlined />}\n action={\n <Button onClick={() => setOpen(true)} size=\"small\">\n More\n </Button>\n }\n ></Alert>\n <OverlayAlertsModal\n alerts={alerts}\n open={open}\n onClose={() => setOpen(false)}\n />\n </React.Fragment>\n );\n};\n\nexport const OverlayAlertsButton: React.FC<{\n alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>;\n}> = ({ alerts = [] }) => {\n if (!alerts.length) return null;\n\n const [open, setOpen] = useState(false);\n\n return (\n <div className={styles.container}>\n <div onClick={() => setOpen(!open)} className={styles.badgeContainer}>\n <Badge count={alerts.length} size=\"small\">\n <BugOutlined style={{ fontSize: 15 }} />\n </Badge>\n </div>\n <OverlayAlertsModal\n alerts={alerts}\n open={open}\n onClose={() => setOpen(false)}\n />\n </div>\n );\n};\n\nexport const OverlayAlertsWithButton = withServerAPI({\n api: SDK.ServerAPI.API.GetOverlayAlerts,\n Component: OverlayAlertsButton,\n responsePropName: 'alerts',\n fallbackComponent: () => null,\n});\n\nexport const OverlayAlertsWithTips = withServerAPI({\n api: SDK.ServerAPI.API.GetOverlayAlerts,\n Component: OverlayAlertsTips,\n responsePropName: 'alerts',\n fallbackComponent: () => null,\n});\n"],"names":["getOverlayAlertsMessage","alerts","warns","errors","item","suffixText","fontSize","Typography","Color","OverlayAlertsModal","open","onClose","Dialog","e","React","Row","Button","CloseCircleOutlined","Size","Col","Collapse","DownOutlined","RightOutlined","Tag","Ansi","OverlayAlertsTips","defaultOpen","setOpen","useState","Alert","BugOutlined","OverlayAlertsButton","styles","Badge","OverlayAlertsWithButton","withServerAPI","SDK","OverlayAlertsWithTips"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"components/Alerts/overlay.mjs","sources":["../../../src/components/Alerts/overlay.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { SDK } from '@rsdoctor/types';\nimport {\n Alert,\n Button,\n Col,\n Collapse,\n Row,\n Tag,\n Typography,\n Badge,\n} from 'antd';\nimport {\n BugOutlined,\n CloseCircleOutlined,\n DownOutlined,\n RightOutlined,\n} from '@ant-design/icons';\nimport Dialog from 'rc-dialog';\nimport Ansi from 'ansi-to-react';\n\nimport { withServerAPI } from '../Manifest';\nimport { Size, Color } from '../../constants';\n\nimport styles from './overlay.module.scss';\n\nimport 'rc-dialog/assets/index.css';\n\nfunction getOverlayAlertsMessage(\n alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>,\n) {\n let warns = 0;\n let errors = 0;\n\n alerts.forEach((item) => {\n if (item.level === 'warn') {\n warns++;\n } else {\n errors++;\n }\n });\n\n const suffixText =\n warns !== 0 && errors !== 0 ? 'problems' : warns === 0 ? 'errors' : 'warns';\n\n const fontSize = 16;\n\n return {\n title: `${alerts.length} compiled ${suffixText}`,\n detail: (\n <Typography.Text strong style={{ color: '#fff', marginBottom: 0 }}>\n <Typography.Text style={{ color: 'inherit', fontSize }}>\n Compiled with\n </Typography.Text>\n <Typography.Text strong style={{ color: Color.Red, fontSize }}>\n {' '}\n {errors} {errors === 1 ? 'error' : 'errors'}{' '}\n </Typography.Text>\n <Typography.Text style={{ color: 'inherit', fontSize }}>\n and\n </Typography.Text>\n <Typography.Text strong style={{ color: Color.Yellow, fontSize }}>\n {' '}\n {warns} {warns === 1 ? 'warning' : 'warnings'}\n </Typography.Text>\n </Typography.Text>\n ),\n warns,\n errors,\n };\n}\n\nexport const OverlayAlertsModal: React.FC<{\n alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>;\n open: boolean;\n onClose(): void;\n}> = ({ alerts = [], open, onClose }) => {\n if (!alerts.length) return null;\n\n return (\n <Dialog\n visible={open}\n onClose={() => onClose()}\n style={{ width: '100%', height: '100%', margin: 0, zIndex: 1000 }}\n closable={false}\n modalRender={(e) => {\n return React.cloneElement(e as React.ReactElement, {\n style: {\n background: 'rgba(0, 0, 0, 0.7)',\n color: '#fff',\n height: '100%',\n overflow: 'scroll',\n borderRadius: 0,\n },\n });\n }}\n >\n <Row justify=\"space-between\" align=\"middle\">\n {getOverlayAlertsMessage(alerts).detail}\n <Button\n onClick={() => onClose()}\n type=\"text\"\n style={{ color: '#fff' }}\n size=\"large\"\n icon={<CloseCircleOutlined />}\n ></Button>\n </Row>\n <Row gutter={[0, Size.BasePadding]}>\n {alerts.map((e) => {\n return (\n <Col\n span={24}\n key={e.id}\n style={{\n whiteSpace: 'pre-wrap',\n lineHeight: `16px`,\n fontSize: 14,\n }}\n >\n <Collapse\n ghost\n style={{ background: '#000' }}\n defaultActiveKey={[e.id]}\n expandIcon={(e) => {\n return e.isActive ? (\n <DownOutlined style={{ color: '#fff' }} />\n ) : (\n <RightOutlined style={{ color: '#fff' }} />\n );\n }}\n >\n <Collapse.Panel\n header={\n <div style={{ color: '#fff' }}>\n {e.level === 'warn' ? (\n <Tag color={Color.Yellow}>WARNING</Tag>\n ) : (\n <Tag color={Color.Red}>ERROR</Tag>\n )}\n <Ansi>{e.description || e.title}</Ansi>\n </div>\n }\n key={e.id}\n >\n <div style={{ color: '#fff' }}>\n <Ansi>{e.stack}</Ansi>\n </div>\n </Collapse.Panel>\n </Collapse>\n </Col>\n );\n })}\n </Row>\n </Dialog>\n );\n};\n\nexport const OverlayAlertsTips: React.FC<{\n alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>;\n defaultOpen?: boolean;\n}> = ({ alerts = [], defaultOpen = alerts.length > 0 }) => {\n if (!alerts.length) return null;\n\n const [open, setOpen] = useState(defaultOpen);\n\n return (\n <React.Fragment>\n <Alert\n banner\n message={React.cloneElement(getOverlayAlertsMessage(alerts).detail, {\n style: {\n color: '#000',\n },\n })}\n icon={<BugOutlined />}\n action={\n <Button onClick={() => setOpen(true)} size=\"small\">\n More\n </Button>\n }\n ></Alert>\n <OverlayAlertsModal\n alerts={alerts}\n open={open}\n onClose={() => setOpen(false)}\n />\n </React.Fragment>\n );\n};\n\nexport const OverlayAlertsButton: React.FC<{\n alerts: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetOverlayAlerts>;\n}> = ({ alerts = [] }) => {\n if (!alerts.length) return null;\n\n const [open, setOpen] = useState(false);\n\n return (\n <div className={styles.container}>\n <div onClick={() => setOpen(!open)} className={styles.badgeContainer}>\n <Badge count={alerts.length} size=\"small\">\n <BugOutlined style={{ fontSize: 15 }} />\n </Badge>\n </div>\n <OverlayAlertsModal\n alerts={alerts}\n open={open}\n onClose={() => setOpen(false)}\n />\n </div>\n );\n};\n\nexport const OverlayAlertsWithButton = withServerAPI({\n api: SDK.ServerAPI.API.GetOverlayAlerts,\n Component: OverlayAlertsButton,\n responsePropName: 'alerts',\n fallbackComponent: () => null,\n});\n\nexport const OverlayAlertsWithTips = withServerAPI({\n api: SDK.ServerAPI.API.GetOverlayAlerts,\n Component: OverlayAlertsTips,\n responsePropName: 'alerts',\n fallbackComponent: () => null,\n});\n"],"names":["getOverlayAlertsMessage","alerts","warns","errors","item","suffixText","fontSize","Typography","Color","OverlayAlertsModal","open","onClose","Dialog","e","React","Row","Button","CloseCircleOutlined","Size","Col","Collapse","DownOutlined","RightOutlined","Tag","Ansi","OverlayAlertsTips","defaultOpen","setOpen","useState","Alert","BugOutlined","OverlayAlertsButton","styles","Badge","OverlayAlertsWithButton","withServerAPI","SDK","OverlayAlertsWithTips"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components/Card/diff.mjs","sources":["../../../src/components/Card/diff.tsx"],"sourcesContent":["import { Client } from '@rsdoctor/types';\nimport { Segmented, Space, Tooltip, Typography } from 'antd';\nimport { Graph } from '@rsdoctor/utils/common';\nimport React, { useState } from 'react';\nimport { formatSize } from '../../utils';\nimport { Color } from '../../constants';\nimport { StatisticCard } from './statistic';\nexport { StatisticCard } from './statistic';\nexport interface DiffCardProps extends Pick<DiffCardContentProps, 'formatter'> {\n titles: Array<string> | [string | React.ReactNode];\n datas: Array<DiffCardContentProps['data']>;\n showPercentInTitle?: boolean;\n}\n\nexport interface DiffCardContentProps {\n data: Client.RsdoctorClientAssetsDiffItem;\n formatter?(\n v: number,\n target: 'baseline' | 'current',\n ): number | string | React.ReactNode;\n}\n\nexport interface PercentProps {\n percent: number;\n state: Client.RsdoctorClientDiffState;\n fontSize?: React.CSSProperties['fontSize'];\n}\n\nexport const SizePercent: React.FC<\n {\n baseline: number;\n current: number;\n } & Omit<PercentProps, 'percent' | 'state'>\n> = ({ baseline, current, ...rest }) => {\n const diff = Graph.diffSize(baseline, current);\n return <Percent {...rest} {...diff} />;\n};\n\nexport const Percent: React.FC<PercentProps> = ({\n percent,\n state,\n fontSize = 14,\n}) => {\n const _percent = +percent.toFixed(2);\n\n if (_percent > 0) {\n const percentText = `${_percent}`;\n\n if (state === Client.RsdoctorClientDiffState.Up) {\n return (\n <Typography.Text strong style={{ fontSize, color: Color.Red }}>\n +{percentText}%\n </Typography.Text>\n );\n }\n\n if (state === Client.RsdoctorClientDiffState.Down) {\n return (\n <Typography.Text strong style={{ fontSize, color: Color.Green }}>\n -{percentText}%\n </Typography.Text>\n );\n }\n }\n\n return null;\n};\n\nexport const DiffCardContent: React.FC<DiffCardContentProps> = ({\n data,\n formatter,\n}) => {\n const { percent, state, size } = data;\n const { baseline, current } = size;\n\n const bSize = formatter\n ? formatter(baseline, 'baseline')\n : formatSize(baseline);\n const cSize = formatter ? formatter(current, 'current') : formatSize(current);\n\n return (\n <Space align=\"start\">\n <Space direction=\"vertical\" style={{ textAlign: 'left' }}>\n <Space>\n <Typography.Text style={{ fontSize: 10, color: 'inherit' }} keyboard>\n Current\n </Typography.Text>\n <Tooltip\n title={\n typeof cSize === 'number' || typeof cSize === 'string'\n ? `Value of Current is ${cSize}`\n : undefined\n }\n >\n <Typography.Text style={{ fontSize: 16, color: 'inherit' }} strong>\n {cSize}\n </Typography.Text>\n </Tooltip>\n <Percent percent={percent} state={state} />\n </Space>\n <Space>\n <Typography.Text style={{ fontSize: 10, color: 'inherit' }} keyboard>\n Baseline\n </Typography.Text>\n <Tooltip\n title={\n typeof bSize === 'number' || typeof bSize === 'string'\n ? `Value of Baseline is ${bSize}`\n : undefined\n }\n >\n <Typography.Text style={{ fontSize: 14 }} type=\"secondary\">\n {bSize}\n </Typography.Text>\n </Tooltip>\n </Space>\n </Space>\n </Space>\n );\n};\n\nexport const DiffCard: React.FC<DiffCardProps> = ({\n titles,\n datas,\n formatter,\n showPercentInTitle,\n}) => {\n const [idx, setIdx] = useState(0);\n\n return (\n <StatisticCard\n title={\n titles.length > 1 ? (\n <Segmented\n defaultValue={titles[idx] as string}\n options={\n showPercentInTitle\n ? titles.map((e, i) => {\n const data = datas[i];\n\n return {\n label: (\n <Space>\n <Typography.Text>{e}</Typography.Text>\n <Percent percent={data.percent} state={data.state} />\n </Space>\n ),\n value: e as string,\n };\n })\n : (titles as string[])\n }\n onChange={(e) => {\n setIdx(titles.indexOf(e as string));\n }}\n size=\"small\"\n style={{ transition: 'transform 0.3s ease' }}\n value={(titles[idx] || titles[0]) as string}\n />\n ) : (\n titles[idx]\n )\n }\n value={<DiffCardContent data={datas[idx]} formatter={formatter} />}\n statisticProps={{\n style: { textAlign: 'left' },\n }}\n />\n );\n};\n"],"names":["SizePercent","baseline","current","rest","diff","Graph","Percent","percent","state","fontSize","_percent","percentText","Client","Typography","Color","DiffCardContent","data","formatter","size","bSize","formatSize","cSize","Space","Tooltip","undefined","DiffCard","titles","datas","showPercentInTitle","idx","setIdx","useState","StatisticCard","Segmented","e","i"],"mappings":";;;;;;;;AA4BO,MAAMA,cAKT,CAAC,EAAEC,QAAQ,EAAEC,OAAO,EAAE,GAAGC,MAAM;IACjC,MAAMC,OAAOC,MAAM,QAAQ,CAACJ,UAAUC;IACtC,OAAO,WAAP,GAAO,IAACI,
|
|
1
|
+
{"version":3,"file":"components/Card/diff.mjs","sources":["../../../src/components/Card/diff.tsx"],"sourcesContent":["import { Client } from '@rsdoctor/types';\nimport { Segmented, Space, Tooltip, Typography } from 'antd';\nimport { Graph } from '@rsdoctor/utils/common';\nimport React, { useState } from 'react';\nimport { formatSize } from '../../utils';\nimport { Color } from '../../constants';\nimport { StatisticCard } from './statistic';\nexport { StatisticCard } from './statistic';\nexport interface DiffCardProps extends Pick<DiffCardContentProps, 'formatter'> {\n titles: Array<string> | [string | React.ReactNode];\n datas: Array<DiffCardContentProps['data']>;\n showPercentInTitle?: boolean;\n}\n\nexport interface DiffCardContentProps {\n data: Client.RsdoctorClientAssetsDiffItem;\n formatter?(\n v: number,\n target: 'baseline' | 'current',\n ): number | string | React.ReactNode;\n}\n\nexport interface PercentProps {\n percent: number;\n state: Client.RsdoctorClientDiffState;\n fontSize?: React.CSSProperties['fontSize'];\n}\n\nexport const SizePercent: React.FC<\n {\n baseline: number;\n current: number;\n } & Omit<PercentProps, 'percent' | 'state'>\n> = ({ baseline, current, ...rest }) => {\n const diff = Graph.diffSize(baseline, current);\n return <Percent {...rest} {...diff} />;\n};\n\nexport const Percent: React.FC<PercentProps> = ({\n percent,\n state,\n fontSize = 14,\n}) => {\n const _percent = +percent.toFixed(2);\n\n if (_percent > 0) {\n const percentText = `${_percent}`;\n\n if (state === Client.RsdoctorClientDiffState.Up) {\n return (\n <Typography.Text strong style={{ fontSize, color: Color.Red }}>\n +{percentText}%\n </Typography.Text>\n );\n }\n\n if (state === Client.RsdoctorClientDiffState.Down) {\n return (\n <Typography.Text strong style={{ fontSize, color: Color.Green }}>\n -{percentText}%\n </Typography.Text>\n );\n }\n }\n\n return null;\n};\n\nexport const DiffCardContent: React.FC<DiffCardContentProps> = ({\n data,\n formatter,\n}) => {\n const { percent, state, size } = data;\n const { baseline, current } = size;\n\n const bSize = formatter\n ? formatter(baseline, 'baseline')\n : formatSize(baseline);\n const cSize = formatter ? formatter(current, 'current') : formatSize(current);\n\n return (\n <Space align=\"start\">\n <Space direction=\"vertical\" style={{ textAlign: 'left' }}>\n <Space>\n <Typography.Text style={{ fontSize: 10, color: 'inherit' }} keyboard>\n Current\n </Typography.Text>\n <Tooltip\n title={\n typeof cSize === 'number' || typeof cSize === 'string'\n ? `Value of Current is ${cSize}`\n : undefined\n }\n >\n <Typography.Text style={{ fontSize: 16, color: 'inherit' }} strong>\n {cSize}\n </Typography.Text>\n </Tooltip>\n <Percent percent={percent} state={state} />\n </Space>\n <Space>\n <Typography.Text style={{ fontSize: 10, color: 'inherit' }} keyboard>\n Baseline\n </Typography.Text>\n <Tooltip\n title={\n typeof bSize === 'number' || typeof bSize === 'string'\n ? `Value of Baseline is ${bSize}`\n : undefined\n }\n >\n <Typography.Text style={{ fontSize: 14 }} type=\"secondary\">\n {bSize}\n </Typography.Text>\n </Tooltip>\n </Space>\n </Space>\n </Space>\n );\n};\n\nexport const DiffCard: React.FC<DiffCardProps> = ({\n titles,\n datas,\n formatter,\n showPercentInTitle,\n}) => {\n const [idx, setIdx] = useState(0);\n\n return (\n <StatisticCard\n title={\n titles.length > 1 ? (\n <Segmented\n defaultValue={titles[idx] as string}\n options={\n showPercentInTitle\n ? titles.map((e, i) => {\n const data = datas[i];\n\n return {\n label: (\n <Space>\n <Typography.Text>{e}</Typography.Text>\n <Percent percent={data.percent} state={data.state} />\n </Space>\n ),\n value: e as string,\n };\n })\n : (titles as string[])\n }\n onChange={(e) => {\n setIdx(titles.indexOf(e as string));\n }}\n size=\"small\"\n style={{ transition: 'transform 0.3s ease' }}\n value={(titles[idx] || titles[0]) as string}\n />\n ) : (\n titles[idx]\n )\n }\n value={<DiffCardContent data={datas[idx]} formatter={formatter} />}\n statisticProps={{\n style: { textAlign: 'left' },\n }}\n />\n );\n};\n"],"names":["SizePercent","baseline","current","rest","diff","Graph","Percent","percent","state","fontSize","_percent","percentText","Client","Typography","Color","DiffCardContent","data","formatter","size","bSize","formatSize","cSize","Space","Tooltip","undefined","DiffCard","titles","datas","showPercentInTitle","idx","setIdx","useState","StatisticCard","Segmented","e","i"],"mappings":"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"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
+
export * from "./diff.mjs";
|
|
1
2
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
3
|
import { useState } from "react";
|
|
3
4
|
import { CaretDownOutlined, CaretRightOutlined } from "@ant-design/icons";
|
|
4
5
|
import { Card, Space } from "antd";
|
|
5
|
-
export * from "./diff.mjs";
|
|
6
6
|
const Card_Card = ({ collapsable = false, children, title, dividerStyle, defaultCollapsed = false, ...rest })=>{
|
|
7
7
|
const [collapsed, setCollapsed] = useState(defaultCollapsed);
|
|
8
8
|
if (title && collapsable) return /*#__PURE__*/ jsx(Card, {
|
|
@@ -9,7 +9,7 @@ import { getFiles } from "../Overall/index.mjs";
|
|
|
9
9
|
import { ServerAPIProvider } from "../Manifest/index.mjs";
|
|
10
10
|
import { SDK } from "@rsdoctor/types";
|
|
11
11
|
import size_module from "./size.module.mjs";
|
|
12
|
-
const { DirectoryTree } = Tree;
|
|
12
|
+
const { DirectoryTree: DirectoryTree } = Tree;
|
|
13
13
|
const height = 100;
|
|
14
14
|
const SizeCard = ({ files, total, showProgress = false, type })=>{
|
|
15
15
|
const fileType = type.toLocaleLowerCase();
|
|
@@ -26,7 +26,7 @@ const SizeCard = ({ files, total, showProgress = false, type })=>{
|
|
|
26
26
|
const { treeData } = getFiles(res[type].total);
|
|
27
27
|
return /*#__PURE__*/ jsxs(Space, {
|
|
28
28
|
style: {
|
|
29
|
-
height
|
|
29
|
+
height: height
|
|
30
30
|
},
|
|
31
31
|
align: "center",
|
|
32
32
|
children: [
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components/Card/size.mjs","sources":["../../../src/components/Card/size.tsx"],"sourcesContent":["import { Empty, Progress, Space, Tree } from 'antd';\nimport { sumBy } from 'es-toolkit/compat';\nimport React, { useMemo } from 'react';\nimport { RightOutlined } from '@ant-design/icons';\n\nimport { formatSize } from 'src/utils';\nimport { TextDrawer } from '../TextDrawer';\nimport { getFiles } from '../Overall';\nimport { ServerAPIProvider } from '../Manifest';\n\nimport { SDK, Client } from '@rsdoctor/types';\n\nimport styles from './size.module.scss';\n\nconst { DirectoryTree } = Tree;\nconst height = 100;\n\nexport interface SizeCardProps {\n files: {\n path: string;\n size: number;\n }[];\n /**\n * total size for origin files\n */\n total: number;\n /**\n * @default false\n */\n showProgress?: boolean;\n tagBgColor: string;\n type: string;\n}\nexport interface bgColorType {\n bgColor: string;\n tagBgColor: string;\n}\n\nexport const SizeCard: React.FC<SizeCardProps> = ({\n files,\n total,\n showProgress = false,\n type,\n}) => {\n const fileType =\n type.toLocaleLowerCase() as keyof Client.RsdoctorClientAssetsSummary;\n const sum = useMemo(() => {\n return sumBy(files, (e) => e.size);\n }, [files]);\n\n return (\n <ServerAPIProvider\n api={SDK.ServerAPI.API.GetAssetsSummary}\n body={{ withFileContent: false }}\n >\n {(res) => {\n const type = fileType.includes('image') ? 'imgs' : fileType;\n const { treeData } = getFiles(res[type].total);\n return (\n <Space style={{ height }} align=\"center\">\n <Progress\n type=\"circle\"\n percent={+((sum / total) * 100).toFixed(2)}\n strokeColor={{ '0%': '#108ee9', '100%': '#108ee9' }}\n strokeWidth={12}\n format={(percent) => (\n <div className={styles.percentContainer}>\n <span style={{ marginTop: '10px' }}>{percent}%</span>\n <span className={styles.percentDescription}>\n total {type}\n </span>\n </div>\n )}\n />\n <div style={{ marginLeft: '10px' }}>\n <div className={styles.dataContainer}>\n <div className={styles.title}>Size</div>\n <div className={styles.description}>{formatSize(sum)}</div>\n </div>\n <TextDrawer\n buttonProps={{\n size: 'small',\n }}\n buttonStyle={{\n fontSize: 'inherit',\n }}\n drawerProps={{\n title: 'Files',\n }}\n text={\n <Space\n style={{ textAlign: showProgress ? 'left' : 'center' }}\n align=\"end\"\n >\n <Space direction=\"vertical\">\n <div className={styles.dataContainer}>\n <div className={styles.title}>\n <span style={{ marginRight: '5px' }}>Files</span>\n <RightOutlined />\n </div>\n </div>\n </Space>\n </Space>\n }\n >\n {treeData.length ? (\n <DirectoryTree\n defaultExpandAll\n selectable={false}\n treeData={treeData}\n rootStyle={{\n minHeight: '800px',\n border: '1px solid rgba(235, 237, 241)',\n }}\n />\n ) : (\n <div\n style={{\n position: 'relative',\n top: '50%',\n transform: 'translateY(-50%)',\n }}\n >\n <Empty style={{ height: '100%' }} />\n </div>\n )}\n </TextDrawer>\n <div className={styles.description}>{files.length}</div>\n </div>\n </Space>\n );\n }}\n </ServerAPIProvider>\n );\n};\n"],"names":["DirectoryTree","Tree","height","SizeCard","files","total","showProgress","type","fileType","sum","useMemo","sumBy","e","ServerAPIProvider","SDK","res","treeData","getFiles","Space","Progress","percent","styles","formatSize","TextDrawer","RightOutlined","Empty"],"mappings":";;;;;;;;;;;AAcA,MAAM,EAAEA,aAAa,EAAE,GAAGC;AAC1B,MAAMC,SAAS;AAuBR,MAAMC,WAAoC,CAAC,EAChDC,KAAK,EACLC,KAAK,EACLC,eAAe,KAAK,EACpBC,IAAI,EACL;IACC,MAAMC,WACJD,KAAK,iBAAiB;IACxB,MAAME,MAAMC,QAAQ,IACXC,MAAMP,OAAO,CAACQ,IAAMA,EAAE,IAAI,GAChC;QAACR;KAAM;IAEV,OAAO,WAAP,GACE,IAACS,mBAAiBA;QAChB,KAAKC,IAAI,SAAS,CAAC,GAAG,CAAC,gBAAgB;QACvC,MAAM;YAAE,iBAAiB;QAAM;kBAE9B,CAACC;YACA,MAAMR,OAAOC,SAAS,QAAQ,CAAC,WAAW,SAASA;YACnD,MAAM,EAAEQ,QAAQ,EAAE,GAAGC,SAASF,GAAG,CAACR,KAAK,CAAC,KAAK;YAC7C,OAAO,WAAP,GACE,KAACW,OAAKA;gBAAC,OAAO;oBAAEhB;gBAAO;gBAAG,OAAM;;kCAC9B,IAACiB,UAAQA;wBACP,MAAK;wBACL,SAAS,CAAE,AAACV,CAAAA,MAAMJ,QAAS,GAAE,EAAG,OAAO,CAAC;wBACxC,aAAa;4BAAE,MAAM;4BAAW,QAAQ;wBAAU;wBAClD,aAAa;wBACb,QAAQ,CAACe,UAAAA,WAAAA,GACP,KAAC;gCAAI,WAAWC,YAAAA,gBAAuB;;kDACrC,KAAC;wCAAK,OAAO;4CAAE,WAAW;wCAAO;;4CAAID;4CAAQ;;;kDAC7C,KAAC;wCAAK,WAAWC,YAAAA,kBAAyB;;4CAAE;4CACnCd;;;;;;kCAKf,KAAC;wBAAI,OAAO;4BAAE,YAAY;wBAAO;;0CAC/B,KAAC;gCAAI,WAAWc,YAAAA,aAAoB;;kDAClC,IAAC;wCAAI,WAAWA,YAAAA,KAAY;kDAAE;;kDAC9B,IAAC;wCAAI,WAAWA,YAAAA,WAAkB;kDAAGC,WAAWb;;;;0CAElD,IAACc,YAAUA;gCACT,aAAa;oCACX,MAAM;gCACR;gCACA,aAAa;oCACX,UAAU;gCACZ;gCACA,aAAa;oCACX,OAAO;gCACT;gCACA,oBACE,IAACL,OAAKA;oCACJ,OAAO;wCAAE,WAAWZ,eAAe,SAAS;oCAAS;oCACrD,OAAM;8CAEN,kBAACY,OAAKA;wCAAC,WAAU;kDACf,kBAAC;4CAAI,WAAWG,YAAAA,aAAoB;sDAClC,mBAAC;gDAAI,WAAWA,YAAAA,KAAY;;kEAC1B,IAAC;wDAAK,OAAO;4DAAE,aAAa;wDAAM;kEAAG;;kEACrC,IAACG,eAAaA,CAAAA;;;;;;0CAOvBR,SAAS,MAAM,GAAG,WAAH,GACd,IAAChB,
|
|
1
|
+
{"version":3,"file":"components/Card/size.mjs","sources":["../../../src/components/Card/size.tsx"],"sourcesContent":["import { Empty, Progress, Space, Tree } from 'antd';\nimport { sumBy } from 'es-toolkit/compat';\nimport React, { useMemo } from 'react';\nimport { RightOutlined } from '@ant-design/icons';\n\nimport { formatSize } from 'src/utils';\nimport { TextDrawer } from '../TextDrawer';\nimport { getFiles } from '../Overall';\nimport { ServerAPIProvider } from '../Manifest';\n\nimport { SDK, Client } from '@rsdoctor/types';\n\nimport styles from './size.module.scss';\n\nconst { DirectoryTree } = Tree;\nconst height = 100;\n\nexport interface SizeCardProps {\n files: {\n path: string;\n size: number;\n }[];\n /**\n * total size for origin files\n */\n total: number;\n /**\n * @default false\n */\n showProgress?: boolean;\n tagBgColor: string;\n type: string;\n}\nexport interface bgColorType {\n bgColor: string;\n tagBgColor: string;\n}\n\nexport const SizeCard: React.FC<SizeCardProps> = ({\n files,\n total,\n showProgress = false,\n type,\n}) => {\n const fileType =\n type.toLocaleLowerCase() as keyof Client.RsdoctorClientAssetsSummary;\n const sum = useMemo(() => {\n return sumBy(files, (e) => e.size);\n }, [files]);\n\n return (\n <ServerAPIProvider\n api={SDK.ServerAPI.API.GetAssetsSummary}\n body={{ withFileContent: false }}\n >\n {(res) => {\n const type = fileType.includes('image') ? 'imgs' : fileType;\n const { treeData } = getFiles(res[type].total);\n return (\n <Space style={{ height }} align=\"center\">\n <Progress\n type=\"circle\"\n percent={+((sum / total) * 100).toFixed(2)}\n strokeColor={{ '0%': '#108ee9', '100%': '#108ee9' }}\n strokeWidth={12}\n format={(percent) => (\n <div className={styles.percentContainer}>\n <span style={{ marginTop: '10px' }}>{percent}%</span>\n <span className={styles.percentDescription}>\n total {type}\n </span>\n </div>\n )}\n />\n <div style={{ marginLeft: '10px' }}>\n <div className={styles.dataContainer}>\n <div className={styles.title}>Size</div>\n <div className={styles.description}>{formatSize(sum)}</div>\n </div>\n <TextDrawer\n buttonProps={{\n size: 'small',\n }}\n buttonStyle={{\n fontSize: 'inherit',\n }}\n drawerProps={{\n title: 'Files',\n }}\n text={\n <Space\n style={{ textAlign: showProgress ? 'left' : 'center' }}\n align=\"end\"\n >\n <Space direction=\"vertical\">\n <div className={styles.dataContainer}>\n <div className={styles.title}>\n <span style={{ marginRight: '5px' }}>Files</span>\n <RightOutlined />\n </div>\n </div>\n </Space>\n </Space>\n }\n >\n {treeData.length ? (\n <DirectoryTree\n defaultExpandAll\n selectable={false}\n treeData={treeData}\n rootStyle={{\n minHeight: '800px',\n border: '1px solid rgba(235, 237, 241)',\n }}\n />\n ) : (\n <div\n style={{\n position: 'relative',\n top: '50%',\n transform: 'translateY(-50%)',\n }}\n >\n <Empty style={{ height: '100%' }} />\n </div>\n )}\n </TextDrawer>\n <div className={styles.description}>{files.length}</div>\n </div>\n </Space>\n );\n }}\n </ServerAPIProvider>\n );\n};\n"],"names":["DirectoryTree","Tree","height","SizeCard","files","total","showProgress","type","fileType","sum","useMemo","sumBy","e","ServerAPIProvider","SDK","res","treeData","getFiles","Space","Progress","percent","styles","formatSize","TextDrawer","RightOutlined","Empty"],"mappings":";;;;;;;;;;;AAcA,MAAM,EAAEA,eAAAA,aAAa,EAAE,GAAGC;AAC1B,MAAMC,SAAS;AAuBR,MAAMC,WAAoC,CAAC,EAChDC,KAAK,EACLC,KAAK,EACLC,eAAe,KAAK,EACpBC,IAAI,EACL;IACC,MAAMC,WACJD,KAAK,iBAAiB;IACxB,MAAME,MAAMC,QAAQ,IACXC,MAAMP,OAAO,CAACQ,IAAMA,EAAE,IAAI,GAChC;QAACR;KAAM;IAEV,OAAO,WAAP,GACE,IAACS,mBAAiBA;QAChB,KAAKC,IAAI,SAAS,CAAC,GAAG,CAAC,gBAAgB;QACvC,MAAM;YAAE,iBAAiB;QAAM;kBAE9B,CAACC;YACA,MAAMR,OAAOC,SAAS,QAAQ,CAAC,WAAW,SAASA;YACnD,MAAM,EAAEQ,QAAQ,EAAE,GAAGC,SAASF,GAAG,CAACR,KAAK,CAAC,KAAK;YAC7C,OAAO,WAAP,GACE,KAACW,OAAKA;gBAAC,OAAO;oBAAEhB,QAAAA;gBAAO;gBAAG,OAAM;;kCAC9B,IAACiB,UAAQA;wBACP,MAAK;wBACL,SAAS,CAAE,AAACV,CAAAA,MAAMJ,QAAS,GAAE,EAAG,OAAO,CAAC;wBACxC,aAAa;4BAAE,MAAM;4BAAW,QAAQ;wBAAU;wBAClD,aAAa;wBACb,QAAQ,CAACe,UAAAA,WAAAA,GACP,KAAC;gCAAI,WAAWC,YAAAA,gBAAuB;;kDACrC,KAAC;wCAAK,OAAO;4CAAE,WAAW;wCAAO;;4CAAID;4CAAQ;;;kDAC7C,KAAC;wCAAK,WAAWC,YAAAA,kBAAyB;;4CAAE;4CACnCd;;;;;;kCAKf,KAAC;wBAAI,OAAO;4BAAE,YAAY;wBAAO;;0CAC/B,KAAC;gCAAI,WAAWc,YAAAA,aAAoB;;kDAClC,IAAC;wCAAI,WAAWA,YAAAA,KAAY;kDAAE;;kDAC9B,IAAC;wCAAI,WAAWA,YAAAA,WAAkB;kDAAGC,WAAWb;;;;0CAElD,IAACc,YAAUA;gCACT,aAAa;oCACX,MAAM;gCACR;gCACA,aAAa;oCACX,UAAU;gCACZ;gCACA,aAAa;oCACX,OAAO;gCACT;gCACA,oBACE,IAACL,OAAKA;oCACJ,OAAO;wCAAE,WAAWZ,eAAe,SAAS;oCAAS;oCACrD,OAAM;8CAEN,kBAACY,OAAKA;wCAAC,WAAU;kDACf,kBAAC;4CAAI,WAAWG,YAAAA,aAAoB;sDAClC,mBAAC;gDAAI,WAAWA,YAAAA,KAAY;;kEAC1B,IAAC;wDAAK,OAAO;4DAAE,aAAa;wDAAM;kEAAG;;kEACrC,IAACG,eAAaA,CAAAA;;;;;;0CAOvBR,SAAS,MAAM,GAAG,WAAH,GACd,IAAChB,eAAaA;oCACZ,kBAAgB;oCAChB,YAAY;oCACZ,UAAUgB;oCACV,WAAW;wCACT,WAAW;wCACX,QAAQ;oCACV;mDAGF,IAAC;oCACC,OAAO;wCACL,UAAU;wCACV,KAAK;wCACL,WAAW;oCACb;8CAEA,kBAACS,OAAKA;wCAAC,OAAO;4CAAE,QAAQ;wCAAO;;;;0CAIrC,IAAC;gCAAI,WAAWJ,YAAAA,WAAkB;0CAAGjB,MAAM,MAAM;;;;;;QAIzD;;AAGN"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { memo, useEffect, 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 { CustomChart } from "echarts/charts";
|
|
5
6
|
import { DataZoomComponent, GridComponent, TooltipComponent } from "echarts/components";
|
|
6
7
|
import { CanvasRenderer } from "echarts/renderers";
|
|
7
8
|
import dayjs from "dayjs";
|
|
8
9
|
import { groupBy } from "es-toolkit/compat";
|
|
9
10
|
import { ChartTypes, PALETTE_COLORS } from "../constants.mjs";
|
|
10
|
-
import * as __rspack_external_echarts_core_d2845954 from "echarts/core";
|
|
11
11
|
const LINE_HEIGHT = 60;
|
|
12
12
|
const TimelineCom = /*#__PURE__*/ memo(({ loaderData, pluginsData, formatterFn, chartType = ChartTypes.Normal, exts = null })=>{
|
|
13
13
|
const data = [];
|
|
@@ -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,
|