@rsdoctor/components 1.5.17 → 1.6.0

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"}

package/dist/pages/BundleSize/components/search-modal_module.css

@@ -0,0 +1,39 @@
+.modal-jTgoC2 .ant-input-affix-wrapper {
+  width: 490px;
+  padding: 4px 5px;
+}
+
+.list-osNsTS .ant-spin-container {
+  max-height: 30rem;
+  overflow: auto;
+}
+
+.listItemInteractive-AC3tqb:hover {
+  background-color: var(--color-bg-box-elevated);
+  cursor: pointer;
+}
+
+.searchBtn-ZhRlk8 {
+  color: #fff;
+}
+
+.searchBtn-ZhRlk8 > span {
+  position: relative;
+}
+
+.searchBtn-ZhRlk8:before {
+  content: "";
+  opacity: 1;
+  border-radius: inherit;
+  background: linear-gradient(135deg, #6253e1, #04befe);
+  transition: all .3s;
+  position: absolute;
+  inset: -1px;
+}
+
+.searchBtn-ZhRlk8:hover:before {
+  opacity: 0;
+}
+
+
+/*# sourceMappingURL=search-modal_module.css.map */

package/dist/pages/BundleSize/components/search-modal_module.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["webpack://./src/pages/BundleSize/components/search-modal.module.scss"],"names":[],"mappings":"AAAA;EACE,YAAY;EACZ,gBAAgB;AAClB;;AAHoE;EAMlE,iBAAiB;EACjB,cAAc;AAChB;;AARqI;EAWnI,8CAA8C;EAC9C,eAAe;AACjB;;AAb6N;EAgB3N,WAAW;AACb;;AAjBmP;EAoBjP,kBAAkB;AACpB;;AArBqR;EAwBnR,WAAW;EACX,UAAU;EACV,sBAAsB;EACtB,qDAAqD;EACrD,mBAAmB;EACnB,kBAAkB;EAClB,WAAW;AACb;;AA/Bwb;EAkCtb,UAAU;AACZ","sourcesContent":[".modal :global .ant-input-affix-wrapper{padding:4px 5px;width:490px}.list :global .ant-spin-container{overflow:auto;max-height:30rem}.listItemInteractive:hover{background-color:var(--color-bg-box-elevated);cursor:pointer}.searchBtn{color:#fff}.searchBtn>span{position:relative}.searchBtn::before{content:\"\";background:linear-gradient(135deg, #6253e1, #04befe);position:absolute;inset:-1px;opacity:1;transition:all .3s;border-radius:inherit}.searchBtn:hover::before{opacity:0}"],"sourceRoot":""}

package/dist/pages/BundleSize/components/tree-graph.mjs

@@ -1,7 +1,7 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { CodeOutlined, InfoCircleOutlined } from "@ant-design/icons";
 import { SDK } from "@rsdoctor/types";
-import { Card, Col, Divider, Empty, InputNumber, Row, Select, Space, Tooltip, Typography } from "antd";
+import { Card, Checkbox, Col, Divider, Empty, InputNumber, Row, Select, Space, Tooltip, Typography } from "antd";
 import { debounce, sumBy } from "es-toolkit/compat";
 import { memo, useCallback, useEffect, useMemo, useState } from "react";
 import { useCodeDrawer } from "../../../components/base/CodeViewer/useCodeDrawer.mjs";
@@ -13,9 +13,11 @@ import { ServerAPIProvider } from "../../../components/Manifest/index.mjs";
 import { Size } from "../../../constants.mjs";
 import { createFileStructures, formatSize, useI18n } from "../../../utils/index.mjs";
 import { AssetDetail } from "./asset.mjs";
+import { createAssetPathMap, resolveAssetFileTitleTarget } from "./asset-path.mjs";
 import index_module from "./index.module.mjs";
 import "./index.css";
 import { SearchModal } from "./search-modal.mjs";
+import { isJavaScriptAsset } from "../../../utils/assets.mjs";
 const { Option: Option } = Select;
 const TreeGraph = /*#__PURE__*/ memo(({ cwd, summary, entryPoints })=>{
     const [selectedEntryPoints, setEntryPoints] = useState([]);
@@ -25,6 +27,7 @@ const TreeGraph = /*#__PURE__*/ memo(({ cwd, summary, entryPoints })=>{
     const [defaultExpandAll, setDefaultExpandAll] = useState(false);
     const [inputModuleUnit, setModuleUnit] = useState('');
     const [inputChunkUnit, setChunkUnit] = useState('');
+    const [showOnlyJavaScriptAssets, setShowOnlyJavaScriptAssets] = useState(false);
     const [assetPath, setAssetPath] = useState(null);
     const { showCode, codeDrawerComponent } = useCodeDrawer('Do not have the codes of assets. If you use the lite or brief mode, there will have codes.');
     const { t } = useI18n();
@@ -58,6 +61,7 @@ const TreeGraph = /*#__PURE__*/ memo(({ cwd, summary, entryPoints })=>{
     const filteredAssets = useMemo(()=>{
         let res = assets.slice();
         if (inputAssetName) res = res.filter((e)=>e.path.indexOf(inputAssetName) > -1);
+        if (showOnlyJavaScriptAssets) res = res.filter((e)=>isJavaScriptAsset(e.path));
         if (inputAssetSize > 0) res = res.filter((e)=>e.size >= inputAssetSize);
         if (selectedEntryPoints.length) res = res.filter((e)=>{
             if (selectedEntryPoints.some((ep)=>ep.assets.includes(e.path))) return true;
@@ -72,25 +76,26 @@ const TreeGraph = /*#__PURE__*/ memo(({ cwd, summary, entryPoints })=>{
         assets,
         selectedEntryPoints,
         inputAssetName,
-        inputAssetSize
+        inputAssetSize,
+        showOnlyJavaScriptAssets
     ]);
     useEffect(()=>{
-        function getFileExtension(filePath) {
-            const parts = filePath.split('.');
-            return parts.length > 1 ? parts.pop() : '';
-        }
-        summary.all.total.files.forEach((f)=>{
-            const ext = getFileExtension(f.path);
-            if ('js' === ext) setAssetPath(f.path);
-        });
+        if (assetPath && filteredAssets.some((f)=>f.path === assetPath)) return;
+        const nextAsset = filteredAssets.find((f)=>isJavaScriptAsset(f.path)) ?? filteredAssets[0];
+        setAssetPath(nextAsset?.path ?? null);
     }, [
-        summary.all.total.files
+        assetPath,
+        filteredAssets
+    ]);
+    const assetsMap = useMemo(()=>createAssetPathMap(filteredAssets), [
+        filteredAssets
     ]);
     const assetsStructures = useMemo(()=>{
         const res = createFileStructures({
             files: filteredAssets.map((e)=>e.path).filter(Boolean),
             fileTitle (file, basename) {
-                const target = filteredAssets.find((e)=>e.path === file);
+                const target = resolveAssetFileTitleTarget(assetsMap, file, basename);
+                if ('string' == typeof target) return target;
                 const { size, initial, path, content } = target;
                 return /*#__PURE__*/ jsxs("div", {
                     className: index_module.assetBox,
@@ -143,7 +148,9 @@ const TreeGraph = /*#__PURE__*/ memo(({ cwd, summary, entryPoints })=>{
         });
         return res;
     }, [
-        filteredAssets
+        assetsMap,
+        filteredAssets,
+        showCode
     ]);
     const onSearch = (value)=>{
         setAssetName(value);
@@ -196,6 +203,16 @@ const TreeGraph = /*#__PURE__*/ memo(({ cwd, summary, entryPoints })=>{
                                     onChange: onSearch
                                 })
                             }),
+                            /*#__PURE__*/ jsx(Col, {
+                                children: /*#__PURE__*/ jsx(Checkbox, {
+                                    checked: showOnlyJavaScriptAssets,
+                                    onChange: (e)=>{
+                                        setShowOnlyJavaScriptAssets(e.target.checked);
+                                        setDefaultExpandAll(false);
+                                    },
+                                    children: "JS only"
+                                })
+                            }),
                             /*#__PURE__*/ jsx(Col, {
                                 span: 6,
                                 children: /*#__PURE__*/ jsx(InputNumber, {
@@ -219,7 +236,7 @@ const TreeGraph = /*#__PURE__*/ memo(({ cwd, summary, entryPoints })=>{
                                                 },
                                                 children: /*#__PURE__*/ jsx(InfoCircleOutlined, {
                                                     style: {
-                                                        color: 'rgba(0,0,0,.45)'
+                                                        color: 'var(--text-color-secondary)'
                                                     }
                                                 })
                                             })
@@ -252,7 +269,7 @@ const TreeGraph = /*#__PURE__*/ memo(({ cwd, summary, entryPoints })=>{
                                                 },
                                                 children: /*#__PURE__*/ jsx(InfoCircleOutlined, {
                                                     style: {
-                                                        color: 'rgba(0,0,0,.45)'
+                                                        color: 'var(--text-color-secondary)'
                                                     }
                                                 })
                                             })

package/dist/pages/BundleSize/components/tree-graph.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"pages/BundleSize/components/tree-graph.mjs","sources":["../../../../src/pages/BundleSize/components/tree-graph.tsx"],"sourcesContent":["import { CodeOutlined, InfoCircleOutlined } from '@ant-design/icons';\nimport { type Client, SDK } from '@rsdoctor/types';\nimport {\n  Card,\n  Col,\n  Divider,\n  Empty,\n  InputNumber,\n  Row,\n  Select,\n  Space,\n  Tooltip,\n  Typography,\n} from 'antd';\nimport { debounce, sumBy } from 'es-toolkit/compat';\nimport { memo, useCallback, useEffect, useMemo, useState } from 'react';\nimport { useCodeDrawer } from 'src/components/base/CodeViewer/useCodeDrawer';\nimport { Badge as Bdg } from '../../../components/Badge';\nimport { FileTree } from '../../../components/FileTree';\nimport { KeywordInput } from '../../../components/Form/keyword';\nimport { Keyword } from '../../../components/Keyword';\nimport { ServerAPIProvider } from '../../../components/Manifest';\nimport { Size } from '../../../constants';\nimport { createFileStructures, formatSize, useI18n } from '../../../utils';\nimport { AssetDetail } from './asset';\nimport styles from './index.module.scss';\nimport './index.sass';\nimport { SearchModal } from './search-modal';\nconst { Option } = Select;\n\nexport const TreeGraph = memo(\n  ({\n    cwd,\n    summary,\n    entryPoints,\n  }: {\n    cwd: string;\n    summary: Client.RsdoctorClientAssetsSummary;\n    entryPoints: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetEntryPoints>;\n  }) => {\n    const [selectedEntryPoints, setEntryPoints] = useState<\n      SDK.EntryPointData[]\n    >([]);\n    const [inputModule, setModuleValue] = useState(0);\n    const [inputAssetName, setAssetName] = useState('');\n    const [inputAssetSize, setAssetSize] = useState(0);\n    const [defaultExpandAll, setDefaultExpandAll] = useState(false);\n    const [inputModuleUnit, setModuleUnit] = useState('');\n    const [inputChunkUnit, setChunkUnit] = useState('');\n    const [assetPath, setAssetPath] = useState<string | null>(null);\n    const { showCode, codeDrawerComponent } = useCodeDrawer(\n      'Do not have the codes of assets. If you use the lite or brief mode, there will have codes.',\n    );\n\n    const { t } = useI18n();\n\n    const assets = summary.all.total.files;\n\n    const handleChange = useCallback(\n      (type: string) => (value: string) => {\n        if (type === 'module') {\n          setModuleUnit(value);\n        } else if (type === 'chunk') {\n          setChunkUnit(value);\n        }\n      },\n      [],\n    );\n\n    const selectAfter = (type: string) => (\n      <Select defaultValue=\"kb\" onChange={handleChange(type)}>\n        <Option value=\"kb\">KB</Option>\n        <Option value=\"mb\">MB</Option>\n      </Select>\n    );\n    const onChangeModule = useCallback(\n      debounce((newValue: number) => {\n        const count =\n          inputModuleUnit === 'mb' ? newValue * 1024 * 1024 : newValue * 1024;\n        setModuleValue(count);\n      }, 300),\n      [],\n    );\n\n    const onChangeAsset = useCallback(\n      debounce((newValue: number) => {\n        const count =\n          inputChunkUnit === 'mb' ? newValue * 1024 * 1024 : newValue * 1024;\n        setAssetSize(count);\n      }, 300),\n      [],\n    );\n\n    const filteredAssets = useMemo(() => {\n      let res = assets.slice();\n\n      if (inputAssetName) {\n        res = res.filter((e) => e.path.indexOf(inputAssetName) > -1);\n      }\n\n      if (inputAssetSize > 0) {\n        res = res.filter((e) => e.size >= inputAssetSize);\n      }\n\n      if (selectedEntryPoints.length) {\n        res = res.filter((e) => {\n          if (selectedEntryPoints.some((ep) => ep.assets.includes(e.path))) {\n            return true;\n          }\n          return false;\n        });\n      }\n\n      return res.sort((a, b) => {\n        const _a = a.path.indexOf('/') > -1 ? 1 : 0;\n        const _b = b.path.indexOf('/') > -1 ? 1 : 0;\n        // return _a - _b;\n        return _b - _a;\n      });\n    }, [assets, selectedEntryPoints, inputAssetName, inputAssetSize]);\n\n    useEffect(() => {\n      function getFileExtension(filePath: string) {\n        const parts = filePath.split('.');\n        return parts.length > 1 ? parts.pop() : '';\n      }\n\n      summary.all.total.files.forEach((f) => {\n        const ext = getFileExtension(f.path);\n        if (ext === 'js') {\n          setAssetPath(f.path);\n        }\n      });\n    }, [summary.all.total.files]);\n\n    const assetsStructures = useMemo(() => {\n      const res = createFileStructures({\n        files: filteredAssets.map((e) => e.path).filter(Boolean),\n        fileTitle(file, basename) {\n          const target = filteredAssets.find((e) => e.path === file)!;\n          const { size, initial, path, content } = target;\n\n          return (\n            <div\n              className={styles.assetBox}\n              onClick={() => {\n                setAssetPath(path);\n              }}\n            >\n              <Keyword\n                text={basename}\n                keyword={''}\n                className={styles.fileText}\n              />\n              <Space size=\"small\" className={styles.assetsTag}>\n                <Divider type=\"vertical\" />\n                <Typography.Text style={{ color: '#4FD233' }}>\n                  {formatSize(size)}\n                </Typography.Text>\n                <Divider type=\"vertical\" />\n                {initial ? (\n                  <Typography.Text style={{ color: '#009A9E' }}>\n                    initial\n                  </Typography.Text>\n                ) : null}\n                <CodeOutlined\n                  style={{ fontSize: 14, padding: 0 }}\n                  onClick={() => showCode({ code: content!, filePath: path })}\n                />\n              </Space>\n            </div>\n          );\n        },\n      });\n      return res;\n    }, [filteredAssets]);\n\n    const onSearch = (value: string) => {\n      setAssetName(value);\n      setDefaultExpandAll(false);\n    };\n    return (\n      <>\n        <div className={styles.treeGraph}>\n          <Row align=\"middle\" gutter={[Size.BasePadding, Size.BasePadding]}>\n            {entryPoints && entryPoints.length ? (\n              <Col>\n                <Select\n                  mode=\"multiple\"\n                  value={selectedEntryPoints.map((e) => e.name)}\n                  style={{\n                    minWidth: 230,\n                    width: 'auto',\n                    maxWidth: 300,\n                  }}\n                  placeholder={'filter assets by entry point'}\n                  onChange={(name: string[]) => {\n                    setEntryPoints(\n                      name\n                        .map((e) => entryPoints.find((ep) => ep.name === e)!)\n                        .filter(Boolean),\n                    );\n                  }}\n                  allowClear\n                  onClear={() => {\n                    setEntryPoints([]);\n                  }}\n                >\n                  {entryPoints.map((e) => {\n                    return (\n                      <Select.Option key={e.name} value={e.name}>\n                        <Space>\n                          <Bdg\n                            label={e.name}\n                            value={formatSize(e.size)}\n                            tooltip={e.name}\n                          />\n                        </Space>\n                      </Select.Option>\n                    );\n                  })}\n                </Select>\n              </Col>\n            ) : null}\n            <Col>\n              <KeywordInput\n                placeholder=\"search asset by keyword\"\n                onChange={onSearch}\n              />\n            </Col>\n            <Col span={6}>\n              <InputNumber\n                min={0}\n                style={{ width: '95%' }}\n                addonBefore={\n                  <Space>\n                    <Typography.Text style={{ fontSize: 14, color: 'inherit' }}>\n                      Asset Size\n                    </Typography.Text>\n                    <Tooltip\n                      title={t(\n                        'filter the output assets which size is greater than the input value',\n                      )}\n                      style={{ marginLeft: 3 }}\n                    >\n                      <InfoCircleOutlined\n                        style={{ color: 'rgba(0,0,0,.45)' }}\n                      />\n                    </Tooltip>\n                  </Space>\n                }\n                onChange={(value) => onChangeAsset(Number(value))}\n                addonAfter={selectAfter('chunk')}\n              />\n            </Col>\n            <Col span={6}>\n              <InputNumber\n                min={0}\n                style={{ width: '95%' }}\n                addonBefore={\n                  <Space>\n                    <Typography.Text style={{ fontSize: 14, color: 'inherit' }}>\n                      Module Size\n                    </Typography.Text>\n                    <Tooltip\n                      title={t(\n                        'filter the modules which size is greater than the input value',\n                      )}\n                      style={{ marginLeft: 3 }}\n                    >\n                      <InfoCircleOutlined\n                        style={{ color: 'rgba(0,0,0,.45)' }}\n                      />\n                    </Tooltip>\n                  </Space>\n                }\n                onChange={(value) => {\n                  onChangeModule(Number(value));\n                }}\n                addonAfter={selectAfter('module')}\n              />\n            </Col>\n          </Row>\n          <Row>\n            <SearchModal />\n          </Row>\n          {filteredAssets.length ? (\n            <div className={styles.assetDetailRoot}>\n              <div className={styles.assetDetailCol}>\n                <Card\n                  className={styles.assetDetailFileTreeRoot}\n                  classNames={{\n                    body: styles.assetDetailFileTreeBody,\n                  }}\n                  title={\n                    <Space>\n                      <Typography.Text>\n                        {t('Output Assets List')}\n                      </Typography.Text>\n                      <Divider type=\"vertical\" />\n                      <Tooltip\n                        title={`total assets count is ${assets.length}, the filtered assets count is ${filteredAssets.length}`}\n                      >\n                        <Typography.Text\n                          type=\"secondary\"\n                          style={{\n                            fontSize: 12,\n                            fontWeight: 400,\n                          }}\n                        >\n                          {filteredAssets.length} / {assets.length}\n                        </Typography.Text>\n                      </Tooltip>\n                      <Divider type=\"vertical\" />\n                      <Typography.Text\n                        type=\"secondary\"\n                        style={{ fontSize: 12, fontWeight: 400 }}\n                      >\n                        {formatSize(sumBy(filteredAssets, (e) => e.size))}\n                      </Typography.Text>\n                    </Space>\n                  }\n                  size=\"small\"\n                >\n                  <div className={styles.assetDetailFileTreeViewport}>\n                    <div className={styles.assetDetailFileTreeScrollArea}>\n                      <FileTree\n                        className={styles.assets}\n                        treeData={assetsStructures}\n                        autoExpandParent\n                        defaultExpandAll={\n                          defaultExpandAll || filteredAssets.length <= 20\n                        }\n                        key={`tree_${inputAssetName}_${defaultExpandAll}`}\n                      />\n                    </div>\n                  </div>\n                </Card>\n              </div>\n              <div className={styles.assetDetailCol}>\n                {assetPath ? (\n                  <ServerAPIProvider\n                    api={SDK.ServerAPI.API.GetAssetDetails}\n                    body={{ assetPath }}\n                  >\n                    {(details) => (\n                      <AssetDetail\n                        asset={details.asset}\n                        chunks={details.chunks}\n                        modules={details.modules}\n                        moduleSizeLimit={inputModule}\n                        root={cwd}\n                      />\n                    )}\n                  </ServerAPIProvider>\n                ) : (\n                  <Card>\n                    <Empty\n                      description={\n                        <Typography.Text strong>\n                          Click the file path on the left to show the modules of\n                          the asset\n                        </Typography.Text>\n                      }\n                    />\n                  </Card>\n                )}\n              </div>\n            </div>\n          ) : (\n            <Empty />\n          )}\n        </div>\n        {codeDrawerComponent}\n      </>\n    );\n  },\n);\n"],"names":["Option","Select","TreeGraph","memo","cwd","summary","entryPoints","selectedEntryPoints","setEntryPoints","useState","inputModule","setModuleValue","inputAssetName","setAssetName","inputAssetSize","setAssetSize","defaultExpandAll","setDefaultExpandAll","inputModuleUnit","setModuleUnit","inputChunkUnit","setChunkUnit","assetPath","setAssetPath","showCode","codeDrawerComponent","useCodeDrawer","t","useI18n","assets","handleChange","useCallback","type","value","selectAfter","onChangeModule","debounce","newValue","count","onChangeAsset","filteredAssets","useMemo","res","e","ep","a","b","_a","_b","useEffect","getFileExtension","filePath","parts","f","ext","assetsStructures","createFileStructures","Boolean","file","basename","target","size","initial","path","content","styles","Keyword","Space","Divider","Typography","formatSize","CodeOutlined","onSearch","Row","Size","Col","name","Bdg","KeywordInput","InputNumber","Tooltip","InfoCircleOutlined","Number","SearchModal","Card","sumBy","FileTree","ServerAPIProvider","SDK","details","AssetDetail","Empty"],"mappings":"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"}
+{"version":3,"file":"pages/BundleSize/components/tree-graph.mjs","sources":["../../../../src/pages/BundleSize/components/tree-graph.tsx"],"sourcesContent":["import { CodeOutlined, InfoCircleOutlined } from '@ant-design/icons';\nimport { type Client, SDK } from '@rsdoctor/types';\nimport {\n  Card,\n  Checkbox,\n  Col,\n  Divider,\n  Empty,\n  InputNumber,\n  Row,\n  Select,\n  Space,\n  Tooltip,\n  Typography,\n} from 'antd';\nimport { debounce, sumBy } from 'es-toolkit/compat';\nimport { memo, useCallback, useEffect, useMemo, useState } from 'react';\nimport { useCodeDrawer } from 'src/components/base/CodeViewer/useCodeDrawer';\nimport { Badge as Bdg } from '../../../components/Badge';\nimport { FileTree } from '../../../components/FileTree';\nimport { KeywordInput } from '../../../components/Form/keyword';\nimport { Keyword } from '../../../components/Keyword';\nimport { ServerAPIProvider } from '../../../components/Manifest';\nimport { Size } from '../../../constants';\nimport { createFileStructures, formatSize, useI18n } from '../../../utils';\nimport { AssetDetail } from './asset';\nimport { createAssetPathMap, resolveAssetFileTitleTarget } from './asset-path';\nimport styles from './index.module.scss';\nimport './index.sass';\nimport { SearchModal } from './search-modal';\nimport { isJavaScriptAsset } from '../../../utils/assets';\n\nconst { Option } = Select;\n\nexport const TreeGraph = memo(\n  ({\n    cwd,\n    summary,\n    entryPoints,\n  }: {\n    cwd: string;\n    summary: Client.RsdoctorClientAssetsSummary;\n    entryPoints: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetEntryPoints>;\n  }) => {\n    const [selectedEntryPoints, setEntryPoints] = useState<\n      SDK.EntryPointData[]\n    >([]);\n    const [inputModule, setModuleValue] = useState(0);\n    const [inputAssetName, setAssetName] = useState('');\n    const [inputAssetSize, setAssetSize] = useState(0);\n    const [defaultExpandAll, setDefaultExpandAll] = useState(false);\n    const [inputModuleUnit, setModuleUnit] = useState('');\n    const [inputChunkUnit, setChunkUnit] = useState('');\n    const [showOnlyJavaScriptAssets, setShowOnlyJavaScriptAssets] =\n      useState(false);\n    const [assetPath, setAssetPath] = useState<string | null>(null);\n    const { showCode, codeDrawerComponent } = useCodeDrawer(\n      'Do not have the codes of assets. If you use the lite or brief mode, there will have codes.',\n    );\n\n    const { t } = useI18n();\n\n    const assets = summary.all.total.files;\n\n    const handleChange = useCallback(\n      (type: string) => (value: string) => {\n        if (type === 'module') {\n          setModuleUnit(value);\n        } else if (type === 'chunk') {\n          setChunkUnit(value);\n        }\n      },\n      [],\n    );\n\n    const selectAfter = (type: string) => (\n      <Select defaultValue=\"kb\" onChange={handleChange(type)}>\n        <Option value=\"kb\">KB</Option>\n        <Option value=\"mb\">MB</Option>\n      </Select>\n    );\n    const onChangeModule = useCallback(\n      debounce((newValue: number) => {\n        const count =\n          inputModuleUnit === 'mb' ? newValue * 1024 * 1024 : newValue * 1024;\n        setModuleValue(count);\n      }, 300),\n      [],\n    );\n\n    const onChangeAsset = useCallback(\n      debounce((newValue: number) => {\n        const count =\n          inputChunkUnit === 'mb' ? newValue * 1024 * 1024 : newValue * 1024;\n        setAssetSize(count);\n      }, 300),\n      [],\n    );\n\n    const filteredAssets = useMemo(() => {\n      let res = assets.slice();\n\n      if (inputAssetName) {\n        res = res.filter((e) => e.path.indexOf(inputAssetName) > -1);\n      }\n\n      if (showOnlyJavaScriptAssets) {\n        res = res.filter((e) => isJavaScriptAsset(e.path));\n      }\n\n      if (inputAssetSize > 0) {\n        res = res.filter((e) => e.size >= inputAssetSize);\n      }\n\n      if (selectedEntryPoints.length) {\n        res = res.filter((e) => {\n          if (selectedEntryPoints.some((ep) => ep.assets.includes(e.path))) {\n            return true;\n          }\n          return false;\n        });\n      }\n\n      return res.sort((a, b) => {\n        const _a = a.path.indexOf('/') > -1 ? 1 : 0;\n        const _b = b.path.indexOf('/') > -1 ? 1 : 0;\n        // return _a - _b;\n        return _b - _a;\n      });\n    }, [\n      assets,\n      selectedEntryPoints,\n      inputAssetName,\n      inputAssetSize,\n      showOnlyJavaScriptAssets,\n    ]);\n\n    useEffect(() => {\n      if (assetPath && filteredAssets.some((f) => f.path === assetPath)) {\n        return;\n      }\n\n      const nextAsset =\n        filteredAssets.find((f) => isJavaScriptAsset(f.path)) ??\n        filteredAssets[0];\n\n      setAssetPath(nextAsset?.path ?? null);\n    }, [assetPath, filteredAssets]);\n\n    const assetsMap = useMemo(() => {\n      return createAssetPathMap(filteredAssets);\n    }, [filteredAssets]);\n\n    const assetsStructures = useMemo(() => {\n      const res = createFileStructures({\n        files: filteredAssets.map((e) => e.path).filter(Boolean),\n        fileTitle(file, basename) {\n          const target = resolveAssetFileTitleTarget(assetsMap, file, basename);\n\n          if (typeof target === 'string') {\n            return target;\n          }\n\n          const { size, initial, path, content } = target;\n\n          return (\n            <div\n              className={styles.assetBox}\n              onClick={() => {\n                setAssetPath(path);\n              }}\n            >\n              <Keyword\n                text={basename}\n                keyword={''}\n                className={styles.fileText}\n              />\n              <Space size=\"small\" className={styles.assetsTag}>\n                <Divider type=\"vertical\" />\n                <Typography.Text style={{ color: '#4FD233' }}>\n                  {formatSize(size)}\n                </Typography.Text>\n                <Divider type=\"vertical\" />\n                {initial ? (\n                  <Typography.Text style={{ color: '#009A9E' }}>\n                    initial\n                  </Typography.Text>\n                ) : null}\n                <CodeOutlined\n                  style={{ fontSize: 14, padding: 0 }}\n                  onClick={() => showCode({ code: content!, filePath: path })}\n                />\n              </Space>\n            </div>\n          );\n        },\n      });\n      return res;\n    }, [assetsMap, filteredAssets, showCode]);\n\n    const onSearch = (value: string) => {\n      setAssetName(value);\n      setDefaultExpandAll(false);\n    };\n    return (\n      <>\n        <div className={styles.treeGraph}>\n          <Row align=\"middle\" gutter={[Size.BasePadding, Size.BasePadding]}>\n            {entryPoints && entryPoints.length ? (\n              <Col>\n                <Select\n                  mode=\"multiple\"\n                  value={selectedEntryPoints.map((e) => e.name)}\n                  style={{\n                    minWidth: 230,\n                    width: 'auto',\n                    maxWidth: 300,\n                  }}\n                  placeholder={'filter assets by entry point'}\n                  onChange={(name: string[]) => {\n                    setEntryPoints(\n                      name\n                        .map((e) => entryPoints.find((ep) => ep.name === e)!)\n                        .filter(Boolean),\n                    );\n                  }}\n                  allowClear\n                  onClear={() => {\n                    setEntryPoints([]);\n                  }}\n                >\n                  {entryPoints.map((e) => {\n                    return (\n                      <Select.Option key={e.name} value={e.name}>\n                        <Space>\n                          <Bdg\n                            label={e.name}\n                            value={formatSize(e.size)}\n                            tooltip={e.name}\n                          />\n                        </Space>\n                      </Select.Option>\n                    );\n                  })}\n                </Select>\n              </Col>\n            ) : null}\n            <Col>\n              <KeywordInput\n                placeholder=\"search asset by keyword\"\n                onChange={onSearch}\n              />\n            </Col>\n            <Col>\n              <Checkbox\n                checked={showOnlyJavaScriptAssets}\n                onChange={(e) => {\n                  setShowOnlyJavaScriptAssets(e.target.checked);\n                  setDefaultExpandAll(false);\n                }}\n              >\n                JS only\n              </Checkbox>\n            </Col>\n            <Col span={6}>\n              <InputNumber\n                min={0}\n                style={{ width: '95%' }}\n                addonBefore={\n                  <Space>\n                    <Typography.Text style={{ fontSize: 14, color: 'inherit' }}>\n                      Asset Size\n                    </Typography.Text>\n                    <Tooltip\n                      title={t(\n                        'filter the output assets which size is greater than the input value',\n                      )}\n                      style={{ marginLeft: 3 }}\n                    >\n                      <InfoCircleOutlined\n                        style={{ color: 'var(--text-color-secondary)' }}\n                      />\n                    </Tooltip>\n                  </Space>\n                }\n                onChange={(value) => onChangeAsset(Number(value))}\n                addonAfter={selectAfter('chunk')}\n              />\n            </Col>\n            <Col span={6}>\n              <InputNumber\n                min={0}\n                style={{ width: '95%' }}\n                addonBefore={\n                  <Space>\n                    <Typography.Text style={{ fontSize: 14, color: 'inherit' }}>\n                      Module Size\n                    </Typography.Text>\n                    <Tooltip\n                      title={t(\n                        'filter the modules which size is greater than the input value',\n                      )}\n                      style={{ marginLeft: 3 }}\n                    >\n                      <InfoCircleOutlined\n                        style={{ color: 'var(--text-color-secondary)' }}\n                      />\n                    </Tooltip>\n                  </Space>\n                }\n                onChange={(value) => {\n                  onChangeModule(Number(value));\n                }}\n                addonAfter={selectAfter('module')}\n              />\n            </Col>\n          </Row>\n          <Row>\n            <SearchModal />\n          </Row>\n          {filteredAssets.length ? (\n            <div className={styles.assetDetailRoot}>\n              <div className={styles.assetDetailCol}>\n                <Card\n                  className={styles.assetDetailFileTreeRoot}\n                  classNames={{\n                    body: styles.assetDetailFileTreeBody,\n                  }}\n                  title={\n                    <Space>\n                      <Typography.Text>\n                        {t('Output Assets List')}\n                      </Typography.Text>\n                      <Divider type=\"vertical\" />\n                      <Tooltip\n                        title={`total assets count is ${assets.length}, the filtered assets count is ${filteredAssets.length}`}\n                      >\n                        <Typography.Text\n                          type=\"secondary\"\n                          style={{\n                            fontSize: 12,\n                            fontWeight: 400,\n                          }}\n                        >\n                          {filteredAssets.length} / {assets.length}\n                        </Typography.Text>\n                      </Tooltip>\n                      <Divider type=\"vertical\" />\n                      <Typography.Text\n                        type=\"secondary\"\n                        style={{ fontSize: 12, fontWeight: 400 }}\n                      >\n                        {formatSize(sumBy(filteredAssets, (e) => e.size))}\n                      </Typography.Text>\n                    </Space>\n                  }\n                  size=\"small\"\n                >\n                  <div className={styles.assetDetailFileTreeViewport}>\n                    <div className={styles.assetDetailFileTreeScrollArea}>\n                      <FileTree\n                        className={styles.assets}\n                        treeData={assetsStructures}\n                        autoExpandParent\n                        defaultExpandAll={\n                          defaultExpandAll || filteredAssets.length <= 20\n                        }\n                        key={`tree_${inputAssetName}_${defaultExpandAll}`}\n                      />\n                    </div>\n                  </div>\n                </Card>\n              </div>\n              <div className={styles.assetDetailCol}>\n                {assetPath ? (\n                  <ServerAPIProvider\n                    api={SDK.ServerAPI.API.GetAssetDetails}\n                    body={{ assetPath }}\n                  >\n                    {(details) => (\n                      <AssetDetail\n                        asset={details.asset}\n                        chunks={details.chunks}\n                        modules={details.modules}\n                        moduleSizeLimit={inputModule}\n                        root={cwd}\n                      />\n                    )}\n                  </ServerAPIProvider>\n                ) : (\n                  <Card>\n                    <Empty\n                      description={\n                        <Typography.Text strong>\n                          Click the file path on the left to show the modules of\n                          the asset\n                        </Typography.Text>\n                      }\n                    />\n                  </Card>\n                )}\n              </div>\n            </div>\n          ) : (\n            <Empty />\n          )}\n        </div>\n        {codeDrawerComponent}\n      </>\n    );\n  },\n);\n"],"names":["Option","Select","TreeGraph","memo","cwd","summary","entryPoints","selectedEntryPoints","setEntryPoints","useState","inputModule","setModuleValue","inputAssetName","setAssetName","inputAssetSize","setAssetSize","defaultExpandAll","setDefaultExpandAll","inputModuleUnit","setModuleUnit","inputChunkUnit","setChunkUnit","showOnlyJavaScriptAssets","setShowOnlyJavaScriptAssets","assetPath","setAssetPath","showCode","codeDrawerComponent","useCodeDrawer","t","useI18n","assets","handleChange","useCallback","type","value","selectAfter","onChangeModule","debounce","newValue","count","onChangeAsset","filteredAssets","useMemo","res","e","isJavaScriptAsset","ep","a","b","_a","_b","useEffect","f","nextAsset","assetsMap","createAssetPathMap","assetsStructures","createFileStructures","Boolean","file","basename","target","resolveAssetFileTitleTarget","size","initial","path","content","styles","Keyword","Space","Divider","Typography","formatSize","CodeOutlined","onSearch","Row","Size","Col","name","Bdg","KeywordInput","Checkbox","InputNumber","Tooltip","InfoCircleOutlined","Number","SearchModal","Card","sumBy","FileTree","ServerAPIProvider","SDK","details","AssetDetail","Empty"],"mappings":"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"}

package/dist/pages/ModuleAnalyze/components/fileTreeCom.css

@@ -50,10 +50,14 @@
   display: inline-block;
 }
 
+.file-tree-com-titles-box {
+  border: 1px solid #0000;
+}
+
 .file-tree-com-titles-box:hover {
+  background-color: var(--color-bg-box-elevated, #f0f3f5);
+  border-color: var(--color-border, #e5e6eb);
   cursor: pointer;
-  background-color: #f0f3f5;
-  border: 1px solid #e5e6eb;
   width: 80%;
 }
 

package/dist/pages/ModuleAnalyze/components/fileTreeCom.css.map

@@ -1 +1 @@
-{"version":3,"sources":["webpack://./src/pages/ModuleAnalyze/components/fileTreeCom.scss"],"names":[],"mappings":"AAAA;EACE,SAAS;AACX;;AAFwB;EAKtB,mBAAmB;EACnB,UAAU;EACV,SAAS;EACT,UAAU;EACV,iBAAiB;EACjB,gBAAgB;AAClB;;AAXgJ;EAc9I,sBAAsB;EACtB,mBAAmB;EACnB,eAAe;EACf,YAAY;EACZ,SAAS;EACT,cAAc;EACd,qBAAqB;EACrB,qBAAqB;EACrB,kBAAkB;AACpB;;AAvBkX;EA0BhX,wBAAwB;AAC1B;;AA3B2c;EA8Bzc,aAAa;AACf;;AA/Bkf;EAkChf,cAAc;AAChB;;AAnC+hB;EAsC7hB,cAAc;EACd,mBAAmB;AACrB;;AAxC0qB;EA2CxqB,qBAAqB;EACrB,kBAAkB;AACpB;;AA7C2vB;EAgDzvB,eAAe;EACf,qBAAqB;AACvB;;AAlDozB;EAqDlzB,eAAe;EACf,yBAAyB;EACzB,yBAAyB;EACzB,UAAU;AACZ;;AAzD+5B;EA4D75B,cAAc;AAChB;;AA7Dm+B;EAgEj+B,gBAAgB;AAClB;;AAjE0hC;EAoExhC,sBAAsB;EACtB,SAAS;EACT,qBAAqB;AACvB;;AAvEomC;EA0ElmC,WAAW;EACX,qBAAqB;AACvB;;AA5E+pC;EA+E7pC,yBAAyB;EACzB,oBAAoB;AACtB;;AAjF8uC;EAoF5uC,wBAAwB;AAC1B;;AArFuyC;EAwFryC,2BAA2B;AAC7B;;AAzFg4C;EA4F93C,sBAAsB;EACtB,aAAa;AACf;;AA9Fu/C;EAiGr/C,eAAe;EACf,iBAAiB;EACjB,aAAa;AACf;;AApGkpD;EAuGhpD,eAAe;AACjB;;AAxGw5D;EA2Gt5D,sBAAsB;AACxB;;AA5G+gE;EA+G7gE,oBAAoB;AACtB;;AAhH+nE;EAmH7nE,eAAe;EACf,cAAc;AAChB;;AArH6vE;EAwH3vE,sBAAsB;EACtB,SAAS;EACT,qBAAqB;AACvB;;AA3Hi0E;EA8H/zE,WAAW;EACX,qBAAqB;AACvB","sourcesContent":[".file-tree-com{margin:0}.file-tree-com .file-tree-com-treenode{margin:0;padding:0;line-height:24px;white-space:nowrap;list-style:none;outline:0}.file-tree-com .file-tree-com-treenode .file-tree-com-node-content-wrapper{position:relative;display:inline-block;height:24px;margin:0;padding:0 4px;box-sizing:border-box;text-decoration:none;vertical-align:top;cursor:pointer}.file-tree-com .file-tree-com-treenode .file-tree-com-arrow-icon{transform:rotate(90deg)}.file-tree-com-child-tree{display:none}.file-tree-com-child-tree-open{display:block}.file-tree-com-treenode-disabled>span:not(.file-tree-com-switcher),.file-tree-com>a,.file-tree-com>a span{color:#767676;cursor:not-allowed}.file-tree-com-treenode-selected{background:rgba(5,145,255,.3);border-radius:4px}.file-tree-com-title{display:inline-block;cursor:pointer}.file-tree-com-titles-box:hover{background-color:#f0f3f5;border:1px solid #e5e6eb;cursor:pointer;width:80%}.file-tree-com-titles-box:hover .ant-typography:hover{color:#0079ff}.file-tree-com-node-title .file-icon{padding:4px 0 0 0}.file-tree-com-indent{display:inline-block;height:0;vertical-align:bottom}.file-tree-com-indent-unit{display:inline-block;width:14px}.file-tree-switcher-arrow{transform:rotate(0deg);transition:transform .3s ease}.file-tree-switcher-arrow-expand{transform:rotate(90deg)}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child){border-left:1px solid #eee}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) .file-tree-com-titles{display:flex;flex-direction:column}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) .file-tree-com-titles .file-tree-com-node-title{display:flex;cursor:pointer;line-height:30px}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) .file-tree-com-titles .file-tree-com-node-title img{cursor:pointer}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) .file-tree-com-titles .file-tree-com-node-title img-tag{cursor:pointer}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) .file-tree-com-node-title-selected{background-color:#ff0}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) .file-tree-com-node-title-tag{margin-inline-end:0}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) .file-tree-com-node-title-code-tag{cursor:pointer;padding:0 2px}.rc-tree-indent{display:inline-block;height:0;vertical-align:bottom}.rc-tree-indent-unit{display:inline-block;width:14px}"],"sourceRoot":""}
+{"version":3,"sources":["webpack://./src/pages/ModuleAnalyze/components/fileTreeCom.scss"],"names":[],"mappings":"AAAA;EACE,SAAS;AACX;;AAFwB;EAKtB,mBAAmB;EACnB,UAAU;EACV,SAAS;EACT,UAAU;EACV,iBAAiB;EACjB,gBAAgB;AAClB;;AAXgJ;EAc9I,sBAAsB;EACtB,mBAAmB;EACnB,eAAe;EACf,YAAY;EACZ,SAAS;EACT,cAAc;EACd,qBAAqB;EACrB,qBAAqB;EACrB,kBAAkB;AACpB;;AAvBkX;EA0BhX,wBAAwB;AAC1B;;AA3B2c;EA8Bzc,aAAa;AACf;;AA/Bkf;EAkChf,cAAc;AAChB;;AAnC+hB;EAsC7hB,cAAc;EACd,mBAAmB;AACrB;;AAxC0qB;EA2CxqB,qBAAqB;EACrB,kBAAkB;AACpB;;AA7C2vB;EAgDzvB,eAAe;EACf,qBAAqB;AACvB;;AAlDozB;EAqDlzB,uBAAuB;AACzB;;AAtD64B;EAyD34B,uDAAuD;EACvD,0CAA0C;EAC1C,eAAe;EACf,UAAU;AACZ;;AA7DuiC;EAgEriC,cAAc;AAChB;;AAjE2mC;EAoEzmC,gBAAgB;AAClB;;AArEkqC;EAwEhqC,sBAAsB;EACtB,SAAS;EACT,qBAAqB;AACvB;;AA3E4uC;EA8E1uC,WAAW;EACX,qBAAqB;AACvB;;AAhFuyC;EAmFryC,yBAAyB;EACzB,oBAAoB;AACtB;;AArFs3C;EAwFp3C,wBAAwB;AAC1B;;AAzF+6C;EA4F76C,2BAA2B;AAC7B;;AA7FwgD;EAgGtgD,sBAAsB;EACtB,aAAa;AACf;;AAlG+nD;EAqG7nD,eAAe;EACf,iBAAiB;EACjB,aAAa;AACf;;AAxG0xD;EA2GxxD,eAAe;AACjB;;AA5GgiE;EA+G9hE,sBAAsB;AACxB;;AAhHupE;EAmHrpE,oBAAoB;AACtB;;AApHuwE;EAuHrwE,eAAe;EACf,cAAc;AAChB;;AAzHq4E;EA4Hn4E,sBAAsB;EACtB,SAAS;EACT,qBAAqB;AACvB;;AA/Hy8E;EAkIv8E,WAAW;EACX,qBAAqB;AACvB","sourcesContent":[".file-tree-com{margin:0}.file-tree-com .file-tree-com-treenode{margin:0;padding:0;line-height:24px;white-space:nowrap;list-style:none;outline:0}.file-tree-com .file-tree-com-treenode .file-tree-com-node-content-wrapper{position:relative;display:inline-block;height:24px;margin:0;padding:0 4px;box-sizing:border-box;text-decoration:none;vertical-align:top;cursor:pointer}.file-tree-com .file-tree-com-treenode .file-tree-com-arrow-icon{transform:rotate(90deg)}.file-tree-com-child-tree{display:none}.file-tree-com-child-tree-open{display:block}.file-tree-com-treenode-disabled>span:not(.file-tree-com-switcher),.file-tree-com>a,.file-tree-com>a span{color:#767676;cursor:not-allowed}.file-tree-com-treenode-selected{background:rgba(5,145,255,.3);border-radius:4px}.file-tree-com-title{display:inline-block;cursor:pointer}.file-tree-com-titles-box{border-width:1px;border-style:solid;border-color:rgba(0,0,0,0)}.file-tree-com-titles-box:hover{background-color:var(--color-bg-box-elevated, #f0f3f5);border-color:var(--color-border, #e5e6eb);cursor:pointer;width:80%}.file-tree-com-titles-box:hover .ant-typography:hover{color:#0079ff}.file-tree-com-node-title .file-icon{padding:4px 0 0 0}.file-tree-com-indent{display:inline-block;height:0;vertical-align:bottom}.file-tree-com-indent-unit{display:inline-block;width:14px}.file-tree-switcher-arrow{transform:rotate(0deg);transition:transform .3s ease}.file-tree-switcher-arrow-expand{transform:rotate(90deg)}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child){border-left:1px solid #eee}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) .file-tree-com-titles{display:flex;flex-direction:column}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) .file-tree-com-titles .file-tree-com-node-title{display:flex;cursor:pointer;line-height:30px}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) .file-tree-com-titles .file-tree-com-node-title img{cursor:pointer}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) .file-tree-com-titles .file-tree-com-node-title img-tag{cursor:pointer}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) .file-tree-com-node-title-selected{background-color:#ff0}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) .file-tree-com-node-title-tag{margin-inline-end:0}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) .file-tree-com-node-title-code-tag{cursor:pointer;padding:0 2px}.rc-tree-indent{display:inline-block;height:0;vertical-align:bottom}.rc-tree-indent-unit{display:inline-block;width:14px}"],"sourceRoot":""}

package/dist/pages/ModuleAnalyze/index.css

@@ -17,16 +17,15 @@
 }
 
 .module-analyze-bailout-card {
+  border: 1px solid var(--color-border-secondary);
   box-shadow: none;
-  background: #fff;
-  border: 1px solid #0505050f;
+  background: var(--color-bg-box-elevated);
   border-radius: 8px;
   margin-top: 16px;
   margin-bottom: 24px;
 }
 
 .module-analyze-bailout-card-title {
-  color: #1c1f23cc;
   margin-bottom: 12px;
   font-size: 14px;
   font-weight: 600;
@@ -40,7 +39,7 @@
 }
 
 .module-analyze-bailout-card-item {
-  border-bottom: 1px solid #161a2314;
+  border-bottom: 1px solid var(--color-border);
   justify-content: space-between;
   align-items: center;
   padding: 6px 0;
@@ -52,14 +51,13 @@
 }
 
 .module-analyze-bailout-card-text {
-  color: #1c1f23cc;
   max-width: calc(100% - 70px);
   font-size: 12px;
   font-weight: 400;
 }
 
 .module-analyze-bailout-card-meta {
-  color: #1c1f2373;
+  color: var(--text-color-secondary);
   font-size: 12px;
 }
 

package/dist/pages/ModuleAnalyze/index.css.map

@@ -1 +1 @@
-{"version":3,"sources":["webpack://./src/pages/ModuleAnalyze/index.scss"],"names":[],"mappings":"AAAA;EACE,aAAa;EACb,gBAAgB;AAClB;;AAHuD;EAMrD,eAAe;AACjB;;AAPsH;EAUpH,sBAAsB;EACtB,aAAa;AACf;;AAZ6K;EAe3K,iBAAiB;AACnB;;AAhBwN;EAmBtN,gBAAgB;EAChB,gBAAgB;EAChB,2BAA2B;EAC3B,kBAAkB;EAClB,gBAAgB;EAChB,mBAAmB;AACrB;;AAzB2W;EA4BzW,gBAAgB;EAChB,mBAAmB;EACnB,eAAe;EACf,gBAAgB;EAChB,qBAAqB;AACvB;;AAjC6e;EAoC3e,sBAAsB;EACtB,QAAQ;EACR,aAAa;AACf;;AAvC0jB;EA0CxjB,kCAAkC;EAClC,8BAA8B;EAC9B,mBAAmB;EACnB,cAAc;EACd,aAAa;AACf;;AA/CmtB;EAkDjtB,mBAAmB;AACrB;;AAnDmxB;EAsDjxB,gBAAgB;EAChB,4BAA4B;EAC5B,eAAe;EACf,gBAAgB;AAClB;;AA1Dw4B;EA6Dt4B,gBAAgB;EAChB,eAAe;AACjB","sourcesContent":[".module-analyze-file-tree{width:\"100%\";min-height:50em}.module-analyze-file-tree .module-analyze-empty{margin-top:20%}.module-analyze-box{display:flex;flex-direction:column}.file-tree-com-titles-box{line-height:30px}.module-analyze-bailout-card{margin-top:16px;border-radius:8px;border:1px solid rgba(5,5,5,.06);box-shadow:none;background:#fff;margin-bottom:24px}.module-analyze-bailout-card-title{display:inline-block;font-size:14px;margin-bottom:12px;color:rgba(28,31,35,.8);font-weight:600}.module-analyze-bailout-card-list{display:flex;flex-direction:column;gap:8px}.module-analyze-bailout-card-item{display:flex;align-items:center;justify-content:space-between;padding:6px 0;border-bottom:1px solid rgba(22,26,35,.08)}.module-analyze-bailout-card-item:last-child{border-bottom:none}.module-analyze-bailout-card-text{max-width:calc(100% - 70px);font-weight:400;font-size:12px;color:rgba(28,31,35,.8)}.module-analyze-bailout-card-meta{font-size:12px;color:rgba(28,31,35,.45)}"],"sourceRoot":""}
+{"version":3,"sources":["webpack://./src/pages/ModuleAnalyze/index.scss"],"names":[],"mappings":"AAAA;EACE,aAAa;EACb,gBAAgB;AAClB;;AAHuD;EAMrD,eAAe;AACjB;;AAPsH;EAUpH,sBAAsB;EACtB,aAAa;AACf;;AAZ6K;EAe3K,iBAAiB;AACnB;;AAhBwN;EAmBtN,+CAA+C;EAC/C,gBAAgB;EAChB,wCAAwC;EACxC,kBAAkB;EAClB,gBAAgB;EAChB,mBAAmB;AACrB;;AAzBiZ;EA4B/Y,mBAAmB;EACnB,eAAe;EACf,gBAAgB;EAChB,qBAAqB;AACvB;;AAhC2f;EAmCzf,sBAAsB;EACtB,QAAQ;EACR,aAAa;AACf;;AAtCwkB;EAyCtkB,4CAA4C;EAC5C,8BAA8B;EAC9B,mBAAmB;EACnB,cAAc;EACd,aAAa;AACf;;AA9CkuB;EAiDhuB,mBAAmB;AACrB;;AAlDkyB;EAqDhyB,4BAA4B;EAC5B,eAAe;EACf,gBAAgB;AAClB;;AAxD+3B;EA2D73B,kCAAkC;EAClC,eAAe;AACjB","sourcesContent":[".module-analyze-file-tree{width:\"100%\";min-height:50em}.module-analyze-file-tree .module-analyze-empty{margin-top:20%}.module-analyze-box{display:flex;flex-direction:column}.file-tree-com-titles-box{line-height:30px}.module-analyze-bailout-card{margin-top:16px;border-radius:8px;border:1px solid var(--color-border-secondary);box-shadow:none;background:var(--color-bg-box-elevated);margin-bottom:24px}.module-analyze-bailout-card-title{display:inline-block;font-size:14px;margin-bottom:12px;font-weight:600}.module-analyze-bailout-card-list{display:flex;flex-direction:column;gap:8px}.module-analyze-bailout-card-item{display:flex;align-items:center;justify-content:space-between;padding:6px 0;border-bottom:1px solid var(--color-border)}.module-analyze-bailout-card-item:last-child{border-bottom:none}.module-analyze-bailout-card-text{max-width:calc(100% - 70px);font-weight:400;font-size:12px}.module-analyze-bailout-card-meta{font-size:12px;color:var(--text-color-secondary)}"],"sourceRoot":""}

package/dist/pages/ModuleAnalyze/index.mjs

@@ -40,9 +40,9 @@ const ModuleAnalyzeComponent = ({ modules, cwd, moduleId, show, setShow })=>{
                             children: getShortPath(module.path)
                         }),
                         /*#__PURE__*/ jsx(Typography.Text, {
+                            type: "secondary",
                             style: {
-                                fontSize: 12,
-                                color: 'rgba(0, 0, 0, 0.45)'
+                                fontSize: 12
                             },
                             children: `Current Module: ${module.path}`
                         })
@@ -95,8 +95,7 @@ const ModuleAnalyzeComponent = ({ modules, cwd, moduleId, show, setShow })=>{
                                                         }),
                                                         /*#__PURE__*/ jsx(Typography.Text, {
                                                             style: {
-                                                                fontSize: 14,
-                                                                color: 'rgba(28, 31, 35, 0.8)'
+                                                                fontSize: 14
                                                             },
                                                             children: "Current Module Imported Reasons Tree"
                                                         }),

package/dist/pages/ModuleAnalyze/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"pages/ModuleAnalyze/index.mjs","sources":["../../../src/pages/ModuleAnalyze/index.tsx"],"sourcesContent":["import { SDK } from '@rsdoctor/types';\nimport { Badge, Card, Drawer, Popover, Space, Tabs, Typography } from 'antd';\nimport React, { useState } from 'react';\nimport { ServerAPIProvider } from 'src/components/Manifest';\nimport { getShortPath } from 'src/utils';\nimport { ModuleGraphListContext } from '../BundleSize/config';\nimport { ModuleFilesTree, BailoutReasonCard } from './fileTree';\nimport './index.scss';\nimport { drawerWidth } from '../../constants';\nimport {\n  LeftSquareOutlined,\n  QuestionCircleOutlined,\n  RightSquareTwoTone,\n} from '@ant-design/icons';\n\nexport enum TabList {\n  Reasons,\n  Dependencies,\n}\n\nconst tabslist = [\n  {\n    key: TabList[TabList.Reasons],\n    label: TabList[TabList.Reasons],\n  },\n  {\n    key: TabList[TabList.Dependencies],\n    label: TabList[TabList.Dependencies],\n  },\n] as unknown as { key: string; label: string }[];\n\nexport const ModuleAnalyzeComponent: React.FC<{\n  modules: SDK.ModuleData[];\n  cwd: string;\n  moduleId: string | number;\n  show: boolean;\n  setShow: (arg: boolean) => void;\n}> = ({ modules, cwd, moduleId, show, setShow }) => {\n  const [selectedChunk, _setSelectedChunk] = useState('' as string);\n  const [activeTabKey, setActiveTabKey] = useState(TabList[TabList.Reasons]);\n\n  return (\n    <ServerAPIProvider\n      api={SDK.ServerAPI.API.GetModuleDetails}\n      body={{ moduleId: +moduleId }}\n    >\n      {({ module, dependencies, sideEffectCodes }) => {\n        return (\n          <Drawer\n            title={\n              <div className=\"module-analyze-box\">\n                <Typography.Text>{getShortPath(module.path)}</Typography.Text>\n                <Typography.Text\n                  style={{ fontSize: 12, color: 'rgba(0, 0, 0, 0.45)' }}\n                >\n                  {`Current Module: ${module.path}`}\n                </Typography.Text>\n              </div>\n            }\n            open={show}\n            maskClosable\n            width={drawerWidth * 0.8}\n            onClose={() => setShow(false)}\n          >\n            <ServerAPIProvider\n              api={SDK.ServerAPI.API.GetAllChunkGraph}\n              body={{}}\n            >\n              {(_chunks) => {\n                return (\n                  <ModuleGraphListContext.Consumer>\n                    {({ moduleJumpList, setModuleJumpList }) => {\n                      return (\n                        <Tabs\n                          defaultActiveKey=\"bailout\"\n                          items={[\n                            {\n                              key: 'moduleTree',\n                              label: 'Module Tree',\n                              children: (\n                                <Card\n                                  style={{ minHeight: 400 }}\n                                  tabList={tabslist}\n                                  activeTabKey={activeTabKey}\n                                  tabProps={{\n                                    size: 'small',\n                                    style: {\n                                      fontSize: 12,\n                                    },\n                                  }}\n                                  onTabChange={(k) => setActiveTabKey(k)}\n                                  styles={{\n                                    title: { paddingTop: 0 },\n                                  }}\n                                  title={\n                                    <Space style={{ padding: '10px 0px' }}>\n                                      <LeftSquareOutlined\n                                        onClick={() => {\n                                          const _list = [\n                                            ...moduleJumpList.slice(0, -1),\n                                          ];\n                                          setModuleJumpList(_list);\n                                        }}\n                                      />\n                                      <Typography.Text\n                                        style={{\n                                          fontSize: 14,\n                                          color: 'rgba(28, 31, 35, 0.8)',\n                                        }}\n                                      >\n                                        Current Module Imported Reasons Tree\n                                      </Typography.Text>\n                                      <Popover\n                                        content={\n                                          <div>\n                                            <div>\n                                              <Badge\n                                                status=\"success\"\n                                                text=\" \"\n                                              />\n                                              <RightSquareTwoTone />\n                                              <Typography.Text>\n                                                {\n                                                  ': Jump button, click to jump to the Module dependency analysis page of this module.'\n                                                }\n                                              </Typography.Text>\n                                            </div>\n                                          </div>\n                                        }\n                                        title=\"Usage\"\n                                      >\n                                        <QuestionCircleOutlined />\n                                      </Popover>\n                                    </Space>\n                                  }\n                                >\n                                  <ModuleFilesTree\n                                    curModule={module}\n                                    modules={modules}\n                                    dependencies={dependencies}\n                                    cwd={cwd}\n                                    selectedChunk={selectedChunk}\n                                    activeTabKey={activeTabKey}\n                                  />\n                                </Card>\n                              ),\n                            },\n                            {\n                              key: 'bailout',\n                              label: 'Bailout',\n                              children: (\n                                <div style={{ marginTop: 16 }}>\n                                  <BailoutReasonCard\n                                    reasons={module.bailoutReason}\n                                    sideEffectCodes={sideEffectCodes}\n                                    modulePath={module.path}\n                                  />\n                                </div>\n                              ),\n                            },\n                          ]}\n                        />\n                      );\n                    }}\n                  </ModuleGraphListContext.Consumer>\n                );\n              }}\n            </ServerAPIProvider>\n          </Drawer>\n        );\n      }}\n    </ServerAPIProvider>\n  );\n};\n"],"names":["TabList","tabslist","ModuleAnalyzeComponent","modules","cwd","moduleId","show","setShow","selectedChunk","_setSelectedChunk","useState","activeTabKey","setActiveTabKey","ServerAPIProvider","SDK","module","dependencies","sideEffectCodes","Drawer","Typography","getShortPath","drawerWidth","_chunks","ModuleGraphListContext","moduleJumpList","setModuleJumpList","Tabs","Card","k","Space","LeftSquareOutlined","_list","Popover","Badge","RightSquareTwoTone","QuestionCircleOutlined","ModuleFilesTree","BailoutReasonCard"],"mappings":"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"}
+{"version":3,"file":"pages/ModuleAnalyze/index.mjs","sources":["../../../src/pages/ModuleAnalyze/index.tsx"],"sourcesContent":["import { SDK } from '@rsdoctor/types';\nimport { Badge, Card, Drawer, Popover, Space, Tabs, Typography } from 'antd';\nimport React, { useState } from 'react';\nimport { ServerAPIProvider } from 'src/components/Manifest';\nimport { getShortPath } from 'src/utils';\nimport { ModuleGraphListContext } from '../BundleSize/config';\nimport { ModuleFilesTree, BailoutReasonCard } from './fileTree';\nimport './index.scss';\nimport { drawerWidth } from '../../constants';\nimport {\n  LeftSquareOutlined,\n  QuestionCircleOutlined,\n  RightSquareTwoTone,\n} from '@ant-design/icons';\n\nexport enum TabList {\n  Reasons,\n  Dependencies,\n}\n\nconst tabslist = [\n  {\n    key: TabList[TabList.Reasons],\n    label: TabList[TabList.Reasons],\n  },\n  {\n    key: TabList[TabList.Dependencies],\n    label: TabList[TabList.Dependencies],\n  },\n] as unknown as { key: string; label: string }[];\n\nexport const ModuleAnalyzeComponent: React.FC<{\n  modules: SDK.ModuleData[];\n  cwd: string;\n  moduleId: string | number;\n  show: boolean;\n  setShow: (arg: boolean) => void;\n}> = ({ modules, cwd, moduleId, show, setShow }) => {\n  const [selectedChunk, _setSelectedChunk] = useState('' as string);\n  const [activeTabKey, setActiveTabKey] = useState(TabList[TabList.Reasons]);\n\n  return (\n    <ServerAPIProvider\n      api={SDK.ServerAPI.API.GetModuleDetails}\n      body={{ moduleId: +moduleId }}\n    >\n      {({ module, dependencies, sideEffectCodes }) => {\n        return (\n          <Drawer\n            title={\n              <div className=\"module-analyze-box\">\n                <Typography.Text>{getShortPath(module.path)}</Typography.Text>\n                <Typography.Text type=\"secondary\" style={{ fontSize: 12 }}>\n                  {`Current Module: ${module.path}`}\n                </Typography.Text>\n              </div>\n            }\n            open={show}\n            maskClosable\n            width={drawerWidth * 0.8}\n            onClose={() => setShow(false)}\n          >\n            <ServerAPIProvider\n              api={SDK.ServerAPI.API.GetAllChunkGraph}\n              body={{}}\n            >\n              {(_chunks) => {\n                return (\n                  <ModuleGraphListContext.Consumer>\n                    {({ moduleJumpList, setModuleJumpList }) => {\n                      return (\n                        <Tabs\n                          defaultActiveKey=\"bailout\"\n                          items={[\n                            {\n                              key: 'moduleTree',\n                              label: 'Module Tree',\n                              children: (\n                                <Card\n                                  style={{ minHeight: 400 }}\n                                  tabList={tabslist}\n                                  activeTabKey={activeTabKey}\n                                  tabProps={{\n                                    size: 'small',\n                                    style: {\n                                      fontSize: 12,\n                                    },\n                                  }}\n                                  onTabChange={(k) => setActiveTabKey(k)}\n                                  styles={{\n                                    title: { paddingTop: 0 },\n                                  }}\n                                  title={\n                                    <Space style={{ padding: '10px 0px' }}>\n                                      <LeftSquareOutlined\n                                        onClick={() => {\n                                          const _list = [\n                                            ...moduleJumpList.slice(0, -1),\n                                          ];\n                                          setModuleJumpList(_list);\n                                        }}\n                                      />\n                                      <Typography.Text style={{ fontSize: 14 }}>\n                                        Current Module Imported Reasons Tree\n                                      </Typography.Text>\n                                      <Popover\n                                        content={\n                                          <div>\n                                            <div>\n                                              <Badge\n                                                status=\"success\"\n                                                text=\" \"\n                                              />\n                                              <RightSquareTwoTone />\n                                              <Typography.Text>\n                                                {\n                                                  ': Jump button, click to jump to the Module dependency analysis page of this module.'\n                                                }\n                                              </Typography.Text>\n                                            </div>\n                                          </div>\n                                        }\n                                        title=\"Usage\"\n                                      >\n                                        <QuestionCircleOutlined />\n                                      </Popover>\n                                    </Space>\n                                  }\n                                >\n                                  <ModuleFilesTree\n                                    curModule={module}\n                                    modules={modules}\n                                    dependencies={dependencies}\n                                    cwd={cwd}\n                                    selectedChunk={selectedChunk}\n                                    activeTabKey={activeTabKey}\n                                  />\n                                </Card>\n                              ),\n                            },\n                            {\n                              key: 'bailout',\n                              label: 'Bailout',\n                              children: (\n                                <div style={{ marginTop: 16 }}>\n                                  <BailoutReasonCard\n                                    reasons={module.bailoutReason}\n                                    sideEffectCodes={sideEffectCodes}\n                                    modulePath={module.path}\n                                  />\n                                </div>\n                              ),\n                            },\n                          ]}\n                        />\n                      );\n                    }}\n                  </ModuleGraphListContext.Consumer>\n                );\n              }}\n            </ServerAPIProvider>\n          </Drawer>\n        );\n      }}\n    </ServerAPIProvider>\n  );\n};\n"],"names":["TabList","tabslist","ModuleAnalyzeComponent","modules","cwd","moduleId","show","setShow","selectedChunk","_setSelectedChunk","useState","activeTabKey","setActiveTabKey","ServerAPIProvider","SDK","module","dependencies","sideEffectCodes","Drawer","Typography","getShortPath","drawerWidth","_chunks","ModuleGraphListContext","moduleJumpList","setModuleJumpList","Tabs","Card","k","Space","LeftSquareOutlined","_list","Popover","Badge","RightSquareTwoTone","QuestionCircleOutlined","ModuleFilesTree","BailoutReasonCard"],"mappings":";;;;;;;;;;;AAeO,IAAKA,wBAAOA,WAAAA,GAAAA,SAAPA,OAAO;;;WAAPA;;AAKZ,MAAMC,WAAW;IACf;QACE,KAAKD,qBAAO,CAAC,EAAgB;QAC7B,OAAOA,qBAAO,CAAC,EAAgB;IACjC;IACA;QACE,KAAKA,qBAAO,CAAC,EAAqB;QAClC,OAAOA,qBAAO,CAAC,EAAqB;IACtC;CACD;AAEM,MAAME,yBAMR,CAAC,EAAEC,OAAO,EAAEC,GAAG,EAAEC,QAAQ,EAAEC,IAAI,EAAEC,OAAO,EAAE;IAC7C,MAAM,CAACC,eAAeC,kBAAkB,GAAGC,SAAS;IACpD,MAAM,CAACC,cAAcC,gBAAgB,GAAGF,SAASV,qBAAO,CAAC,EAAgB;IAEzE,OAAO,WAAP,GACE,IAACa,mBAAiBA;QAChB,KAAKC,IAAI,SAAS,CAAC,GAAG,CAAC,gBAAgB;QACvC,MAAM;YAAE,UAAU,CAACT;QAAS;kBAE3B,CAAC,EAAEU,MAAM,EAAEC,YAAY,EAAEC,eAAe,EAAE,GAClC,WAAP,GACE,IAACC,QAAMA;gBACL,qBACE,KAAC;oBAAI,WAAU;;sCACb,IAACC,WAAW,IAAI;sCAAEC,aAAaL,OAAO,IAAI;;sCAC1C,IAACI,WAAW,IAAI;4BAAC,MAAK;4BAAY,OAAO;gCAAE,UAAU;4BAAG;sCACrD,CAAC,gBAAgB,EAAEJ,OAAO,IAAI,EAAE;;;;gBAIvC,MAAMT;gBACN,cAAY;gBACZ,OAAOe,AAAc,MAAdA;gBACP,SAAS,IAAMd,QAAQ;0BAEvB,kBAACM,mBAAiBA;oBAChB,KAAKC,IAAI,SAAS,CAAC,GAAG,CAAC,gBAAgB;oBACvC,MAAM,CAAC;8BAEN,CAACQ,UACO,WAAP,GACE,IAACC,uBAAuB,QAAQ;sCAC7B,CAAC,EAAEC,cAAc,EAAEC,iBAAiB,EAAE,GAC9B,WAAP,GACE,IAACC,MAAIA;oCACH,kBAAiB;oCACjB,OAAO;wCACL;4CACE,KAAK;4CACL,OAAO;4CACP,UAAU,WAAV,GACE,IAACC,MAAIA;gDACH,OAAO;oDAAE,WAAW;gDAAI;gDACxB,SAAS1B;gDACT,cAAcU;gDACd,UAAU;oDACR,MAAM;oDACN,OAAO;wDACL,UAAU;oDACZ;gDACF;gDACA,aAAa,CAACiB,IAAMhB,gBAAgBgB;gDACpC,QAAQ;oDACN,OAAO;wDAAE,YAAY;oDAAE;gDACzB;gDACA,qBACE,KAACC,OAAKA;oDAAC,OAAO;wDAAE,SAAS;oDAAW;;sEAClC,IAACC,oBAAkBA;4DACjB,SAAS;gEACP,MAAMC,QAAQ;uEACTP,eAAe,KAAK,CAAC,GAAG;iEAC5B;gEACDC,kBAAkBM;4DACpB;;sEAEF,IAACZ,WAAW,IAAI;4DAAC,OAAO;gEAAE,UAAU;4DAAG;sEAAG;;sEAG1C,IAACa,SAAOA;4DACN,uBACE,IAAC;0EACC,mBAAC;;sFACC,IAACC,OAAKA;4EACJ,QAAO;4EACP,MAAK;;sFAEP,IAACC,oBAAkBA,CAAAA;sFACnB,IAACf,WAAW,IAAI;sFAEZ;;;;;4DAMV,OAAM;sEAEN,kBAACgB,wBAAsBA,CAAAA;;;;0DAK7B,kBAACC,iBAAeA;oDACd,WAAWrB;oDACX,SAASZ;oDACT,cAAca;oDACd,KAAKZ;oDACL,eAAeI;oDACf,cAAcG;;;wCAItB;wCACA;4CACE,KAAK;4CACL,OAAO;4CACP,UAAU,WAAV,GACE,IAAC;gDAAI,OAAO;oDAAE,WAAW;gDAAG;0DAC1B,kBAAC0B,mBAAiBA;oDAChB,SAAStB,OAAO,aAAa;oDAC7B,iBAAiBE;oDACjB,YAAYF,OAAO,IAAI;;;wCAI/B;qCACD;;;;;;AAa3B"}

package/dist/pages/WebpackLoaders/Analysis/index.mjs

@@ -3,13 +3,13 @@ import "react";
 import { LoaderAnalysis } from "../../../components/Loader/Analysis/index.mjs";
 import { WebpackConfigurationViewer } from "../../../components/Configuration/index.mjs";
 import { Card } from "../../../components/Card/index.mjs";
-import { Popover, Space, Tag, Typography, theme } from "antd";
+import { Popover, Space, Tag, Typography } from "antd";
 import { ExclamationCircleOutlined } from "@ant-design/icons";
 import { t } from "i18next";
+import { useThemeToken } from "../../../utils/index.mjs";
 export * from "./constants.mjs";
-const { useToken: useToken } = theme;
 const Page = ()=>{
-    const { token } = useToken();
+    const token = useThemeToken();
     return /*#__PURE__*/ jsx(Card, {
         title: /*#__PURE__*/ jsxs(Space, {
             align: "baseline",

package/dist/pages/WebpackLoaders/Analysis/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"pages/WebpackLoaders/Analysis/index.mjs","sources":["../../../../src/pages/WebpackLoaders/Analysis/index.tsx"],"sourcesContent":["import React from 'react';\nimport { LoaderAnalysis } from '../../../components/Loader/Analysis';\nimport { WebpackConfigurationViewer } from '../../../components/Configuration';\nimport { Card } from '../../../components/Card';\nimport { Popover, Space, Tag, theme, Typography } from 'antd';\nimport { ExclamationCircleOutlined } from '@ant-design/icons';\nimport { t } from 'i18next';\nconst { useToken } = theme;\n\nexport const Page: React.FC = () => {\n  const { token } = useToken();\n\n  return (\n    <Card\n      title={\n        <Space align=\"baseline\">\n          <Typography.Title level={5} style={{ margin: 0 }}>\n            Loader Analysis\n          </Typography.Title>\n          <Popover\n            content={\n              <div>\n                {t('AsyncLoaderInfo')}\n                <a\n                  href=\"https://rsdoctor.rs/guide/more/faq#cssextractrspackplugin-%E7%9A%84-loader-%E8%80%97%E6%97%B6%E8%BF%87%E9%95%BF%E9%97%AE%E9%A2%98\"\n                  target=\"_blank\"\n                  rel=\"noreferrer\"\n                >\n                  {t('Details')}\n                </a>\n              </div>\n            }\n            title=\"Info\"\n          >\n            <Tag icon={<ExclamationCircleOutlined />} color=\"warning\">\n              Info\n            </Tag>\n          </Popover>\n        </Space>\n      }\n      extra={<WebpackConfigurationViewer defaultKeys={['module', 'resolve']} />}\n      bodyStyle={{ paddingTop: token.padding, height: 800 }}\n    >\n      <LoaderAnalysis />\n    </Card>\n  );\n};\n\nexport * from './constants';\n"],"names":["useToken","theme","Page","token","Card","Space","Typography","Popover","t","Tag","ExclamationCircleOutlined","WebpackConfigurationViewer","LoaderAnalysis"],"mappings":";;;;;;;;;AAOA,MAAM,EAAEA,UAAAA,QAAQ,EAAE,GAAGC;AAEd,MAAMC,OAAiB;IAC5B,MAAM,EAAEC,KAAK,EAAE,GAAGH;IAElB,OAAO,WAAP,GACE,IAACI,MAAIA;QACH,qBACE,KAACC,OAAKA;YAAC,OAAM;;8BACX,IAACC,WAAW,KAAK;oBAAC,OAAO;oBAAG,OAAO;wBAAE,QAAQ;oBAAE;8BAAG;;8BAGlD,IAACC,SAAOA;oBACN,uBACE,KAAC;;4BACEC,EAAE;0CACH,IAAC;gCACC,MAAK;gCACL,QAAO;gCACP,KAAI;0CAEHA,EAAE;;;;oBAIT,OAAM;8BAEN,kBAACC,KAAGA;wBAAC,oBAAM,IAACC,2BAAyBA,CAAAA;wBAAK,OAAM;kCAAU;;;;;QAMhE,qBAAO,IAACC,4BAA0BA;YAAC,aAAa;gBAAC;gBAAU;aAAU;;QACrE,WAAW;YAAE,YAAYR,MAAM,OAAO;YAAE,QAAQ;QAAI;kBAEpD,kBAACS,gBAAcA,CAAAA;;AAGrB"}
+{"version":3,"file":"pages/WebpackLoaders/Analysis/index.mjs","sources":["../../../../src/pages/WebpackLoaders/Analysis/index.tsx"],"sourcesContent":["import React from 'react';\nimport { LoaderAnalysis } from '../../../components/Loader/Analysis';\nimport { WebpackConfigurationViewer } from '../../../components/Configuration';\nimport { Card } from '../../../components/Card';\nimport { Popover, Space, Tag, Typography } from 'antd';\nimport { ExclamationCircleOutlined } from '@ant-design/icons';\nimport { t } from 'i18next';\nimport { useThemeToken } from 'src/utils';\n\nexport const Page: React.FC = () => {\n  const token = useThemeToken();\n\n  return (\n    <Card\n      title={\n        <Space align=\"baseline\">\n          <Typography.Title level={5} style={{ margin: 0 }}>\n            Loader Analysis\n          </Typography.Title>\n          <Popover\n            content={\n              <div>\n                {t('AsyncLoaderInfo')}\n                <a\n                  href=\"https://rsdoctor.rs/guide/more/faq#cssextractrspackplugin-%E7%9A%84-loader-%E8%80%97%E6%97%B6%E8%BF%87%E9%95%BF%E9%97%AE%E9%A2%98\"\n                  target=\"_blank\"\n                  rel=\"noreferrer\"\n                >\n                  {t('Details')}\n                </a>\n              </div>\n            }\n            title=\"Info\"\n          >\n            <Tag icon={<ExclamationCircleOutlined />} color=\"warning\">\n              Info\n            </Tag>\n          </Popover>\n        </Space>\n      }\n      extra={<WebpackConfigurationViewer defaultKeys={['module', 'resolve']} />}\n      bodyStyle={{ paddingTop: token.padding, height: 800 }}\n    >\n      <LoaderAnalysis />\n    </Card>\n  );\n};\n\nexport * from './constants';\n"],"names":["Page","token","useThemeToken","Card","Space","Typography","Popover","t","Tag","ExclamationCircleOutlined","WebpackConfigurationViewer","LoaderAnalysis"],"mappings":";;;;;;;;;;AASO,MAAMA,OAAiB;IAC5B,MAAMC,QAAQC;IAEd,OAAO,WAAP,GACE,IAACC,MAAIA;QACH,qBACE,KAACC,OAAKA;YAAC,OAAM;;8BACX,IAACC,WAAW,KAAK;oBAAC,OAAO;oBAAG,OAAO;wBAAE,QAAQ;oBAAE;8BAAG;;8BAGlD,IAACC,SAAOA;oBACN,uBACE,KAAC;;4BACEC,EAAE;0CACH,IAAC;gCACC,MAAK;gCACL,QAAO;gCACP,KAAI;0CAEHA,EAAE;;;;oBAIT,OAAM;8BAEN,kBAACC,KAAGA;wBAAC,oBAAM,IAACC,2BAAyBA,CAAAA;wBAAK,OAAM;kCAAU;;;;;QAMhE,qBAAO,IAACC,4BAA0BA;YAAC,aAAa;gBAAC;gBAAU;aAAU;;QACrE,WAAW;YAAE,YAAYT,MAAM,OAAO;YAAE,QAAQ;QAAI;kBAEpD,kBAACU,gBAAcA,CAAAA;;AAGrB"}

package/dist/pages/WebpackLoaders/Overall/index.mjs

@@ -3,7 +3,7 @@ import "react";
 import { WebpackConfigurationViewer } from "../../../components/Configuration/index.mjs";
 import { Card } from "../../../components/Card/index.mjs";
 import { LoaderChart } from "../../../components/Charts/index.mjs";
-import { Popover, Space, Tag, Typography } from "antd/lib";
+import { Popover, Space, Tag, Typography } from "antd";
 import { ExclamationCircleOutlined } from "@ant-design/icons";
 import { useTranslation } from "react-i18next";
 export * from "./constants.mjs";

package/dist/pages/WebpackLoaders/Overall/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"pages/WebpackLoaders/Overall/index.mjs","sources":["../../../../src/pages/WebpackLoaders/Overall/index.tsx"],"sourcesContent":["import React from 'react';\nimport { WebpackConfigurationViewer } from '../../../components/Configuration';\nimport { Card } from '../../../components/Card';\nimport { LoaderChart } from 'src/components/Charts';\nimport { Popover, Space, Tag, Typography } from 'antd/lib';\nimport { ExclamationCircleOutlined } from '@ant-design/icons';\nimport { useTranslation } from 'react-i18next';\n\nexport const Page: React.FC = () => {\n  const { t } = useTranslation();\n  return (\n    <Card\n      title={\n        <Space align=\"baseline\">\n          <Typography.Title level={5} style={{ margin: 0 }}>\n            Loader Timeline\n          </Typography.Title>\n          <Popover\n            content={\n              <div>\n                {t('AsyncLoaderInfo')}\n                <a\n                  href=\"https://rsdoctor.rs/guide/more/faq#cssextractrspackplugin-%E7%9A%84-loader-%E8%80%97%E6%97%B6%E8%BF%87%E9%95%BF%E9%97%AE%E9%A2%98\"\n                  target=\"_blank\"\n                  rel=\"noreferrer\"\n                >\n                  {t('Details')}\n                </a>\n              </div>\n            }\n            title=\"Info\"\n          >\n            <Tag icon={<ExclamationCircleOutlined />} color=\"warning\">\n              Info\n            </Tag>\n          </Popover>\n        </Space>\n      }\n      extra={<WebpackConfigurationViewer defaultKeys={['module']} />}\n    >\n      <LoaderChart />\n    </Card>\n  );\n};\n\nexport * from './constants';\n"],"names":["Page","t","useTranslation","Card","Space","Typography","Popover","Tag","ExclamationCircleOutlined","WebpackConfigurationViewer","LoaderChart"],"mappings":";;;;;;;;;AAQO,MAAMA,OAAiB;IAC5B,MAAM,EAAEC,CAAC,EAAE,GAAGC;IACd,OAAO,WAAP,GACE,IAACC,MAAIA;QACH,qBACE,KAACC,OAAKA;YAAC,OAAM;;8BACX,IAACC,WAAW,KAAK;oBAAC,OAAO;oBAAG,OAAO;wBAAE,QAAQ;oBAAE;8BAAG;;8BAGlD,IAACC,SAAOA;oBACN,uBACE,KAAC;;4BACEL,EAAE;0CACH,IAAC;gCACC,MAAK;gCACL,QAAO;gCACP,KAAI;0CAEHA,EAAE;;;;oBAIT,OAAM;8BAEN,kBAACM,KAAGA;wBAAC,oBAAM,IAACC,2BAAyBA,CAAAA;wBAAK,OAAM;kCAAU;;;;;QAMhE,qBAAO,IAACC,4BAA0BA;YAAC,aAAa;gBAAC;aAAS;;kBAE1D,kBAACC,aAAWA,CAAAA;;AAGlB"}
+{"version":3,"file":"pages/WebpackLoaders/Overall/index.mjs","sources":["../../../../src/pages/WebpackLoaders/Overall/index.tsx"],"sourcesContent":["import React from 'react';\nimport { WebpackConfigurationViewer } from '../../../components/Configuration';\nimport { Card } from '../../../components/Card';\nimport { LoaderChart } from 'src/components/Charts';\nimport { Popover, Space, Tag, Typography } from 'antd';\nimport { ExclamationCircleOutlined } from '@ant-design/icons';\nimport { useTranslation } from 'react-i18next';\n\nexport const Page: React.FC = () => {\n  const { t } = useTranslation();\n  return (\n    <Card\n      title={\n        <Space align=\"baseline\">\n          <Typography.Title level={5} style={{ margin: 0 }}>\n            Loader Timeline\n          </Typography.Title>\n          <Popover\n            content={\n              <div>\n                {t('AsyncLoaderInfo')}\n                <a\n                  href=\"https://rsdoctor.rs/guide/more/faq#cssextractrspackplugin-%E7%9A%84-loader-%E8%80%97%E6%97%B6%E8%BF%87%E9%95%BF%E9%97%AE%E9%A2%98\"\n                  target=\"_blank\"\n                  rel=\"noreferrer\"\n                >\n                  {t('Details')}\n                </a>\n              </div>\n            }\n            title=\"Info\"\n          >\n            <Tag icon={<ExclamationCircleOutlined />} color=\"warning\">\n              Info\n            </Tag>\n          </Popover>\n        </Space>\n      }\n      extra={<WebpackConfigurationViewer defaultKeys={['module']} />}\n    >\n      <LoaderChart />\n    </Card>\n  );\n};\n\nexport * from './constants';\n"],"names":["Page","t","useTranslation","Card","Space","Typography","Popover","Tag","ExclamationCircleOutlined","WebpackConfigurationViewer","LoaderChart"],"mappings":";;;;;;;;;AAQO,MAAMA,OAAiB;IAC5B,MAAM,EAAEC,CAAC,EAAE,GAAGC;IACd,OAAO,WAAP,GACE,IAACC,MAAIA;QACH,qBACE,KAACC,OAAKA;YAAC,OAAM;;8BACX,IAACC,WAAW,KAAK;oBAAC,OAAO;oBAAG,OAAO;wBAAE,QAAQ;oBAAE;8BAAG;;8BAGlD,IAACC,SAAOA;oBACN,uBACE,KAAC;;4BACEL,EAAE;0CACH,IAAC;gCACC,MAAK;gCACL,QAAO;gCACP,KAAI;0CAEHA,EAAE;;;;oBAIT,OAAM;8BAEN,kBAACM,KAAGA;wBAAC,oBAAM,IAACC,2BAAyBA,CAAAA;wBAAK,OAAM;kCAAU;;;;;QAMhE,qBAAO,IAACC,4BAA0BA;YAAC,aAAa;gBAAC;aAAS;;kBAE1D,kBAACC,aAAWA,CAAAA;;AAGlB"}

package/dist/utils/assets.d.ts

@@ -0,0 +1 @@
+export declare const isJavaScriptAsset: (assetPath: string) => boolean;

package/dist/utils/assets.mjs

@@ -0,0 +1,17 @@
+const JAVASCRIPT_ASSET_EXTENSIONS = new Set([
+    'js',
+    'cjs',
+    'mjs',
+    'jsx',
+    'bundle'
+]);
+const isJavaScriptAsset = (assetPath)=>{
+    const cleanPath = assetPath.split(/[?#]/, 1)[0] ?? '';
+    const lastDot = cleanPath.lastIndexOf('.');
+    if (-1 === lastDot) return false;
+    const ext = cleanPath.slice(lastDot + 1).toLowerCase();
+    return JAVASCRIPT_ASSET_EXTENSIONS.has(ext);
+};
+export { isJavaScriptAsset };
+
+//# sourceMappingURL=assets.mjs.map

package/dist/utils/assets.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils/assets.mjs","sources":["../../src/utils/assets.ts"],"sourcesContent":["const JAVASCRIPT_ASSET_EXTENSIONS = new Set([\n  'js',\n  'cjs',\n  'mjs',\n  'jsx',\n  'bundle',\n]);\n\nexport const isJavaScriptAsset = (assetPath: string): boolean => {\n  const cleanPath = assetPath.split(/[?#]/, 1)[0] ?? '';\n  const lastDot = cleanPath.lastIndexOf('.');\n\n  if (lastDot === -1) return false;\n\n  const ext = cleanPath.slice(lastDot + 1).toLowerCase();\n  return JAVASCRIPT_ASSET_EXTENSIONS.has(ext);\n};\n"],"names":["JAVASCRIPT_ASSET_EXTENSIONS","Set","isJavaScriptAsset","assetPath","cleanPath","lastDot","ext"],"mappings":"AAAA,MAAMA,8BAA8B,IAAIC,IAAI;IAC1C;IACA;IACA;IACA;IACA;CACD;AAEM,MAAMC,oBAAoB,CAACC;IAChC,MAAMC,YAAYD,UAAU,KAAK,CAAC,QAAQ,EAAE,CAAC,EAAE,IAAI;IACnD,MAAME,UAAUD,UAAU,WAAW,CAAC;IAEtC,IAAIC,AAAY,OAAZA,SAAgB,OAAO;IAE3B,MAAMC,MAAMF,UAAU,KAAK,CAACC,UAAU,GAAG,WAAW;IACpD,OAAOL,4BAA4B,GAAG,CAACM;AACzC"}