@rsdoctor/components 1.3.2 → 1.3.4

package/dist/components/Alert/package-relation.mjs

@@ -1,6 +1,6 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Alert, Button, Col, Divider, Empty, Grid, Row, Space, Tabs, Tag, Timeline, Typography } from "antd";
-import { sumBy } from "lodash-es";
+import { sumBy } from "es-toolkit/compat";
 import { DoubleRightOutlined, ExpandAltOutlined, InfoCircleOutlined } from "@ant-design/icons";
 import { formatSize, useRuleIndexNavigate } from "../../utils/index.mjs";
 import { TextDrawer } from "../TextDrawer/index.mjs";

package/dist/components/Alert/package-relation.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"components/Alert/package-relation.mjs","sources":["webpack://@rsdoctor/components/./src/components/Alert/package-relation.tsx"],"sourcesContent":["/* eslint-disable financial/no-float-calculation */\nimport {\n  Space,\n  Alert,\n  Button,\n  Typography,\n  Divider,\n  Tabs,\n  Row,\n  Col,\n  Timeline,\n  Tag,\n  Empty,\n  Grid,\n} from 'antd';\nimport { sumBy } from 'lodash-es';\nimport {\n  ExpandAltOutlined,\n  InfoCircleOutlined,\n  DoubleRightOutlined,\n} from '@ant-design/icons';\n\nimport { useRuleIndexNavigate, formatSize } from '../../utils';\nimport { TextDrawer } from '../TextDrawer';\nimport { Title } from '../Title';\nimport { Size, Color } from '../../constants';\nimport { Badge as Bdg } from '../Badge';\nimport { withServerAPI } from '../Manifest';\n\nimport { Rule, SDK } from '@rsdoctor/types';\n\nimport { PackageRelationAlertProps } from './types';\n\nimport styles from './package-relation.module.scss';\n\nconst TextDrawerWidth = '60%';\n\nexport const PackageRelationReasons: React.FC<{\n  data: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetPackageRelationAlertDetails>;\n  cwd: string;\n}> = ({ data }) => {\n  return (\n    <Row gutter={Size.BasePadding} wrap={false} align=\"top\">\n      <Col style={{ height: '100%', width: '100%' }}>\n        {data.length ? (\n          <>\n            <Timeline style={{ marginTop: '20px' }}>\n              {data.map((e, i) => {\n                const { dependency, module, relativePath } = e!;\n                const { statements } = dependency;\n                const { start } = statements?.[0]?.position\n                  ? module.isPreferSource\n                    ? statements[0].position.source!\n                    : statements[0].position.transformed\n                  : { start: { line: 0, column: 0 } };\n                const text = `${relativePath}:${start.line}:${\n                  start.column || 1\n                }`;\n\n                return (\n                  <Timeline.Item key={text} style={{ cursor: 'default' }}>\n                    <Typography.Text>\n                      <div className={styles.filePath}>\n                        {text}\n                        <Typography.Paragraph\n                          copyable={{ text: relativePath }}\n                          style={{ position: 'relative', top: '7px' }}\n                        />\n                      </div>\n                      {i !== data.length - 1 ? (\n                        <DoubleRightOutlined className={styles.arrow} />\n                      ) : null}\n                    </Typography.Text>\n                  </Timeline.Item>\n                );\n              })}\n            </Timeline>\n          </>\n        ) : (\n          <Empty description={'This package no dependencies'} />\n        )}\n      </Col>\n    </Row>\n  );\n};\n\nexport const PackageRelationReasonsWithServer = withServerAPI({\n  Component: PackageRelationReasons,\n  api: SDK.ServerAPI.API.GetPackageRelationAlertDetails,\n  responsePropName: 'data',\n});\n\nexport const PackageRelationAlert: React.FC<PackageRelationAlertProps> = ({\n  data,\n  getPackageRelationContentComponent,\n}) => {\n  const { level, code, packages } = data;\n\n  const navigate = useRuleIndexNavigate(code, data.link);\n  const totalSize = sumBy(packages, (e) => e.targetSize.sourceSize);\n  const totalSizeStr = formatSize(totalSize);\n  const { xs, lg, xxl } = Grid.useBreakpoint();\n  const { name } = packages.find((e) => !!e.target.name)!.target;\n\n  const versions = packages.map((item) => item.target.version);\n\n  return (\n    <Alert\n      showIcon={!xs}\n      message={\n        <Space\n          wrap\n          split={xs ? null : <Divider type=\"vertical\" />}\n          align=\"center\"\n        >\n          <Space wrap={false}>\n            <Typography.Text\n              code\n              strong\n              onClick={navigate}\n              style={{ cursor: 'pointer' }}\n            >\n              <a>{code}</a>\n            </Typography.Text>\n            <Typography.Text strong>\n              {Rule.RuleErrorMap[code as keyof Rule.RuleErrorCodes]?.title ||\n                data.title}\n            </Typography.Text>\n          </Space>\n          <Typography.Paragraph\n            ellipsis={{ rows: 1 }}\n            style={{ marginBottom: 0 }}\n          >\n            <Typography.Text strong code>\n              {name}\n            </Typography.Text>\n            <Typography.Text strong> {data.packages.length}</Typography.Text>\n            <Typography.Text> versions was found</Typography.Text>\n          </Typography.Paragraph>\n          <Bdg\n            label={'total size'}\n            value={totalSizeStr}\n            type=\"error\"\n            tooltip={`total size of ${data.packages.length} versions is ${totalSizeStr}`}\n          />\n        </Space>\n      }\n      description={\n        <Space direction=\"vertical\" wrap={false}>\n          {data.packages.map(({ target: el, targetSize: size }) => {\n            const sizeStr = formatSize(size.sourceSize);\n            const parsedSizeStr = size.parsedSize\n              ? formatSize(size.parsedSize)\n              : null;\n            const name = `${el.name}@${el.version}`;\n            return (\n              <Space\n                key={el.version}\n                style={{ wordBreak: 'break-all' }}\n                align=\"center\"\n                split={xs ? null : <Divider type=\"vertical\" />}\n                wrap\n              >\n                <Space wrap={false}>\n                  <Typography.Text style={{ marginLeft: 4 }}>└</Typography.Text>\n                  <Bdg\n                    label={el.name}\n                    value={`v${el.version}`}\n                    tooltip={name}\n                  />\n                </Space>\n                <Space>\n                  <Bdg\n                    label={\n                      <div color={'rgb(255, 255, 255)'}>\n                        Source Size <InfoCircleOutlined />\n                      </div>\n                    }\n                    value={sizeStr}\n                    tooltip={`The bundle size of \"${name}\" is ${sizeStr}, this is source size.`}\n                    type=\"error\"\n                  />\n                  <Bdg\n                    label=\"Bundled size\"\n                    value={parsedSizeStr || 'CONCATENATED'}\n                    tooltip={`The bundle size of \"${name}\" is ${sizeStr}, this is after bundled, concatenated module cannot get bundled size. `}\n                    type=\"error\"\n                  />\n                </Space>\n\n                <Typography.Paragraph\n                  style={{\n                    marginBottom: 0,\n                    width: xxl ? '40rem' : lg ? '30rem' : '20rem',\n                  }}\n                  copyable={{ text: el.root }}\n                  ellipsis={{\n                    rows: 1,\n                    expandable: true,\n                    symbol: <ExpandAltOutlined />,\n                    tooltip: el.root,\n                  }}\n                  code\n                >\n                  {el.root}\n                </Typography.Paragraph>\n              </Space>\n            );\n          })}\n        </Space>\n      }\n      type={level === 'warn' ? 'info' : level}\n      action={\n        <>\n          {packages && packages.length > 0 ? (\n            <TextDrawer\n              text=\"Show Relations\"\n              buttonProps={{ size: 'small' }}\n              drawerProps={{ title: data.title, width: TextDrawerWidth }}\n            >\n              <Space direction=\"vertical\" className=\"alert-space\">\n                <Space style={{ marginBottom: Size.BasePadding / 2 }}>\n                  <Title text={name} upperFirst={false} />\n                  <Typography.Text strong>{versions.length}</Typography.Text>\n                  <Typography.Text> versions was found: </Typography.Text>\n                  {versions.map((e) => (\n                    <Typography.Text strong code key={e}>\n                      {e}\n                    </Typography.Text>\n                  ))}\n                </Space>\n                <Tabs\n                  type=\"card\"\n                  size=\"middle\"\n                  className=\"tabs-space\"\n                  defaultActiveKey={versions[0]}\n                  items={\n                    packages.map((pkg) => {\n                      const { target, targetSize } = pkg;\n                      return {\n                        label: (\n                          <Space>\n                            <Typography.Text>{`${name}@${target.version}`}</Typography.Text>\n                            <Tag color={Color.Red}>\n                              {formatSize(targetSize.sourceSize)}\n                            </Tag>\n                          </Space>\n                        ),\n                        key: `${target.root}${target.name}${target.version}`,\n                        children: getPackageRelationContentComponent({\n                          data,\n                          package: pkg,\n                        }),\n                      };\n                    })!\n                  }\n                />\n              </Space>\n            </TextDrawer>\n          ) : null}\n          <Divider type=\"vertical\" />\n          <Button\n            type=\"link\"\n            onClick={navigate}\n            size=\"small\"\n            icon={<InfoCircleOutlined />}\n          />\n        </>\n      }\n    />\n  );\n};\n"],"names":["TextDrawerWidth","PackageRelationReasons","data","Row","Size","Col","Timeline","e","i","_statements_","dependency","module","relativePath","statements","start","text","Typography","styles","DoubleRightOutlined","Empty","PackageRelationReasonsWithServer","withServerAPI","SDK","PackageRelationAlert","getPackageRelationContentComponent","_Rule_RuleErrorMap_code","level","code","packages","navigate","useRuleIndexNavigate","totalSize","sumBy","totalSizeStr","formatSize","xs","lg","xxl","Grid","name","versions","item","Alert","Space","Divider","Bdg","el","size","sizeStr","parsedSizeStr","InfoCircleOutlined","ExpandAltOutlined","TextDrawer","Title","Tabs","pkg","target","targetSize","Tag","Color","Button"],"mappings":"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"}
+{"version":3,"file":"components/Alert/package-relation.mjs","sources":["webpack://@rsdoctor/components/./src/components/Alert/package-relation.tsx"],"sourcesContent":["/* eslint-disable financial/no-float-calculation */\nimport {\n  Space,\n  Alert,\n  Button,\n  Typography,\n  Divider,\n  Tabs,\n  Row,\n  Col,\n  Timeline,\n  Tag,\n  Empty,\n  Grid,\n} from 'antd';\nimport { sumBy } from 'es-toolkit/compat';\nimport {\n  ExpandAltOutlined,\n  InfoCircleOutlined,\n  DoubleRightOutlined,\n} from '@ant-design/icons';\n\nimport { useRuleIndexNavigate, formatSize } from '../../utils';\nimport { TextDrawer } from '../TextDrawer';\nimport { Title } from '../Title';\nimport { Size, Color } from '../../constants';\nimport { Badge as Bdg } from '../Badge';\nimport { withServerAPI } from '../Manifest';\n\nimport { Rule, SDK } from '@rsdoctor/types';\n\nimport { PackageRelationAlertProps } from './types';\n\nimport styles from './package-relation.module.scss';\n\nconst TextDrawerWidth = '60%';\n\nexport const PackageRelationReasons: React.FC<{\n  data: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetPackageRelationAlertDetails>;\n  cwd: string;\n}> = ({ data }) => {\n  return (\n    <Row gutter={Size.BasePadding} wrap={false} align=\"top\">\n      <Col style={{ height: '100%', width: '100%' }}>\n        {data.length ? (\n          <>\n            <Timeline style={{ marginTop: '20px' }}>\n              {data.map((e, i) => {\n                const { dependency, module, relativePath } = e!;\n                const { statements } = dependency;\n                const { start } = statements?.[0]?.position\n                  ? module.isPreferSource\n                    ? statements[0].position.source!\n                    : statements[0].position.transformed\n                  : { start: { line: 0, column: 0 } };\n                const text = `${relativePath}:${start.line}:${\n                  start.column || 1\n                }`;\n\n                return (\n                  <Timeline.Item key={text} style={{ cursor: 'default' }}>\n                    <Typography.Text>\n                      <div className={styles.filePath}>\n                        {text}\n                        <Typography.Paragraph\n                          copyable={{ text: relativePath }}\n                          style={{ position: 'relative', top: '7px' }}\n                        />\n                      </div>\n                      {i !== data.length - 1 ? (\n                        <DoubleRightOutlined className={styles.arrow} />\n                      ) : null}\n                    </Typography.Text>\n                  </Timeline.Item>\n                );\n              })}\n            </Timeline>\n          </>\n        ) : (\n          <Empty description={'This package no dependencies'} />\n        )}\n      </Col>\n    </Row>\n  );\n};\n\nexport const PackageRelationReasonsWithServer = withServerAPI({\n  Component: PackageRelationReasons,\n  api: SDK.ServerAPI.API.GetPackageRelationAlertDetails,\n  responsePropName: 'data',\n});\n\nexport const PackageRelationAlert: React.FC<PackageRelationAlertProps> = ({\n  data,\n  getPackageRelationContentComponent,\n}) => {\n  const { level, code, packages } = data;\n\n  const navigate = useRuleIndexNavigate(code, data.link);\n  const totalSize = sumBy(packages, (e) => e.targetSize.sourceSize);\n  const totalSizeStr = formatSize(totalSize);\n  const { xs, lg, xxl } = Grid.useBreakpoint();\n  const { name } = packages.find((e) => !!e.target.name)!.target;\n\n  const versions = packages.map((item) => item.target.version);\n\n  return (\n    <Alert\n      showIcon={!xs}\n      message={\n        <Space\n          wrap\n          split={xs ? null : <Divider type=\"vertical\" />}\n          align=\"center\"\n        >\n          <Space wrap={false}>\n            <Typography.Text\n              code\n              strong\n              onClick={navigate}\n              style={{ cursor: 'pointer' }}\n            >\n              <a>{code}</a>\n            </Typography.Text>\n            <Typography.Text strong>\n              {Rule.RuleErrorMap[code as keyof Rule.RuleErrorCodes]?.title ||\n                data.title}\n            </Typography.Text>\n          </Space>\n          <Typography.Paragraph\n            ellipsis={{ rows: 1 }}\n            style={{ marginBottom: 0 }}\n          >\n            <Typography.Text strong code>\n              {name}\n            </Typography.Text>\n            <Typography.Text strong> {data.packages.length}</Typography.Text>\n            <Typography.Text> versions was found</Typography.Text>\n          </Typography.Paragraph>\n          <Bdg\n            label={'total size'}\n            value={totalSizeStr}\n            type=\"error\"\n            tooltip={`total size of ${data.packages.length} versions is ${totalSizeStr}`}\n          />\n        </Space>\n      }\n      description={\n        <Space direction=\"vertical\" wrap={false}>\n          {data.packages.map(({ target: el, targetSize: size }) => {\n            const sizeStr = formatSize(size.sourceSize);\n            const parsedSizeStr = size.parsedSize\n              ? formatSize(size.parsedSize)\n              : null;\n            const name = `${el.name}@${el.version}`;\n            return (\n              <Space\n                key={el.version}\n                style={{ wordBreak: 'break-all' }}\n                align=\"center\"\n                split={xs ? null : <Divider type=\"vertical\" />}\n                wrap\n              >\n                <Space wrap={false}>\n                  <Typography.Text style={{ marginLeft: 4 }}>└</Typography.Text>\n                  <Bdg\n                    label={el.name}\n                    value={`v${el.version}`}\n                    tooltip={name}\n                  />\n                </Space>\n                <Space>\n                  <Bdg\n                    label={\n                      <div color={'rgb(255, 255, 255)'}>\n                        Source Size <InfoCircleOutlined />\n                      </div>\n                    }\n                    value={sizeStr}\n                    tooltip={`The bundle size of \"${name}\" is ${sizeStr}, this is source size.`}\n                    type=\"error\"\n                  />\n                  <Bdg\n                    label=\"Bundled size\"\n                    value={parsedSizeStr || 'CONCATENATED'}\n                    tooltip={`The bundle size of \"${name}\" is ${sizeStr}, this is after bundled, concatenated module cannot get bundled size. `}\n                    type=\"error\"\n                  />\n                </Space>\n\n                <Typography.Paragraph\n                  style={{\n                    marginBottom: 0,\n                    width: xxl ? '40rem' : lg ? '30rem' : '20rem',\n                  }}\n                  copyable={{ text: el.root }}\n                  ellipsis={{\n                    rows: 1,\n                    expandable: true,\n                    symbol: <ExpandAltOutlined />,\n                    tooltip: el.root,\n                  }}\n                  code\n                >\n                  {el.root}\n                </Typography.Paragraph>\n              </Space>\n            );\n          })}\n        </Space>\n      }\n      type={level === 'warn' ? 'info' : level}\n      action={\n        <>\n          {packages && packages.length > 0 ? (\n            <TextDrawer\n              text=\"Show Relations\"\n              buttonProps={{ size: 'small' }}\n              drawerProps={{ title: data.title, width: TextDrawerWidth }}\n            >\n              <Space direction=\"vertical\" className=\"alert-space\">\n                <Space style={{ marginBottom: Size.BasePadding / 2 }}>\n                  <Title text={name} upperFirst={false} />\n                  <Typography.Text strong>{versions.length}</Typography.Text>\n                  <Typography.Text> versions was found: </Typography.Text>\n                  {versions.map((e) => (\n                    <Typography.Text strong code key={e}>\n                      {e}\n                    </Typography.Text>\n                  ))}\n                </Space>\n                <Tabs\n                  type=\"card\"\n                  size=\"middle\"\n                  className=\"tabs-space\"\n                  defaultActiveKey={versions[0]}\n                  items={\n                    packages.map((pkg) => {\n                      const { target, targetSize } = pkg;\n                      return {\n                        label: (\n                          <Space>\n                            <Typography.Text>{`${name}@${target.version}`}</Typography.Text>\n                            <Tag color={Color.Red}>\n                              {formatSize(targetSize.sourceSize)}\n                            </Tag>\n                          </Space>\n                        ),\n                        key: `${target.root}${target.name}${target.version}`,\n                        children: getPackageRelationContentComponent({\n                          data,\n                          package: pkg,\n                        }),\n                      };\n                    })!\n                  }\n                />\n              </Space>\n            </TextDrawer>\n          ) : null}\n          <Divider type=\"vertical\" />\n          <Button\n            type=\"link\"\n            onClick={navigate}\n            size=\"small\"\n            icon={<InfoCircleOutlined />}\n          />\n        </>\n      }\n    />\n  );\n};\n"],"names":["TextDrawerWidth","PackageRelationReasons","data","Row","Size","Col","Timeline","e","i","_statements_","dependency","module","relativePath","statements","start","text","Typography","styles","DoubleRightOutlined","Empty","PackageRelationReasonsWithServer","withServerAPI","SDK","PackageRelationAlert","getPackageRelationContentComponent","_Rule_RuleErrorMap_code","level","code","packages","navigate","useRuleIndexNavigate","totalSize","sumBy","totalSizeStr","formatSize","xs","lg","xxl","Grid","name","versions","item","Alert","Space","Divider","Bdg","el","size","sizeStr","parsedSizeStr","InfoCircleOutlined","ExpandAltOutlined","TextDrawer","Title","Tabs","pkg","target","targetSize","Tag","Color","Button"],"mappings":"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"}

package/dist/components/Alerts/collapse.mjs

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Collapse, Divider, Space, Tabs, Tag, Tooltip, Typography } from "antd";
 import icons from "@ant-design/icons";
-import { sumBy } from "lodash-es";
+import { sumBy } from "es-toolkit/compat";
 import overview from "../Overall/overview.mjs";
 import { TextDrawer } from "../TextDrawer/index.mjs";
 import { Title } from "../Title/index.mjs";

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\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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"}
+{"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 '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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"}

package/dist/components/Card/size.mjs

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Empty, Progress, Space, Tree } from "antd";
-import { sumBy } from "lodash-es";
+import { sumBy } from "es-toolkit/compat";
 import { useMemo } from "react";
 import { RightOutlined } from "@ant-design/icons";
 import { formatSize } from "../../utils/index.mjs";

package/dist/components/Card/size.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"components/Card/size.mjs","sources":["webpack://@rsdoctor/components/./src/components/Card/size.tsx"],"sourcesContent":["import { Empty, Progress, Space, Tree } from 'antd';\nimport { sumBy } from 'lodash-es';\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,eAAAA;oCACC,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"}
+{"version":3,"file":"components/Card/size.mjs","sources":["webpack://@rsdoctor/components/./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,eAAAA;oCACC,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"}

package/dist/components/Charts/TimelineCharts/index.mjs

@@ -5,7 +5,7 @@ import { CustomChart } from "echarts/charts";
 import { DataZoomComponent, GridComponent, TooltipComponent } from "echarts/components";
 import { CanvasRenderer } from "echarts/renderers";
 import dayjs from "dayjs";
-import { groupBy } from "lodash-es";
+import { groupBy } from "es-toolkit/compat";
 import { ChartTypes, PALETTE_COLORS } from "../constants.mjs";
 import * as __WEBPACK_EXTERNAL_MODULE_echarts_core_d2845954__ from "echarts/core";
 const LINE_HEIGHT = 60;

package/dist/components/Charts/TimelineCharts/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"components/Charts/TimelineCharts/index.mjs","sources":["webpack://@rsdoctor/components/./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 'lodash-es';\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","_loaderData_c","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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"}
+{"version":3,"file":"components/Charts/TimelineCharts/index.mjs","sources":["webpack://@rsdoctor/components/./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","_loaderData_c","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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"}

package/dist/components/Charts/loader.mjs

@@ -1,6 +1,6 @@
 import { Fragment, jsx } from "react/jsx-runtime";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { groupBy } from "lodash-es";
+import { groupBy } from "es-toolkit/compat";
 import { Empty } from "antd";
 import "./loader.css";
 import { useTheme } from "../../utils/manifest.mjs";

package/dist/components/Charts/loader.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"components/Charts/loader.mjs","sources":["webpack://@rsdoctor/components/./src/components/Charts/loader.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useMemo,\n  useRef,\n  useEffect,\n  useState,\n} from 'react';\nimport { groupBy } from 'lodash-es';\nimport { Empty } from 'antd';\nimport './loader.scss';\nimport { useTheme } from 'src/utils/manifest';\nimport { findLoaderTotalTiming } from 'src/utils/loader';\nimport { beautifyPath } from 'src/utils/file';\nimport { TimelineCom } from './TimelineCharts';\nimport { ChartProps, DurationMetric } from './types';\nimport {\n  renderTotalLoadersTooltip,\n  getTooltipHtmlForLoader,\n  useDebounceHook,\n} from './utils';\nimport { ChartTypes } from './constants';\nlet startTimestamp = 0;\nlet endTimestamp = 0;\n\nexport const LoaderExecutionsChart: React.FC<ChartProps> = ({\n  loaders,\n  cwd,\n}) => {\n  const { isDark } = useTheme();\n  const ref = useRef(null);\n  const [data, setData] = useState([] as DurationMetric[]);\n  const durationMetricData = useDebounceHook(data, 200);\n  // const [endTimestamp, setEndTimestamp] = useState(0);\n\n  const groupByLoader = useMemo(\n    () => groupBy(loaders, (e) => e.loader),\n    [loaders],\n  );\n\n  const formatterForLoader = useCallback((raw: any) => {\n    const { name, data } = raw;\n    const loaderName = name.replace(' total', '');\n    if (data?.ext) {\n      return getTooltipHtmlForLoader(data.ext as (typeof loaders)[0]);\n    }\n\n    return renderTotalLoadersTooltip(loaderName, loaders, cwd);\n  }, []);\n\n  useEffect(() => {\n    const _data = Object.keys(groupByLoader).map<DurationMetric>(\n      (loaderName) => {\n        const list = groupByLoader[loaderName] || [];\n        const { start, end } = findLoaderTotalTiming(list);\n\n        if (start < startTimestamp || startTimestamp === 0) {\n          startTimestamp = start;\n        }\n\n        if (end > endTimestamp || endTimestamp === 0) {\n          endTimestamp = end;\n        }\n\n        return {\n          p: loaderName,\n          n: loaderName,\n          s: start,\n          e: end,\n          c: list.map((e) => {\n            return {\n              p: loaderName,\n              // n: loaderName,\n              n: beautifyPath(e.resource, cwd),\n              s: e.startAt,\n              e: e.endAt,\n              ext: e,\n            };\n          }),\n        };\n      },\n    );\n    setData(_data);\n  }, [groupByLoader]);\n\n  return (\n    <>\n      {data?.length ? (\n        <div\n          className={[\n            'loader-chart-container',\n            isDark ? 'loader-chart-container_dark' : '',\n          ]\n            .join(' ')\n            .trim()}\n          ref={ref}\n          style={{ width: '100%' }}\n        >\n          <TimelineCom\n            loaderData={durationMetricData}\n            formatterFn={formatterForLoader}\n            chartType={ChartTypes.Loader}\n            exts={{ startTimestamp, endTimestamp }}\n          />\n        </div>\n      ) : (\n        <Empty />\n      )}\n    </>\n  );\n};\n"],"names":["startTimestamp","endTimestamp","LoaderExecutionsChart","loaders","cwd","isDark","useTheme","ref","useRef","data","setData","useState","durationMetricData","useDebounceHook","groupByLoader","useMemo","groupBy","e","formatterForLoader","useCallback","raw","name","loaderName","getTooltipHtmlForLoader","renderTotalLoadersTooltip","useEffect","_data","Object","list","start","end","findLoaderTotalTiming","beautifyPath","TimelineCom","ChartTypes","Empty"],"mappings":";;;;;;;;;;;AAqBA,IAAIA,iBAAiB;AACrB,IAAIC,eAAe;AAEZ,MAAMC,wBAA8C,CAAC,EAC1DC,OAAO,EACPC,GAAG,EACJ;IACC,MAAM,EAAEC,MAAM,EAAE,GAAGC;IACnB,MAAMC,MAAMC,OAAO;IACnB,MAAM,CAACC,MAAMC,QAAQ,GAAGC,SAAS,EAAE;IACnC,MAAMC,qBAAqBC,gBAAgBJ,MAAM;IAGjD,MAAMK,gBAAgBC,QACpB,IAAMC,QAAQb,SAAS,CAACc,IAAMA,EAAE,MAAM,GACtC;QAACd;KAAQ;IAGX,MAAMe,qBAAqBC,YAAY,CAACC;QACtC,MAAM,EAAEC,IAAI,EAAEZ,IAAI,EAAE,GAAGW;QACvB,MAAME,aAAaD,KAAK,OAAO,CAAC,UAAU;QAC1C,IAAIZ,QAAAA,OAAAA,KAAAA,IAAAA,KAAM,GAAG,EACX,OAAOc,wBAAwBd,KAAK,GAAG;QAGzC,OAAOe,0BAA0BF,YAAYnB,SAASC;IACxD,GAAG,EAAE;IAELqB,UAAU;QACR,MAAMC,QAAQC,OAAO,IAAI,CAACb,eAAe,GAAG,CAC1C,CAACQ;YACC,MAAMM,OAAOd,aAAa,CAACQ,WAAW,IAAI,EAAE;YAC5C,MAAM,EAAEO,KAAK,EAAEC,GAAG,EAAE,GAAGC,sBAAsBH;YAE7C,IAAIC,QAAQ7B,kBAAkBA,AAAmB,MAAnBA,gBAC5BA,iBAAiB6B;YAGnB,IAAIC,MAAM7B,gBAAgBA,AAAiB,MAAjBA,cACxBA,eAAe6B;YAGjB,OAAO;gBACL,GAAGR;gBACH,GAAGA;gBACH,GAAGO;gBACH,GAAGC;gBACH,GAAGF,KAAK,GAAG,CAAC,CAACX,IACJ;wBACL,GAAGK;wBAEH,GAAGU,aAAaf,EAAE,QAAQ,EAAEb;wBAC5B,GAAGa,EAAE,OAAO;wBACZ,GAAGA,EAAE,KAAK;wBACV,KAAKA;oBACP;YAEJ;QACF;QAEFP,QAAQgB;IACV,GAAG;QAACZ;KAAc;IAElB,OAAO,WAAP,GACE;kBACGL,AAAAA,CAAAA,QAAAA,OAAAA,KAAAA,IAAAA,KAAM,MAAM,AAAD,IAAC,cACX,IAAC;YACC,WAAW;gBACT;gBACAJ,SAAS,gCAAgC;aAC1C,CACE,IAAI,CAAC,KACL,IAAI;YACP,KAAKE;YACL,OAAO;gBAAE,OAAO;YAAO;sBAEvB,kBAAC0B,aAAWA;gBACV,YAAYrB;gBACZ,aAAaM;gBACb,WAAWgB,WAAW,MAAM;gBAC5B,MAAM;oBAAElC;oBAAgBC;gBAAa;;2BAIzC,IAACkC,OAAKA,CAAAA;;AAId"}
+{"version":3,"file":"components/Charts/loader.mjs","sources":["webpack://@rsdoctor/components/./src/components/Charts/loader.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useMemo,\n  useRef,\n  useEffect,\n  useState,\n} from 'react';\nimport { groupBy } from 'es-toolkit/compat';\nimport { Empty } from 'antd';\nimport './loader.scss';\nimport { useTheme } from 'src/utils/manifest';\nimport { findLoaderTotalTiming } from 'src/utils/loader';\nimport { beautifyPath } from 'src/utils/file';\nimport { TimelineCom } from './TimelineCharts';\nimport { ChartProps, DurationMetric } from './types';\nimport {\n  renderTotalLoadersTooltip,\n  getTooltipHtmlForLoader,\n  useDebounceHook,\n} from './utils';\nimport { ChartTypes } from './constants';\nlet startTimestamp = 0;\nlet endTimestamp = 0;\n\nexport const LoaderExecutionsChart: React.FC<ChartProps> = ({\n  loaders,\n  cwd,\n}) => {\n  const { isDark } = useTheme();\n  const ref = useRef(null);\n  const [data, setData] = useState([] as DurationMetric[]);\n  const durationMetricData = useDebounceHook(data, 200);\n  // const [endTimestamp, setEndTimestamp] = useState(0);\n\n  const groupByLoader = useMemo(\n    () => groupBy(loaders, (e) => e.loader),\n    [loaders],\n  );\n\n  const formatterForLoader = useCallback((raw: any) => {\n    const { name, data } = raw;\n    const loaderName = name.replace(' total', '');\n    if (data?.ext) {\n      return getTooltipHtmlForLoader(data.ext as (typeof loaders)[0]);\n    }\n\n    return renderTotalLoadersTooltip(loaderName, loaders, cwd);\n  }, []);\n\n  useEffect(() => {\n    const _data = Object.keys(groupByLoader).map<DurationMetric>(\n      (loaderName) => {\n        const list = groupByLoader[loaderName] || [];\n        const { start, end } = findLoaderTotalTiming(list);\n\n        if (start < startTimestamp || startTimestamp === 0) {\n          startTimestamp = start;\n        }\n\n        if (end > endTimestamp || endTimestamp === 0) {\n          endTimestamp = end;\n        }\n\n        return {\n          p: loaderName,\n          n: loaderName,\n          s: start,\n          e: end,\n          c: list.map((e) => {\n            return {\n              p: loaderName,\n              // n: loaderName,\n              n: beautifyPath(e.resource, cwd),\n              s: e.startAt,\n              e: e.endAt,\n              ext: e,\n            };\n          }),\n        };\n      },\n    );\n    setData(_data);\n  }, [groupByLoader]);\n\n  return (\n    <>\n      {data?.length ? (\n        <div\n          className={[\n            'loader-chart-container',\n            isDark ? 'loader-chart-container_dark' : '',\n          ]\n            .join(' ')\n            .trim()}\n          ref={ref}\n          style={{ width: '100%' }}\n        >\n          <TimelineCom\n            loaderData={durationMetricData}\n            formatterFn={formatterForLoader}\n            chartType={ChartTypes.Loader}\n            exts={{ startTimestamp, endTimestamp }}\n          />\n        </div>\n      ) : (\n        <Empty />\n      )}\n    </>\n  );\n};\n"],"names":["startTimestamp","endTimestamp","LoaderExecutionsChart","loaders","cwd","isDark","useTheme","ref","useRef","data","setData","useState","durationMetricData","useDebounceHook","groupByLoader","useMemo","groupBy","e","formatterForLoader","useCallback","raw","name","loaderName","getTooltipHtmlForLoader","renderTotalLoadersTooltip","useEffect","_data","Object","list","start","end","findLoaderTotalTiming","beautifyPath","TimelineCom","ChartTypes","Empty"],"mappings":";;;;;;;;;;;AAqBA,IAAIA,iBAAiB;AACrB,IAAIC,eAAe;AAEZ,MAAMC,wBAA8C,CAAC,EAC1DC,OAAO,EACPC,GAAG,EACJ;IACC,MAAM,EAAEC,MAAM,EAAE,GAAGC;IACnB,MAAMC,MAAMC,OAAO;IACnB,MAAM,CAACC,MAAMC,QAAQ,GAAGC,SAAS,EAAE;IACnC,MAAMC,qBAAqBC,gBAAgBJ,MAAM;IAGjD,MAAMK,gBAAgBC,QACpB,IAAMC,QAAQb,SAAS,CAACc,IAAMA,EAAE,MAAM,GACtC;QAACd;KAAQ;IAGX,MAAMe,qBAAqBC,YAAY,CAACC;QACtC,MAAM,EAAEC,IAAI,EAAEZ,IAAI,EAAE,GAAGW;QACvB,MAAME,aAAaD,KAAK,OAAO,CAAC,UAAU;QAC1C,IAAIZ,QAAAA,OAAAA,KAAAA,IAAAA,KAAM,GAAG,EACX,OAAOc,wBAAwBd,KAAK,GAAG;QAGzC,OAAOe,0BAA0BF,YAAYnB,SAASC;IACxD,GAAG,EAAE;IAELqB,UAAU;QACR,MAAMC,QAAQC,OAAO,IAAI,CAACb,eAAe,GAAG,CAC1C,CAACQ;YACC,MAAMM,OAAOd,aAAa,CAACQ,WAAW,IAAI,EAAE;YAC5C,MAAM,EAAEO,KAAK,EAAEC,GAAG,EAAE,GAAGC,sBAAsBH;YAE7C,IAAIC,QAAQ7B,kBAAkBA,AAAmB,MAAnBA,gBAC5BA,iBAAiB6B;YAGnB,IAAIC,MAAM7B,gBAAgBA,AAAiB,MAAjBA,cACxBA,eAAe6B;YAGjB,OAAO;gBACL,GAAGR;gBACH,GAAGA;gBACH,GAAGO;gBACH,GAAGC;gBACH,GAAGF,KAAK,GAAG,CAAC,CAACX,IACJ;wBACL,GAAGK;wBAEH,GAAGU,aAAaf,EAAE,QAAQ,EAAEb;wBAC5B,GAAGa,EAAE,OAAO;wBACZ,GAAGA,EAAE,KAAK;wBACV,KAAKA;oBACP;YAEJ;QACF;QAEFP,QAAQgB;IACV,GAAG;QAACZ;KAAc;IAElB,OAAO,WAAP,GACE;kBACGL,AAAAA,CAAAA,QAAAA,OAAAA,KAAAA,IAAAA,KAAM,MAAM,AAAD,IAAC,cACX,IAAC;YACC,WAAW;gBACT;gBACAJ,SAAS,gCAAgC;aAC1C,CACE,IAAI,CAAC,KACL,IAAI;YACP,KAAKE;YACL,OAAO;gBAAE,OAAO;YAAO;sBAEvB,kBAAC0B,aAAWA;gBACV,YAAYrB;gBACZ,aAAaM;gBACb,WAAWgB,WAAW,MAAM;gBAC5B,MAAM;oBAAElC;oBAAgBC;gBAAa;;2BAIzC,IAACkC,OAAKA,CAAAA;;AAId"}

package/dist/components/Charts/utils.mjs

@@ -1,6 +1,6 @@
 import { Loader } from "@rsdoctor/utils/common";
 import dayjs from "dayjs";
-import { maxBy, minBy } from "lodash-es";
+import { maxBy, minBy } from "es-toolkit/compat";
 import { formatCosts } from "../../utils/index.mjs";
 import "./tooltips.css";
 import { ETraceEventPhase } from "./types.mjs";

package/dist/components/Charts/utils.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"components/Charts/utils.mjs","sources":["webpack://@rsdoctor/components/./src/components/Charts/utils.ts"],"sourcesContent":["import { Loader } from '@rsdoctor/utils/common';\nimport { SDK } from '@rsdoctor/types';\nimport dayjs from 'dayjs';\nimport { maxBy, minBy } from 'lodash-es';\nimport { formatCosts } from 'src/utils';\n\nimport './tooltips.scss';\nimport { DurationMetric, ETraceEventPhase, ITraceEventData } from './types';\nimport { useEffect, useState } from 'react';\n\nexport function getTooltipHtmlForLoader(\n  loader: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetLoaderChartData>[0],\n) {\n  return `\n  <div class=\"loader-tooltip-container\">\n    <div class=\"loader-tooltip-title\">${loader.loader}</div>\n    <li class=\"loader-tooltip-item\">\n      <span>isPitch</span>\n      <span>${loader.isPitch}</span>\n    </li>\n    ${\n      loader.layer && loader.layer !== 'undefined'\n        ? `<li class=\"loader-tooltip-item\">\n        <span>layer</span>\n        <span>${loader.layer}</span>\n      </li>`\n        : ``\n    }\n    <li class=\"loader-tooltip-item\">\n      <span>duration</span>\n      <span class=\"loader-tooltip-text-bold\">${formatCosts(loader.costs)}</span>\n    </li>\n    <li class=\"loader-tooltip-item\">\n      <span>filepath</span>\n      <span>${loader.resource}</span>\n    </li>\n    <li class=\"loader-tooltip-item\">\n      <span>start</span>\n      <span class=\"loader-tooltip-text-bold\">${dayjs(loader.startAt).format(\n        'YYYY/MM/DD HH:mm:ss',\n      )}</span>\n    </li>\n    <li class=\"loader-tooltip-item\">\n      <span>end</span>\n      <span class=\"loader-tooltip-text-bold\">${dayjs(loader.endAt).format(\n        'YYYY/MM/DD HH:mm:ss',\n      )}</span>\n    </li>\n  </div>\n  `.trim();\n}\n\nexport function renderTotalLoadersTooltip(\n  loaderName: string,\n  loaders: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetLoaderChartData>,\n  cwd: string,\n) {\n  const filter = (loader: { loader: string }) => loader.loader === loaderName;\n  const filteredLoaders = loaders.filter(filter);\n  const resources = filteredLoaders.map((e) => e.resource);\n  const nodeModulesResources = resources.filter((e) =>\n    e.includes('/node_modules/'),\n  );\n  const outsideResources = resources.filter((e) => !e.startsWith(cwd));\n  const start = minBy(filteredLoaders, (e) => e.startAt)!.startAt;\n  const end = maxBy(filteredLoaders, (e) => e.endAt)!.endAt;\n\n  // const duration = sumBy(filteredLoaders, (e) => e.costs);\n  const duration = Loader.getLoadersCosts(filter, loaders);\n\n  return `\n<div class=\"loader-tooltip-container\">\n  <div class=\"loader-tooltip-title\">${loaderName}</div>\n  <li class=\"loader-tooltip-item\">\n    <span>files</span>\n    <span class=\"loader-tooltip-text-bold\">${resources.length}</span>\n  </li>\n  <li class=\"loader-tooltip-item\">\n    <span>files(node_modules)</span>\n    <span class=\"loader-tooltip-text-bold\">${nodeModulesResources.length}</span>\n  </li>\n  <li class=\"loader-tooltip-item\">\n    <span>files(outside the cwd)</span>\n    <span class=\"loader-tooltip-text-bold\">${outsideResources.length}</span>\n  </li>\n  <li class=\"loader-tooltip-item\">\n    <span>duration(estimated)</span>\n    <span class=\"loader-tooltip-text-bold\">${formatCosts(duration)}</span>\n  </li>\n  <li class=\"loader-tooltip-item\">\n    <span>start(min)</span>\n    <span>${dayjs(start).format('YYYY/MM/DD HH:mm:ss')}</span>\n  </li>\n  <li class=\"loader-tooltip-item\">\n    <span>end(max)</span>\n    <span>${dayjs(end).format('YYYY/MM/DD HH:mm:ss')}</span>\n  </li>\n  </div>\n    `.trim();\n}\n\nexport function transformDurationMetric(\n  rawData: DurationMetric[],\n): ITraceEventData[] {\n  return rawData.reduce((acc, cur) => {\n    if (cur.c) {\n      const res = transformDurationMetric(cur.c);\n      acc.push(\n        {\n          name: cur.n,\n          ph: ETraceEventPhase.BEGIN,\n          pid: cur.p,\n          ts: cur.s,\n          args: cur,\n        },\n        ...res,\n        {\n          name: cur.n,\n          ph: ETraceEventPhase.END,\n          pid: cur.p,\n          ts: cur.e,\n          args: cur,\n        },\n      );\n    } else {\n      acc.push({\n        name: cur.n,\n        ph: ETraceEventPhase.BEGIN,\n        pid: cur.p,\n        ts: cur.s,\n        args: cur,\n      });\n      acc.push({\n        name: cur.n,\n        ph: ETraceEventPhase.END,\n        pid: cur.p,\n        ts: cur.e,\n        args: cur,\n      });\n    }\n    return acc;\n  }, [] as ITraceEventData[]);\n}\n\n// DFS 遍历，取每层的最后一个元素与目标元素进行比较，如果目标元素可以存放至当前层，就push；如果不能就放到下一层\nexport function processTrans(rawData: DurationMetric[]) {\n  const processedData = rawData\n    .sort((a, b) => a.s - b.s)\n    .reduce(\n      (prev, cur) => {\n        const ca = prev[cur.p];\n        if (ca) {\n          loop(ca, cur);\n        } else {\n          prev[cur.p] = [cur];\n        }\n        return prev;\n      },\n      {} as Record<string, DurationMetric[]>,\n    );\n  const data = Object.entries(processedData).reduce((prev, [_key, val]) => {\n    // @ts-ignore\n    prev.push(...val);\n    return prev;\n  }, [] as DurationMetric[]);\n  return transformDurationMetric(data);\n}\n\nfunction loop(dur: DurationMetric[], target: DurationMetric) {\n  const queue = [dur];\n  while (queue.length > 0) {\n    const floor = queue.shift() || [];\n    if (floor.length === 0) return;\n    const curFloorLast = floor[floor.length - 1];\n    if (curFloorLast.e <= target.s) {\n      return floor.push(target);\n    }\n    let nextFloor: DurationMetric[];\n    for (let i = floor.length - 1; i >= 0; i--) {\n      const { c } = floor[i];\n      if (c) {\n        nextFloor = c;\n      }\n    }\n    // @ts-ignore\n    if (nextFloor) {\n      queue.push(nextFloor);\n    } else {\n      curFloorLast.c = [target];\n    }\n  }\n}\n\nexport function formatterForPlugins(raw: { data: { ext: ITraceEventData } }) {\n  const { ext } = raw.data;\n  return `\n  <div class=\"loader-tooltip-container\">\n    <div class=\"loader-tooltip-title\">[${ext.args.p}] ${ext.args.n}</div>\n    <li class=\"loader-tooltip-item\">\n      <span>hook</span>\n      <span>${ext.args.p}</span>\n    </li>\n    <li class=\"loader-tooltip-item\">\n      <span>tap name</span>\n      <span>${ext.args.n}</span>\n    </li>\n    <li class=\"loader-tooltip-item\">\n      <span>start</span>\n      <span>${dayjs(ext.args.s).format('YYYY/MM/DD HH:mm:ss')}</span>\n    </li>\n    <li class=\"loader-tooltip-item\">\n      <span>end</span>\n      <span>${dayjs(ext.args.e).format('YYYY/MM/DD HH:mm:ss')}</span>\n    </li>\n    <li class=\"loader-tooltip-item\">\n      <span>duration</span>\n      <span>${formatCosts(ext.args.e - ext.args.s)}</span>\n    </li>\n  </div>\n      `.trim();\n}\n\nexport function useDebounceHook(\n  value: DurationMetric[],\n  delay: number,\n): DurationMetric[] | undefined {\n  const [debounceValue, setDebounceValue] = useState(value);\n  useEffect(() => {\n    let timer = setTimeout(() => setDebounceValue(value), delay);\n    return () => clearTimeout(timer);\n  }, [value, delay]);\n  return debounceValue;\n}\n"],"names":["getTooltipHtmlForLoader","loader","formatCosts","dayjs","renderTotalLoadersTooltip","loaderName","loaders","cwd","filter","filteredLoaders","resources","e","nodeModulesResources","outsideResources","start","minBy","end","maxBy","duration","Loader","transformDurationMetric","rawData","acc","cur","res","ETraceEventPhase","processTrans","processedData","a","b","prev","ca","loop","data","Object","_key","val","dur","target","queue","floor","curFloorLast","nextFloor","i","c","formatterForPlugins","raw","ext","useDebounceHook","value","delay","debounceValue","setDebounceValue","useState","useEffect","timer","setTimeout","clearTimeout"],"mappings":"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"}
+{"version":3,"file":"components/Charts/utils.mjs","sources":["webpack://@rsdoctor/components/./src/components/Charts/utils.ts"],"sourcesContent":["import { Loader } from '@rsdoctor/utils/common';\nimport { SDK } from '@rsdoctor/types';\nimport dayjs from 'dayjs';\nimport { maxBy, minBy } from 'es-toolkit/compat';\nimport { formatCosts } from 'src/utils';\n\nimport './tooltips.scss';\nimport { DurationMetric, ETraceEventPhase, ITraceEventData } from './types';\nimport { useEffect, useState } from 'react';\n\nexport function getTooltipHtmlForLoader(\n  loader: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetLoaderChartData>[0],\n) {\n  return `\n  <div class=\"loader-tooltip-container\">\n    <div class=\"loader-tooltip-title\">${loader.loader}</div>\n    <li class=\"loader-tooltip-item\">\n      <span>isPitch</span>\n      <span>${loader.isPitch}</span>\n    </li>\n    ${\n      loader.layer && loader.layer !== 'undefined'\n        ? `<li class=\"loader-tooltip-item\">\n        <span>layer</span>\n        <span>${loader.layer}</span>\n      </li>`\n        : ``\n    }\n    <li class=\"loader-tooltip-item\">\n      <span>duration</span>\n      <span class=\"loader-tooltip-text-bold\">${formatCosts(loader.costs)}</span>\n    </li>\n    <li class=\"loader-tooltip-item\">\n      <span>filepath</span>\n      <span>${loader.resource}</span>\n    </li>\n    <li class=\"loader-tooltip-item\">\n      <span>start</span>\n      <span class=\"loader-tooltip-text-bold\">${dayjs(loader.startAt).format(\n        'YYYY/MM/DD HH:mm:ss',\n      )}</span>\n    </li>\n    <li class=\"loader-tooltip-item\">\n      <span>end</span>\n      <span class=\"loader-tooltip-text-bold\">${dayjs(loader.endAt).format(\n        'YYYY/MM/DD HH:mm:ss',\n      )}</span>\n    </li>\n  </div>\n  `.trim();\n}\n\nexport function renderTotalLoadersTooltip(\n  loaderName: string,\n  loaders: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetLoaderChartData>,\n  cwd: string,\n) {\n  const filter = (loader: { loader: string }) => loader.loader === loaderName;\n  const filteredLoaders = loaders.filter(filter);\n  const resources = filteredLoaders.map((e) => e.resource);\n  const nodeModulesResources = resources.filter((e) =>\n    e.includes('/node_modules/'),\n  );\n  const outsideResources = resources.filter((e) => !e.startsWith(cwd));\n  const start = minBy(filteredLoaders, (e) => e.startAt)!.startAt;\n  const end = maxBy(filteredLoaders, (e) => e.endAt)!.endAt;\n\n  // const duration = sumBy(filteredLoaders, (e) => e.costs);\n  const duration = Loader.getLoadersCosts(filter, loaders);\n\n  return `\n<div class=\"loader-tooltip-container\">\n  <div class=\"loader-tooltip-title\">${loaderName}</div>\n  <li class=\"loader-tooltip-item\">\n    <span>files</span>\n    <span class=\"loader-tooltip-text-bold\">${resources.length}</span>\n  </li>\n  <li class=\"loader-tooltip-item\">\n    <span>files(node_modules)</span>\n    <span class=\"loader-tooltip-text-bold\">${nodeModulesResources.length}</span>\n  </li>\n  <li class=\"loader-tooltip-item\">\n    <span>files(outside the cwd)</span>\n    <span class=\"loader-tooltip-text-bold\">${outsideResources.length}</span>\n  </li>\n  <li class=\"loader-tooltip-item\">\n    <span>duration(estimated)</span>\n    <span class=\"loader-tooltip-text-bold\">${formatCosts(duration)}</span>\n  </li>\n  <li class=\"loader-tooltip-item\">\n    <span>start(min)</span>\n    <span>${dayjs(start).format('YYYY/MM/DD HH:mm:ss')}</span>\n  </li>\n  <li class=\"loader-tooltip-item\">\n    <span>end(max)</span>\n    <span>${dayjs(end).format('YYYY/MM/DD HH:mm:ss')}</span>\n  </li>\n  </div>\n    `.trim();\n}\n\nexport function transformDurationMetric(\n  rawData: DurationMetric[],\n): ITraceEventData[] {\n  return rawData.reduce((acc, cur) => {\n    if (cur.c) {\n      const res = transformDurationMetric(cur.c);\n      acc.push(\n        {\n          name: cur.n,\n          ph: ETraceEventPhase.BEGIN,\n          pid: cur.p,\n          ts: cur.s,\n          args: cur,\n        },\n        ...res,\n        {\n          name: cur.n,\n          ph: ETraceEventPhase.END,\n          pid: cur.p,\n          ts: cur.e,\n          args: cur,\n        },\n      );\n    } else {\n      acc.push({\n        name: cur.n,\n        ph: ETraceEventPhase.BEGIN,\n        pid: cur.p,\n        ts: cur.s,\n        args: cur,\n      });\n      acc.push({\n        name: cur.n,\n        ph: ETraceEventPhase.END,\n        pid: cur.p,\n        ts: cur.e,\n        args: cur,\n      });\n    }\n    return acc;\n  }, [] as ITraceEventData[]);\n}\n\n// DFS 遍历，取每层的最后一个元素与目标元素进行比较，如果目标元素可以存放至当前层，就push；如果不能就放到下一层\nexport function processTrans(rawData: DurationMetric[]) {\n  const processedData = rawData\n    .sort((a, b) => a.s - b.s)\n    .reduce(\n      (prev, cur) => {\n        const ca = prev[cur.p];\n        if (ca) {\n          loop(ca, cur);\n        } else {\n          prev[cur.p] = [cur];\n        }\n        return prev;\n      },\n      {} as Record<string, DurationMetric[]>,\n    );\n  const data = Object.entries(processedData).reduce((prev, [_key, val]) => {\n    // @ts-ignore\n    prev.push(...val);\n    return prev;\n  }, [] as DurationMetric[]);\n  return transformDurationMetric(data);\n}\n\nfunction loop(dur: DurationMetric[], target: DurationMetric) {\n  const queue = [dur];\n  while (queue.length > 0) {\n    const floor = queue.shift() || [];\n    if (floor.length === 0) return;\n    const curFloorLast = floor[floor.length - 1];\n    if (curFloorLast.e <= target.s) {\n      return floor.push(target);\n    }\n    let nextFloor: DurationMetric[];\n    for (let i = floor.length - 1; i >= 0; i--) {\n      const { c } = floor[i];\n      if (c) {\n        nextFloor = c;\n      }\n    }\n    // @ts-ignore\n    if (nextFloor) {\n      queue.push(nextFloor);\n    } else {\n      curFloorLast.c = [target];\n    }\n  }\n}\n\nexport function formatterForPlugins(raw: { data: { ext: ITraceEventData } }) {\n  const { ext } = raw.data;\n  return `\n  <div class=\"loader-tooltip-container\">\n    <div class=\"loader-tooltip-title\">[${ext.args.p}] ${ext.args.n}</div>\n    <li class=\"loader-tooltip-item\">\n      <span>hook</span>\n      <span>${ext.args.p}</span>\n    </li>\n    <li class=\"loader-tooltip-item\">\n      <span>tap name</span>\n      <span>${ext.args.n}</span>\n    </li>\n    <li class=\"loader-tooltip-item\">\n      <span>start</span>\n      <span>${dayjs(ext.args.s).format('YYYY/MM/DD HH:mm:ss')}</span>\n    </li>\n    <li class=\"loader-tooltip-item\">\n      <span>end</span>\n      <span>${dayjs(ext.args.e).format('YYYY/MM/DD HH:mm:ss')}</span>\n    </li>\n    <li class=\"loader-tooltip-item\">\n      <span>duration</span>\n      <span>${formatCosts(ext.args.e - ext.args.s)}</span>\n    </li>\n  </div>\n      `.trim();\n}\n\nexport function useDebounceHook(\n  value: DurationMetric[],\n  delay: number,\n): DurationMetric[] | undefined {\n  const [debounceValue, setDebounceValue] = useState(value);\n  useEffect(() => {\n    let timer = setTimeout(() => setDebounceValue(value), delay);\n    return () => clearTimeout(timer);\n  }, [value, delay]);\n  return debounceValue;\n}\n"],"names":["getTooltipHtmlForLoader","loader","formatCosts","dayjs","renderTotalLoadersTooltip","loaderName","loaders","cwd","filter","filteredLoaders","resources","e","nodeModulesResources","outsideResources","start","minBy","end","maxBy","duration","Loader","transformDurationMetric","rawData","acc","cur","res","ETraceEventPhase","processTrans","processedData","a","b","prev","ca","loop","data","Object","_key","val","dur","target","queue","floor","curFloorLast","nextFloor","i","c","formatterForPlugins","raw","ext","useDebounceHook","value","delay","debounceValue","setDebounceValue","useState","useEffect","timer","setTimeout","clearTimeout"],"mappings":"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"}

package/dist/components/Loader/Analysis/files.mjs

@@ -2,7 +2,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { CloseCircleOutlined } from "@ant-design/icons";
 import { SDK } from "@rsdoctor/types";
 import { Card, Col, Divider, Drawer, List, Popover, Row, Space, Table, Tag, Tooltip, Typography } from "antd";
-import { get } from "lodash-es";
+import { get } from "es-toolkit/compat";
 import react, { useMemo, useState } from "react";
 import { Size, drawerWidth } from "../../../constants.mjs";
 import { createFileStructures, filterLoader, formatCosts, mapFileKey } from "../../../utils/index.mjs";

package/dist/components/Loader/Analysis/files.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"components/Loader/Analysis/files.mjs","sources":["webpack://@rsdoctor/components/./src/components/Loader/Analysis/files.tsx"],"sourcesContent":["import { CloseCircleOutlined } from '@ant-design/icons';\nimport { SDK } from '@rsdoctor/types';\nimport {\n  Card,\n  Col,\n  Divider,\n  Drawer,\n  List,\n  Popover,\n  Row,\n  Space,\n  Table,\n  Tag,\n  Tooltip,\n  Typography,\n} from 'antd';\nimport { get } from 'lodash-es';\nimport React, { useMemo, useState } from 'react';\nimport { drawerWidth, Size } from '../../../constants';\nimport {\n  createFileStructures,\n  DataNode,\n  filterLoader,\n  formatCosts,\n  mapFileKey,\n} from '../../../utils';\nimport { FileTree } from '../../FileTree';\nimport { Keyword } from '../../Keyword';\nimport { ServerAPIProvider } from '../../Manifest';\nimport { LoaderExecutions } from '../executions';\nimport styles from './style.module.scss';\n\nconst ADDITION_LOADER_NUMBER = 3;\n\nexport const LoaderFiles: React.FC<{\n  filetree: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetLoaderFileTree>;\n  cwd: string;\n  loaders: string[];\n  filename: string;\n  layer?: string;\n}> = (props) => {\n  const { cwd, filetree } = props;\n  const [drawerVisible, setDrawerVisible] = useState(false);\n  const [resourcePath, setResourcePath] = useState('');\n  const [loaderIndex, setLoaderIndex] = useState(0);\n  const [selectedNode, setSelectedNode] = useState<DataNode | null>(null);\n\n  const maxHeight = 800;\n\n  const filteredFiles = useMemo(\n    () =>\n      filetree.filter((e) =>\n        e.loaders.some((l) =>\n          filterLoader(\n            e.path,\n            l.loader,\n            props.filename,\n            props.loaders,\n            e.layer,\n            props?.layer,\n          ),\n        ),\n      ),\n    [props.filename, props.loaders, props.layer],\n  );\n\n  const inlinedResourcePathKey = '__RESOURCEPATH__';\n\n  const files = useMemo(() => {\n    return createFileStructures({\n      files: filteredFiles.map((e) => e.path),\n      cwd,\n      fileTitle(file, basename) {\n        const { loaders, layer } = filetree.find((e) => e.path === file)!;\n\n        const additionalLoaders: (Pick<\n          SDK.LoaderTransformData,\n          'path' | 'loader' | 'errors'\n        > & { costs: number })[] = [];\n\n        loaders.forEach(\n          (l, i) => i > ADDITION_LOADER_NUMBER && additionalLoaders.push(l),\n        );\n\n        return (\n          <div\n            style={{\n              wordBreak: 'break-all',\n              display: 'flex',\n              cursor: 'pointer',\n            }}\n            onClick={() => {\n              setLoaderIndex(0);\n              setResourcePath(file);\n              setDrawerVisible(true);\n            }}\n          >\n            <div className={styles.box}>\n              <div className={styles.keywords}>\n                <Keyword text={basename.replace(/\\[.*?\\]/g, '')} keyword={''} />\n              </div>\n            </div>\n            <div className={styles.dividerDiv} style={{ flex: 1 }}>\n              <Divider className={styles.divider} dashed />\n            </div>\n\n            {layer && (\n              <Tag color=\"cyan\" bordered={false}>\n                {layer}\n              </Tag>\n            )}\n            <Space>\n              {loaders.slice(0, ADDITION_LOADER_NUMBER).map((e, i) => {\n                const isError = e.errors && e.errors.length;\n                const key = `${file}_${e.loader}_${i}`;\n                if (i <= ADDITION_LOADER_NUMBER) {\n                  return (\n                    <Tooltip title={e.path} key={key}>\n                      <Typography.Text\n                        className={styles.textBox}\n                        style={{ color: isError ? '#f50' : 'inherit' }}\n                        onClick={(ev) => {\n                          ev.stopPropagation();\n                          setResourcePath(file);\n                          setLoaderIndex(i);\n                          setDrawerVisible(true);\n                        }}\n                      >\n                        <Typography.Text className={styles.text} ellipsis>\n                          {e.loader.match(/([^/]+-loader)/g)?.[0] || e.loader}\n                        </Typography.Text>\n                        <Divider type=\"vertical\" />\n                        {isError ? (\n                          <CloseCircleOutlined />\n                        ) : (\n                          <Typography.Text className={styles.text}>\n                            {formatCosts(e.costs)}\n                          </Typography.Text>\n                        )}\n                      </Typography.Text>\n                    </Tooltip>\n                  );\n                }\n              })}\n              {additionalLoaders?.length ? (\n                <Popover\n                  content={\n                    <List\n                      dataSource={additionalLoaders}\n                      renderItem={(e, i) => {\n                        const isError = e.errors && e.errors.length;\n                        const key = `${file}_${e.loader}_${i + ADDITION_LOADER_NUMBER}`;\n\n                        return (\n                          <List.Item>\n                            <Tooltip title={e.path} key={key}>\n                              <div style={{ paddingBottom: 5 }}>\n                                <Typography.Text\n                                  className={styles.textBox}\n                                  style={{\n                                    color: isError ? '#f50' : 'inherit',\n                                  }}\n                                  onClick={(ev) => {\n                                    ev.stopPropagation();\n                                    setResourcePath(file);\n                                    setLoaderIndex(i);\n                                    setDrawerVisible(true);\n                                  }}\n                                >\n                                  <Typography.Text\n                                    className={styles.text}\n                                    ellipsis\n                                  >\n                                    {e.loader.match(/([^/]+-loader)/g)?.[0] ||\n                                      e.loader}\n                                  </Typography.Text>\n                                  <Divider type=\"vertical\" />\n                                  <Typography.Text className={styles.text}>\n                                    {formatCosts(e.costs)}\n                                  </Typography.Text>\n                                </Typography.Text>\n                              </div>\n                            </Tooltip>\n                          </List.Item>\n                        );\n                      }}\n                    />\n                  }\n                >\n                  <div className={styles.textBox}>\n                    <Typography.Text>···</Typography.Text>\n                  </div>\n                </Popover>\n              ) : (\n                <></>\n              )}\n            </Space>\n          </div>\n        );\n      },\n      dirTitle(_dir, defaultTitle) {\n        return (\n          <div style={{ display: 'flex', cursor: 'pointer' }}>\n            <Keyword text={defaultTitle} keyword={''} />\n          </div>\n        );\n      },\n    });\n  }, [filteredFiles]);\n\n  return (\n    <Row style={{ width: '100%', marginLeft: 0 }} gutter={Size.BasePadding}>\n      <Col span={24}>\n        <Card\n          title={\n            <Space>\n              <Typography.Text strong>Files</Typography.Text>\n              <Typography.Text\n                style={{\n                  fontSize: 12,\n                  fontWeight: 400,\n                  color: '#1C1F2399',\n                  opacity: 0.6,\n                }}\n              >\n                Total Files: {filteredFiles.length}\n              </Typography.Text>\n            </Space>\n          }\n          bodyStyle={{\n            overflow: 'auto',\n            maxHeight,\n            minHeight: '40rem',\n            padding: 14,\n          }}\n        >\n          <FileTree\n            defaultExpandedKeys={mapFileKey(\n              files,\n              filteredFiles.length >= 100 ? 3 : 4,\n              (node) => {\n                const resourcePath: string = get(node, inlinedResourcePathKey)!;\n                const isNodeModules =\n                  resourcePath.indexOf('/node_modules/') > -1;\n\n                return !isNodeModules;\n              },\n            )}\n            treeData={files}\n            key={`${props.loaders.join('|')}_${props.filename}`}\n            onSelect={(_e, info) => {\n              if (!info.node.isLeaf) {\n                setSelectedNode(info.node);\n              }\n            }}\n            selectedKeys={selectedNode ? [selectedNode.key] : undefined}\n            expandAction=\"click\"\n          />\n          <Drawer\n            open={drawerVisible}\n            onClose={() => setDrawerVisible(false)}\n            maskClosable\n            width={drawerWidth}\n            zIndex={999}\n            bodyStyle={{ padding: 0 }}\n          >\n            {drawerVisible ? (\n              <ServerAPIProvider\n                api={SDK.ServerAPI.API.GetLoaderFileDetails}\n                body={{ path: resourcePath }}\n              >\n                {(data) => (\n                  <LoaderExecutions data={data} cwd={cwd} index={loaderIndex} />\n                )}\n              </ServerAPIProvider>\n            ) : null}\n          </Drawer>\n        </Card>\n      </Col>\n\n      <Drawer\n        open={!!selectedNode}\n        onClose={() => setSelectedNode(null)}\n        maskClosable\n        width={drawerWidth}\n        zIndex={999}\n        bodyStyle={{ padding: 0 }}\n      >\n        {selectedNode && (\n          <Row>\n            <Col span={24}>\n              <Card\n                title={\n                  <Tooltip\n                    title={React.cloneElement(\n                      selectedNode.title as React.ReactElement,\n                      { style: { color: '#fff' } },\n                    )}\n                  >\n                    <Typography.Text>\n                      {`Statistics of`}\n                      {selectedNode.title as React.ReactNode}\n                    </Typography.Text>\n                  </Tooltip>\n                }\n              >\n                <ServerAPIProvider\n                  api={SDK.ServerAPI.API.GetLoaderFolderStatistics}\n                  body={{ folder: selectedNode[inlinedResourcePathKey] }}\n                >\n                  {(tableData) => (\n                    <Table\n                      style={{\n                        width: '100%',\n                        maxHeight,\n                        height: '40rem',\n                        overflowY: 'scroll',\n                        wordBreak: 'break-all',\n                      }}\n                      pagination={false}\n                      bordered\n                      rowKey={(e) => e.loader}\n                      columns={[\n                        {\n                          title: 'Loader Name',\n                          dataIndex: 'loader',\n                        },\n                        {\n                          title: 'Files',\n                          dataIndex: 'files',\n                        },\n                        {\n                          title: 'Total Duration',\n                          dataIndex: 'costs',\n                          render: (v) => (\n                            <Typography.Text strong>\n                              {formatCosts(v)}\n                            </Typography.Text>\n                          ),\n                          sorter: (a, b) => a.costs - b.costs,\n                          defaultSortOrder: 'descend',\n                          sortDirections: ['descend', 'ascend'],\n                        },\n                      ]}\n                      dataSource={tableData!}\n                    />\n                  )}\n                </ServerAPIProvider>\n              </Card>\n            </Col>\n          </Row>\n        )}\n      </Drawer>\n    </Row>\n  );\n};\n"],"names":["ADDITION_LOADER_NUMBER","LoaderFiles","props","cwd","filetree","drawerVisible","setDrawerVisible","useState","resourcePath","setResourcePath","loaderIndex","setLoaderIndex","selectedNode","setSelectedNode","maxHeight","filteredFiles","useMemo","e","l","filterLoader","inlinedResourcePathKey","files","createFileStructures","file","basename","loaders","layer","additionalLoaders","i","styles","Keyword","Divider","Tag","Space","isError","key","_e_loader_match","Tooltip","Typography","ev","CloseCircleOutlined","formatCosts","Popover","List","_dir","defaultTitle","Row","Size","Col","Card","FileTree","mapFileKey","node","get","isNodeModules","_e","info","undefined","Drawer","drawerWidth","ServerAPIProvider","SDK","data","LoaderExecutions","React","tableData","Table","v","a","b"],"mappings":"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"}
+{"version":3,"file":"components/Loader/Analysis/files.mjs","sources":["webpack://@rsdoctor/components/./src/components/Loader/Analysis/files.tsx"],"sourcesContent":["import { CloseCircleOutlined } from '@ant-design/icons';\nimport { SDK } from '@rsdoctor/types';\nimport {\n  Card,\n  Col,\n  Divider,\n  Drawer,\n  List,\n  Popover,\n  Row,\n  Space,\n  Table,\n  Tag,\n  Tooltip,\n  Typography,\n} from 'antd';\nimport { get } from 'es-toolkit/compat';\nimport React, { useMemo, useState } from 'react';\nimport { drawerWidth, Size } from '../../../constants';\nimport {\n  createFileStructures,\n  DataNode,\n  filterLoader,\n  formatCosts,\n  mapFileKey,\n} from '../../../utils';\nimport { FileTree } from '../../FileTree';\nimport { Keyword } from '../../Keyword';\nimport { ServerAPIProvider } from '../../Manifest';\nimport { LoaderExecutions } from '../executions';\nimport styles from './style.module.scss';\n\nconst ADDITION_LOADER_NUMBER = 3;\n\nexport const LoaderFiles: React.FC<{\n  filetree: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetLoaderFileTree>;\n  cwd: string;\n  loaders: string[];\n  filename: string;\n  layer?: string;\n}> = (props) => {\n  const { cwd, filetree } = props;\n  const [drawerVisible, setDrawerVisible] = useState(false);\n  const [resourcePath, setResourcePath] = useState('');\n  const [loaderIndex, setLoaderIndex] = useState(0);\n  const [selectedNode, setSelectedNode] = useState<DataNode | null>(null);\n\n  const maxHeight = 800;\n\n  const filteredFiles = useMemo(\n    () =>\n      filetree.filter((e) =>\n        e.loaders.some((l) =>\n          filterLoader(\n            e.path,\n            l.loader,\n            props.filename,\n            props.loaders,\n            e.layer,\n            props?.layer,\n          ),\n        ),\n      ),\n    [props.filename, props.loaders, props.layer],\n  );\n\n  const inlinedResourcePathKey = '__RESOURCEPATH__';\n\n  const files = useMemo(() => {\n    return createFileStructures({\n      files: filteredFiles.map((e) => e.path),\n      cwd,\n      fileTitle(file, basename) {\n        const { loaders, layer } = filetree.find((e) => e.path === file)!;\n\n        const additionalLoaders: (Pick<\n          SDK.LoaderTransformData,\n          'path' | 'loader' | 'errors'\n        > & { costs: number })[] = [];\n\n        loaders.forEach(\n          (l, i) => i > ADDITION_LOADER_NUMBER && additionalLoaders.push(l),\n        );\n\n        return (\n          <div\n            style={{\n              wordBreak: 'break-all',\n              display: 'flex',\n              cursor: 'pointer',\n            }}\n            onClick={() => {\n              setLoaderIndex(0);\n              setResourcePath(file);\n              setDrawerVisible(true);\n            }}\n          >\n            <div className={styles.box}>\n              <div className={styles.keywords}>\n                <Keyword text={basename.replace(/\\[.*?\\]/g, '')} keyword={''} />\n              </div>\n            </div>\n            <div className={styles.dividerDiv} style={{ flex: 1 }}>\n              <Divider className={styles.divider} dashed />\n            </div>\n\n            {layer && (\n              <Tag color=\"cyan\" bordered={false}>\n                {layer}\n              </Tag>\n            )}\n            <Space>\n              {loaders.slice(0, ADDITION_LOADER_NUMBER).map((e, i) => {\n                const isError = e.errors && e.errors.length;\n                const key = `${file}_${e.loader}_${i}`;\n                if (i <= ADDITION_LOADER_NUMBER) {\n                  return (\n                    <Tooltip title={e.path} key={key}>\n                      <Typography.Text\n                        className={styles.textBox}\n                        style={{ color: isError ? '#f50' : 'inherit' }}\n                        onClick={(ev) => {\n                          ev.stopPropagation();\n                          setResourcePath(file);\n                          setLoaderIndex(i);\n                          setDrawerVisible(true);\n                        }}\n                      >\n                        <Typography.Text className={styles.text} ellipsis>\n                          {e.loader.match(/([^/]+-loader)/g)?.[0] || e.loader}\n                        </Typography.Text>\n                        <Divider type=\"vertical\" />\n                        {isError ? (\n                          <CloseCircleOutlined />\n                        ) : (\n                          <Typography.Text className={styles.text}>\n                            {formatCosts(e.costs)}\n                          </Typography.Text>\n                        )}\n                      </Typography.Text>\n                    </Tooltip>\n                  );\n                }\n              })}\n              {additionalLoaders?.length ? (\n                <Popover\n                  content={\n                    <List\n                      dataSource={additionalLoaders}\n                      renderItem={(e, i) => {\n                        const isError = e.errors && e.errors.length;\n                        const key = `${file}_${e.loader}_${i + ADDITION_LOADER_NUMBER}`;\n\n                        return (\n                          <List.Item>\n                            <Tooltip title={e.path} key={key}>\n                              <div style={{ paddingBottom: 5 }}>\n                                <Typography.Text\n                                  className={styles.textBox}\n                                  style={{\n                                    color: isError ? '#f50' : 'inherit',\n                                  }}\n                                  onClick={(ev) => {\n                                    ev.stopPropagation();\n                                    setResourcePath(file);\n                                    setLoaderIndex(i);\n                                    setDrawerVisible(true);\n                                  }}\n                                >\n                                  <Typography.Text\n                                    className={styles.text}\n                                    ellipsis\n                                  >\n                                    {e.loader.match(/([^/]+-loader)/g)?.[0] ||\n                                      e.loader}\n                                  </Typography.Text>\n                                  <Divider type=\"vertical\" />\n                                  <Typography.Text className={styles.text}>\n                                    {formatCosts(e.costs)}\n                                  </Typography.Text>\n                                </Typography.Text>\n                              </div>\n                            </Tooltip>\n                          </List.Item>\n                        );\n                      }}\n                    />\n                  }\n                >\n                  <div className={styles.textBox}>\n                    <Typography.Text>···</Typography.Text>\n                  </div>\n                </Popover>\n              ) : (\n                <></>\n              )}\n            </Space>\n          </div>\n        );\n      },\n      dirTitle(_dir, defaultTitle) {\n        return (\n          <div style={{ display: 'flex', cursor: 'pointer' }}>\n            <Keyword text={defaultTitle} keyword={''} />\n          </div>\n        );\n      },\n    });\n  }, [filteredFiles]);\n\n  return (\n    <Row style={{ width: '100%', marginLeft: 0 }} gutter={Size.BasePadding}>\n      <Col span={24}>\n        <Card\n          title={\n            <Space>\n              <Typography.Text strong>Files</Typography.Text>\n              <Typography.Text\n                style={{\n                  fontSize: 12,\n                  fontWeight: 400,\n                  color: '#1C1F2399',\n                  opacity: 0.6,\n                }}\n              >\n                Total Files: {filteredFiles.length}\n              </Typography.Text>\n            </Space>\n          }\n          bodyStyle={{\n            overflow: 'auto',\n            maxHeight,\n            minHeight: '40rem',\n            padding: 14,\n          }}\n        >\n          <FileTree\n            defaultExpandedKeys={mapFileKey(\n              files,\n              filteredFiles.length >= 100 ? 3 : 4,\n              (node) => {\n                const resourcePath: string = get(node, inlinedResourcePathKey)!;\n                const isNodeModules =\n                  resourcePath.indexOf('/node_modules/') > -1;\n\n                return !isNodeModules;\n              },\n            )}\n            treeData={files}\n            key={`${props.loaders.join('|')}_${props.filename}`}\n            onSelect={(_e, info) => {\n              if (!info.node.isLeaf) {\n                setSelectedNode(info.node);\n              }\n            }}\n            selectedKeys={selectedNode ? [selectedNode.key] : undefined}\n            expandAction=\"click\"\n          />\n          <Drawer\n            open={drawerVisible}\n            onClose={() => setDrawerVisible(false)}\n            maskClosable\n            width={drawerWidth}\n            zIndex={999}\n            bodyStyle={{ padding: 0 }}\n          >\n            {drawerVisible ? (\n              <ServerAPIProvider\n                api={SDK.ServerAPI.API.GetLoaderFileDetails}\n                body={{ path: resourcePath }}\n              >\n                {(data) => (\n                  <LoaderExecutions data={data} cwd={cwd} index={loaderIndex} />\n                )}\n              </ServerAPIProvider>\n            ) : null}\n          </Drawer>\n        </Card>\n      </Col>\n\n      <Drawer\n        open={!!selectedNode}\n        onClose={() => setSelectedNode(null)}\n        maskClosable\n        width={drawerWidth}\n        zIndex={999}\n        bodyStyle={{ padding: 0 }}\n      >\n        {selectedNode && (\n          <Row>\n            <Col span={24}>\n              <Card\n                title={\n                  <Tooltip\n                    title={React.cloneElement(\n                      selectedNode.title as React.ReactElement,\n                      { style: { color: '#fff' } },\n                    )}\n                  >\n                    <Typography.Text>\n                      {`Statistics of`}\n                      {selectedNode.title as React.ReactNode}\n                    </Typography.Text>\n                  </Tooltip>\n                }\n              >\n                <ServerAPIProvider\n                  api={SDK.ServerAPI.API.GetLoaderFolderStatistics}\n                  body={{ folder: selectedNode[inlinedResourcePathKey] }}\n                >\n                  {(tableData) => (\n                    <Table\n                      style={{\n                        width: '100%',\n                        maxHeight,\n                        height: '40rem',\n                        overflowY: 'scroll',\n                        wordBreak: 'break-all',\n                      }}\n                      pagination={false}\n                      bordered\n                      rowKey={(e) => e.loader}\n                      columns={[\n                        {\n                          title: 'Loader Name',\n                          dataIndex: 'loader',\n                        },\n                        {\n                          title: 'Files',\n                          dataIndex: 'files',\n                        },\n                        {\n                          title: 'Total Duration',\n                          dataIndex: 'costs',\n                          render: (v) => (\n                            <Typography.Text strong>\n                              {formatCosts(v)}\n                            </Typography.Text>\n                          ),\n                          sorter: (a, b) => a.costs - b.costs,\n                          defaultSortOrder: 'descend',\n                          sortDirections: ['descend', 'ascend'],\n                        },\n                      ]}\n                      dataSource={tableData!}\n                    />\n                  )}\n                </ServerAPIProvider>\n              </Card>\n            </Col>\n          </Row>\n        )}\n      </Drawer>\n    </Row>\n  );\n};\n"],"names":["ADDITION_LOADER_NUMBER","LoaderFiles","props","cwd","filetree","drawerVisible","setDrawerVisible","useState","resourcePath","setResourcePath","loaderIndex","setLoaderIndex","selectedNode","setSelectedNode","maxHeight","filteredFiles","useMemo","e","l","filterLoader","inlinedResourcePathKey","files","createFileStructures","file","basename","loaders","layer","additionalLoaders","i","styles","Keyword","Divider","Tag","Space","isError","key","_e_loader_match","Tooltip","Typography","ev","CloseCircleOutlined","formatCosts","Popover","List","_dir","defaultTitle","Row","Size","Col","Card","FileTree","mapFileKey","node","get","isNodeModules","_e","info","undefined","Drawer","drawerWidth","ServerAPIProvider","SDK","data","LoaderExecutions","React","tableData","Table","v","a","b"],"mappings":"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"}

package/dist/components/Manifest/api.mjs

@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import { Constants, SDK } from "@rsdoctor/types";
 import { Skeleton, Spin } from "antd";
 import { useCallback, useEffect, useState } from "react";
-import { isEqual } from "lodash-es";
+import { isEqual } from "es-toolkit/compat";
 import { fetchManifest, useDataLoader } from "../../utils/index.mjs";
 import { ComponentState } from "../../constants.mjs";
 import { FailedStatus } from "../Status/index.mjs";

package/dist/components/Manifest/api.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"components/Manifest/api.mjs","sources":["webpack://@rsdoctor/components/./src/components/Manifest/api.tsx"],"sourcesContent":["import { Constants, Manifest, SDK } from '@rsdoctor/types';\nimport { Skeleton, Spin } from 'antd';\nimport React, { useCallback, useEffect, useState } from 'react';\nimport { isEqual } from 'lodash-es';\nimport { fetchManifest, useDataLoader } from '../../utils';\nimport { ComponentState } from '../../constants';\nimport { FailedStatus } from '../Status';\nimport { BaseDataLoader } from '../../utils/data/base';\nimport { Lodash } from '@rsdoctor/utils/common';\n\nexport type InferServerAPIBody<T> =\n  SDK.ServerAPI.InferRequestBodyType<T> extends void\n    ? {\n        // use `any` to avoid ts check when need not to define the body in this component.\n        body?: any;\n      }\n    : {\n        body: SDK.ServerAPI.InferRequestBodyType<T>;\n      };\n\ntype ServerAPIProviderProps<\n  T extends SDK.ServerAPI.API | SDK.ServerAPI.APIExtends,\n> = {\n  manifestLoader?: () => Promise<Manifest.RsdoctorManifestWithShardingFiles>;\n  api: T;\n  children: (response: SDK.ServerAPI.InferResponseType<T>) => JSX.Element;\n  fallbackComponent?: React.FC;\n  showSkeleton?: boolean;\n} & InferServerAPIBody<T>;\n\n/**\n * this component will request server api to the sdk of Rsdoctor in local development.\n * otherwise it will fallback to load full manifest for the data.\n *\n * @example usage\n * <ServerAPIProvider {...props}>\n *   {(response) => {\n *     <Component {...}></Component>\n *   }}\n * </ServerAPIProvider>\n */\nexport const ServerAPIProvider = <\n  T extends SDK.ServerAPI.API | SDK.ServerAPI.APIExtends,\n>(\n  props: ServerAPIProviderProps<T>,\n): JSX.Element | null => {\n  const {\n    manifestLoader = fetchManifest,\n    api,\n    children,\n    // default value of \"body\" must be \"null\" to avoid the response type not match when the socket received message.\n    body = null,\n    showSkeleton = true,\n    fallbackComponent,\n  } = props;\n  let promise: Promise<Manifest.RsdoctorManifestWithShardingFiles>;\n\n  const [manifest, setManifest] =\n    useState<Manifest.RsdoctorManifestWithShardingFiles>();\n  const [state, setState] = useState(ComponentState.Pending);\n  const [res, setRes] = useState({} as SDK.ServerAPI.InferResponseType<T>);\n\n  const { loader } = useDataLoader(manifest);\n\n  function init(loader: BaseDataLoader | void) {\n    if (window[Constants.WINDOW_RSDOCTOR_TAG]) {\n      executeLoader(loader);\n    } else {\n      promise = manifestLoader();\n      ensureManifest(promise).then(() => {\n        executeLoader(loader);\n      });\n    }\n  }\n\n  const update = useCallback(\n    ({ req, res: response }: SDK.ServerAPI.SocketResponseType<T>) => {\n      if (req.api === api) {\n        // body is equal.\n        // both two body are null or undefined.\n        if (\n          isEqual(req.body, body) ||\n          (Lodash.isNil(req.body) && Lodash.isNil(body))\n        ) {\n          if (!isEqual(res, response)) {\n            setRes(response);\n          }\n        }\n      }\n      // make sure update successful.\n      setState(ComponentState.Success);\n    },\n    [res, api, body],\n  );\n\n  useEffect(() => {\n    init(loader);\n  }, [loader, api, body]);\n\n  useEffect(() => {\n    if (!loader) return;\n    // add update event listener\n    loader.onDataUpdate(api, update);\n    return () => {\n      // remove update event when the component unmount.\n      loader.removeOnDataUpdate(api, update);\n    };\n  }, [loader, api, body]);\n\n  function ensureManifest(\n    pro: Promise<Manifest.RsdoctorManifestWithShardingFiles>,\n  ) {\n    return pro\n      .then((manifest) => {\n        setManifest(manifest);\n      })\n      .catch((err) => {\n        setState(ComponentState.Fail);\n        throw err;\n      });\n  }\n\n  function executeLoader(loader: BaseDataLoader | void) {\n    if (!loader) return;\n\n    const exts = Object.values(SDK.ServerAPI.APIExtends);\n\n    // extends api will wait for update only.\n    if (exts.includes(api as SDK.ServerAPI.APIExtends)) {\n      // extends api need to handle \"undefined\" response inside component.\n      setState(ComponentState.Success);\n      return;\n    }\n\n    loader\n      .loadAPI(api as SDK.ServerAPI.API, body)\n      .then((e) => {\n        // if (process.env.NODE_ENV === 'development') {\n        //   console.log('[ServerAPIProvider] props: ', e, api, loader);\n        // }\n        // maybe the data not prepared.\n        if (Lodash.isNil(e)) {\n          return;\n        }\n        setRes(e as SDK.ServerAPI.InferResponseType<T>);\n        setState(ComponentState.Success);\n      })\n      .catch((err) => {\n        console.error(err);\n        setState(ComponentState.Fail);\n      });\n  }\n\n  if (state === ComponentState.Pending) {\n    return showSkeleton ? <Skeleton active /> : null;\n  }\n\n  if (state === ComponentState.Fail) {\n    if (fallbackComponent)\n      return fallbackComponent as unknown as React.ReactElement;\n\n    return (\n      <FailedStatus\n        retry={() => {\n          setState(ComponentState.Pending);\n          promise = manifestLoader();\n          init();\n        }}\n      />\n    );\n  }\n\n  if (state === ComponentState.Updating) {\n    return <Spin spinning>{children(res)}</Spin>;\n  }\n\n  return children(res);\n};\n\nexport function withServerAPI<\n  T,\n  P extends keyof T,\n  A extends SDK.ServerAPI.API | SDK.ServerAPI.APIExtends,\n>({\n  Component,\n  api,\n  responsePropName,\n  body: bodyInRoot,\n  fallbackComponent,\n  showSkeleton,\n}: {\n  Component: React.FC<T>;\n  api: A;\n  responsePropName: P;\n  fallbackComponent?: React.FC;\n  showSkeleton?: boolean;\n} & Partial<Partial<InferServerAPIBody<A>>>): React.FC<\n  Omit<T, P> & Partial<InferServerAPIBody<A>>\n> {\n  return function _(props) {\n    const { body = bodyInRoot, ...rest } = props;\n\n    return (\n      // @ts-ignore\n      <ServerAPIProvider\n        api={api}\n        body={body}\n        showSkeleton={showSkeleton}\n        fallbackComponent={fallbackComponent}\n      >\n        {(res) => {\n          const _props = {\n            ...rest,\n            [responsePropName]: res,\n          } as T & JSX.IntrinsicAttributes;\n\n          return <Component {..._props} />;\n        }}\n      </ServerAPIProvider>\n    );\n  };\n}\n"],"names":["ServerAPIProvider","props","manifestLoader","fetchManifest","api","children","body","showSkeleton","fallbackComponent","promise","manifest","setManifest","useState","state","setState","ComponentState","res","setRes","loader","useDataLoader","init","window","Constants","executeLoader","ensureManifest","update","useCallback","req","response","isEqual","Lodash","useEffect","pro","err","exts","Object","SDK","e","console","Skeleton","FailedStatus","Spin","withServerAPI","Component","responsePropName","bodyInRoot","rest","_props"],"mappings":"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"}
+{"version":3,"file":"components/Manifest/api.mjs","sources":["webpack://@rsdoctor/components/./src/components/Manifest/api.tsx"],"sourcesContent":["import { Constants, Manifest, SDK } from '@rsdoctor/types';\nimport { Skeleton, Spin } from 'antd';\nimport React, { useCallback, useEffect, useState } from 'react';\nimport { isEqual } from 'es-toolkit/compat';\nimport { fetchManifest, useDataLoader } from '../../utils';\nimport { ComponentState } from '../../constants';\nimport { FailedStatus } from '../Status';\nimport { BaseDataLoader } from '../../utils/data/base';\nimport { Lodash } from '@rsdoctor/utils/common';\n\nexport type InferServerAPIBody<T> =\n  SDK.ServerAPI.InferRequestBodyType<T> extends void\n    ? {\n        // use `any` to avoid ts check when need not to define the body in this component.\n        body?: any;\n      }\n    : {\n        body: SDK.ServerAPI.InferRequestBodyType<T>;\n      };\n\ntype ServerAPIProviderProps<\n  T extends SDK.ServerAPI.API | SDK.ServerAPI.APIExtends,\n> = {\n  manifestLoader?: () => Promise<Manifest.RsdoctorManifestWithShardingFiles>;\n  api: T;\n  children: (response: SDK.ServerAPI.InferResponseType<T>) => JSX.Element;\n  fallbackComponent?: React.FC;\n  showSkeleton?: boolean;\n} & InferServerAPIBody<T>;\n\n/**\n * this component will request server api to the sdk of Rsdoctor in local development.\n * otherwise it will fallback to load full manifest for the data.\n *\n * @example usage\n * <ServerAPIProvider {...props}>\n *   {(response) => {\n *     <Component {...}></Component>\n *   }}\n * </ServerAPIProvider>\n */\nexport const ServerAPIProvider = <\n  T extends SDK.ServerAPI.API | SDK.ServerAPI.APIExtends,\n>(\n  props: ServerAPIProviderProps<T>,\n): JSX.Element | null => {\n  const {\n    manifestLoader = fetchManifest,\n    api,\n    children,\n    // default value of \"body\" must be \"null\" to avoid the response type not match when the socket received message.\n    body = null,\n    showSkeleton = true,\n    fallbackComponent,\n  } = props;\n  let promise: Promise<Manifest.RsdoctorManifestWithShardingFiles>;\n\n  const [manifest, setManifest] =\n    useState<Manifest.RsdoctorManifestWithShardingFiles>();\n  const [state, setState] = useState(ComponentState.Pending);\n  const [res, setRes] = useState({} as SDK.ServerAPI.InferResponseType<T>);\n\n  const { loader } = useDataLoader(manifest);\n\n  function init(loader: BaseDataLoader | void) {\n    if (window[Constants.WINDOW_RSDOCTOR_TAG]) {\n      executeLoader(loader);\n    } else {\n      promise = manifestLoader();\n      ensureManifest(promise).then(() => {\n        executeLoader(loader);\n      });\n    }\n  }\n\n  const update = useCallback(\n    ({ req, res: response }: SDK.ServerAPI.SocketResponseType<T>) => {\n      if (req.api === api) {\n        // body is equal.\n        // both two body are null or undefined.\n        if (\n          isEqual(req.body, body) ||\n          (Lodash.isNil(req.body) && Lodash.isNil(body))\n        ) {\n          if (!isEqual(res, response)) {\n            setRes(response);\n          }\n        }\n      }\n      // make sure update successful.\n      setState(ComponentState.Success);\n    },\n    [res, api, body],\n  );\n\n  useEffect(() => {\n    init(loader);\n  }, [loader, api, body]);\n\n  useEffect(() => {\n    if (!loader) return;\n    // add update event listener\n    loader.onDataUpdate(api, update);\n    return () => {\n      // remove update event when the component unmount.\n      loader.removeOnDataUpdate(api, update);\n    };\n  }, [loader, api, body]);\n\n  function ensureManifest(\n    pro: Promise<Manifest.RsdoctorManifestWithShardingFiles>,\n  ) {\n    return pro\n      .then((manifest) => {\n        setManifest(manifest);\n      })\n      .catch((err) => {\n        setState(ComponentState.Fail);\n        throw err;\n      });\n  }\n\n  function executeLoader(loader: BaseDataLoader | void) {\n    if (!loader) return;\n\n    const exts = Object.values(SDK.ServerAPI.APIExtends);\n\n    // extends api will wait for update only.\n    if (exts.includes(api as SDK.ServerAPI.APIExtends)) {\n      // extends api need to handle \"undefined\" response inside component.\n      setState(ComponentState.Success);\n      return;\n    }\n\n    loader\n      .loadAPI(api as SDK.ServerAPI.API, body)\n      .then((e) => {\n        // if (process.env.NODE_ENV === 'development') {\n        //   console.log('[ServerAPIProvider] props: ', e, api, loader);\n        // }\n        // maybe the data not prepared.\n        if (Lodash.isNil(e)) {\n          return;\n        }\n        setRes(e as SDK.ServerAPI.InferResponseType<T>);\n        setState(ComponentState.Success);\n      })\n      .catch((err) => {\n        console.error(err);\n        setState(ComponentState.Fail);\n      });\n  }\n\n  if (state === ComponentState.Pending) {\n    return showSkeleton ? <Skeleton active /> : null;\n  }\n\n  if (state === ComponentState.Fail) {\n    if (fallbackComponent)\n      return fallbackComponent as unknown as React.ReactElement;\n\n    return (\n      <FailedStatus\n        retry={() => {\n          setState(ComponentState.Pending);\n          promise = manifestLoader();\n          init();\n        }}\n      />\n    );\n  }\n\n  if (state === ComponentState.Updating) {\n    return <Spin spinning>{children(res)}</Spin>;\n  }\n\n  return children(res);\n};\n\nexport function withServerAPI<\n  T,\n  P extends keyof T,\n  A extends SDK.ServerAPI.API | SDK.ServerAPI.APIExtends,\n>({\n  Component,\n  api,\n  responsePropName,\n  body: bodyInRoot,\n  fallbackComponent,\n  showSkeleton,\n}: {\n  Component: React.FC<T>;\n  api: A;\n  responsePropName: P;\n  fallbackComponent?: React.FC;\n  showSkeleton?: boolean;\n} & Partial<Partial<InferServerAPIBody<A>>>): React.FC<\n  Omit<T, P> & Partial<InferServerAPIBody<A>>\n> {\n  return function _(props) {\n    const { body = bodyInRoot, ...rest } = props;\n\n    return (\n      // @ts-ignore\n      <ServerAPIProvider\n        api={api}\n        body={body}\n        showSkeleton={showSkeleton}\n        fallbackComponent={fallbackComponent}\n      >\n        {(res) => {\n          const _props = {\n            ...rest,\n            [responsePropName]: res,\n          } as T & JSX.IntrinsicAttributes;\n\n          return <Component {..._props} />;\n        }}\n      </ServerAPIProvider>\n    );\n  };\n}\n"],"names":["ServerAPIProvider","props","manifestLoader","fetchManifest","api","children","body","showSkeleton","fallbackComponent","promise","manifest","setManifest","useState","state","setState","ComponentState","res","setRes","loader","useDataLoader","init","window","Constants","executeLoader","ensureManifest","update","useCallback","req","response","isEqual","Lodash","useEffect","pro","err","exts","Object","SDK","e","console","Skeleton","FailedStatus","Spin","withServerAPI","Component","responsePropName","bodyInRoot","rest","_props"],"mappings":"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"}