@rsdoctor/components 1.5.18 → 1.6.1

package/dist/components/base/DiffViewer/interface.d.ts

@@ -35,8 +35,7 @@ export interface DiffViewerProps {
      */
     isEmbed?: boolean;
     /**
-     * Whether to use light theme
-     * @default true
+     * Whether to use light theme. If not specified the global theme is used.
      */
     isLightTheme?: boolean;
     /**

package/dist/pages/BundleSize/components/asset_module.css

@@ -37,13 +37,16 @@
   --x-pad-minus-scrollbar: calc(var(--x-pad) - var(--scrollbar-width));
   min-height: var(--tree-min-height);
   padding: var(--y-pad) var(--x-pad-minus-scrollbar) var(--y-pad) var(--x-pad);
-  resize: vertical;
-  border: 1px solid #ebedf1;
-  border-radius: 8px;
+  border: 1px solid var(--color-border-secondary);
+  border-radius: var(--border-radius-lg);
   flex: 1;
   display: flex;
 }
 
+.bundleTree-ym_nR5 .ant-tree-list-scrollbar-thumb {
+  background: var(--color-scrollbar) !important;
+}
+
 @media (max-height: 900px) {
   .bundleTree-ym_nR5 {
     --tree-min-height: 450px;
@@ -84,7 +87,6 @@
 .bundleTreeEntryTitle-XbeexU {
   text-overflow: ellipsis;
   text-wrap: nowrap;
-  color: #000000d9;
   font-size: 14px;
   font-weight: 400;
   overflow: hidden;
@@ -98,7 +100,7 @@
 }
 
 .divider-Iq1wtJ {
-  border-bottom: 1px dashed #0000001f;
+  border-bottom: 1px dashed var(--color-divider);
   flex-grow: 1;
   min-width: 10px;
   height: 1px;

package/dist/pages/BundleSize/components/asset_module.css.map

@@ -1 +1 @@
-{"version":3,"sources":["webpack://./src/pages/BundleSize/components/asset.module.scss"],"names":[],"mappings":"AAAA;EACE,eAAe;AACjB;;AAF6D;EAK3D,cAAc;AAChB;;AANsG;EASpG,WAAW;AACb;;AAVuJ;EAarJ,iBAAiB;AACnB;;AAd0M;EAiBxM,aAAa;AACf;;AAlBsQ;EAqBpQ,2CAA2C;EAC3C,2BAA2B;AAC7B;;AAvBwV;EA0BtV,sBAAsB;EACtB,OAAO;EACP,aAAa;AACf;;AA7BsZ;EAgCpZ,wBAAwB;EACxB,aAAa;EACb,aAAa;EACb,uBAAuB;EACvB,oEAAoE;EACpE,kCAAkC;EAClC,4EAA4E;EAC5E,gBAAgB;EAChB,yBAAyB;EACzB,kBAAkB;EAClB,OAAO;EACP,aAAa;AACf;;AA5CivB;EAA0B;IAgDvwB,wBAAwB;EAC1B;AACF;;AAlDizB;EAqD/yB,OAAO;EACP,kBAAkB;AACpB;;AAvD81B;EA0D51B,kBAAkB;EAClB,QAAQ;AACV;;AA5Di5B;EA+D/4B,gCAAgC;EAChC,aAAa;EACb,kBAAkB;AACpB;;AAlEi+B;EAqE/9B,YAAY;EACZ,oBAAoB;AACtB;;AAvEyiC;EA0EviC,WAAW;EACX,mBAAmB;EACnB,qDAAqD;EACrD,aAAa;EACb,kBAAkB;EAClB,MAAM;EACN,OAAO;AACT;;AAjFgsC;EAoF9rC,uBAAuB;EACvB,iBAAiB;EACjB,gBAAgB;EAChB,eAAe;EACf,gBAAgB;EAChB,gBAAgB;AAClB;;AA1Fm0C;EA6Fj0C,OAAO;EACP,mBAAmB;EACnB,aAAa;EACb,gBAAgB;AAClB;;AAjGo5C;EAoGl5C,mCAAmC;EACnC,YAAY;EACZ,eAAe;EACf,WAAW;EACX,cAAc;EACd,kBAAkB;EAClB,QAAQ;AACV","sourcesContent":[".bundle :global .rc-tree-node-content-wrapper{font-size:14px}.bundle :global .file-icon{margin-left:0}.bundle :global .ant-tree-indent-unit{width:10px}.bundle :global .ant-tree-iconEle{margin-right:2px}.bundle :global .ant-tree-node-content-wrapper{display:flex}.bundleBody{justify-content:flex-start;min-height:var(--body-min-height, initial)}.bundle,.bundleBody{display:flex;flex-direction:column;flex:1}.bundleTree{--tree-min-height: 300px;--x-pad: 20px;--y-pad: 14px;--scrollbar-width: 10px;--x-pad-minus-scrollbar: calc(var(--x-pad) - var(--scrollbar-width));display:flex;flex:1;min-height:var(--tree-min-height);padding:var(--y-pad) var(--x-pad-minus-scrollbar) var(--y-pad) var(--x-pad);border:1px solid #ebedf1;border-radius:8px;resize:vertical}@media(max-height: 900px){.bundleTree{--tree-min-height: 450px}}.bundleTreeViewport{flex:1;position:relative}.bundleTreeInnerViewport{position:absolute;inset:0}.bundleTreeEntry{display:flex;position:relative;height:var(--item-height, 30px)}.bundleTreeEntry :global span.ant-tag{margin:none;margin-inline-end:0px}.bundleTreeEntryContent{position:absolute;left:0;top:0;width:100%;display:flex;align-items:center;padding-inline-end:var(--x-pad-minus-scrollbar, 0px)}.bundleTreeEntryTitle{text-overflow:ellipsis;overflow:hidden;text-wrap:nowrap;font-size:14px;font-weight:400;color:rgba(0,0,0,.85)}.bundleTreeEntryTitleWrap{display:flex;flex:1;align-items:center;overflow:hidden}.divider{position:relative;top:4px;height:1px;min-width:10px;flex-grow:1;margin:0 10px;border-bottom:1px dashed rgba(0,0,0,.12)}"],"sourceRoot":""}
+{"version":3,"sources":["webpack://./src/pages/BundleSize/components/asset.module.scss"],"names":[],"mappings":"AAAA;EACE,eAAe;AACjB;;AAF6D;EAK3D,cAAc;AAChB;;AANsG;EASpG,WAAW;AACb;;AAVuJ;EAarJ,iBAAiB;AACnB;;AAd0M;EAiBxM,aAAa;AACf;;AAlBsQ;EAqBpQ,2CAA2C;EAC3C,2BAA2B;AAC7B;;AAvBwV;EA0BtV,sBAAsB;EACtB,OAAO;EACP,aAAa;AACf;;AA7BsZ;EAgCpZ,wBAAwB;EACxB,aAAa;EACb,aAAa;EACb,uBAAuB;EACvB,oEAAoE;EACpE,kCAAkC;EAClC,4EAA4E;EAC5E,+CAA+C;EAC/C,sCAAsC;EACtC,OAAO;EACP,aAAa;AACf;;AA3C2wB;EA8CzwB,6CAA6C;AAC/C;;AA/C42B;EAA0B;IAmDl4B,wBAAwB;EAC1B;AACF;;AArD46B;EAwD16B,OAAO;EACP,kBAAkB;AACpB;;AA1Dy9B;EA6Dv9B,kBAAkB;EAClB,QAAQ;AACV;;AA/D4gC;EAkE1gC,gCAAgC;EAChC,aAAa;EACb,kBAAkB;AACpB;;AArE4lC;EAwE1lC,YAAY;EACZ,oBAAoB;AACtB;;AA1EoqC;EA6ElqC,WAAW;EACX,mBAAmB;EACnB,qDAAqD;EACrD,aAAa;EACb,kBAAkB;EAClB,MAAM;EACN,OAAO;AACT;;AApF2zC;EAuFzzC,uBAAuB;EACvB,iBAAiB;EACjB,eAAe;EACf,gBAAgB;EAChB,gBAAgB;AAClB;;AA5Fw6C;EA+Ft6C,OAAO;EACP,mBAAmB;EACnB,aAAa;EACb,gBAAgB;AAClB;;AAnGy/C;EAsGv/C,8CAA8C;EAC9C,YAAY;EACZ,eAAe;EACf,WAAW;EACX,cAAc;EACd,kBAAkB;EAClB,QAAQ;AACV","sourcesContent":[".bundle :global .rc-tree-node-content-wrapper{font-size:14px}.bundle :global .file-icon{margin-left:0}.bundle :global .ant-tree-indent-unit{width:10px}.bundle :global .ant-tree-iconEle{margin-right:2px}.bundle :global .ant-tree-node-content-wrapper{display:flex}.bundleBody{justify-content:flex-start;min-height:var(--body-min-height, initial)}.bundle,.bundleBody{display:flex;flex-direction:column;flex:1}.bundleTree{--tree-min-height: 300px;--x-pad: 20px;--y-pad: 14px;--scrollbar-width: 10px;--x-pad-minus-scrollbar: calc(var(--x-pad) - var(--scrollbar-width));display:flex;flex:1;min-height:var(--tree-min-height);padding:var(--y-pad) var(--x-pad-minus-scrollbar) var(--y-pad) var(--x-pad);border:1px solid var(--color-border-secondary);border-radius:var(--border-radius-lg)}.bundleTree :global(.ant-tree-list-scrollbar-thumb){background:var(--color-scrollbar) !important}@media(max-height: 900px){.bundleTree{--tree-min-height: 450px}}.bundleTreeViewport{flex:1;position:relative}.bundleTreeInnerViewport{position:absolute;inset:0}.bundleTreeEntry{display:flex;position:relative;height:var(--item-height, 30px)}.bundleTreeEntry :global span.ant-tag{margin:none;margin-inline-end:0px}.bundleTreeEntryContent{position:absolute;left:0;top:0;width:100%;display:flex;align-items:center;padding-inline-end:var(--x-pad-minus-scrollbar, 0px)}.bundleTreeEntryTitle{text-overflow:ellipsis;overflow:hidden;text-wrap:nowrap;font-size:14px;font-weight:400}.bundleTreeEntryTitleWrap{display:flex;flex:1;align-items:center;overflow:hidden}.divider{position:relative;top:4px;height:1px;min-width:10px;flex-grow:1;margin:0 10px;border-bottom:1px dashed var(--color-divider)}"],"sourceRoot":""}

package/dist/pages/BundleSize/components/card_module.css

@@ -1,5 +1,7 @@
 .container-wODg_6 {
-  background-color: #fff;
+  background-color: var(--color-bg-box);
+  border: 1px solid var(--color-border-secondary);
+  border-radius: var(--border-radius-lg);
   align-items: center;
   margin-bottom: 20px;
   padding: 20px 0;
@@ -27,19 +29,23 @@
 }
 
 .container-wODg_6 .summary-zj0ygd .description-o0ffpO {
+  font-variant-numeric: tabular-nums;
   margin-right: 5px;
   font-size: 20px;
-  font-weight: 500;
+  font-weight: 600;
   line-height: 32px;
 }
 
 .container-wODg_6 .summary-zj0ygd .unit-n5Yty6 {
+  color: var(--text-color-secondary);
   font-size: 12px;
   font-weight: 400;
   line-height: 32px;
 }
 
 .container-wODg_6 .summary-zj0ygd .totalNumber-UweUl8 {
+  color: var(--text-color-secondary);
+  font-variant-numeric: tabular-nums;
   margin: 4px 0;
   font-size: 13px;
   font-weight: 400;
@@ -54,7 +60,7 @@
 }
 
 .cardTitle-xNmEfV .title-qIR7dd {
-  color: #000;
+  color: var(--text-color);
   font-size: 14px;
   font-weight: 500;
   line-height: 20px;

package/dist/pages/BundleSize/components/card_module.css.map

@@ -1 +1 @@
-{"version":3,"sources":["webpack://./src/pages/BundleSize/components/card.module.scss"],"names":[],"mappings":"AAAA;EACE,sBAAsB;EACtB,mBAAmB;EACnB,mBAAmB;EACnB,eAAe;EACf,aAAa;AACf;;AANmG;EASjG,6BAA6B;EAC7B,WAAW;EACX,aAAa;AACf;;AAZoL;EAelL,OAAO;EACP,uBAAuB;EACvB,mBAAmB;EACnB,aAAa;AACf;;AAnBqR;EAsBnR,sBAAsB;EACtB,uBAAuB;EACvB,cAAc;EACd,aAAa;AACf;;AA1BiX;EA6B/W,iBAAiB;EACjB,eAAe;EACf,gBAAgB;EAChB,iBAAiB;AACnB;;AAjCmd;EAoCjd,eAAe;EACf,gBAAgB;EAChB,iBAAiB;AACnB;;AAvC6hB;EA0C3hB,aAAa;EACb,eAAe;EACf,gBAAgB;EAChB,iBAAiB;AACnB;;AA9C2nB;EAiDznB,8BAA8B;EAC9B,mBAAmB;EACnB,mBAAmB;EACnB,aAAa;AACf;;AArDutB;EAwDrtB,WAAW;EACX,eAAe;EACf,gBAAgB;EAChB,iBAAiB;AACnB","sourcesContent":[".container{display:flex;align-items:center;background-color:#fff;padding:20px 0;margin-bottom:20px}.container .chartsContainer{width:100%;display:flex;justify-content:space-evenly}.container .chartsContainer .chart{display:flex;align-items:center;justify-content:center;flex:1}.container .summary{display:flex;flex-direction:column;justify-content:center;margin:0 20px}.container .summary .description{font-size:20px;font-weight:500;line-height:32px;margin-right:5px}.container .summary .unit{font-size:12px;font-weight:400;line-height:32px}.container .summary .totalNumber{font-size:13px;font-weight:400;line-height:20px;margin:4px 0}.cardTitle{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.cardTitle .title{font-size:14px;font-weight:500;line-height:20px;color:#000}"],"sourceRoot":""}
+{"version":3,"sources":["webpack://./src/pages/BundleSize/components/card.module.scss"],"names":[],"mappings":"AAAA;EACE,qCAAqC;EACrC,+CAA+C;EAC/C,sCAAsC;EACtC,mBAAmB;EACnB,mBAAmB;EACnB,eAAe;EACf,aAAa;AACf;;AARuM;EAWrM,6BAA6B;EAC7B,WAAW;EACX,aAAa;AACf;;AAdwR;EAiBtR,OAAO;EACP,uBAAuB;EACvB,mBAAmB;EACnB,aAAa;AACf;;AArByX;EAwBvX,sBAAsB;EACtB,uBAAuB;EACvB,cAAc;EACd,aAAa;AACf;;AA5Bqd;EA+Bnd,kCAAkC;EAClC,iBAAiB;EACjB,eAAe;EACf,gBAAgB;EAChB,iBAAiB;AACnB;;AApCylB;EAuCvlB,kCAAkC;EAClC,eAAe;EACf,gBAAgB;EAChB,iBAAiB;AACnB;;AA3CqsB;EA8CnsB,kCAAkC;EAClC,kCAAkC;EAClC,aAAa;EACb,eAAe;EACf,gBAAgB;EAChB,iBAAiB;AACnB;;AApDu2B;EAuDr2B,8BAA8B;EAC9B,mBAAmB;EACnB,mBAAmB;EACnB,aAAa;AACf;;AA3Dm8B;EA8Dj8B,wBAAwB;EACxB,eAAe;EACf,gBAAgB;EAChB,iBAAiB;AACnB","sourcesContent":[".container{display:flex;align-items:center;background-color:var(--color-bg-box);padding:20px 0;margin-bottom:20px;border:1px solid var(--color-border-secondary);border-radius:var(--border-radius-lg)}.container .chartsContainer{width:100%;display:flex;justify-content:space-evenly}.container .chartsContainer .chart{display:flex;align-items:center;justify-content:center;flex:1}.container .summary{display:flex;flex-direction:column;justify-content:center;margin:0 20px}.container .summary .description{font-size:20px;font-weight:600;line-height:32px;margin-right:5px;font-variant-numeric:tabular-nums}.container .summary .unit{font-size:12px;font-weight:400;line-height:32px;color:var(--text-color-secondary)}.container .summary .totalNumber{font-size:13px;font-weight:400;line-height:20px;margin:4px 0;color:var(--text-color-secondary);font-variant-numeric:tabular-nums}.cardTitle{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.cardTitle .title{font-size:14px;font-weight:500;line-height:20px;color:var(--text-color)}"],"sourceRoot":""}

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

@@ -1,9 +1,9 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useMemo, useState } from "react";
-import { Avatar, Divider, Segmented, Tree, theme } from "antd";
+import { Avatar, Divider, Segmented, Tree } from "antd";
 import { SDK } from "@rsdoctor/types";
 import { FileFilled, GoldenFilled, RightOutlined } from "@ant-design/icons";
-import { formatSize, useDuplicatePackagesByErrors } from "../../../utils/index.mjs";
+import { formatSize, useDuplicatePackagesByErrors, useThemeToken } from "../../../utils/index.mjs";
 import { StatisticCard } from "../../../components/Card/statistic.mjs";
 import { SizeCard } from "../../../components/Card/size.mjs";
 import overview from "../../../components/Overall/overview.mjs";
@@ -12,10 +12,9 @@ import { getFiles } from "../../../components/Overall/index.mjs";
 import { TextDrawer } from "../../../components/TextDrawer/index.mjs";
 import card_module from "./card.module.mjs";
 const { DirectoryTree: DirectoryTree } = Tree;
-const { useToken: useToken } = theme;
 const { innerWidth: cards_innerWidth } = window;
 const AssetCard = ({ showProgress = false, data, total, tagBgColor, type })=>{
-    const { token } = useToken();
+    const token = useThemeToken();
     const _tagBgColor = tagBgColor || token.colorPrimaryBorderHover;
     return /*#__PURE__*/ jsx(SizeCard, {
         type: type,
@@ -175,7 +174,7 @@ const BundleCards = ({ errors, summary })=>{
                                     },
                                     text: /*#__PURE__*/ jsxs("div", {
                                         style: {
-                                            color: '#000000a6'
+                                            color: 'var(--text-color-secondary)'
                                         },
                                         children: [
                                             /*#__PURE__*/ jsx("span", {
@@ -193,7 +192,7 @@ const BundleCards = ({ errors, summary })=>{
                                         treeData: treeData,
                                         rootStyle: {
                                             minHeight: '800px',
-                                            border: '1px solid rgba(235, 237, 241)'
+                                            border: '1px solid var(--color-border)'
                                         }
                                     })
                                 }),

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

@@ -1 +1 @@
-{"version":3,"file":"pages/BundleSize/components/cards.mjs","sources":["../../../../src/pages/BundleSize/components/cards.tsx"],"sourcesContent":["/* rslint-disable react/jsx-key */\nimport React, { useState, useMemo } from 'react';\nimport { Divider, Segmented, theme, Avatar, Tree } from 'antd';\nimport { Client, SDK } from '@rsdoctor/types';\nimport { RightOutlined, FileFilled, GoldenFilled } from '@ant-design/icons';\n\nimport { formatSize, useDuplicatePackagesByErrors } from '../../../utils';\nimport { StatisticCard } from '../../../components/Card/statistic';\nimport { SizeCard, bgColorType } from '../../../components/Card/size';\nimport Overview from '../../../components/Overall/overview';\nimport { ServerAPIProvider } from '../../../components/Manifest';\nimport { getFiles } from '../../..//components/Overall';\nimport { TextDrawer } from '../../..//components/TextDrawer';\n\nimport styles from './card.module.scss';\n\nconst { DirectoryTree } = Tree;\nconst { useToken } = theme;\nconst { innerWidth } = window;\n\ninterface CardProps {\n  showProgress?: boolean;\n  data: Client.RsdoctorClientAssetsSummary['all']['total'];\n  total: number;\n  tagBgColor?: string;\n  type?: string;\n}\n\nconst AssetCard: React.FC<CardProps> = ({\n  showProgress = false,\n  data,\n  total,\n  tagBgColor,\n  type,\n}) => {\n  const { token } = useToken();\n  const _tagBgColor = tagBgColor || token.colorPrimaryBorderHover;\n  return (\n    <SizeCard\n      type={type!}\n      files={data.files}\n      total={total}\n      showProgress={showProgress}\n      tagBgColor={_tagBgColor}\n    />\n  );\n};\n\nconst AssetCardContainer: React.FC<{\n  type?: string;\n  titles: string[];\n  datas: CardProps[];\n  bgColor?: bgColorType;\n}> = ({ titles, datas, bgColor, type }) => {\n  const [selectedTitle, setSelectedTitle] = useState(titles[0]);\n  const idx = useMemo(\n    () => titles.indexOf(selectedTitle),\n    [titles, selectedTitle],\n  );\n  const currentIdx = idx >= 0 ? idx : 0;\n  const fileType = type || selectedTitle || titles[0];\n\n  // Add bounds checking to prevent accessing undefined data\n  const currentData =\n    currentIdx >= 0 && currentIdx < datas.length\n      ? datas[currentIdx]\n      : datas[0] || {};\n\n  return (\n    <StatisticCard\n      title={\n        <div className={styles.cardTitle}>\n          <div className={styles.title}>{fileType}</div>\n          {titles.length > 1 ? (\n            <Segmented\n              defaultValue={titles[0]}\n              options={titles}\n              onChange={(value) => {\n                setSelectedTitle(value as string);\n              }}\n              size=\"small\"\n              style={{ transition: 'transform 0.3s ease' }}\n              value={selectedTitle}\n            />\n          ) : null}\n        </div>\n      }\n      value={\n        <AssetCard\n          type={fileType}\n          {...currentData}\n          tagBgColor={bgColor?.tagBgColor}\n        />\n      }\n      boxProps={{\n        style: {\n          background: bgColor?.bgColor,\n          width: innerWidth > 1300 ? '80%' : '95%',\n        },\n      }}\n    />\n  );\n};\n\nexport const BundleCards: React.FC<{\n  cwd: string;\n  errors: SDK.ErrorsData;\n  summary: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetAssetsSummary>;\n}> = ({ errors, summary }) => {\n  const duplicatePackages = useDuplicatePackagesByErrors(errors);\n  const [totalSize, totalSizeUnit] = formatSize(summary.all.total.size).split(\n    ' ',\n  );\n\n  const arr = [\n    <AssetCardContainer\n      type={'JS'}\n      titles={['Total', 'Initial']}\n      datas={[\n        {\n          data: summary.js.total,\n          total: summary.all.total.size,\n          showProgress: true,\n        },\n        {\n          data: summary.js.initial,\n          total: summary.all.total.size,\n          showProgress: true,\n        },\n      ]}\n    />,\n    <AssetCardContainer\n      type={'CSS'}\n      titles={['Total', 'Initial']}\n      datas={[\n        {\n          data: summary.css.total,\n          total: summary.all.total.size,\n          showProgress: true,\n        },\n        {\n          data: summary.css.initial,\n          total: summary.all.total.size,\n          showProgress: true,\n        },\n      ]}\n    />,\n    <AssetCardContainer\n      titles={['Images', 'Fonts', 'Media']}\n      datas={[\n        {\n          data: summary.imgs.total,\n          total: summary.all.total.size,\n          showProgress: true,\n        },\n        {\n          data: summary.fonts.total,\n          total: summary.all.total.size,\n          showProgress: true,\n        },\n        {\n          data: summary.media.total,\n          total: summary.all.total.size,\n          showProgress: true,\n        },\n      ]}\n    />,\n    <AssetCardContainer\n      type={'HTML'}\n      titles={['HTML Files']}\n      datas={[\n        {\n          data: summary.html.total,\n          total: summary.all.total.size,\n          showProgress: true,\n        },\n      ]}\n    />,\n  ];\n\n  return (\n    <ServerAPIProvider\n      api={SDK.ServerAPI.API.GetAssetsSummary}\n      body={{ withFileContent: false }}\n    >\n      {(res) => {\n        const { treeData } = getFiles(res['all'].total);\n        return (\n          <div className={styles.container}>\n            <div className={styles.summary}>\n              <Overview\n                title={\n                  <TextDrawer\n                    buttonProps={{\n                      size: 'small',\n                    }}\n                    buttonStyle={{\n                      fontSize: 'inherit',\n                    }}\n                    drawerProps={{\n                      title: 'Files',\n                    }}\n                    text={\n                      <div style={{ color: '#000000a6' }}>\n                        <span style={{ marginRight: '5px' }}>Total Files</span>\n                        <RightOutlined />\n                      </div>\n                    }\n                  >\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                  </TextDrawer>\n                }\n                description={\n                  <>\n                    <span className={styles.description}>{totalSize}</span>\n                    <span className={styles.unit}>{totalSizeUnit}</span>\n                    <div className={styles.totalNumber}>\n                      <span style={{ marginRight: '7px' }}>\n                        Number of files\n                      </span>\n                      <span style={{ fontWeight: 500 }}>\n                        {summary.all.total.count}\n                      </span>\n                    </div>\n                  </>\n                }\n                icon={\n                  <Avatar\n                    style={{ background: '#3874F6' }}\n                    shape=\"circle\"\n                    icon={<FileFilled style={{ fontSize: '18px' }} />}\n                  />\n                }\n                style={{\n                  marginBottom: '12px',\n                  minWidth: '210px',\n                }}\n              />\n              <Overview\n                style={{ minWidth: '210px' }}\n                title={\n                  <div style={{ margin: '4px 0' }}>\n                    <span style={{ marginRight: '5px' }}>\n                      Duplicate Packages\n                    </span>\n                  </div>\n                }\n                description={duplicatePackages.length}\n                icon={\n                  <Avatar\n                    style={{ background: '#13C2C2' }}\n                    shape=\"circle\"\n                    icon={<GoldenFilled style={{ fontSize: '18px' }} />}\n                  />\n                }\n              />\n            </div>\n            <Divider style={{ height: '200px' }} type=\"vertical\" />\n            <div className={styles.chartsContainer}>\n              {arr.map((e, idx) => (\n                <>\n                  <div key={idx} className={styles.chart}>\n                    {e}\n                  </div>\n                  {idx !== arr.length - 1 ? (\n                    <Divider\n                      key={`${idx}-divider`}\n                      style={{ height: '200px' }}\n                      type=\"vertical\"\n                    />\n                  ) : null}\n                </>\n              ))}\n            </div>\n          </div>\n        );\n      }}\n    </ServerAPIProvider>\n  );\n};\n"],"names":["DirectoryTree","Tree","useToken","theme","innerWidth","window","AssetCard","showProgress","data","total","tagBgColor","type","token","_tagBgColor","SizeCard","AssetCardContainer","titles","datas","bgColor","selectedTitle","setSelectedTitle","useState","idx","useMemo","currentIdx","fileType","currentData","StatisticCard","styles","Segmented","value","BundleCards","errors","summary","duplicatePackages","useDuplicatePackagesByErrors","totalSize","totalSizeUnit","formatSize","arr","ServerAPIProvider","SDK","res","treeData","getFiles","Overview","TextDrawer","RightOutlined","Avatar","FileFilled","GoldenFilled","Divider","e"],"mappings":";;;;;;;;;;;;;AAgBA,MAAM,EAAEA,eAAAA,aAAa,EAAE,GAAGC;AAC1B,MAAM,EAAEC,UAAAA,QAAQ,EAAE,GAAGC;AACrB,MAAM,EAAEC,YAAAA,gBAAU,EAAE,GAAGC;AAUvB,MAAMC,YAAiC,CAAC,EACtCC,eAAe,KAAK,EACpBC,IAAI,EACJC,KAAK,EACLC,UAAU,EACVC,IAAI,EACL;IACC,MAAM,EAAEC,KAAK,EAAE,GAAGV;IAClB,MAAMW,cAAcH,cAAcE,MAAM,uBAAuB;IAC/D,OAAO,WAAP,GACE,IAACE,UAAQA;QACP,MAAMH;QACN,OAAOH,KAAK,KAAK;QACjB,OAAOC;QACP,cAAcF;QACd,YAAYM;;AAGlB;AAEA,MAAME,qBAKD,CAAC,EAAEC,MAAM,EAAEC,KAAK,EAAEC,OAAO,EAAEP,IAAI,EAAE;IACpC,MAAM,CAACQ,eAAeC,iBAAiB,GAAGC,SAASL,MAAM,CAAC,EAAE;IAC5D,MAAMM,MAAMC,QACV,IAAMP,OAAO,OAAO,CAACG,gBACrB;QAACH;QAAQG;KAAc;IAEzB,MAAMK,aAAaF,OAAO,IAAIA,MAAM;IACpC,MAAMG,WAAWd,QAAQQ,iBAAiBH,MAAM,CAAC,EAAE;IAGnD,MAAMU,cACJF,cAAc,KAAKA,aAAaP,MAAM,MAAM,GACxCA,KAAK,CAACO,WAAW,GACjBP,KAAK,CAAC,EAAE,IAAI,CAAC;IAEnB,OAAO,WAAP,GACE,IAACU,eAAaA;QACZ,qBACE,KAAC;YAAI,WAAWC,YAAAA,SAAgB;;8BAC9B,IAAC;oBAAI,WAAWA,YAAAA,KAAY;8BAAGH;;gBAC9BT,OAAO,MAAM,GAAG,IAAI,WAAJ,GACf,IAACa,WAASA;oBACR,cAAcb,MAAM,CAAC,EAAE;oBACvB,SAASA;oBACT,UAAU,CAACc;wBACTV,iBAAiBU;oBACnB;oBACA,MAAK;oBACL,OAAO;wBAAE,YAAY;oBAAsB;oBAC3C,OAAOX;qBAEP;;;QAGR,qBACE,IAACb,WAASA;YACR,MAAMmB;YACL,GAAGC,WAAW;YACf,YAAYR,SAAS;;QAGzB,UAAU;YACR,OAAO;gBACL,YAAYA,SAAS;gBACrB,OAAOd,mBAAa,OAAO,QAAQ;YACrC;QACF;;AAGN;AAEO,MAAM2B,cAIR,CAAC,EAAEC,MAAM,EAAEC,OAAO,EAAE;IACvB,MAAMC,oBAAoBC,6BAA6BH;IACvD,MAAM,CAACI,WAAWC,cAAc,GAAGC,WAAWL,QAAQ,GAAG,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CACzE;IAGF,MAAMM,MAAM;sBACV,IAACxB,oBAAkBA;YACjB,MAAM;YACN,QAAQ;gBAAC;gBAAS;aAAU;YAC5B,OAAO;gBACL;oBACE,MAAMkB,QAAQ,EAAE,CAAC,KAAK;oBACtB,OAAOA,QAAQ,GAAG,CAAC,KAAK,CAAC,IAAI;oBAC7B,cAAc;gBAChB;gBACA;oBACE,MAAMA,QAAQ,EAAE,CAAC,OAAO;oBACxB,OAAOA,QAAQ,GAAG,CAAC,KAAK,CAAC,IAAI;oBAC7B,cAAc;gBAChB;aACD;;sBAEH,IAAClB,oBAAkBA;YACjB,MAAM;YACN,QAAQ;gBAAC;gBAAS;aAAU;YAC5B,OAAO;gBACL;oBACE,MAAMkB,QAAQ,GAAG,CAAC,KAAK;oBACvB,OAAOA,QAAQ,GAAG,CAAC,KAAK,CAAC,IAAI;oBAC7B,cAAc;gBAChB;gBACA;oBACE,MAAMA,QAAQ,GAAG,CAAC,OAAO;oBACzB,OAAOA,QAAQ,GAAG,CAAC,KAAK,CAAC,IAAI;oBAC7B,cAAc;gBAChB;aACD;;sBAEH,IAAClB,oBAAkBA;YACjB,QAAQ;gBAAC;gBAAU;gBAAS;aAAQ;YACpC,OAAO;gBACL;oBACE,MAAMkB,QAAQ,IAAI,CAAC,KAAK;oBACxB,OAAOA,QAAQ,GAAG,CAAC,KAAK,CAAC,IAAI;oBAC7B,cAAc;gBAChB;gBACA;oBACE,MAAMA,QAAQ,KAAK,CAAC,KAAK;oBACzB,OAAOA,QAAQ,GAAG,CAAC,KAAK,CAAC,IAAI;oBAC7B,cAAc;gBAChB;gBACA;oBACE,MAAMA,QAAQ,KAAK,CAAC,KAAK;oBACzB,OAAOA,QAAQ,GAAG,CAAC,KAAK,CAAC,IAAI;oBAC7B,cAAc;gBAChB;aACD;;sBAEH,IAAClB,oBAAkBA;YACjB,MAAM;YACN,QAAQ;gBAAC;aAAa;YACtB,OAAO;gBACL;oBACE,MAAMkB,QAAQ,IAAI,CAAC,KAAK;oBACxB,OAAOA,QAAQ,GAAG,CAAC,KAAK,CAAC,IAAI;oBAC7B,cAAc;gBAChB;aACD;;KAEJ;IAED,OAAO,WAAP,GACE,IAACO,mBAAiBA;QAChB,KAAKC,IAAI,SAAS,CAAC,GAAG,CAAC,gBAAgB;QACvC,MAAM;YAAE,iBAAiB;QAAM;kBAE9B,CAACC;YACA,MAAM,EAAEC,QAAQ,EAAE,GAAGC,SAASF,GAAG,CAAC,MAAM,CAAC,KAAK;YAC9C,OAAO,WAAP,GACE,KAAC;gBAAI,WAAWd,YAAAA,SAAgB;;kCAC9B,KAAC;wBAAI,WAAWA,YAAAA,OAAc;;0CAC5B,IAACiB,UAAQA;gCACP,qBACE,IAACC,YAAUA;oCACT,aAAa;wCACX,MAAM;oCACR;oCACA,aAAa;wCACX,UAAU;oCACZ;oCACA,aAAa;wCACX,OAAO;oCACT;oCACA,oBACE,KAAC;wCAAI,OAAO;4CAAE,OAAO;wCAAY;;0DAC/B,IAAC;gDAAK,OAAO;oDAAE,aAAa;gDAAM;0DAAG;;0DACrC,IAACC,eAAaA,CAAAA;;;8CAIlB,kBAAC/C,eAAaA;wCACZ,kBAAgB;wCAChB,YAAY;wCACZ,UAAU2C;wCACV,WAAW;4CACT,WAAW;4CACX,QAAQ;wCACV;;;gCAIN,2BACE;;sDACE,IAAC;4CAAK,WAAWf,YAAAA,WAAkB;sDAAGQ;;sDACtC,IAAC;4CAAK,WAAWR,YAAAA,IAAW;sDAAGS;;sDAC/B,KAAC;4CAAI,WAAWT,YAAAA,WAAkB;;8DAChC,IAAC;oDAAK,OAAO;wDAAE,aAAa;oDAAM;8DAAG;;8DAGrC,IAAC;oDAAK,OAAO;wDAAE,YAAY;oDAAI;8DAC5BK,QAAQ,GAAG,CAAC,KAAK,CAAC,KAAK;;;;;;gCAKhC,oBACE,IAACe,QAAMA;oCACL,OAAO;wCAAE,YAAY;oCAAU;oCAC/B,OAAM;oCACN,oBAAM,IAACC,YAAUA;wCAAC,OAAO;4CAAE,UAAU;wCAAO;;;gCAGhD,OAAO;oCACL,cAAc;oCACd,UAAU;gCACZ;;0CAEF,IAACJ,UAAQA;gCACP,OAAO;oCAAE,UAAU;gCAAQ;gCAC3B,qBACE,IAAC;oCAAI,OAAO;wCAAE,QAAQ;oCAAQ;8CAC5B,kBAAC;wCAAK,OAAO;4CAAE,aAAa;wCAAM;kDAAG;;;gCAKzC,aAAaX,kBAAkB,MAAM;gCACrC,oBACE,IAACc,QAAMA;oCACL,OAAO;wCAAE,YAAY;oCAAU;oCAC/B,OAAM;oCACN,oBAAM,IAACE,cAAYA;wCAAC,OAAO;4CAAE,UAAU;wCAAO;;;;;;kCAKtD,IAACC,SAAOA;wBAAC,OAAO;4BAAE,QAAQ;wBAAQ;wBAAG,MAAK;;kCAC1C,IAAC;wBAAI,WAAWvB,YAAAA,eAAsB;kCACnCW,IAAI,GAAG,CAAC,CAACa,GAAG9B,MAAAA,WAAAA,GACX;;kDACE,IAAC;wCAAc,WAAWM,YAAAA,KAAY;kDACnCwB;uCADO9B;oCAGTA,QAAQiB,IAAI,MAAM,GAAG,IAAI,WAAJ,GACpB,IAACY,SAAOA;wCAEN,OAAO;4CAAE,QAAQ;wCAAQ;wCACzB,MAAK;uCAFA,GAAG7B,IAAI,QAAQ,CAAC,IAIrB;;;;;;QAMhB;;AAGN"}
+{"version":3,"file":"pages/BundleSize/components/cards.mjs","sources":["../../../../src/pages/BundleSize/components/cards.tsx"],"sourcesContent":["/* rslint-disable react/jsx-key */\nimport React, { useState, useMemo } from 'react';\nimport { Divider, Segmented, Avatar, Tree } from 'antd';\nimport { Client, SDK } from '@rsdoctor/types';\nimport { RightOutlined, FileFilled, GoldenFilled } from '@ant-design/icons';\n\nimport {\n  formatSize,\n  useDuplicatePackagesByErrors,\n  useThemeToken,\n} from '../../../utils';\nimport { StatisticCard } from '../../../components/Card/statistic';\nimport { SizeCard, bgColorType } from '../../../components/Card/size';\nimport Overview from '../../../components/Overall/overview';\nimport { ServerAPIProvider } from '../../../components/Manifest';\nimport { getFiles } from '../../..//components/Overall';\nimport { TextDrawer } from '../../..//components/TextDrawer';\n\nimport styles from './card.module.scss';\n\nconst { DirectoryTree } = Tree;\nconst { innerWidth } = window;\n\ninterface CardProps {\n  showProgress?: boolean;\n  data: Client.RsdoctorClientAssetsSummary['all']['total'];\n  total: number;\n  tagBgColor?: string;\n  type?: string;\n}\n\nconst AssetCard: React.FC<CardProps> = ({\n  showProgress = false,\n  data,\n  total,\n  tagBgColor,\n  type,\n}) => {\n  const token = useThemeToken();\n  const _tagBgColor = tagBgColor || token.colorPrimaryBorderHover;\n  return (\n    <SizeCard\n      type={type!}\n      files={data.files}\n      total={total}\n      showProgress={showProgress}\n      tagBgColor={_tagBgColor}\n    />\n  );\n};\n\nconst AssetCardContainer: React.FC<{\n  type?: string;\n  titles: string[];\n  datas: CardProps[];\n  bgColor?: bgColorType;\n}> = ({ titles, datas, bgColor, type }) => {\n  const [selectedTitle, setSelectedTitle] = useState(titles[0]);\n  const idx = useMemo(\n    () => titles.indexOf(selectedTitle),\n    [titles, selectedTitle],\n  );\n  const currentIdx = idx >= 0 ? idx : 0;\n  const fileType = type || selectedTitle || titles[0];\n\n  // Add bounds checking to prevent accessing undefined data\n  const currentData =\n    currentIdx >= 0 && currentIdx < datas.length\n      ? datas[currentIdx]\n      : datas[0] || {};\n\n  return (\n    <StatisticCard\n      title={\n        <div className={styles.cardTitle}>\n          <div className={styles.title}>{fileType}</div>\n          {titles.length > 1 ? (\n            <Segmented\n              defaultValue={titles[0]}\n              options={titles}\n              onChange={(value) => {\n                setSelectedTitle(value as string);\n              }}\n              size=\"small\"\n              style={{ transition: 'transform 0.3s ease' }}\n              value={selectedTitle}\n            />\n          ) : null}\n        </div>\n      }\n      value={\n        <AssetCard\n          type={fileType}\n          {...currentData}\n          tagBgColor={bgColor?.tagBgColor}\n        />\n      }\n      boxProps={{\n        style: {\n          background: bgColor?.bgColor,\n          width: innerWidth > 1300 ? '80%' : '95%',\n        },\n      }}\n    />\n  );\n};\n\nexport const BundleCards: React.FC<{\n  cwd: string;\n  errors: SDK.ErrorsData;\n  summary: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetAssetsSummary>;\n}> = ({ errors, summary }) => {\n  const duplicatePackages = useDuplicatePackagesByErrors(errors);\n  const [totalSize, totalSizeUnit] = formatSize(summary.all.total.size).split(\n    ' ',\n  );\n\n  const arr = [\n    <AssetCardContainer\n      type={'JS'}\n      titles={['Total', 'Initial']}\n      datas={[\n        {\n          data: summary.js.total,\n          total: summary.all.total.size,\n          showProgress: true,\n        },\n        {\n          data: summary.js.initial,\n          total: summary.all.total.size,\n          showProgress: true,\n        },\n      ]}\n    />,\n    <AssetCardContainer\n      type={'CSS'}\n      titles={['Total', 'Initial']}\n      datas={[\n        {\n          data: summary.css.total,\n          total: summary.all.total.size,\n          showProgress: true,\n        },\n        {\n          data: summary.css.initial,\n          total: summary.all.total.size,\n          showProgress: true,\n        },\n      ]}\n    />,\n    <AssetCardContainer\n      titles={['Images', 'Fonts', 'Media']}\n      datas={[\n        {\n          data: summary.imgs.total,\n          total: summary.all.total.size,\n          showProgress: true,\n        },\n        {\n          data: summary.fonts.total,\n          total: summary.all.total.size,\n          showProgress: true,\n        },\n        {\n          data: summary.media.total,\n          total: summary.all.total.size,\n          showProgress: true,\n        },\n      ]}\n    />,\n    <AssetCardContainer\n      type={'HTML'}\n      titles={['HTML Files']}\n      datas={[\n        {\n          data: summary.html.total,\n          total: summary.all.total.size,\n          showProgress: true,\n        },\n      ]}\n    />,\n  ];\n\n  return (\n    <ServerAPIProvider\n      api={SDK.ServerAPI.API.GetAssetsSummary}\n      body={{ withFileContent: false }}\n    >\n      {(res) => {\n        const { treeData } = getFiles(res['all'].total);\n        return (\n          <div className={styles.container}>\n            <div className={styles.summary}>\n              <Overview\n                title={\n                  <TextDrawer\n                    buttonProps={{\n                      size: 'small',\n                    }}\n                    buttonStyle={{\n                      fontSize: 'inherit',\n                    }}\n                    drawerProps={{\n                      title: 'Files',\n                    }}\n                    text={\n                      <div style={{ color: 'var(--text-color-secondary)' }}>\n                        <span style={{ marginRight: '5px' }}>Total Files</span>\n                        <RightOutlined />\n                      </div>\n                    }\n                  >\n                    <DirectoryTree\n                      defaultExpandAll\n                      selectable={false}\n                      treeData={treeData}\n                      rootStyle={{\n                        minHeight: '800px',\n                        border: '1px solid var(--color-border)',\n                      }}\n                    />\n                  </TextDrawer>\n                }\n                description={\n                  <>\n                    <span className={styles.description}>{totalSize}</span>\n                    <span className={styles.unit}>{totalSizeUnit}</span>\n                    <div className={styles.totalNumber}>\n                      <span style={{ marginRight: '7px' }}>\n                        Number of files\n                      </span>\n                      <span style={{ fontWeight: 500 }}>\n                        {summary.all.total.count}\n                      </span>\n                    </div>\n                  </>\n                }\n                icon={\n                  <Avatar\n                    style={{ background: '#3874F6' }}\n                    shape=\"circle\"\n                    icon={<FileFilled style={{ fontSize: '18px' }} />}\n                  />\n                }\n                style={{\n                  marginBottom: '12px',\n                  minWidth: '210px',\n                }}\n              />\n              <Overview\n                style={{ minWidth: '210px' }}\n                title={\n                  <div style={{ margin: '4px 0' }}>\n                    <span style={{ marginRight: '5px' }}>\n                      Duplicate Packages\n                    </span>\n                  </div>\n                }\n                description={duplicatePackages.length}\n                icon={\n                  <Avatar\n                    style={{ background: '#13C2C2' }}\n                    shape=\"circle\"\n                    icon={<GoldenFilled style={{ fontSize: '18px' }} />}\n                  />\n                }\n              />\n            </div>\n            <Divider style={{ height: '200px' }} type=\"vertical\" />\n            <div className={styles.chartsContainer}>\n              {arr.map((e, idx) => (\n                <>\n                  <div key={idx} className={styles.chart}>\n                    {e}\n                  </div>\n                  {idx !== arr.length - 1 ? (\n                    <Divider\n                      key={`${idx}-divider`}\n                      style={{ height: '200px' }}\n                      type=\"vertical\"\n                    />\n                  ) : null}\n                </>\n              ))}\n            </div>\n          </div>\n        );\n      }}\n    </ServerAPIProvider>\n  );\n};\n"],"names":["DirectoryTree","Tree","innerWidth","window","AssetCard","showProgress","data","total","tagBgColor","type","token","useThemeToken","_tagBgColor","SizeCard","AssetCardContainer","titles","datas","bgColor","selectedTitle","setSelectedTitle","useState","idx","useMemo","currentIdx","fileType","currentData","StatisticCard","styles","Segmented","value","BundleCards","errors","summary","duplicatePackages","useDuplicatePackagesByErrors","totalSize","totalSizeUnit","formatSize","arr","ServerAPIProvider","SDK","res","treeData","getFiles","Overview","TextDrawer","RightOutlined","Avatar","FileFilled","GoldenFilled","Divider","e"],"mappings":"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"}

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

@@ -5,7 +5,7 @@ import { Button, Card, Col, Row, Space, Tabs, Tag, Tooltip, Typography } from "a
 import react, { useId } from "react";
 import { ServerAPIProvider } from "../../../components/Manifest/index.mjs";
 import { useProjectInfo } from "../../../components/Layout/project-info-context.mjs";
-import { flattenTreemapData, usePersistedState } from "../../../utils/index.mjs";
+import { flattenTreemapData, usePersistedState, useTheme } from "../../../utils/index.mjs";
 import { BundleCards } from "./cards.mjs";
 import index_module from "./index.module.mjs";
 import "./index.css";
@@ -17,6 +17,8 @@ const WebpackModulesOverallBase = ({ errors, cwd, summary, entryPoints })=>{
     const [expanded, setExpanded] = usePersistedState('bundle-size-tabs-card-expanded', false);
     const cardDomId = useId();
     const expandActionText = expanded ? 'Shrink card' : 'Expand card';
+    const { isLight } = useTheme();
+    const treeGraphTooltipColor = isLight ? 'white' : void 0;
     return /*#__PURE__*/ jsxs(Fragment, {
         children: [
             /*#__PURE__*/ jsx(react.Activity, {
@@ -65,10 +67,10 @@ const WebpackModulesOverallBase = ({ errors, cwd, summary, entryPoints })=>{
                                             marginLeft: 16,
                                             padding: 10
                                         },
-                                        color: "white",
+                                        color: treeGraphTooltipColor,
                                         title: /*#__PURE__*/ jsxs(Space, {
                                             direction: "vertical",
-                                            color: "white",
+                                            color: treeGraphTooltipColor,
                                             size: "middle",
                                             children: [
                                                 /*#__PURE__*/ jsx(Row, {
@@ -111,7 +113,7 @@ const WebpackModulesOverallBase = ({ errors, cwd, summary, entryPoints })=>{
                                                                     maxWidth: 408
                                                                 },
                                                                 placement: "bottom",
-                                                                color: "white",
+                                                                color: treeGraphTooltipColor,
                                                                 title: /*#__PURE__*/ jsx(Space, {
                                                                     direction: "vertical",
                                                                     color: "white",
@@ -129,11 +131,12 @@ const WebpackModulesOverallBase = ({ errors, cwd, summary, entryPoints })=>{
                                                                         })
                                                                     })
                                                                 }),
-                                                                children: /*#__PURE__*/ jsx(InfoCircleOutlined, {
+                                                                children: /*#__PURE__*/ jsx(Typography.Text, {
+                                                                    type: "secondary",
                                                                     style: {
-                                                                        color: 'rgba(0,0,0,.45)',
                                                                         marginLeft: 4
-                                                                    }
+                                                                    },
+                                                                    children: /*#__PURE__*/ jsx(InfoCircleOutlined, {})
                                                                 })
                                                             }),
                                                             /*#__PURE__*/ jsx(Typography.Text, {
@@ -204,7 +207,7 @@ const WebpackModulesOverallBase = ({ errors, cwd, summary, entryPoints })=>{
                                         }),
                                         children: /*#__PURE__*/ jsx(InfoCircleOutlined, {
                                             style: {
-                                                color: 'rgba(0,0,0,.45)'
+                                                color: 'var(--text-color-secondary)'
                                             }
                                         })
                                     })

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

@@ -1 +1 @@
-{"version":3,"file":"pages/BundleSize/components/index.mjs","sources":["../../../../src/pages/BundleSize/components/index.tsx"],"sourcesContent":["import {\n  CodepenCircleOutlined,\n  DeploymentUnitOutlined,\n  InfoCircleOutlined,\n  ShrinkOutlined,\n  ArrowsAltOutlined,\n} from '@ant-design/icons';\nimport { type Client, SDK } from '@rsdoctor/types';\nimport {\n  Button,\n  Card,\n  Col,\n  Row,\n  Space,\n  Tag,\n  Tooltip,\n  Typography,\n  Tabs,\n} from 'antd';\nimport React, { useId } from 'react';\nimport { ServerAPIProvider } from '../../../components/Manifest';\nimport { useProjectInfo } from '../../../components/Layout/project-info-context';\nimport { flattenTreemapData, usePersistedState } from '../../../utils';\nimport { BundleCards } from './cards';\nimport styles from './index.module.scss';\nimport './index.sass';\nimport {\n  AssetTreemapWithFilter,\n  TreeNode,\n} from 'src/components/Charts/TreeMap';\nimport { Rspack } from '@rsdoctor/utils/common';\nimport { TreeGraph } from './tree-graph';\nimport { isJavaScriptAsset } from '../../../utils/assets';\n\ninterface WebpackModulesOverallProps {\n  cwd: string;\n  errors: SDK.ErrorsData;\n  summary: Client.RsdoctorClientAssetsSummary;\n  entryPoints: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetEntryPoints>;\n}\n\nexport const WebpackModulesOverallBase: React.FC<\n  WebpackModulesOverallProps\n> = ({ errors, cwd, summary, entryPoints }) => {\n  const [expanded, setExpanded] = usePersistedState(\n    'bundle-size-tabs-card-expanded',\n    false,\n  );\n  const cardDomId = useId();\n  const expandActionText = expanded ? 'Shrink card' : 'Expand card';\n  return (\n    <>\n      <React.Activity mode={expanded ? 'hidden' : 'visible'}>\n        <BundleCards cwd={cwd} errors={errors} summary={summary} />\n      </React.Activity>\n      <Card\n        className={styles.root}\n        classNames={{ body: styles.rootBody }}\n        id={cardDomId}\n      >\n        <Tabs\n          size=\"middle\"\n          className={styles.tabsRoot}\n          tabBarExtraContent={{\n            right: (\n              <Tooltip\n                // the content collapses/expands, but the cursor stays at the same position (outside the button now, cause layout has shifted)\n                // antd doesn't know that and keeps the tooltip open, so we need to force rerender it on every state change\n                key={String(expanded)}\n                title={expandActionText}\n              >\n                <Button\n                  // TODO:: does it make sense here? the content basically stays the same and we're actually controlling other elements\n                  aria-controls={cardDomId}\n                  aria-expanded={expanded}\n                  aria-label={expandActionText}\n                  onClick={() => setExpanded(!expanded)}\n                  icon={expanded ? <ShrinkOutlined /> : <ArrowsAltOutlined />}\n                  size=\"small\"\n                ></Button>\n              </Tooltip>\n            ),\n          }}\n          items={[\n            {\n              key: 'tree',\n              label: (\n                <Space>\n                  <Typography.Text>Tree Graph</Typography.Text>\n                  <Tooltip\n                    overlayStyle={{ maxWidth: 380 }}\n                    overlayInnerStyle={{ marginLeft: 16, padding: 10 }}\n                    color=\"white\"\n                    title={\n                      <Space direction=\"vertical\" color=\"white\" size=\"middle\">\n                        <Row>\n                          <Col>\n                            <Tag color=\"cyan\" style={{ margin: 0 }}>\n                              initial\n                            </Tag>\n                            <Typography.Text style={{ marginLeft: 4 }}>\n                              Identify whether the chunk is an initial chunk.\n                            </Typography.Text>\n                          </Col>\n                        </Row>\n                        <Row>\n                          <Col>\n                            <Tag color=\"green\" style={{ margin: 0 }}>\n                              concatenated\n                            </Tag>\n                            <Typography.Text style={{ marginLeft: 4 }}>\n                              Identify whether the module is a concatenated\n                              module\n                            </Typography.Text>\n                            <Tooltip\n                              overlayStyle={{ maxWidth: 408 }}\n                              placement=\"bottom\"\n                              color=\"white\"\n                              title={\n                                <Space direction=\"vertical\" color=\"white\">\n                                  <Row>\n                                    <Col>\n                                      <Typography.Text strong>\n                                        Concatenated Module\n                                      </Typography.Text>\n                                      <Typography.Text>\n                                        : A performance optimization where\n                                        multiple modules are merged (or\n                                        \"hoisted\") into a single scope instead\n                                        of wrapping each module in separate\n                                        function closures. This reduces the\n                                        bundle size and improves runtime\n                                        performance by minimizing function call\n                                        overhead.\n                                      </Typography.Text>\n                                    </Col>\n                                  </Row>\n                                </Space>\n                              }\n                            >\n                              <InfoCircleOutlined\n                                style={{\n                                  color: 'rgba(0,0,0,.45)',\n                                  marginLeft: 4,\n                                }}\n                              />\n                            </Tooltip>\n                            <Typography.Text>.</Typography.Text>\n                          </Col>\n                        </Row>\n                        <Row>\n                          <Col>\n                            <Button\n                              size=\"small\"\n                              icon={<CodepenCircleOutlined />}\n                            />\n                            <Typography.Text style={{ marginLeft: 4 }}>\n                              Open the code.\n                            </Typography.Text>\n                          </Col>\n                        </Row>\n                        <Row>\n                          <Col>\n                            <Button\n                              size=\"small\"\n                              icon={<DeploymentUnitOutlined />}\n                            />\n                            <Typography.Text style={{ marginLeft: 4 }}>\n                              View the module dependency, that is, module\n                              reasons in stats.json.\n                            </Typography.Text>\n                          </Col>\n                        </Row>\n                        <Row>\n                          <Col>\n                            <Tag color={'purple'}>{'Bundled: 15.77 KB'}</Tag>\n                            <Typography.Text>\n                              The final size of the output files after\n                              processing, bundling, and optimization. This is\n                              what is delivered to the browser.\n                            </Typography.Text>\n                          </Col>\n                        </Row>\n                        <Row>\n                          <Col>\n                            <Tag color={'orange'}>{'Source: 60.46 KB'}</Tag>\n                            <Typography.Text>\n                              The original size of your source code files before\n                              any processing or transformations. This is the raw\n                              size of your code as you wrote it.\n                            </Typography.Text>\n                          </Col>\n                        </Row>\n                      </Space>\n                    }\n                  >\n                    <InfoCircleOutlined style={{ color: 'rgba(0,0,0,.45)' }} />\n                  </Tooltip>\n                </Space>\n              ),\n              children: (\n                <TreeGraph\n                  entryPoints={entryPoints}\n                  cwd={cwd}\n                  summary={summary}\n                />\n              ),\n            },\n            {\n              key: 'treemap',\n              label: 'Treemap',\n              children: (\n                <ServerAPIProvider api={SDK.ServerAPI.API.GetProjectInfo}>\n                  {(data) => {\n                    const { isRspack, hasSourceMap } =\n                      Rspack.checkSourceMapSupport(data.configs);\n                    return (\n                      <ServerAPIProvider\n                        api={SDK.ServerAPI.API.GetSummaryBundles}\n                      >\n                        {(data) => {\n                          // Filter assets to only show JS (js, cjs, mjs), .bundle, CSS, and HTML files\n                          const isVisibleTreemapAsset = (filePath: string) => {\n                            const ext =\n                              filePath.toLowerCase().split('.').pop() || '';\n                            return (\n                              isJavaScriptAsset(filePath) ||\n                              ext === 'css' ||\n                              ext === 'html'\n                            );\n                          };\n\n                          const computedTreeData: TreeNode[] = data\n                            .filter((item) =>\n                              isVisibleTreemapAsset(item.asset.path),\n                            )\n                            .map((item) => {\n                              const moduleTree = flattenTreemapData(\n                                item.modules,\n                              );\n                              const hasModules = item.modules.length > 0;\n                              return {\n                                name: item.asset.path,\n                                sourceSize: hasModules\n                                  ? (moduleTree.sourceSize ?? 0)\n                                  : item.asset.size,\n                                bundledSize: item.asset.size,\n                                gzipSize: item.asset.gzipSize ?? 0,\n                                children: moduleTree.children,\n                              };\n                            });\n                          return (\n                            <AssetTreemapWithFilter\n                              treeData={computedTreeData}\n                              bundledSize={hasSourceMap || isRspack}\n                            />\n                          );\n                        }}\n                      </ServerAPIProvider>\n                    );\n                  }}\n                </ServerAPIProvider>\n              ),\n            },\n          ]}\n          defaultActiveKey=\"tree\"\n        />\n      </Card>\n    </>\n  );\n};\n\nexport const WebpackModulesOverall: React.FC = () => {\n  const { project } = useProjectInfo();\n\n  if (!project) {\n    return null;\n  }\n\n  const { root, errors } = project;\n  return (\n    <ServerAPIProvider\n      api={SDK.ServerAPI.API.GetAssetsSummary}\n      body={{ withFileContent: true }}\n    >\n      {(summary) => {\n        return (\n          <ServerAPIProvider api={SDK.ServerAPI.API.GetEntryPoints}>\n            {(entryPoints) => (\n              <WebpackModulesOverallBase\n                cwd={root}\n                errors={errors}\n                summary={summary}\n                entryPoints={entryPoints}\n              />\n            )}\n          </ServerAPIProvider>\n        );\n      }}\n    </ServerAPIProvider>\n  );\n};\n"],"names":["WebpackModulesOverallBase","errors","cwd","summary","entryPoints","expanded","setExpanded","usePersistedState","cardDomId","useId","expandActionText","React","BundleCards","Card","styles","Tabs","Tooltip","Button","ShrinkOutlined","ArrowsAltOutlined","String","Space","Typography","Row","Col","Tag","InfoCircleOutlined","CodepenCircleOutlined","DeploymentUnitOutlined","TreeGraph","ServerAPIProvider","SDK","data","isRspack","hasSourceMap","Rspack","isVisibleTreemapAsset","filePath","ext","isJavaScriptAsset","computedTreeData","item","moduleTree","flattenTreemapData","hasModules","AssetTreemapWithFilter","WebpackModulesOverall","project","useProjectInfo","root"],"mappings":"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"}
+{"version":3,"file":"pages/BundleSize/components/index.mjs","sources":["../../../../src/pages/BundleSize/components/index.tsx"],"sourcesContent":["import {\n  CodepenCircleOutlined,\n  DeploymentUnitOutlined,\n  InfoCircleOutlined,\n  ShrinkOutlined,\n  ArrowsAltOutlined,\n} from '@ant-design/icons';\nimport { type Client, SDK } from '@rsdoctor/types';\nimport {\n  Button,\n  Card,\n  Col,\n  Row,\n  Space,\n  Tag,\n  Tooltip,\n  Typography,\n  Tabs,\n} from 'antd';\nimport React, { useId } from 'react';\nimport { ServerAPIProvider } from '../../../components/Manifest';\nimport { useProjectInfo } from '../../../components/Layout/project-info-context';\nimport {\n  flattenTreemapData,\n  usePersistedState,\n  useTheme,\n} from '../../../utils';\nimport { BundleCards } from './cards';\nimport styles from './index.module.scss';\nimport './index.sass';\nimport {\n  AssetTreemapWithFilter,\n  TreeNode,\n} from 'src/components/Charts/TreeMap';\nimport { Rspack } from '@rsdoctor/utils/common';\nimport { TreeGraph } from './tree-graph';\nimport { isJavaScriptAsset } from '../../../utils/assets';\n\ninterface WebpackModulesOverallProps {\n  cwd: string;\n  errors: SDK.ErrorsData;\n  summary: Client.RsdoctorClientAssetsSummary;\n  entryPoints: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetEntryPoints>;\n}\n\nexport const WebpackModulesOverallBase: React.FC<\n  WebpackModulesOverallProps\n> = ({ errors, cwd, summary, entryPoints }) => {\n  const [expanded, setExpanded] = usePersistedState(\n    'bundle-size-tabs-card-expanded',\n    false,\n  );\n  const cardDomId = useId();\n  const expandActionText = expanded ? 'Shrink card' : 'Expand card';\n  const { isLight } = useTheme();\n  // In light mode the tooltip's background is dark and the text is also dark cause Typography is used inside. dark mode is ok\n  const treeGraphTooltipColor = isLight ? 'white' : undefined;\n  return (\n    <>\n      <React.Activity mode={expanded ? 'hidden' : 'visible'}>\n        <BundleCards cwd={cwd} errors={errors} summary={summary} />\n      </React.Activity>\n      <Card\n        className={styles.root}\n        classNames={{ body: styles.rootBody }}\n        id={cardDomId}\n      >\n        <Tabs\n          size=\"middle\"\n          className={styles.tabsRoot}\n          tabBarExtraContent={{\n            right: (\n              <Tooltip\n                // the content collapses/expands, but the cursor stays at the same position (outside the button now, cause layout has shifted)\n                // antd doesn't know that and keeps the tooltip open, so we need to force rerender it on every state change\n                key={String(expanded)}\n                title={expandActionText}\n              >\n                <Button\n                  // TODO:: does it make sense here? the content basically stays the same and we're actually controlling other elements\n                  aria-controls={cardDomId}\n                  aria-expanded={expanded}\n                  aria-label={expandActionText}\n                  onClick={() => setExpanded(!expanded)}\n                  icon={expanded ? <ShrinkOutlined /> : <ArrowsAltOutlined />}\n                  size=\"small\"\n                ></Button>\n              </Tooltip>\n            ),\n          }}\n          items={[\n            {\n              key: 'tree',\n              label: (\n                <Space>\n                  <Typography.Text>Tree Graph</Typography.Text>\n                  <Tooltip\n                    overlayStyle={{ maxWidth: 380 }}\n                    overlayInnerStyle={{ marginLeft: 16, padding: 10 }}\n                    color={treeGraphTooltipColor}\n                    title={\n                      <Space\n                        direction=\"vertical\"\n                        color={treeGraphTooltipColor}\n                        size=\"middle\"\n                      >\n                        <Row>\n                          <Col>\n                            <Tag color=\"cyan\" style={{ margin: 0 }}>\n                              initial\n                            </Tag>\n                            <Typography.Text style={{ marginLeft: 4 }}>\n                              Identify whether the chunk is an initial chunk.\n                            </Typography.Text>\n                          </Col>\n                        </Row>\n                        <Row>\n                          <Col>\n                            <Tag color=\"green\" style={{ margin: 0 }}>\n                              concatenated\n                            </Tag>\n                            <Typography.Text style={{ marginLeft: 4 }}>\n                              Identify whether the module is a concatenated\n                              module\n                            </Typography.Text>\n                            {/* TODO:: it's literally a tooltip inside another tooltip */}\n                            <Tooltip\n                              overlayStyle={{ maxWidth: 408 }}\n                              placement=\"bottom\"\n                              color={treeGraphTooltipColor}\n                              title={\n                                <Space direction=\"vertical\" color=\"white\">\n                                  <Row>\n                                    <Col>\n                                      <Typography.Text strong>\n                                        Concatenated Module\n                                      </Typography.Text>\n                                      <Typography.Text>\n                                        : A performance optimization where\n                                        multiple modules are merged (or\n                                        \"hoisted\") into a single scope instead\n                                        of wrapping each module in separate\n                                        function closures. This reduces the\n                                        bundle size and improves runtime\n                                        performance by minimizing function call\n                                        overhead.\n                                      </Typography.Text>\n                                    </Col>\n                                  </Row>\n                                </Space>\n                              }\n                            >\n                              <Typography.Text\n                                type=\"secondary\"\n                                style={{ marginLeft: 4 }}\n                              >\n                                <InfoCircleOutlined />\n                              </Typography.Text>\n                            </Tooltip>\n                            <Typography.Text>.</Typography.Text>\n                          </Col>\n                        </Row>\n                        <Row>\n                          <Col>\n                            <Button\n                              size=\"small\"\n                              icon={<CodepenCircleOutlined />}\n                            />\n                            <Typography.Text style={{ marginLeft: 4 }}>\n                              Open the code.\n                            </Typography.Text>\n                          </Col>\n                        </Row>\n                        <Row>\n                          <Col>\n                            <Button\n                              size=\"small\"\n                              icon={<DeploymentUnitOutlined />}\n                            />\n                            <Typography.Text style={{ marginLeft: 4 }}>\n                              View the module dependency, that is, module\n                              reasons in stats.json.\n                            </Typography.Text>\n                          </Col>\n                        </Row>\n                        <Row>\n                          <Col>\n                            <Tag color={'purple'}>{'Bundled: 15.77 KB'}</Tag>\n                            <Typography.Text>\n                              The final size of the output files after\n                              processing, bundling, and optimization. This is\n                              what is delivered to the browser.\n                            </Typography.Text>\n                          </Col>\n                        </Row>\n                        <Row>\n                          <Col>\n                            <Tag color={'orange'}>{'Source: 60.46 KB'}</Tag>\n                            <Typography.Text>\n                              The original size of your source code files before\n                              any processing or transformations. This is the raw\n                              size of your code as you wrote it.\n                            </Typography.Text>\n                          </Col>\n                        </Row>\n                      </Space>\n                    }\n                  >\n                    <InfoCircleOutlined\n                      style={{ color: 'var(--text-color-secondary)' }}\n                    />\n                  </Tooltip>\n                </Space>\n              ),\n              children: (\n                <TreeGraph\n                  entryPoints={entryPoints}\n                  cwd={cwd}\n                  summary={summary}\n                />\n              ),\n            },\n            {\n              key: 'treemap',\n              label: 'Treemap',\n              children: (\n                <ServerAPIProvider api={SDK.ServerAPI.API.GetProjectInfo}>\n                  {(data) => {\n                    const { isRspack, hasSourceMap } =\n                      Rspack.checkSourceMapSupport(data.configs);\n                    return (\n                      <ServerAPIProvider\n                        api={SDK.ServerAPI.API.GetSummaryBundles}\n                      >\n                        {(data) => {\n                          // Filter assets to only show JS (js, cjs, mjs), .bundle, CSS, and HTML files\n                          const isVisibleTreemapAsset = (filePath: string) => {\n                            const ext =\n                              filePath.toLowerCase().split('.').pop() || '';\n                            return (\n                              isJavaScriptAsset(filePath) ||\n                              ext === 'css' ||\n                              ext === 'html'\n                            );\n                          };\n\n                          const computedTreeData: TreeNode[] = data\n                            .filter((item) =>\n                              isVisibleTreemapAsset(item.asset.path),\n                            )\n                            .map((item) => {\n                              const moduleTree = flattenTreemapData(\n                                item.modules,\n                              );\n                              const hasModules = item.modules.length > 0;\n                              return {\n                                name: item.asset.path,\n                                sourceSize: hasModules\n                                  ? (moduleTree.sourceSize ?? 0)\n                                  : item.asset.size,\n                                bundledSize: item.asset.size,\n                                gzipSize: item.asset.gzipSize ?? 0,\n                                children: moduleTree.children,\n                              };\n                            });\n                          return (\n                            <AssetTreemapWithFilter\n                              treeData={computedTreeData}\n                              bundledSize={hasSourceMap || isRspack}\n                            />\n                          );\n                        }}\n                      </ServerAPIProvider>\n                    );\n                  }}\n                </ServerAPIProvider>\n              ),\n            },\n          ]}\n          defaultActiveKey=\"tree\"\n        />\n      </Card>\n    </>\n  );\n};\n\nexport const WebpackModulesOverall: React.FC = () => {\n  const { project } = useProjectInfo();\n\n  if (!project) {\n    return null;\n  }\n\n  const { root, errors } = project;\n  return (\n    <ServerAPIProvider\n      api={SDK.ServerAPI.API.GetAssetsSummary}\n      body={{ withFileContent: true }}\n    >\n      {(summary) => {\n        return (\n          <ServerAPIProvider api={SDK.ServerAPI.API.GetEntryPoints}>\n            {(entryPoints) => (\n              <WebpackModulesOverallBase\n                cwd={root}\n                errors={errors}\n                summary={summary}\n                entryPoints={entryPoints}\n              />\n            )}\n          </ServerAPIProvider>\n        );\n      }}\n    </ServerAPIProvider>\n  );\n};\n"],"names":["WebpackModulesOverallBase","errors","cwd","summary","entryPoints","expanded","setExpanded","usePersistedState","cardDomId","useId","expandActionText","isLight","useTheme","treeGraphTooltipColor","undefined","React","BundleCards","Card","styles","Tabs","Tooltip","Button","ShrinkOutlined","ArrowsAltOutlined","String","Space","Typography","Row","Col","Tag","InfoCircleOutlined","CodepenCircleOutlined","DeploymentUnitOutlined","TreeGraph","ServerAPIProvider","SDK","data","isRspack","hasSourceMap","Rspack","isVisibleTreemapAsset","filePath","ext","isJavaScriptAsset","computedTreeData","item","moduleTree","flattenTreemapData","hasModules","AssetTreemapWithFilter","WebpackModulesOverall","project","useProjectInfo","root"],"mappings":"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"}

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

@@ -13,12 +13,7 @@ const index_module = {
     assets: "assets-ll1P_L",
     assetBox: "assetBox-Y8vGse",
     fileText: "fileText-W0quVZ",
-    assetsTag: "assetsTag-eAVvyj",
-    modal: "modal-afyzYa",
-    "search-btn": "search-btn-To902q",
-    searchBtn: "search-btn-To902q",
-    "search-modal-list": "search-modal-list-G_Uxc8",
-    searchModalList: "search-modal-list-G_Uxc8"
+    assetsTag: "assetsTag-eAVvyj"
 };
 export default index_module;
 

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

@@ -1 +1 @@
-{"version":3,"file":"pages/BundleSize/components/index.module.mjs","sources":["../../../../src/pages/BundleSize/components/index.module.scss"],"sourcesContent":["// extracted by LIB_CSS_EXTRACT_LOADER\nimport \"./index_module.css\"\nexport default {\"root\":\"root-DgXuux\",\"rootBody\":\"rootBody-xGjkG7\",\"treeGraph\":\"treeGraph-LllSyP\",\"tabsRoot\":\"tabsRoot-gPEaze\",\"assetDetailCol\":\"assetDetailCol-jwyTZJ\",\"assetDetailFileTreeRoot\":\"assetDetailFileTreeRoot-RBNnA8\",\"assetDetailFileTreeBody\":\"assetDetailFileTreeBody-kRMd_h\",\"assetDetailFileTreeViewport\":\"assetDetailFileTreeViewport-USNF6e\",\"assetDetailRoot\":\"assetDetailRoot-dgQPS5\",\"assetDetailFileTreeScrollArea\":\"assetDetailFileTreeScrollArea-IqDzT3\",\"assets\":\"assets-ll1P_L\",\"assetBox\":\"assetBox-Y8vGse\",\"fileText\":\"fileText-W0quVZ\",\"assetsTag\":\"assetsTag-eAVvyj\",\"modal\":\"modal-afyzYa\",\"search-btn\":\"search-btn-To902q\",\"searchBtn\":\"search-btn-To902q\",\"search-modal-list\":\"search-modal-list-G_Uxc8\",\"searchModalList\":\"search-modal-list-G_Uxc8\"};"],"names":[],"mappings":";AAEA,qBAAe;IAAC,MAAO;IAAc,UAAW;IAAkB,WAAY;IAAmB,UAAW;IAAkB,gBAAiB;IAAwB,yBAA0B;IAAiC,yBAA0B;IAAiC,6BAA8B;IAAqC,iBAAkB;IAAyB,+BAAgC;IAAuC,QAAS;IAAgB,UAAW;IAAkB,UAAW;IAAkB,WAAY;IAAmB,OAAQ;IAAe,cAAa;IAAoB,WAAY;IAAoB,qBAAoB;IAA2B,iBAAkB;AAA0B"}
+{"version":3,"file":"pages/BundleSize/components/index.module.mjs","sources":["../../../../src/pages/BundleSize/components/index.module.scss"],"sourcesContent":["// extracted by LIB_CSS_EXTRACT_LOADER\nimport \"./index_module.css\"\nexport default {\"root\":\"root-DgXuux\",\"rootBody\":\"rootBody-xGjkG7\",\"treeGraph\":\"treeGraph-LllSyP\",\"tabsRoot\":\"tabsRoot-gPEaze\",\"assetDetailCol\":\"assetDetailCol-jwyTZJ\",\"assetDetailFileTreeRoot\":\"assetDetailFileTreeRoot-RBNnA8\",\"assetDetailFileTreeBody\":\"assetDetailFileTreeBody-kRMd_h\",\"assetDetailFileTreeViewport\":\"assetDetailFileTreeViewport-USNF6e\",\"assetDetailRoot\":\"assetDetailRoot-dgQPS5\",\"assetDetailFileTreeScrollArea\":\"assetDetailFileTreeScrollArea-IqDzT3\",\"assets\":\"assets-ll1P_L\",\"assetBox\":\"assetBox-Y8vGse\",\"fileText\":\"fileText-W0quVZ\",\"assetsTag\":\"assetsTag-eAVvyj\"};"],"names":[],"mappings":";AAEA,qBAAe;IAAC,MAAO;IAAc,UAAW;IAAkB,WAAY;IAAmB,UAAW;IAAkB,gBAAiB;IAAwB,yBAA0B;IAAiC,yBAA0B;IAAiC,6BAA8B;IAAqC,iBAAkB;IAAyB,+BAAgC;IAAuC,QAAS;IAAgB,UAAW;IAAkB,UAAW;IAAkB,WAAY;AAAkB"}

package/dist/pages/BundleSize/components/index_module.css

@@ -86,42 +86,5 @@
   margin-inline: 0;
 }
 
-.modal-afyzYa .ant-input-affix-wrapper {
-  width: 490px;
-  padding: 4px 5px;
-}
-
-.search-btn-To902q {
-  color: #fff;
-}
-
-.search-btn-To902q > span {
-  position: relative;
-}
-
-.search-btn-To902q:before {
-  content: "";
-  opacity: 1;
-  border-radius: inherit;
-  background: linear-gradient(135deg, #6253e1, #04befe);
-  transition: all .3s;
-  position: absolute;
-  inset: -1px;
-}
-
-.search-btn-To902q:hover:before {
-  opacity: 0;
-}
-
-.search-modal-list-G_Uxc8 .ant-spin-container {
-  max-height: 30rem;
-  overflow: auto;
-}
-
-.search-modal-list-G_Uxc8 .search-list-item.clickable:hover {
-  cursor: pointer;
-  background-color: #eee;
-}
-
 
 /*# sourceMappingURL=index_module.css.map */

package/dist/pages/BundleSize/components/index_module.css.map

@@ -1 +1 @@
-{"version":3,"sources":["webpack://./src/pages/BundleSize/components/index.module.scss"],"names":[],"mappings":"AAAA;EACE,cAAc;AAChB;;AAF8B;EAK5B,sBAAsB;EACtB,OAAO;EACP,aAAa;AACf;;AAR8B;EAW5B,sBAAsB;EACtB,OAAO;EACP,aAAa;AACf;;AAd8B;EAiB5B,sBAAsB;EACtB,OAAO;EACP,aAAa;AACf;;AApB8B;EAuB5B,sBAAsB;EACtB,OAAO;EACP,aAAa;AACf;;AA1ByU;EA6BvU,YAAY;AACd;;AA9BgW;EAiC9V,+BAA+B;EAC/B,OAAO;EACP,8BAA8B;EAC9B,aAAa;AACf;;AArCkc;EAwChc,kBAAkB;AACpB;;AAzCif;EA4C/e,kBAAkB;EAClB,QAAQ;EACR,cAAc;AAChB;;AA/CwjB;EAkDtjB,WAAW;AACb;;AAnDwmB;EAsDtmB,4BAA4B;AAC9B;;AAvDsqB;EA0DpqB,kBAAkB;EAClB,WAAW;AACb;;AA5Dk0B;EA+Dh0B,eAAe;AACjB;;AAhE49B;EAmE19B,cAAc;EACd,iBAAiB;AACnB;;AArEqnC;EAwEnnC,mBAAmB;EACnB,aAAa;AACf;;AA1EuqC;EA6ErqC,iBAAiB;AACnB;;AA9EotC;EAiFltC,YAAY;AACd;;AAlF2uC;EAqFzuC,gBAAgB;AAClB;;AAtFoyC;EAyFlyC,YAAY;EACZ,gBAAgB;AAClB;;AA3Fw2C;EA8Ft2C,WAAW;AACb;;AA/F+3C;EAkG73C,kBAAkB;AACpB;;AAnGk6C;EAsGh6C,WAAW;EACX,UAAU;EACV,sBAAsB;EACtB,qDAAqD;EACrD,mBAAmB;EACnB,kBAAkB;EAClB,WAAW;AACb;;AA7GskD;EAgHpkD,UAAU;AACZ;;AAjH0mD;EAoHxmD,iBAAiB;EACjB,cAAc;AAChB;;AAtHwrD;EAyHtrD,eAAe;EACf,sBAAsB;AACxB","sourcesContent":[".root .rootBody{padding-top:0}.root,.rootBody,.treeGraph,.tabsRoot,.assetDetailCol,.assetDetailFileTreeRoot,.assetDetailFileTreeBody,.assetDetailFileTreeViewport,.tabsRoot :global(.ant-tabs-content-holder),.tabsRoot :global(.ant-tabs-content),.tabsRoot :global(.ant-tabs-tabpane-active){display:flex;flex-direction:column;flex:1}.treeGraph{row-gap:8px}.assetDetailRoot{display:grid;column-gap:var(--spacing-base);grid-template-columns:1fr 3fr;flex:1}.assetDetailFileTreeViewport{position:relative}.assetDetailFileTreeScrollArea{position:absolute;inset:0;overflow:auto}.assets :global .rc-tree-indent-unit{width:22px}.assets :global .rc-tree-treenode{line-height:30px !important}.assets :global .rc-tree-treenode:not(.rc-tree-treenode-switcher-open):not(.rc-tree-treenode-switcher-close) .rc-tree-switcher{position:relative;bottom:4px}.assets :global .rc-tree-treenode:not(.rc-tree-treenode-switcher-open):not(.rc-tree-treenode-switcher-close) .rc-tree-node-content-wrapper{font-size:14px}.assets :global .rc-tree-treenode:not(.rc-tree-treenode-switcher-open):not(.rc-tree-treenode-switcher-close) .file-icon{padding:10px 0 0 0;margin-left:0}.assets .assetBox{display:flex;align-items:center}.assets .assetBox .fileText{margin-right:4px}.assetsTag{height:30px}.assetsTag :global .ant-divider-vertical{margin-inline:0}.modal :global .ant-input-affix-wrapper{padding:4px 5px;width:490px}.search-btn{color:#fff}.search-btn>span{position:relative}.search-btn::before{content:\"\";background:linear-gradient(135deg, #6253e1, #04befe);position:absolute;inset:-1px;opacity:1;transition:all .3s;border-radius:inherit}.search-btn:hover::before{opacity:0}.search-modal-list :global .ant-spin-container{overflow:auto;max-height:30rem}.search-modal-list :global .search-list-item.clickable:hover{background-color:#eee;cursor:pointer}"],"sourceRoot":""}
+{"version":3,"sources":["webpack://./src/pages/BundleSize/components/index.module.scss"],"names":[],"mappings":"AAAA;EACE,cAAc;AAChB;;AAF8B;EAK5B,sBAAsB;EACtB,OAAO;EACP,aAAa;AACf;;AAR8B;EAW5B,sBAAsB;EACtB,OAAO;EACP,aAAa;AACf;;AAd8B;EAiB5B,sBAAsB;EACtB,OAAO;EACP,aAAa;AACf;;AApB8B;EAuB5B,sBAAsB;EACtB,OAAO;EACP,aAAa;AACf;;AA1ByU;EA6BvU,YAAY;AACd;;AA9BgW;EAiC9V,+BAA+B;EAC/B,OAAO;EACP,8BAA8B;EAC9B,aAAa;AACf;;AArCkc;EAwChc,kBAAkB;AACpB;;AAzCif;EA4C/e,kBAAkB;EAClB,QAAQ;EACR,cAAc;AAChB;;AA/CwjB;EAkDtjB,WAAW;AACb;;AAnDwmB;EAsDtmB,4BAA4B;AAC9B;;AAvDsqB;EA0DpqB,kBAAkB;EAClB,WAAW;AACb;;AA5Dk0B;EA+Dh0B,eAAe;AACjB;;AAhE49B;EAmE19B,cAAc;EACd,iBAAiB;AACnB;;AArEqnC;EAwEnnC,mBAAmB;EACnB,aAAa;AACf;;AA1EuqC;EA6ErqC,iBAAiB;AACnB;;AA9EotC;EAiFltC,YAAY;AACd;;AAlF2uC;EAqFzuC,gBAAgB;AAClB","sourcesContent":[".root .rootBody{padding-top:0}.root,.rootBody,.treeGraph,.tabsRoot,.assetDetailCol,.assetDetailFileTreeRoot,.assetDetailFileTreeBody,.assetDetailFileTreeViewport,.tabsRoot :global(.ant-tabs-content-holder),.tabsRoot :global(.ant-tabs-content),.tabsRoot :global(.ant-tabs-tabpane-active){display:flex;flex-direction:column;flex:1}.treeGraph{row-gap:8px}.assetDetailRoot{display:grid;column-gap:var(--spacing-base);grid-template-columns:1fr 3fr;flex:1}.assetDetailFileTreeViewport{position:relative}.assetDetailFileTreeScrollArea{position:absolute;inset:0;overflow:auto}.assets :global .rc-tree-indent-unit{width:22px}.assets :global .rc-tree-treenode{line-height:30px !important}.assets :global .rc-tree-treenode:not(.rc-tree-treenode-switcher-open):not(.rc-tree-treenode-switcher-close) .rc-tree-switcher{position:relative;bottom:4px}.assets :global .rc-tree-treenode:not(.rc-tree-treenode-switcher-open):not(.rc-tree-treenode-switcher-close) .rc-tree-node-content-wrapper{font-size:14px}.assets :global .rc-tree-treenode:not(.rc-tree-treenode-switcher-open):not(.rc-tree-treenode-switcher-close) .file-icon{padding:10px 0 0 0;margin-left:0}.assets .assetBox{display:flex;align-items:center}.assets .assetBox .fileText{margin-right:4px}.assetsTag{height:30px}.assetsTag :global .ant-divider-vertical{margin-inline:0}"],"sourceRoot":""}

package/dist/pages/BundleSize/components/search-modal.mjs

@@ -3,7 +3,7 @@ import { useCallback, useState } from "react";
 import { Button, Empty, Input, List, Modal, Skeleton, Tabs, Typography } from "antd";
 import { ServerAPIProvider } from "../../../components/index.mjs";
 import { SDK } from "@rsdoctor/types";
-import index_module from "./index.module.mjs";
+import search_modal_module from "./search-modal.module.mjs";
 import { SearchOutlined } from "@ant-design/icons";
 const { Search: Search } = Input;
 const SearchModal = ({ onModuleClick, onClose, open, setOpen, isIcon = false })=>{
@@ -32,7 +32,7 @@ const SearchModal = ({ onModuleClick, onClose, open, setOpen, isIcon = false })=
             isIcon ? /*#__PURE__*/ jsx(SearchOutlined, {
                 onClick: showModal
             }) : /*#__PURE__*/ jsx(Button, {
-                className: index_module["search-btn"],
+                className: search_modal_module.searchBtn,
                 color: "cyan",
                 onClick: showModal,
                 children: "Search Module"
@@ -46,7 +46,7 @@ const SearchModal = ({ onModuleClick, onClose, open, setOpen, isIcon = false })=
                     const defaultChunkId = Object.keys(assetsChunksList)[0];
                     return /*#__PURE__*/ jsx(Fragment, {
                         children: /*#__PURE__*/ jsxs(Modal, {
-                            className: index_module.modal,
+                            className: search_modal_module.modal,
                             title: "Search Modules",
                             onOk: handleOk,
                             onCancel: handleCancel,
@@ -97,7 +97,7 @@ const ModulesModal = (searchModule, chunk, onModuleClick)=>/*#__PURE__*/ jsx(Ser
         },
         children: (modules)=>/*#__PURE__*/ jsx(Fragment, {
                 children: modules?.length !== 0 ? /*#__PURE__*/ jsx(List, {
-                    className: index_module["search-modal-list"],
+                    className: search_modal_module.list,
                     loading: !modules.length,
                     itemLayout: "horizontal",
                     pagination: {
@@ -108,7 +108,7 @@ const ModulesModal = (searchModule, chunk, onModuleClick)=>/*#__PURE__*/ jsx(Ser
                     renderItem: (item)=>{
                         const itemPathArr = item.relativePath.split(searchModule);
                         return /*#__PURE__*/ jsx(List.Item, {
-                            className: onModuleClick ? 'search-list-item clickable' : 'search-list-item',
+                            className: onModuleClick && search_modal_module.listItemInteractive,
                             onClick: onModuleClick ? ()=>onModuleClick(item) : void 0,
                             children: /*#__PURE__*/ jsx(Skeleton, {
                                 avatar: true,

package/dist/pages/BundleSize/components/search-modal.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"pages/BundleSize/components/search-modal.mjs","sources":["../../../../src/pages/BundleSize/components/search-modal.tsx"],"sourcesContent":["import React, { useCallback, useState } from 'react';\nimport {\n  Button,\n  Modal,\n  Input,\n  Tabs,\n  List,\n  Skeleton,\n  Typography,\n  Empty,\n} from 'antd';\nimport { SearchProps } from 'antd/es/input';\nimport { ServerAPIProvider } from 'src/components';\nimport { SDK } from '@rsdoctor/types';\nimport styles from './index.module.scss';\nimport { SearchOutlined } from '@ant-design/icons';\n\nconst { Search } = Input;\n\ntype OnSearchParams = Parameters<NonNullable<SearchProps['onSearch']>>;\n\nexport const SearchModal: React.FC<{\n  onModuleClick?: (module: any) => void;\n  onClose?: () => void;\n  open?: boolean;\n  setOpen?: (open: boolean) => void;\n  isIcon?: boolean;\n}> = ({\n  onModuleClick = undefined,\n  onClose,\n  open,\n  setOpen,\n  isIcon = false,\n}) => {\n  const [isModalOpen, setIsModalOpen] = useState(false);\n  const [searchModule, setSearchModule] = useState('');\n  const [searchChunk, setSearchChunk] = useState('');\n\n  const modalOpen = open !== undefined ? open : isModalOpen;\n  const setModalOpen = setOpen || setIsModalOpen;\n\n  const onSearch: SearchProps['onSearch'] = useCallback(\n    (...args: OnSearchParams) => {\n      const [value, _event] = args;\n      setSearchModule(value);\n    },\n    [],\n  );\n\n  const showModal = () => {\n    setModalOpen(true);\n  };\n\n  const handleOk = () => {\n    setModalOpen(false);\n    onClose?.();\n  };\n\n  const handleCancel = () => {\n    setModalOpen(false);\n    onClose?.();\n  };\n\n  return (\n    <>\n      {isIcon ? (\n        <SearchOutlined onClick={showModal} />\n      ) : (\n        <Button\n          className={styles['search-btn']}\n          color=\"cyan\"\n          onClick={showModal}\n        >\n          Search Module\n        </Button>\n      )}\n\n      <ServerAPIProvider\n        api={SDK.ServerAPI.API.GetSearchModules}\n        body={{ moduleName: String(searchModule) }}\n      >\n        {(assetsChunksList) => {\n          const defaultChunkId = Object.keys(assetsChunksList)[0];\n          return (\n            <>\n              <Modal\n                className={styles.modal}\n                title=\"Search Modules\"\n                onOk={handleOk}\n                onCancel={handleCancel}\n                open={modalOpen}\n                width={'65rem'}\n                footer=\"\"\n              >\n                <Search\n                  placeholder=\"input search module name\"\n                  allowClear\n                  onSearch={onSearch}\n                  style={{ width: 500 }}\n                />\n                {defaultChunkId ? (\n                  <Tabs\n                    defaultActiveKey={defaultChunkId}\n                    tabPosition={'top'}\n                    onChange={(value) => setSearchChunk(value)}\n                    items={Object.keys(assetsChunksList).map((chunk, _i) => {\n                      const id = chunk;\n                      return {\n                        label: assetsChunksList[chunk],\n                        key: id,\n                        children: ModulesModal(\n                          searchModule,\n                          searchChunk || defaultChunkId,\n                          (item) => {\n                            onModuleClick?.(item);\n                            setModalOpen(false);\n                            onClose?.();\n                          },\n                        ),\n                      };\n                    })}\n                  />\n                ) : (\n                  <Empty description={'No modules found.'} />\n                )}\n              </Modal>\n            </>\n          );\n        }}\n      </ServerAPIProvider>\n    </>\n  );\n};\n\nconst ModulesModal = (\n  searchModule: string,\n  chunk: string,\n  onModuleClick?: (module: any) => void | undefined,\n) => {\n  return (\n    <ServerAPIProvider\n      api={SDK.ServerAPI.API.GetSearchModuleInChunk}\n      body={{ moduleName: String(searchModule), chunk }}\n    >\n      {(modules) => (\n        <>\n          {modules?.length !== 0 ? (\n            <List\n              className={styles['search-modal-list']}\n              loading={!modules.length}\n              itemLayout=\"horizontal\"\n              pagination={{ position: 'bottom', align: 'center' }}\n              dataSource={modules}\n              renderItem={(item) => {\n                const itemPathArr = item.relativePath.split(searchModule);\n                return (\n                  <List.Item\n                    className={\n                      onModuleClick\n                        ? 'search-list-item clickable'\n                        : 'search-list-item'\n                    }\n                    key={`${item.path}-${item.relativePath}`}\n                    onClick={\n                      onModuleClick ? () => onModuleClick(item) : undefined\n                    }\n                  >\n                    <Skeleton avatar title={false} loading={!item.path} active>\n                      <List.Item.Meta\n                        key={`${item.path}-${item.relativePath}-meta`}\n                        description={\n                          <>\n                            <Typography.Text code>{'Module:'}</Typography.Text>\n                            {itemPathArr.map((cur, index) => {\n                              if (index < itemPathArr.length - 1) {\n                                return (\n                                  <Typography.Text\n                                    key={`${cur}-${index}`}\n                                    style={{ fontWeight: 200 }}\n                                  >\n                                    {cur}\n                                    <Typography.Text\n                                      strong\n                                      key={`${cur}-${index}-strong`}\n                                      style={{ fontWeight: 600 }}\n                                    >\n                                      {searchModule}\n                                    </Typography.Text>\n                                  </Typography.Text>\n                                );\n                              }\n                              return (\n                                <Typography.Text style={{ fontWeight: 200 }}>\n                                  {cur}\n                                </Typography.Text>\n                              );\n                            })}\n                          </>\n                        }\n                      />\n                    </Skeleton>\n                  </List.Item>\n                );\n              }}\n            />\n          ) : (\n            <Empty />\n          )}\n        </>\n      )}\n    </ServerAPIProvider>\n  );\n};\n"],"names":["Search","Input","SearchModal","onModuleClick","onClose","open","setOpen","isIcon","isModalOpen","setIsModalOpen","useState","searchModule","setSearchModule","searchChunk","setSearchChunk","modalOpen","undefined","setModalOpen","onSearch","useCallback","args","value","_event","showModal","handleOk","handleCancel","SearchOutlined","Button","styles","ServerAPIProvider","SDK","String","assetsChunksList","defaultChunkId","Object","Modal","Tabs","chunk","_i","id","ModulesModal","item","Empty","modules","List","itemPathArr","Skeleton","Typography","cur","index"],"mappings":"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"}
+{"version":3,"file":"pages/BundleSize/components/search-modal.mjs","sources":["../../../../src/pages/BundleSize/components/search-modal.tsx"],"sourcesContent":["import React, { useCallback, useState } from 'react';\nimport {\n  Button,\n  Modal,\n  Input,\n  Tabs,\n  List,\n  Skeleton,\n  Typography,\n  Empty,\n} from 'antd';\nimport { SearchProps } from 'antd/es/input';\nimport { ServerAPIProvider } from 'src/components';\nimport { SDK } from '@rsdoctor/types';\nimport styles from './search-modal.module.scss';\nimport { SearchOutlined } from '@ant-design/icons';\n\nconst { Search } = Input;\n\ntype OnSearchParams = Parameters<NonNullable<SearchProps['onSearch']>>;\n\nexport const SearchModal: React.FC<{\n  onModuleClick?: (module: any) => void;\n  onClose?: () => void;\n  open?: boolean;\n  setOpen?: (open: boolean) => void;\n  isIcon?: boolean;\n}> = ({\n  onModuleClick = undefined,\n  onClose,\n  open,\n  setOpen,\n  isIcon = false,\n}) => {\n  const [isModalOpen, setIsModalOpen] = useState(false);\n  const [searchModule, setSearchModule] = useState('');\n  const [searchChunk, setSearchChunk] = useState('');\n\n  const modalOpen = open !== undefined ? open : isModalOpen;\n  const setModalOpen = setOpen || setIsModalOpen;\n\n  const onSearch: SearchProps['onSearch'] = useCallback(\n    (...args: OnSearchParams) => {\n      const [value, _event] = args;\n      setSearchModule(value);\n    },\n    [],\n  );\n\n  const showModal = () => {\n    setModalOpen(true);\n  };\n\n  const handleOk = () => {\n    setModalOpen(false);\n    onClose?.();\n  };\n\n  const handleCancel = () => {\n    setModalOpen(false);\n    onClose?.();\n  };\n\n  return (\n    <>\n      {isIcon ? (\n        <SearchOutlined onClick={showModal} />\n      ) : (\n        <Button className={styles.searchBtn} color=\"cyan\" onClick={showModal}>\n          Search Module\n        </Button>\n      )}\n\n      <ServerAPIProvider\n        api={SDK.ServerAPI.API.GetSearchModules}\n        body={{ moduleName: String(searchModule) }}\n      >\n        {(assetsChunksList) => {\n          const defaultChunkId = Object.keys(assetsChunksList)[0];\n          return (\n            <>\n              <Modal\n                className={styles.modal}\n                title=\"Search Modules\"\n                onOk={handleOk}\n                onCancel={handleCancel}\n                open={modalOpen}\n                width={'65rem'}\n                footer=\"\"\n              >\n                <Search\n                  placeholder=\"input search module name\"\n                  allowClear\n                  onSearch={onSearch}\n                  style={{ width: 500 }}\n                />\n                {defaultChunkId ? (\n                  <Tabs\n                    defaultActiveKey={defaultChunkId}\n                    tabPosition={'top'}\n                    onChange={(value) => setSearchChunk(value)}\n                    items={Object.keys(assetsChunksList).map((chunk, _i) => {\n                      const id = chunk;\n                      return {\n                        label: assetsChunksList[chunk],\n                        key: id,\n                        children: ModulesModal(\n                          searchModule,\n                          searchChunk || defaultChunkId,\n                          (item) => {\n                            onModuleClick?.(item);\n                            setModalOpen(false);\n                            onClose?.();\n                          },\n                        ),\n                      };\n                    })}\n                  />\n                ) : (\n                  <Empty description={'No modules found.'} />\n                )}\n              </Modal>\n            </>\n          );\n        }}\n      </ServerAPIProvider>\n    </>\n  );\n};\n\nconst ModulesModal = (\n  searchModule: string,\n  chunk: string,\n  onModuleClick?: (module: any) => void | undefined,\n) => {\n  return (\n    <ServerAPIProvider\n      api={SDK.ServerAPI.API.GetSearchModuleInChunk}\n      body={{ moduleName: String(searchModule), chunk }}\n    >\n      {(modules) => (\n        <>\n          {modules?.length !== 0 ? (\n            <List\n              className={styles.list}\n              loading={!modules.length}\n              itemLayout=\"horizontal\"\n              pagination={{ position: 'bottom', align: 'center' }}\n              dataSource={modules}\n              renderItem={(item) => {\n                const itemPathArr = item.relativePath.split(searchModule);\n                return (\n                  <List.Item\n                    className={onModuleClick && styles.listItemInteractive}\n                    key={`${item.path}-${item.relativePath}`}\n                    onClick={\n                      onModuleClick ? () => onModuleClick(item) : undefined\n                    }\n                  >\n                    <Skeleton avatar title={false} loading={!item.path} active>\n                      <List.Item.Meta\n                        key={`${item.path}-${item.relativePath}-meta`}\n                        description={\n                          <>\n                            <Typography.Text code>{'Module:'}</Typography.Text>\n                            {itemPathArr.map((cur, index) => {\n                              if (index < itemPathArr.length - 1) {\n                                return (\n                                  <Typography.Text\n                                    key={`${cur}-${index}`}\n                                    style={{ fontWeight: 200 }}\n                                  >\n                                    {cur}\n                                    <Typography.Text\n                                      strong\n                                      key={`${cur}-${index}-strong`}\n                                      style={{ fontWeight: 600 }}\n                                    >\n                                      {searchModule}\n                                    </Typography.Text>\n                                  </Typography.Text>\n                                );\n                              }\n                              return (\n                                <Typography.Text style={{ fontWeight: 200 }}>\n                                  {cur}\n                                </Typography.Text>\n                              );\n                            })}\n                          </>\n                        }\n                      />\n                    </Skeleton>\n                  </List.Item>\n                );\n              }}\n            />\n          ) : (\n            <Empty />\n          )}\n        </>\n      )}\n    </ServerAPIProvider>\n  );\n};\n"],"names":["Search","Input","SearchModal","onModuleClick","onClose","open","setOpen","isIcon","isModalOpen","setIsModalOpen","useState","searchModule","setSearchModule","searchChunk","setSearchChunk","modalOpen","undefined","setModalOpen","onSearch","useCallback","args","value","_event","showModal","handleOk","handleCancel","SearchOutlined","Button","styles","ServerAPIProvider","SDK","String","assetsChunksList","defaultChunkId","Object","Modal","Tabs","chunk","_i","id","ModulesModal","item","Empty","modules","List","itemPathArr","Skeleton","Typography","cur","index"],"mappings":"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"}

package/dist/pages/BundleSize/components/search-modal.module.mjs

@@ -0,0 +1,10 @@
+import "./search-modal_module.css";
+const search_modal_module = {
+    modal: "modal-jTgoC2",
+    list: "list-osNsTS",
+    listItemInteractive: "listItemInteractive-AC3tqb",
+    searchBtn: "searchBtn-ZhRlk8"
+};
+export default search_modal_module;
+
+//# sourceMappingURL=search-modal.module.mjs.map

package/dist/pages/BundleSize/components/search-modal.module.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"pages/BundleSize/components/search-modal.module.mjs","sources":["../../../../src/pages/BundleSize/components/search-modal.module.scss"],"sourcesContent":["// extracted by LIB_CSS_EXTRACT_LOADER\nimport \"./search-modal_module.css\"\nexport default {\"modal\":\"modal-jTgoC2\",\"list\":\"list-osNsTS\",\"listItemInteractive\":\"listItemInteractive-AC3tqb\",\"searchBtn\":\"searchBtn-ZhRlk8\"};"],"names":[],"mappings":";AAEA,4BAAe;IAAC,OAAQ;IAAe,MAAO;IAAc,qBAAsB;IAA6B,WAAY;AAAkB"}