@rsdoctor/components 1.2.0-beta.1 → 1.2.0

package/dist/components/Alerts/bundle-alert.mjs

@@ -9,7 +9,7 @@ import bundle_alert_module from "./bundle-alert.module.mjs";
 import { useState } from "react";
 import { CrossChunksAlertCollapse } from "./collapse-cross-chunks.mjs";
 const BundleAlert = ({ title, dataSource, extraData })=>{
-    const [activekey, setActiveKey] = useState('E1001');
+    const [activeKey, setActiveKey] = useState('E1001');
     const tabData = [
         {
             key: 'E1001',
@@ -43,11 +43,11 @@ const BundleAlert = ({ title, dataSource, extraData })=>{
         null == target || target.push(data);
     });
     const tabItems = tabData.map((td)=>{
-        const tagStyle = activekey === td.key ? {
+        const tagStyle = activeKey === td.key ? {
             border: '1px solid #91D5FF',
             backgroundColor: '#E6F7FF'
         } : {};
-        const tagTextStyle = activekey === td.key ? {
+        const tagTextStyle = activeKey === td.key ? {
             color: '#1890FF'
         } : {};
         const LabelComponent = ()=>/*#__PURE__*/ jsx(Overview, {

package/dist/components/Alerts/bundle-alert.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"components/Alerts/bundle-alert.mjs","sources":["webpack://@rsdoctor/components/./src/components/Alerts/bundle-alert.tsx"],"sourcesContent":["import { Tabs, Empty, Tag } from 'antd';\n\nimport { Card } from '../Card';\nimport { ECMAVersionCheck } from '../Alert/ecma-version-check';\nimport { Overview } from '../Overall/overview';\nimport { AlertCollapse } from './collapse';\nimport { CommonList } from './list';\nimport { ViewMode } from '../../constants';\n\nimport { AlertProps } from '../Alert/types';\n\nimport type { Rule } from '@rsdoctor/types';\n\nimport styles from './bundle-alert.module.scss';\nimport { CSSProperties, useState } from 'react';\nimport { CrossChunksAlertCollapse } from './collapse-cross-chunks';\n\ninterface BundleAlertProps {\n  title: string;\n  cwd: string;\n  dataSource: Rule.RuleStoreDataItem[];\n  extraData: Omit<AlertProps, 'data'>;\n  viewMode: ViewMode;\n  setViewMode(mode: ViewMode): void;\n  extraCom?: JSX.Element | undefined;\n}\n\nexport const BundleAlert: React.FC<BundleAlertProps> = ({\n  title,\n  dataSource,\n  extraData,\n}) => {\n  const [activekey, setActiveKey] = useState('E1001');\n  const tabData: Array<{\n    key: string;\n    label: string;\n    data: Array<Rule.RuleStoreDataItem>;\n  }> = [\n    {\n      key: 'E1001',\n      label: 'Duplicate Packages',\n      data: [],\n    },\n    {\n      key: 'E1002',\n      label: 'Cross Chunks Package',\n      data: [],\n    },\n    {\n      key: 'E1003',\n      label: 'Loader Performance Optimization',\n      data: [],\n    },\n    {\n      key: 'E1004',\n      label: 'ECMA Version Check',\n      data: [],\n    },\n    {\n      key: 'E1005',\n      label: 'Default Import Check',\n      data: [],\n    },\n  ];\n\n  dataSource.forEach((data) => {\n    const target = tabData.find((td) => td.key === data.code)?.data;\n    target?.push(data);\n  });\n\n  const tabItems = tabData.map((td) => {\n    const tagStyle =\n      activekey === td.key\n        ? ({\n            border: '1px solid #91D5FF',\n            backgroundColor: '#E6F7FF',\n          } as CSSProperties)\n        : {};\n\n    const tagTextStyle =\n      activekey === td.key\n        ? {\n            color: '#1890FF',\n          }\n        : {};\n\n    const LabelComponent = () => (\n      <Overview\n        style={{\n          backgroundColor: 'transparent',\n          paddingLeft: 0,\n          paddingRight: 0,\n          width: '100%',\n        }}\n        title={<span className={styles.labelTitle}>{td.label}</span>}\n        description={\n          <div className={styles.labelDescription}>\n            <span>{td.data.length}</span>\n            <Tag\n              style={{ fontFamily: 'Menlo', borderRadius: '2px', ...tagStyle }}\n            >\n              <span style={{ ...tagTextStyle }}>{td.key}</span>\n            </Tag>\n          </div>\n        }\n      />\n    );\n\n    let children, description;\n    switch (td.key) {\n      case 'E1001':\n        children = <AlertCollapse data={td.data} extraData={extraData} />;\n        break;\n      case 'E1002':\n        children = (\n          <CrossChunksAlertCollapse data={td.data} extraData={extraData} />\n        );\n        break;\n      case 'E1003':\n        children = <CommonList data={td.data} />;\n        break;\n      case 'E1004':\n        description = (\n          <span>\n            No ECMA Version Check Rules were found. Please refer to\n            「https://rsdoctor.rs/guide/usage/rule-config」.\n          </span>\n        );\n        children = <ECMAVersionCheck data={td.data} />;\n        break;\n      case 'E1005':\n        children = <CommonList data={td.data} />;\n        break;\n      default:\n        children = null;\n        break;\n    }\n\n    if (!td.data.length) {\n      children = (\n        <Empty description={description} image={Empty.PRESENTED_IMAGE_SIMPLE} />\n      );\n    }\n\n    return {\n      key: td.key,\n      label: <LabelComponent />,\n      children: (\n        <Card\n          className={styles.card}\n          type=\"inner\"\n          title={\n            <>\n              <Tag\n                style={{\n                  fontFamily: 'Menlo',\n                  fontWeight: '700',\n                  fontSize: '13px',\n                  backgroundColor: '#EAEDF1',\n                  borderRadius: '2px',\n                }}\n              >\n                {td.key}\n              </Tag>\n              <span>{td.label}</span>\n            </>\n          }\n        >\n          {children}\n        </Card>\n      ),\n    };\n  });\n\n  return (\n    <Card style={{ width: '100%', borderRadius: '12px' }}>\n      <div className={styles.container}>\n        <div className={styles.title}>{title}</div>\n        {!dataSource.length ? (\n          <div\n            style={{\n              minHeight: '480px',\n              display: 'flex',\n              justifyContent: 'center',\n              alignItems: 'center',\n            }}\n          >\n            <Empty\n              description={'No Bundle Alerts Data'}\n              image={Empty.PRESENTED_IMAGE_SIMPLE}\n            />\n          </div>\n        ) : (\n          <Tabs\n            onChange={setActiveKey}\n            tabBarGutter={10}\n            type=\"card\"\n            defaultActiveKey=\"E1001\"\n            items={tabItems}\n          />\n        )}\n      </div>\n    </Card>\n  );\n};\n"],"names":["BundleAlert","title","dataSource","extraData","activekey","setActiveKey","useState","tabData","data","_tabData_find","target","td","tabItems","tagStyle","tagTextStyle","LabelComponent","Overview","styles","Tag","children","description","AlertCollapse","CrossChunksAlertCollapse","CommonList","ECMAVersionCheck","Empty","Card","Tabs"],"mappings":"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"}
+{"version":3,"file":"components/Alerts/bundle-alert.mjs","sources":["webpack://@rsdoctor/components/./src/components/Alerts/bundle-alert.tsx"],"sourcesContent":["import { Tabs, Empty, Tag } from 'antd';\n\nimport { Card } from '../Card';\nimport { ECMAVersionCheck } from '../Alert/ecma-version-check';\nimport { Overview } from '../Overall/overview';\nimport { AlertCollapse } from './collapse';\nimport { CommonList } from './list';\nimport { ViewMode } from '../../constants';\n\nimport { AlertProps } from '../Alert/types';\n\nimport type { Rule } from '@rsdoctor/types';\n\nimport styles from './bundle-alert.module.scss';\nimport { CSSProperties, useState } from 'react';\nimport { CrossChunksAlertCollapse } from './collapse-cross-chunks';\n\ninterface BundleAlertProps {\n  title: string;\n  cwd: string;\n  dataSource: Rule.RuleStoreDataItem[];\n  extraData: Omit<AlertProps, 'data'>;\n  viewMode: ViewMode;\n  setViewMode(mode: ViewMode): void;\n  extraCom?: JSX.Element | undefined;\n}\n\nexport const BundleAlert: React.FC<BundleAlertProps> = ({\n  title,\n  dataSource,\n  extraData,\n}) => {\n  const [activeKey, setActiveKey] = useState('E1001');\n  const tabData: Array<{\n    key: string;\n    label: string;\n    data: Array<Rule.RuleStoreDataItem>;\n  }> = [\n    {\n      key: 'E1001',\n      label: 'Duplicate Packages',\n      data: [],\n    },\n    {\n      key: 'E1002',\n      label: 'Cross Chunks Package',\n      data: [],\n    },\n    {\n      key: 'E1003',\n      label: 'Loader Performance Optimization',\n      data: [],\n    },\n    {\n      key: 'E1004',\n      label: 'ECMA Version Check',\n      data: [],\n    },\n    {\n      key: 'E1005',\n      label: 'Default Import Check',\n      data: [],\n    },\n  ];\n\n  dataSource.forEach((data) => {\n    const target = tabData.find((td) => td.key === data.code)?.data;\n    target?.push(data);\n  });\n\n  const tabItems = tabData.map((td) => {\n    const tagStyle =\n      activeKey === td.key\n        ? ({\n            border: '1px solid #91D5FF',\n            backgroundColor: '#E6F7FF',\n          } as CSSProperties)\n        : {};\n\n    const tagTextStyle =\n      activeKey === td.key\n        ? {\n            color: '#1890FF',\n          }\n        : {};\n\n    const LabelComponent = () => (\n      <Overview\n        style={{\n          backgroundColor: 'transparent',\n          paddingLeft: 0,\n          paddingRight: 0,\n          width: '100%',\n        }}\n        title={<span className={styles.labelTitle}>{td.label}</span>}\n        description={\n          <div className={styles.labelDescription}>\n            <span>{td.data.length}</span>\n            <Tag\n              style={{ fontFamily: 'Menlo', borderRadius: '2px', ...tagStyle }}\n            >\n              <span style={{ ...tagTextStyle }}>{td.key}</span>\n            </Tag>\n          </div>\n        }\n      />\n    );\n\n    let children, description;\n    switch (td.key) {\n      case 'E1001':\n        children = <AlertCollapse data={td.data} extraData={extraData} />;\n        break;\n      case 'E1002':\n        children = (\n          <CrossChunksAlertCollapse data={td.data} extraData={extraData} />\n        );\n        break;\n      case 'E1003':\n        children = <CommonList data={td.data} />;\n        break;\n      case 'E1004':\n        description = (\n          <span>\n            No ECMA Version Check Rules were found. Please refer to\n            「https://rsdoctor.rs/guide/usage/rule-config」.\n          </span>\n        );\n        children = <ECMAVersionCheck data={td.data} />;\n        break;\n      case 'E1005':\n        children = <CommonList data={td.data} />;\n        break;\n      default:\n        children = null;\n        break;\n    }\n\n    if (!td.data.length) {\n      children = (\n        <Empty description={description} image={Empty.PRESENTED_IMAGE_SIMPLE} />\n      );\n    }\n\n    return {\n      key: td.key,\n      label: <LabelComponent />,\n      children: (\n        <Card\n          className={styles.card}\n          type=\"inner\"\n          title={\n            <>\n              <Tag\n                style={{\n                  fontFamily: 'Menlo',\n                  fontWeight: '700',\n                  fontSize: '13px',\n                  backgroundColor: '#EAEDF1',\n                  borderRadius: '2px',\n                }}\n              >\n                {td.key}\n              </Tag>\n              <span>{td.label}</span>\n            </>\n          }\n        >\n          {children}\n        </Card>\n      ),\n    };\n  });\n\n  return (\n    <Card style={{ width: '100%', borderRadius: '12px' }}>\n      <div className={styles.container}>\n        <div className={styles.title}>{title}</div>\n        {!dataSource.length ? (\n          <div\n            style={{\n              minHeight: '480px',\n              display: 'flex',\n              justifyContent: 'center',\n              alignItems: 'center',\n            }}\n          >\n            <Empty\n              description={'No Bundle Alerts Data'}\n              image={Empty.PRESENTED_IMAGE_SIMPLE}\n            />\n          </div>\n        ) : (\n          <Tabs\n            onChange={setActiveKey}\n            tabBarGutter={10}\n            type=\"card\"\n            defaultActiveKey=\"E1001\"\n            items={tabItems}\n          />\n        )}\n      </div>\n    </Card>\n  );\n};\n"],"names":["BundleAlert","title","dataSource","extraData","activeKey","setActiveKey","useState","tabData","data","_tabData_find","target","td","tabItems","tagStyle","tagTextStyle","LabelComponent","Overview","styles","Tag","children","description","AlertCollapse","CrossChunksAlertCollapse","CommonList","ECMAVersionCheck","Empty","Card","Tabs"],"mappings":"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"}

package/dist/components/Alerts/collapse.mjs

@@ -39,8 +39,15 @@ const LabelComponent = (props)=>{
 const AlertCollapse = (props)=>{
     const { data, extraData } = props;
     const items = data.map((d)=>{
-        const { packages } = d;
+        const data = d;
+        const { packages } = data;
         const totalSize = sumBy(packages, (e)=>e.targetSize.sourceSize);
+        return {
+            totalSize,
+            data
+        };
+    }).sort((a, b)=>b.totalSize - a.totalSize).map(({ data, totalSize })=>{
+        const { packages } = data;
         const totalSizeStr = formatSize(totalSize);
         const { name } = packages.find((e)=>!!e.target.name).target;
         const versions = packages.map((item)=>item.target.version);
@@ -164,7 +171,7 @@ const AlertCollapse = (props)=>{
                 });
             });
         return {
-            key: d.code,
+            key: data.code,
             label: /*#__PURE__*/ jsx(LabelComponent, {
                 title: /*#__PURE__*/ jsx(Tag, {
                     style: {
@@ -201,7 +208,7 @@ const AlertCollapse = (props)=>{
                                 size: 'small'
                             },
                             drawerProps: {
-                                title: d.title,
+                                title: data.title,
                                 width: '60%'
                             },
                             children: /*#__PURE__*/ jsxs(Space, {
@@ -257,7 +264,7 @@ const AlertCollapse = (props)=>{
                                                 }),
                                                 key: `${target.root}${target.name}${target.version}`,
                                                 children: extraData.getPackageRelationContentComponent({
-                                                    data: d,
+                                                    data,
                                                     package: pkg
                                                 })
                                             };

package/dist/components/Alerts/collapse.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"components/Alerts/collapse.mjs","sources":["webpack://@rsdoctor/components/./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 'lodash-es';\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.map((d) => {\n    const { packages } = d as Rule.PackageRelationDiffRuleStoreData;\n    const totalSize = sumBy(packages, (e) => e.targetSize.sourceSize);\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: d.code,\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: d.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: d as Rule.PackageRelationDiffRuleStoreData,\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","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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"}
+{"version":3,"file":"components/Alerts/collapse.mjs","sources":["webpack://@rsdoctor/components/./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 'lodash-es';\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: data.code,\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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"}

package/dist/pages/BundleSize/components/index.mjs

@@ -18,6 +18,7 @@ import index_module from "./index.module.mjs";
 import "./index.css";
 import { SearchModal } from "./search-modal.mjs";
 import { AssetTreemapWithFilter } from "../../../components/Charts/TreeMap.mjs";
+import { Rspack } from "@rsdoctor/utils/common";
 const { Option } = Select;
 const cardBodyHeight = 600;
 const tabList = [
@@ -342,27 +343,18 @@ const WebpackModulesOverallBase = ({ errors, cwd, summary, entryPoints })=>{
                         children: /*#__PURE__*/ jsx(ServerAPIProvider, {
                             api: SDK.ServerAPI.API.GetProjectInfo,
                             children: (data)=>{
-                                var _configs_, _configs__config, _configs_1;
-                                const configs = data.configs;
-                                const isRspack = Array.isArray(configs) && (null == (_configs_ = configs[0]) ? void 0 : _configs_.name) === 'rspack';
-                                const suitableDevtoolConfig = Array.isArray(configs) && (null == (_configs_1 = configs[0]) ? void 0 : null == (_configs__config = _configs_1.config) ? void 0 : _configs__config.devtool) && 'string' == typeof configs[0].config.devtool && configs[0].config.devtool.includes('source-map') && !configs[0].config.devtool.includes('eval');
+                                const { isRspack, hasSourceMap } = Rspack.checkSourceMapSupport(data.configs);
                                 return /*#__PURE__*/ jsx(ServerAPIProvider, {
                                     api: SDK.ServerAPI.API.GetSummaryBundles,
                                     children: (data)=>{
-                                        const computedTreeData = data.map((item)=>{
-                                            const moduleTree = flattenTreemapData(item.modules);
-                                            return {
+                                        const computedTreeData = data.map((item)=>({
                                                 name: item.asset.path,
                                                 value: item.asset.size,
-                                                children: moduleTree.children
-                                            };
-                                        });
+                                                children: flattenTreemapData(item.modules).children
+                                            }));
                                         return /*#__PURE__*/ jsx(AssetTreemapWithFilter, {
                                             treeData: computedTreeData,
-                                            bundledSize: suitableDevtoolConfig || isRspack,
-                                            onChartClick: (i)=>{
-                                                console.log('onChartClick', i);
-                                            }
+                                            bundledSize: hasSourceMap || isRspack
                                         });
                                     }
                                 });

package/dist/pages/BundleSize/components/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"pages/BundleSize/components/index.mjs","sources":["webpack://@rsdoctor/components/./src/pages/BundleSize/components/index.tsx"],"sourcesContent":["import {\n  CodeOutlined,\n  CodepenCircleOutlined,\n  DeploymentUnitOutlined,\n  InfoCircleOutlined,\n} from '@ant-design/icons';\nimport { Client, SDK } from '@rsdoctor/types';\nimport {\n  Button,\n  Card,\n  Col,\n  Divider,\n  Empty,\n  InputNumber,\n  Row,\n  Select,\n  Space,\n  Tag,\n  Tooltip,\n  Typography,\n} from 'antd';\nimport { debounce, sumBy } from 'lodash-es';\nimport React, { useCallback, useEffect, useMemo, useState } from 'react';\nimport { useCodeDrawer } from 'src/components/base/CodeViewer/useCodeDrawer';\nimport { Badge as Bdg } from '../../../components/Badge';\nimport { FileTree } from '../../../components/FileTree';\nimport { KeywordInput } from '../../../components/Form/keyword';\nimport { Keyword } from '../../../components/Keyword';\nimport { ServerAPIProvider, withServerAPI } from '../../../components/Manifest';\nimport { Size } from '../../../constants';\nimport {\n  createFileStructures,\n  flattenTreemapData,\n  formatSize,\n  useI18n,\n} from '../../../utils';\nimport { GraphType } from '../constants';\nimport { AssetDetail } from './asset';\nimport { BundleCards } from './cards';\nimport styles from './index.module.scss';\nimport './index.sass';\nimport { SearchModal } from './search-modal';\nimport {\n  AssetTreemapWithFilter,\n  TreeNode,\n} from 'src/components/Charts/TreeMap';\n\nconst { Option } = Select;\n\nconst cardBodyHeight = 600;\n\ninterface WebpackModulesOverallProps {\n  cwd: string;\n  errors: SDK.ErrorsData;\n  summary: Client.RsdoctorClientAssetsSummary;\n  entryPoints: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetEntryPoints>;\n}\nconst tabList = [\n  {\n    key: 'tree',\n    label: (\n      <Space>\n        <Typography.Text>{'Tree Graph'}</Typography.Text>\n        <Tooltip\n          overlayStyle={{ maxWidth: 380 }}\n          overlayInnerStyle={{ marginLeft: 16, padding: 10 }}\n          color=\"white\"\n          title={\n            <Space direction=\"vertical\" color=\"white\" size=\"middle\">\n              <Row>\n                <Col>\n                  <Tag color=\"cyan\" style={{ margin: 0 }}>\n                    initial\n                  </Tag>\n                  <Typography.Text style={{ marginLeft: 4 }}>\n                    Identify whether the chunk is an initial chunk.\n                  </Typography.Text>\n                </Col>\n              </Row>\n              <Row>\n                <Col>\n                  <Tag color=\"green\" style={{ margin: 0 }}>\n                    concatenated\n                  </Tag>\n                  <Typography.Text style={{ marginLeft: 4 }}>\n                    Identify whether the module is a concatenated module\n                  </Typography.Text>\n                  <Tooltip\n                    overlayStyle={{ maxWidth: 408 }}\n                    placement=\"bottom\"\n                    color=\"white\"\n                    title={\n                      <Space direction=\"vertical\" color=\"white\">\n                        <Row>\n                          <Col>\n                            <Typography.Text strong>\n                              Concatenated Module\n                            </Typography.Text>\n                            <Typography.Text>\n                              : A performance optimization where multiple\n                              modules are merged (or \"hoisted\") into a single\n                              scope instead of wrapping each module in separate\n                              function closures. This reduces the bundle size\n                              and improves runtime performance by minimizing\n                              function call overhead.\n                            </Typography.Text>\n                          </Col>\n                        </Row>\n                      </Space>\n                    }\n                  >\n                    <InfoCircleOutlined\n                      style={{ color: 'rgba(0,0,0,.45)', marginLeft: 4 }}\n                    />\n                  </Tooltip>\n                  <Typography.Text>.</Typography.Text>\n                </Col>\n              </Row>\n              <Row>\n                <Col>\n                  <Button size=\"small\" icon={<CodepenCircleOutlined />} />\n                  <Typography.Text style={{ marginLeft: 4 }}>\n                    Open the code.\n                  </Typography.Text>\n                </Col>\n              </Row>\n              <Row>\n                <Col>\n                  <Button size=\"small\" icon={<DeploymentUnitOutlined />} />\n                  <Typography.Text style={{ marginLeft: 4 }}>\n                    View the module dependency, that is, module reasons in\n                    stats.json.\n                  </Typography.Text>\n                </Col>\n              </Row>\n              <Row>\n                <Col>\n                  <Tag color={'purple'}>{'Bundled: 15.77 KB'}</Tag>\n                  <Typography.Text>\n                    The final size of the output files after processing,\n                    bundling, and optimization. This is what is delivered to the\n                    browser.\n                  </Typography.Text>\n                </Col>\n              </Row>\n              <Row>\n                <Col>\n                  <Tag color={'orange'}>{'Source: 60.46 KB'}</Tag>\n                  <Typography.Text>\n                    The original size of your source code files before any\n                    processing or transformations. This is the raw size of your\n                    code as you wrote it.\n                  </Typography.Text>\n                </Col>\n              </Row>\n            </Space>\n          }\n        >\n          <InfoCircleOutlined style={{ color: 'rgba(0,0,0,.45)' }} />\n        </Tooltip>\n      </Space>\n    ),\n  },\n  {\n    key: 'tile',\n    label: 'Tile Graph',\n  },\n];\n\nexport const WebpackModulesOverallBase: React.FC<\n  WebpackModulesOverallProps\n> = ({ errors, cwd, summary, entryPoints }) => {\n  const [selectedEntryPoints, setEntryPoints] = useState<SDK.EntryPointData[]>(\n    [],\n  );\n  const [inputModule, setModuleValue] = useState(0);\n  const [inputAssetName, setAssetName] = useState('');\n  const [inputAssetSize, setAssetSize] = useState(0);\n  const [defaultExpandAll, setDefaultExpandAll] = useState(false);\n  const [inputModuleUnit, setModuleUnit] = useState('');\n  const [inputChunkUnit, setChunkUnit] = useState('');\n  const [assetPath, setAssetPath] = useState<string | null>(null);\n  const [graphType, setGraphType] = useState('tree' as GraphType);\n  const { showCode, codeDrawerComponent } = useCodeDrawer(\n    'Do not have the codes of assets. If you use the lite or brief mode, there will have codes.',\n  );\n\n  const { t } = useI18n();\n\n  const assets = summary.all.total.files;\n\n  const handleChange = useCallback(\n    (type: string) => (value: string) => {\n      if (type === 'module') {\n        setModuleUnit(value);\n      } else if (type === 'chunk') {\n        setChunkUnit(value);\n      }\n    },\n    [],\n  );\n\n  const selectAfter = (type: string) => (\n    <Select defaultValue=\"kb\" onChange={handleChange(type)}>\n      <Option value=\"kb\">KB</Option>\n      <Option value=\"mb\">MB</Option>\n    </Select>\n  );\n  const onChangeModule = useCallback(\n    debounce((newValue: number) => {\n      const count =\n        inputModuleUnit === 'mb' ? newValue * 1024 * 1024 : newValue * 1024;\n      setModuleValue(count);\n    }, 300),\n    [],\n  );\n\n  const onChangeAsset = useCallback(\n    debounce((newValue: number) => {\n      const count =\n        inputChunkUnit === 'mb' ? newValue * 1024 * 1024 : newValue * 1024;\n      setAssetSize(count);\n    }, 300),\n    [],\n  );\n\n  const filteredAssets = useMemo(() => {\n    let res = assets.slice();\n\n    if (inputAssetName) {\n      res = res.filter((e) => e.path.indexOf(inputAssetName) > -1);\n    }\n\n    if (inputAssetSize > 0) {\n      res = res.filter((e) => e.size >= inputAssetSize);\n    }\n\n    if (selectedEntryPoints.length) {\n      res = res.filter((e) => {\n        if (selectedEntryPoints.some((ep) => ep.assets.includes(e.path))) {\n          return true;\n        }\n        return false;\n      });\n    }\n\n    return res.sort((a, b) => {\n      const _a = a.path.indexOf('/') > -1 ? 1 : 0;\n      const _b = b.path.indexOf('/') > -1 ? 1 : 0;\n      // return _a - _b;\n      return _b - _a;\n    });\n  }, [assets, selectedEntryPoints, inputAssetName, inputAssetSize]);\n\n  useEffect(() => {\n    function getFileExtension(filePath: string) {\n      const parts = filePath.split('.');\n      return parts.length > 1 ? parts.pop() : '';\n    }\n\n    summary.all.total.files.forEach((f) => {\n      const ext = getFileExtension(f.path);\n      if (ext === 'js') {\n        setAssetPath(f.path);\n      }\n    });\n  }, [summary.all.total.files]);\n\n  const assetsStructures = useMemo(() => {\n    const res = createFileStructures({\n      files: filteredAssets.map((e) => e.path).filter(Boolean),\n      fileTitle(file, basename) {\n        const target = filteredAssets.find((e) => e.path === file)!;\n        const { size, initial, path, content } = target;\n\n        return (\n          <div\n            className={styles.assetBox}\n            onClick={() => {\n              setAssetPath(path);\n            }}\n          >\n            <Keyword text={basename} keyword={''} className={styles.fileText} />\n            <Space size=\"small\" className={styles.assetsTag}>\n              <Divider type=\"vertical\" />\n              <Typography.Text style={{ color: '#4FD233' }}>\n                {formatSize(size)}\n              </Typography.Text>\n              <Divider type=\"vertical\" />\n              {initial ? (\n                <Typography.Text style={{ color: '#009A9E' }}>\n                  initial\n                </Typography.Text>\n              ) : null}\n              <CodeOutlined\n                style={{ fontSize: 14, padding: 0 }}\n                onClick={() => showCode({ code: content!, filePath: path })}\n              />\n            </Space>\n          </div>\n        );\n      },\n    });\n    return res;\n  }, [filteredAssets]);\n\n  const onSearch = (value: string) => {\n    setAssetName(value);\n    setDefaultExpandAll(false);\n  };\n\n  return (\n    <>\n      <div className=\"bundle-size-card\">\n        <BundleCards cwd={cwd} errors={errors} summary={summary} />\n        <Card\n          className=\"bundle-size=card\"\n          tabList={tabList}\n          activeTabKey={graphType as 'tree' | 'tile'}\n          onTabChange={(e) => setGraphType(e as 'tree' | 'tile')}\n          hidden={graphType === 'tree'}\n          tabProps={{\n            size: 'middle',\n          }}\n        >\n          <ServerAPIProvider api={SDK.ServerAPI.API.GetProjectInfo}>\n            {(data) => {\n              const configs = data.configs;\n              const isRspack =\n                Array.isArray(configs) && configs[0]?.name === 'rspack';\n              const suitableDevtoolConfig =\n                Array.isArray(configs) &&\n                configs[0]?.config?.devtool &&\n                typeof configs[0].config.devtool === 'string' &&\n                configs[0].config.devtool.includes('source-map') &&\n                !configs[0].config.devtool.includes('eval');\n              return (\n                <ServerAPIProvider api={SDK.ServerAPI.API.GetSummaryBundles}>\n                  {(data) => {\n                    const computedTreeData: TreeNode[] = data.map((item) => {\n                      const moduleTree = flattenTreemapData(item.modules);\n                      return {\n                        name: item.asset.path,\n                        value: item.asset.size,\n                        children: moduleTree.children,\n                      };\n                    });\n                    return (\n                      <AssetTreemapWithFilter\n                        treeData={computedTreeData}\n                        bundledSize={suitableDevtoolConfig || isRspack}\n                        onChartClick={(i) => {\n                          console.log('onChartClick', i);\n                        }}\n                      />\n                    );\n                  }}\n                </ServerAPIProvider>\n              );\n            }}\n          </ServerAPIProvider>\n        </Card>\n\n        <Card\n          hidden={graphType === 'tile'}\n          tabList={tabList}\n          activeTabKey={graphType as 'tree' | 'tile'}\n          onTabChange={(e) => setGraphType(e as 'tree' | 'tile')}\n          tabProps={{\n            size: 'middle',\n          }}\n        >\n          <Space direction=\"vertical\">\n            <Row align=\"middle\" gutter={[Size.BasePadding, Size.BasePadding]}>\n              {entryPoints && entryPoints.length ? (\n                <Col>\n                  <Select\n                    mode=\"multiple\"\n                    value={selectedEntryPoints.map((e) => e.name)}\n                    style={{ minWidth: 230, width: 'auto', maxWidth: 300 }}\n                    placeholder={'filter assets by entry point'}\n                    onChange={(name: string[]) => {\n                      setEntryPoints(\n                        name\n                          .map((e) => entryPoints.find((ep) => ep.name === e)!)\n                          .filter(Boolean),\n                      );\n                    }}\n                    allowClear\n                    onClear={() => {\n                      setEntryPoints([]);\n                    }}\n                  >\n                    {entryPoints.map((e) => {\n                      return (\n                        <Select.Option key={e.name} value={e.name}>\n                          <Space>\n                            <Bdg\n                              label={e.name}\n                              value={formatSize(e.size)}\n                              tooltip={e.name}\n                            />\n                          </Space>\n                        </Select.Option>\n                      );\n                    })}\n                  </Select>\n                </Col>\n              ) : null}\n              <Col>\n                <KeywordInput\n                  placeholder=\"search asset by keyword\"\n                  onChange={onSearch}\n                />\n              </Col>\n              <Col span={6}>\n                <InputNumber\n                  min={0}\n                  style={{ width: '95%' }}\n                  addonBefore={\n                    <Space>\n                      <Typography.Text\n                        style={{ fontSize: 14, color: 'inherit' }}\n                      >\n                        Asset Size\n                      </Typography.Text>\n                      <Tooltip\n                        title={t(\n                          'filter the output assets which size is greater than the input value',\n                        )}\n                        style={{ marginLeft: 3 }}\n                      >\n                        <InfoCircleOutlined\n                          style={{ color: 'rgba(0,0,0,.45)' }}\n                        />\n                      </Tooltip>\n                    </Space>\n                  }\n                  onChange={(value) => onChangeAsset(Number(value))}\n                  addonAfter={selectAfter('chunk')}\n                />\n              </Col>\n              <Col span={6}>\n                <InputNumber\n                  min={0}\n                  style={{ width: '95%' }}\n                  addonBefore={\n                    <Space>\n                      <Typography.Text\n                        style={{ fontSize: 14, color: 'inherit' }}\n                      >\n                        Module Size\n                      </Typography.Text>\n                      <Tooltip\n                        title={t(\n                          'filter the modules which size is greater than the input value',\n                        )}\n                        style={{ marginLeft: 3 }}\n                      >\n                        <InfoCircleOutlined\n                          style={{ color: 'rgba(0,0,0,.45)' }}\n                        />\n                      </Tooltip>\n                    </Space>\n                  }\n                  onChange={(value) => {\n                    onChangeModule(Number(value));\n                  }}\n                  addonAfter={selectAfter('module')}\n                />\n              </Col>\n            </Row>\n            <Row>\n              <SearchModal />\n            </Row>\n            <Row align=\"middle\" gutter={[Size.BasePadding, Size.BasePadding]}>\n              <Col span={24}>\n                {filteredAssets.length ? (\n                  <Row gutter={Size.BasePadding}>\n                    <Col span={6}>\n                      <Card\n                        title={\n                          <Space>\n                            <Typography.Text>\n                              {t('Output Assets List')}\n                            </Typography.Text>\n                            <Divider type=\"vertical\" />\n                            <Tooltip\n                              title={`total assets count is ${assets.length}, the filtered assets count is ${filteredAssets.length}`}\n                            >\n                              <Typography.Text\n                                type=\"secondary\"\n                                style={{ fontSize: 12, fontWeight: 400 }}\n                              >\n                                {filteredAssets.length} / {assets.length}\n                              </Typography.Text>\n                            </Tooltip>\n                            <Divider type=\"vertical\" />\n                            <Typography.Text\n                              type=\"secondary\"\n                              style={{ fontSize: 12, fontWeight: 400 }}\n                            >\n                              {formatSize(sumBy(filteredAssets, (e) => e.size))}\n                            </Typography.Text>\n                          </Space>\n                        }\n                        size=\"small\"\n                        bodyStyle={{\n                          overflow: 'scroll',\n                          height: cardBodyHeight,\n                        }}\n                      >\n                        <FileTree\n                          className={styles.assets}\n                          treeData={assetsStructures}\n                          autoExpandParent\n                          defaultExpandAll={\n                            defaultExpandAll || filteredAssets.length <= 20\n                          }\n                          key={`tree_${inputAssetName}_${defaultExpandAll}`}\n                        />\n                      </Card>\n                    </Col>\n                    <Col span={18}>\n                      {assetPath ? (\n                        <ServerAPIProvider\n                          api={SDK.ServerAPI.API.GetAssetDetails}\n                          body={{ assetPath }}\n                        >\n                          {(details) => (\n                            <AssetDetail\n                              asset={details.asset}\n                              chunks={details.chunks}\n                              modules={details.modules}\n                              height={cardBodyHeight}\n                              moduleSizeLimit={inputModule}\n                              root={cwd}\n                            />\n                          )}\n                        </ServerAPIProvider>\n                      ) : (\n                        <Card\n                          bodyStyle={{\n                            height: cardBodyHeight,\n                          }}\n                        >\n                          <Empty\n                            description={\n                              <Typography.Text strong>\n                                Click the file path on the left to show the\n                                modules of the asset\n                              </Typography.Text>\n                            }\n                          />\n                        </Card>\n                      )}\n                    </Col>\n                  </Row>\n                ) : (\n                  <Empty />\n                )}\n              </Col>\n            </Row>\n          </Space>\n        </Card>\n      </div>\n      {codeDrawerComponent}\n    </>\n  );\n};\n\nexport const WebpackModulesOverall = withServerAPI({\n  api: SDK.ServerAPI.API.GetProjectInfo,\n  responsePropName: 'project',\n  Component: (props: {\n    project: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetProjectInfo>;\n  }) => {\n    const { root, errors } = props.project;\n    return (\n      <ServerAPIProvider\n        api={SDK.ServerAPI.API.GetAssetsSummary}\n        body={{ withFileContent: true }}\n      >\n        {(summary) => {\n          return (\n            <ServerAPIProvider api={SDK.ServerAPI.API.GetEntryPoints}>\n              {(entryPoints) => (\n                <WebpackModulesOverallBase\n                  cwd={root}\n                  errors={errors}\n                  summary={summary}\n                  entryPoints={entryPoints}\n                />\n              )}\n            </ServerAPIProvider>\n          );\n        }}\n      </ServerAPIProvider>\n    );\n  },\n});\n"],"names":["Option","Select","cardBodyHeight","tabList","Space","Typography","Tooltip","Row","Col","Tag","InfoCircleOutlined","Button","CodepenCircleOutlined","DeploymentUnitOutlined","WebpackModulesOverallBase","errors","cwd","summary","entryPoints","selectedEntryPoints","setEntryPoints","useState","inputModule","setModuleValue","inputAssetName","setAssetName","inputAssetSize","setAssetSize","defaultExpandAll","setDefaultExpandAll","inputModuleUnit","setModuleUnit","inputChunkUnit","setChunkUnit","assetPath","setAssetPath","graphType","setGraphType","showCode","codeDrawerComponent","useCodeDrawer","t","useI18n","assets","handleChange","useCallback","type","value","selectAfter","onChangeModule","debounce","newValue","count","onChangeAsset","filteredAssets","useMemo","res","e","ep","a","b","_a","_b","useEffect","getFileExtension","filePath","parts","f","ext","assetsStructures","createFileStructures","Boolean","file","basename","target","size","initial","path","content","styles","Keyword","Divider","formatSize","CodeOutlined","onSearch","BundleCards","Card","ServerAPIProvider","SDK","data","_configs_","_configs__config","configs","isRspack","Array","suitableDevtoolConfig","computedTreeData","item","moduleTree","flattenTreemapData","AssetTreemapWithFilter","i","console","Size","name","Bdg","KeywordInput","InputNumber","Number","SearchModal","sumBy","FileTree","details","AssetDetail","Empty","WebpackModulesOverall","withServerAPI","props","root"],"mappings":"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"}
+{"version":3,"file":"pages/BundleSize/components/index.mjs","sources":["webpack://@rsdoctor/components/./src/pages/BundleSize/components/index.tsx"],"sourcesContent":["import {\n  CodeOutlined,\n  CodepenCircleOutlined,\n  DeploymentUnitOutlined,\n  InfoCircleOutlined,\n} from '@ant-design/icons';\nimport { Client, SDK } from '@rsdoctor/types';\nimport {\n  Button,\n  Card,\n  Col,\n  Divider,\n  Empty,\n  InputNumber,\n  Row,\n  Select,\n  Space,\n  Tag,\n  Tooltip,\n  Typography,\n} from 'antd';\nimport { debounce, sumBy } from 'lodash-es';\nimport React, { useCallback, useEffect, useMemo, useState } from 'react';\nimport { useCodeDrawer } from 'src/components/base/CodeViewer/useCodeDrawer';\nimport { Badge as Bdg } from '../../../components/Badge';\nimport { FileTree } from '../../../components/FileTree';\nimport { KeywordInput } from '../../../components/Form/keyword';\nimport { Keyword } from '../../../components/Keyword';\nimport { ServerAPIProvider, withServerAPI } from '../../../components/Manifest';\nimport { Size } from '../../../constants';\nimport {\n  createFileStructures,\n  flattenTreemapData,\n  formatSize,\n  useI18n,\n} from '../../../utils';\nimport { GraphType } from '../constants';\nimport { AssetDetail } from './asset';\nimport { BundleCards } from './cards';\nimport styles from './index.module.scss';\nimport './index.sass';\nimport { SearchModal } from './search-modal';\nimport {\n  AssetTreemapWithFilter,\n  TreeNode,\n} from 'src/components/Charts/TreeMap';\nimport { Rspack } from '@rsdoctor/utils/common';\n\nconst { Option } = Select;\n\nconst cardBodyHeight = 600;\n\ninterface WebpackModulesOverallProps {\n  cwd: string;\n  errors: SDK.ErrorsData;\n  summary: Client.RsdoctorClientAssetsSummary;\n  entryPoints: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetEntryPoints>;\n}\nconst tabList = [\n  {\n    key: 'tree',\n    label: (\n      <Space>\n        <Typography.Text>{'Tree Graph'}</Typography.Text>\n        <Tooltip\n          overlayStyle={{ maxWidth: 380 }}\n          overlayInnerStyle={{ marginLeft: 16, padding: 10 }}\n          color=\"white\"\n          title={\n            <Space direction=\"vertical\" color=\"white\" size=\"middle\">\n              <Row>\n                <Col>\n                  <Tag color=\"cyan\" style={{ margin: 0 }}>\n                    initial\n                  </Tag>\n                  <Typography.Text style={{ marginLeft: 4 }}>\n                    Identify whether the chunk is an initial chunk.\n                  </Typography.Text>\n                </Col>\n              </Row>\n              <Row>\n                <Col>\n                  <Tag color=\"green\" style={{ margin: 0 }}>\n                    concatenated\n                  </Tag>\n                  <Typography.Text style={{ marginLeft: 4 }}>\n                    Identify whether the module is a concatenated module\n                  </Typography.Text>\n                  <Tooltip\n                    overlayStyle={{ maxWidth: 408 }}\n                    placement=\"bottom\"\n                    color=\"white\"\n                    title={\n                      <Space direction=\"vertical\" color=\"white\">\n                        <Row>\n                          <Col>\n                            <Typography.Text strong>\n                              Concatenated Module\n                            </Typography.Text>\n                            <Typography.Text>\n                              : A performance optimization where multiple\n                              modules are merged (or \"hoisted\") into a single\n                              scope instead of wrapping each module in separate\n                              function closures. This reduces the bundle size\n                              and improves runtime performance by minimizing\n                              function call overhead.\n                            </Typography.Text>\n                          </Col>\n                        </Row>\n                      </Space>\n                    }\n                  >\n                    <InfoCircleOutlined\n                      style={{ color: 'rgba(0,0,0,.45)', marginLeft: 4 }}\n                    />\n                  </Tooltip>\n                  <Typography.Text>.</Typography.Text>\n                </Col>\n              </Row>\n              <Row>\n                <Col>\n                  <Button size=\"small\" icon={<CodepenCircleOutlined />} />\n                  <Typography.Text style={{ marginLeft: 4 }}>\n                    Open the code.\n                  </Typography.Text>\n                </Col>\n              </Row>\n              <Row>\n                <Col>\n                  <Button size=\"small\" icon={<DeploymentUnitOutlined />} />\n                  <Typography.Text style={{ marginLeft: 4 }}>\n                    View the module dependency, that is, module reasons in\n                    stats.json.\n                  </Typography.Text>\n                </Col>\n              </Row>\n              <Row>\n                <Col>\n                  <Tag color={'purple'}>{'Bundled: 15.77 KB'}</Tag>\n                  <Typography.Text>\n                    The final size of the output files after processing,\n                    bundling, and optimization. This is what is delivered to the\n                    browser.\n                  </Typography.Text>\n                </Col>\n              </Row>\n              <Row>\n                <Col>\n                  <Tag color={'orange'}>{'Source: 60.46 KB'}</Tag>\n                  <Typography.Text>\n                    The original size of your source code files before any\n                    processing or transformations. This is the raw size of your\n                    code as you wrote it.\n                  </Typography.Text>\n                </Col>\n              </Row>\n            </Space>\n          }\n        >\n          <InfoCircleOutlined style={{ color: 'rgba(0,0,0,.45)' }} />\n        </Tooltip>\n      </Space>\n    ),\n  },\n  {\n    key: 'tile',\n    label: 'Tile Graph',\n  },\n];\n\nexport const WebpackModulesOverallBase: React.FC<\n  WebpackModulesOverallProps\n> = ({ errors, cwd, summary, entryPoints }) => {\n  const [selectedEntryPoints, setEntryPoints] = useState<SDK.EntryPointData[]>(\n    [],\n  );\n  const [inputModule, setModuleValue] = useState(0);\n  const [inputAssetName, setAssetName] = useState('');\n  const [inputAssetSize, setAssetSize] = useState(0);\n  const [defaultExpandAll, setDefaultExpandAll] = useState(false);\n  const [inputModuleUnit, setModuleUnit] = useState('');\n  const [inputChunkUnit, setChunkUnit] = useState('');\n  const [assetPath, setAssetPath] = useState<string | null>(null);\n  const [graphType, setGraphType] = useState('tree' as GraphType);\n  const { showCode, codeDrawerComponent } = useCodeDrawer(\n    'Do not have the codes of assets. If you use the lite or brief mode, there will have codes.',\n  );\n\n  const { t } = useI18n();\n\n  const assets = summary.all.total.files;\n\n  const handleChange = useCallback(\n    (type: string) => (value: string) => {\n      if (type === 'module') {\n        setModuleUnit(value);\n      } else if (type === 'chunk') {\n        setChunkUnit(value);\n      }\n    },\n    [],\n  );\n\n  const selectAfter = (type: string) => (\n    <Select defaultValue=\"kb\" onChange={handleChange(type)}>\n      <Option value=\"kb\">KB</Option>\n      <Option value=\"mb\">MB</Option>\n    </Select>\n  );\n  const onChangeModule = useCallback(\n    debounce((newValue: number) => {\n      const count =\n        inputModuleUnit === 'mb' ? newValue * 1024 * 1024 : newValue * 1024;\n      setModuleValue(count);\n    }, 300),\n    [],\n  );\n\n  const onChangeAsset = useCallback(\n    debounce((newValue: number) => {\n      const count =\n        inputChunkUnit === 'mb' ? newValue * 1024 * 1024 : newValue * 1024;\n      setAssetSize(count);\n    }, 300),\n    [],\n  );\n\n  const filteredAssets = useMemo(() => {\n    let res = assets.slice();\n\n    if (inputAssetName) {\n      res = res.filter((e) => e.path.indexOf(inputAssetName) > -1);\n    }\n\n    if (inputAssetSize > 0) {\n      res = res.filter((e) => e.size >= inputAssetSize);\n    }\n\n    if (selectedEntryPoints.length) {\n      res = res.filter((e) => {\n        if (selectedEntryPoints.some((ep) => ep.assets.includes(e.path))) {\n          return true;\n        }\n        return false;\n      });\n    }\n\n    return res.sort((a, b) => {\n      const _a = a.path.indexOf('/') > -1 ? 1 : 0;\n      const _b = b.path.indexOf('/') > -1 ? 1 : 0;\n      // return _a - _b;\n      return _b - _a;\n    });\n  }, [assets, selectedEntryPoints, inputAssetName, inputAssetSize]);\n\n  useEffect(() => {\n    function getFileExtension(filePath: string) {\n      const parts = filePath.split('.');\n      return parts.length > 1 ? parts.pop() : '';\n    }\n\n    summary.all.total.files.forEach((f) => {\n      const ext = getFileExtension(f.path);\n      if (ext === 'js') {\n        setAssetPath(f.path);\n      }\n    });\n  }, [summary.all.total.files]);\n\n  const assetsStructures = useMemo(() => {\n    const res = createFileStructures({\n      files: filteredAssets.map((e) => e.path).filter(Boolean),\n      fileTitle(file, basename) {\n        const target = filteredAssets.find((e) => e.path === file)!;\n        const { size, initial, path, content } = target;\n\n        return (\n          <div\n            className={styles.assetBox}\n            onClick={() => {\n              setAssetPath(path);\n            }}\n          >\n            <Keyword text={basename} keyword={''} className={styles.fileText} />\n            <Space size=\"small\" className={styles.assetsTag}>\n              <Divider type=\"vertical\" />\n              <Typography.Text style={{ color: '#4FD233' }}>\n                {formatSize(size)}\n              </Typography.Text>\n              <Divider type=\"vertical\" />\n              {initial ? (\n                <Typography.Text style={{ color: '#009A9E' }}>\n                  initial\n                </Typography.Text>\n              ) : null}\n              <CodeOutlined\n                style={{ fontSize: 14, padding: 0 }}\n                onClick={() => showCode({ code: content!, filePath: path })}\n              />\n            </Space>\n          </div>\n        );\n      },\n    });\n    return res;\n  }, [filteredAssets]);\n\n  const onSearch = (value: string) => {\n    setAssetName(value);\n    setDefaultExpandAll(false);\n  };\n\n  return (\n    <>\n      <div className=\"bundle-size-card\">\n        <BundleCards cwd={cwd} errors={errors} summary={summary} />\n        <Card\n          className=\"bundle-size=card\"\n          tabList={tabList}\n          activeTabKey={graphType as 'tree' | 'tile'}\n          onTabChange={(e) => setGraphType(e as 'tree' | 'tile')}\n          hidden={graphType === 'tree'}\n          tabProps={{\n            size: 'middle',\n          }}\n        >\n          <ServerAPIProvider api={SDK.ServerAPI.API.GetProjectInfo}>\n            {(data) => {\n              const { isRspack, hasSourceMap } = Rspack.checkSourceMapSupport(\n                data.configs,\n              );\n              return (\n                <ServerAPIProvider api={SDK.ServerAPI.API.GetSummaryBundles}>\n                  {(data) => {\n                    const computedTreeData: TreeNode[] = data.map((item) => ({\n                      name: item.asset.path,\n                      value: item.asset.size,\n                      children: flattenTreemapData(item.modules).children,\n                    }));\n                    return (\n                      <AssetTreemapWithFilter\n                        treeData={computedTreeData}\n                        bundledSize={hasSourceMap || isRspack}\n                      />\n                    );\n                  }}\n                </ServerAPIProvider>\n              );\n            }}\n          </ServerAPIProvider>\n        </Card>\n\n        <Card\n          hidden={graphType === 'tile'}\n          tabList={tabList}\n          activeTabKey={graphType as 'tree' | 'tile'}\n          onTabChange={(e) => setGraphType(e as 'tree' | 'tile')}\n          tabProps={{\n            size: 'middle',\n          }}\n        >\n          <Space direction=\"vertical\">\n            <Row align=\"middle\" gutter={[Size.BasePadding, Size.BasePadding]}>\n              {entryPoints && entryPoints.length ? (\n                <Col>\n                  <Select\n                    mode=\"multiple\"\n                    value={selectedEntryPoints.map((e) => e.name)}\n                    style={{ minWidth: 230, width: 'auto', maxWidth: 300 }}\n                    placeholder={'filter assets by entry point'}\n                    onChange={(name: string[]) => {\n                      setEntryPoints(\n                        name\n                          .map((e) => entryPoints.find((ep) => ep.name === e)!)\n                          .filter(Boolean),\n                      );\n                    }}\n                    allowClear\n                    onClear={() => {\n                      setEntryPoints([]);\n                    }}\n                  >\n                    {entryPoints.map((e) => {\n                      return (\n                        <Select.Option key={e.name} value={e.name}>\n                          <Space>\n                            <Bdg\n                              label={e.name}\n                              value={formatSize(e.size)}\n                              tooltip={e.name}\n                            />\n                          </Space>\n                        </Select.Option>\n                      );\n                    })}\n                  </Select>\n                </Col>\n              ) : null}\n              <Col>\n                <KeywordInput\n                  placeholder=\"search asset by keyword\"\n                  onChange={onSearch}\n                />\n              </Col>\n              <Col span={6}>\n                <InputNumber\n                  min={0}\n                  style={{ width: '95%' }}\n                  addonBefore={\n                    <Space>\n                      <Typography.Text\n                        style={{ fontSize: 14, color: 'inherit' }}\n                      >\n                        Asset Size\n                      </Typography.Text>\n                      <Tooltip\n                        title={t(\n                          'filter the output assets which size is greater than the input value',\n                        )}\n                        style={{ marginLeft: 3 }}\n                      >\n                        <InfoCircleOutlined\n                          style={{ color: 'rgba(0,0,0,.45)' }}\n                        />\n                      </Tooltip>\n                    </Space>\n                  }\n                  onChange={(value) => onChangeAsset(Number(value))}\n                  addonAfter={selectAfter('chunk')}\n                />\n              </Col>\n              <Col span={6}>\n                <InputNumber\n                  min={0}\n                  style={{ width: '95%' }}\n                  addonBefore={\n                    <Space>\n                      <Typography.Text\n                        style={{ fontSize: 14, color: 'inherit' }}\n                      >\n                        Module Size\n                      </Typography.Text>\n                      <Tooltip\n                        title={t(\n                          'filter the modules which size is greater than the input value',\n                        )}\n                        style={{ marginLeft: 3 }}\n                      >\n                        <InfoCircleOutlined\n                          style={{ color: 'rgba(0,0,0,.45)' }}\n                        />\n                      </Tooltip>\n                    </Space>\n                  }\n                  onChange={(value) => {\n                    onChangeModule(Number(value));\n                  }}\n                  addonAfter={selectAfter('module')}\n                />\n              </Col>\n            </Row>\n            <Row>\n              <SearchModal />\n            </Row>\n            <Row align=\"middle\" gutter={[Size.BasePadding, Size.BasePadding]}>\n              <Col span={24}>\n                {filteredAssets.length ? (\n                  <Row gutter={Size.BasePadding}>\n                    <Col span={6}>\n                      <Card\n                        title={\n                          <Space>\n                            <Typography.Text>\n                              {t('Output Assets List')}\n                            </Typography.Text>\n                            <Divider type=\"vertical\" />\n                            <Tooltip\n                              title={`total assets count is ${assets.length}, the filtered assets count is ${filteredAssets.length}`}\n                            >\n                              <Typography.Text\n                                type=\"secondary\"\n                                style={{ fontSize: 12, fontWeight: 400 }}\n                              >\n                                {filteredAssets.length} / {assets.length}\n                              </Typography.Text>\n                            </Tooltip>\n                            <Divider type=\"vertical\" />\n                            <Typography.Text\n                              type=\"secondary\"\n                              style={{ fontSize: 12, fontWeight: 400 }}\n                            >\n                              {formatSize(sumBy(filteredAssets, (e) => e.size))}\n                            </Typography.Text>\n                          </Space>\n                        }\n                        size=\"small\"\n                        bodyStyle={{\n                          overflow: 'scroll',\n                          height: cardBodyHeight,\n                        }}\n                      >\n                        <FileTree\n                          className={styles.assets}\n                          treeData={assetsStructures}\n                          autoExpandParent\n                          defaultExpandAll={\n                            defaultExpandAll || filteredAssets.length <= 20\n                          }\n                          key={`tree_${inputAssetName}_${defaultExpandAll}`}\n                        />\n                      </Card>\n                    </Col>\n                    <Col span={18}>\n                      {assetPath ? (\n                        <ServerAPIProvider\n                          api={SDK.ServerAPI.API.GetAssetDetails}\n                          body={{ assetPath }}\n                        >\n                          {(details) => (\n                            <AssetDetail\n                              asset={details.asset}\n                              chunks={details.chunks}\n                              modules={details.modules}\n                              height={cardBodyHeight}\n                              moduleSizeLimit={inputModule}\n                              root={cwd}\n                            />\n                          )}\n                        </ServerAPIProvider>\n                      ) : (\n                        <Card\n                          bodyStyle={{\n                            height: cardBodyHeight,\n                          }}\n                        >\n                          <Empty\n                            description={\n                              <Typography.Text strong>\n                                Click the file path on the left to show the\n                                modules of the asset\n                              </Typography.Text>\n                            }\n                          />\n                        </Card>\n                      )}\n                    </Col>\n                  </Row>\n                ) : (\n                  <Empty />\n                )}\n              </Col>\n            </Row>\n          </Space>\n        </Card>\n      </div>\n      {codeDrawerComponent}\n    </>\n  );\n};\n\nexport const WebpackModulesOverall = withServerAPI({\n  api: SDK.ServerAPI.API.GetProjectInfo,\n  responsePropName: 'project',\n  Component: (props: {\n    project: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetProjectInfo>;\n  }) => {\n    const { root, errors } = props.project;\n    return (\n      <ServerAPIProvider\n        api={SDK.ServerAPI.API.GetAssetsSummary}\n        body={{ withFileContent: true }}\n      >\n        {(summary) => {\n          return (\n            <ServerAPIProvider api={SDK.ServerAPI.API.GetEntryPoints}>\n              {(entryPoints) => (\n                <WebpackModulesOverallBase\n                  cwd={root}\n                  errors={errors}\n                  summary={summary}\n                  entryPoints={entryPoints}\n                />\n              )}\n            </ServerAPIProvider>\n          );\n        }}\n      </ServerAPIProvider>\n    );\n  },\n});\n"],"names":["Option","Select","cardBodyHeight","tabList","Space","Typography","Tooltip","Row","Col","Tag","InfoCircleOutlined","Button","CodepenCircleOutlined","DeploymentUnitOutlined","WebpackModulesOverallBase","errors","cwd","summary","entryPoints","selectedEntryPoints","setEntryPoints","useState","inputModule","setModuleValue","inputAssetName","setAssetName","inputAssetSize","setAssetSize","defaultExpandAll","setDefaultExpandAll","inputModuleUnit","setModuleUnit","inputChunkUnit","setChunkUnit","assetPath","setAssetPath","graphType","setGraphType","showCode","codeDrawerComponent","useCodeDrawer","t","useI18n","assets","handleChange","useCallback","type","value","selectAfter","onChangeModule","debounce","newValue","count","onChangeAsset","filteredAssets","useMemo","res","e","ep","a","b","_a","_b","useEffect","getFileExtension","filePath","parts","f","ext","assetsStructures","createFileStructures","Boolean","file","basename","target","size","initial","path","content","styles","Keyword","Divider","formatSize","CodeOutlined","onSearch","BundleCards","Card","ServerAPIProvider","SDK","data","isRspack","hasSourceMap","Rspack","computedTreeData","item","flattenTreemapData","AssetTreemapWithFilter","Size","name","Bdg","KeywordInput","InputNumber","Number","SearchModal","sumBy","FileTree","details","AssetDetail","Empty","WebpackModulesOverall","withServerAPI","props","root"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rsdoctor/components",
-  "version": "1.2.0-beta.1",
+  "version": "1.2.0",
   "license": "MIT",
   "types": "dist/index.d.ts",
   "repository": {
@@ -76,9 +76,13 @@
     "react-router-dom": "6.4.3",
     "socket.io-client": "4.6.1",
     "url-parse": "1.5.10",
-    "@rsdoctor/types": "1.2.0-beta.1",
-    "@rsdoctor/utils": "1.2.0-beta.1",
-    "@rsdoctor/graph": "1.2.0-beta.1"
+    "@rsdoctor/graph": "1.2.0",
+    "@rsdoctor/utils": "1.2.0",
+    "@rsdoctor/types": "1.2.0"
+  },
+  "peerDependencies": {
+    "react": ">=18.3.1",
+    "react-dom": ">=18.3.1"
   },
   "publishConfig": {
     "access": "public",