@rsdoctor/components 0.4.13 → 1.0.0-alpha.1

package/dist/pages/ModuleAnalyze/fileTree.js

@@ -1,187 +1,59 @@
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import {
-  ExpandOutlined,
-  InfoCircleOutlined,
-  MenuFoldOutlined,
-  MenuUnfoldOutlined,
-  RightSquareTwoTone
-} from "@ant-design/icons";
-import { SDK } from "@rsdoctor/types";
-import {
-  Badge,
-  Button,
-  Col,
-  Empty,
-  Popover,
-  Radio,
-  Row,
-  Tag,
-  Typography
-} from "antd";
+import { Fragment, jsx } from "react/jsx-runtime";
+import { Col, Empty } from "antd";
 import { useEffect, useState } from "react";
-import { ServerAPIProvider } from "../../components/Manifest";
-import { Title } from "../../components/Title";
-import { Size, TAG_PALLETE } from "../../constants";
-import { useI18n } from "../../utils/hooks";
-import { ChunksTable } from "./chunks";
+import { Size } from "../../constants";
 import { FileTree } from "./components/fileTreeCom";
 import { clsNamePrefix } from "./constants";
 import DependencyTree from "./dependency";
-import { getImporteds, getModuleReasonsTree } from "./utils";
+import { getImporteds } from "./utils";
 import { useCreateFileTreeData } from "./utils/hooks";
-var ChartDimension = /* @__PURE__ */ ((ChartDimension2) => {
-  ChartDimension2[ChartDimension2["Dependencies"] = 0] = "Dependencies";
-  ChartDimension2[ChartDimension2["Chunks"] = 1] = "Chunks";
-  return ChartDimension2;
-})(ChartDimension || {});
+import { TabList } from "./index";
 const ModuleFilesTree = (props) => {
-  const { curModule, modules, dependencies, cwd, selectedChunk = "" } = props;
-  const { t } = useI18n();
+  const {
+    curModule,
+    modules,
+    dependencies,
+    cwd,
+    activeTabKey,
+    selectedChunk = ""
+  } = props;
   const [importedModules, setImportedModules] = useState(
     []
   );
-  const [dimension, setDimension] = useState(
-    0 /* Dependencies */
-  );
-  const [fold, setFold] = useState(true);
   const { data: fileStructures } = useCreateFileTreeData(
     modules,
     importedModules,
     curModule
   );
-  const [reasonsTree, setReasonsTree] = useState(
-    {}
-  );
   useEffect(() => {
     const importeds = getImporteds(curModule, modules);
     setImportedModules(importeds);
   }, [curModule, modules]);
-  useEffect(() => {
-    const _reasonsTree = {};
-    importedModules.forEach((_curModule) => {
-      const treeList = [];
-      const visited = /* @__PURE__ */ new Map();
-      getModuleReasonsTree(_curModule, modules, treeList, visited);
-      _reasonsTree[_curModule.id] = treeList;
-    });
-    setReasonsTree(_reasonsTree);
-  }, [importedModules]);
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsx(
-      Popover,
-      {
-        content: /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsxs("div", { children: [
-            /* @__PURE__ */ jsx(Badge, { status: "success", text: " " }),
-            /* @__PURE__ */ jsxs(Typography.Text, { code: true, children: [
-              /* @__PURE__ */ jsx(ExpandOutlined, {}),
-              " Expand the node_modules's modules that was omitted... "
-            ] }),
-            " ",
-            /* @__PURE__ */ jsx(Typography.Text, { children: `: ${t("Expand Omitted")}` })
-          ] }),
-          /* @__PURE__ */ jsxs("div", { children: [
-            /* @__PURE__ */ jsx(Badge, { status: "success", text: " " }),
-            /* @__PURE__ */ jsx(
-              Popover,
-              {
-                content: "*",
-                title: "Concatenated Module Name",
-                trigger: "hover",
-                children: /* @__PURE__ */ jsx(Tag, { color: TAG_PALLETE.DARK_BLUE, children: "Concatenated" })
-              }
-            ),
-            /* @__PURE__ */ jsx(Typography.Text, { children: `: ${t("Concatenated Tag")}` })
-          ] }),
-          /* @__PURE__ */ jsxs("div", { children: [
-            /* @__PURE__ */ jsx(Badge, { status: "success", text: " " }),
-            /* @__PURE__ */ jsx(RightSquareTwoTone, {}),
-            /* @__PURE__ */ jsx(Typography.Text, { children: ": Jump button, click to jump to the Module dependency analysis page of this module." })
-          ] })
-        ] }),
-        title: "Usage",
-        children: /* @__PURE__ */ jsx(Button, { type: "primary", icon: /* @__PURE__ */ jsx(InfoCircleOutlined, {}), children: "Usage" })
-      }
-    ) }),
-    /* @__PURE__ */ jsxs(Row, { gutter: 4, style: { marginTop: Size.BasePadding }, children: [
-      /* @__PURE__ */ jsx(Col, { span: fold ? 18 : 12, children: /* @__PURE__ */ jsx(Row, { className: `${clsNamePrefix}-file-tree`, justify: "center", children: /* @__PURE__ */ jsxs(Col, { span: 24, style: { padding: Size.BasePadding / 2 }, children: [
-        /* @__PURE__ */ jsx(Title, { text: "Current Module Imported Reasons Tree:" }),
-        importedModules ? /* @__PURE__ */ jsx(
-          FileTree,
-          {
-            cwd,
-            treeData: selectedChunk ? fileStructures.filter(
-              (_parent) => reasonsTree[_parent.id].indexOf(selectedChunk) >= 0
-            ) : fileStructures,
-            needCode: true,
-            needShowAllTree: true,
-            needJumpto: true,
-            selectedChunk
-          }
-        ) : /* @__PURE__ */ jsx(Empty, { className: `${clsNamePrefix}-empty` })
-      ] }) }) }),
-      /* @__PURE__ */ jsx(Col, { span: fold ? 6 : 12, children: /* @__PURE__ */ jsxs(
-        "div",
+  return /* @__PURE__ */ jsx(Fragment, { children: activeTabKey === TabList[TabList.Reasons] ? /* @__PURE__ */ jsx(Fragment, { children: importedModules ? /* @__PURE__ */ jsx(
+    FileTree,
+    {
+      cwd,
+      treeData: fileStructures,
+      needCode: true,
+      needShowAllTree: true,
+      needJumpto: true,
+      selectedChunk
+    }
+  ) : /* @__PURE__ */ jsx(Empty, { className: `${clsNamePrefix}-empty` }) }) : /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: `${clsNamePrefix}-file-tree`,
+      style: { padding: Size.BasePadding / 2 },
+      children: /* @__PURE__ */ jsx(Col, { span: 24, style: { marginTop: Size.BasePadding / 2 }, children: curModule ? /* @__PURE__ */ jsx(
+        DependencyTree,
         {
-          className: `${clsNamePrefix}-file-tree`,
-          style: { padding: Size.BasePadding / 2 },
-          children: [
-            fold ? /* @__PURE__ */ jsx(Popover, { content: "Unfold [Dependencies & Chunks] Box.", children: /* @__PURE__ */ jsx(
-              MenuFoldOutlined,
-              {
-                onClick: () => setFold(!fold),
-                style: { marginRight: 8 }
-              }
-            ) }) : /* @__PURE__ */ jsx(Popover, { content: "Fold [Dependencies & Chunks] Box.", children: /* @__PURE__ */ jsx(
-              MenuUnfoldOutlined,
-              {
-                onClick: () => setFold(!fold),
-                style: { marginRight: 8 }
-              }
-            ) }),
-            /* @__PURE__ */ jsx(
-              Radio.Group,
-              {
-                options: [
-                  {
-                    label: "Dependencies",
-                    value: 0 /* Dependencies */
-                  },
-                  {
-                    label: "Chunks",
-                    value: 1 /* Chunks */
-                  }
-                ],
-                onChange: (e) => setDimension(e.target.value),
-                value: dimension,
-                optionType: "button",
-                buttonStyle: "solid",
-                size: "middle"
-              }
-            ),
-            !fold ? /* @__PURE__ */ jsxs(Fragment, { children: [
-              dimension === 0 /* Dependencies */ && /* @__PURE__ */ jsx(Col, { span: 24, style: { marginTop: Size.BasePadding / 2 }, children: curModule ? /* @__PURE__ */ jsx(
-                DependencyTree,
-                {
-                  module: curModule,
-                  dependencies,
-                  cwd
-                }
-              ) : /* @__PURE__ */ jsx(Empty, { className: `${clsNamePrefix}-empty` }) }),
-              dimension === 1 /* Chunks */ && /* @__PURE__ */ jsx(Col, { span: 18, style: { marginTop: Size.BasePadding / 2 }, children: curModule ? /* @__PURE__ */ jsx(
-                ServerAPIProvider,
-                {
-                  api: SDK.ServerAPI.API.GetChunksByModuleId,
-                  body: { moduleId: curModule.id },
-                  children: (res) => /* @__PURE__ */ jsx(ChunksTable, { chunks: res })
-                }
-              ) : /* @__PURE__ */ jsx(Empty, { className: `${clsNamePrefix}-empty` }) })
-            ] }) : /* @__PURE__ */ jsx(Fragment, {})
-          ]
+          module: curModule,
+          dependencies,
+          cwd
         }
-      ) })
-    ] })
-  ] });
+      ) : /* @__PURE__ */ jsx(Empty, { className: `${clsNamePrefix}-empty` }) })
+    }
+  ) });
 };
 export {
   ModuleFilesTree

package/dist/pages/ModuleAnalyze/index.css

@@ -1,10 +1,14 @@
 .module-analyze-file-tree {
   width: "100%";
-  border: 1px solid #eee;
   min-height: 50em;
-  margin: 4;
-  padding: 4;
 }
 .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;
+}

package/dist/pages/ModuleAnalyze/index.d.ts

@@ -1,8 +1,14 @@
 import { SDK } from '@rsdoctor/types';
 import React from 'react';
-import './index.sass';
+import './index.scss';
+export declare enum TabList {
+    Reasons = 0,
+    Dependencies = 1
+}
 export declare const ModuleAnalyzeComponent: React.FC<{
     modules: SDK.ModuleData[];
     cwd: string;
     moduleId: string | number;
+    show: boolean;
+    setShow: (arg: boolean) => void;
 }>;

package/dist/pages/ModuleAnalyze/index.js

@@ -1,64 +1,141 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { LeftSquareOutlined } from "@ant-design/icons";
 import { SDK } from "@rsdoctor/types";
-import { Card, Col, Row, Select, Space, Typography } from "antd";
+import {
+  Badge,
+  Card,
+  Col,
+  Drawer,
+  Popover,
+  Row,
+  Space,
+  Typography
+} from "antd";
 import { useState } from "react";
 import { ServerAPIProvider } from "../../components/Manifest";
 import { getShortPath } from "../../utils";
-import { values } from "lodash-es";
 import { ModuleGraphListContext } from "../BundleSize/config";
 import { ModuleFilesTree } from "./fileTree";
 import "./index.css";
-const ModuleAnalyzeComponent = ({ modules, cwd, moduleId }) => {
-  const [selectedChunk, setSelectedChunk] = useState("");
-  return /* @__PURE__ */ jsx(ServerAPIProvider, { api: SDK.ServerAPI.API.GetModuleDetails, body: { moduleId: +moduleId }, children: ({ module, dependencies }) => {
-    return /* @__PURE__ */ jsx(ServerAPIProvider, { api: SDK.ServerAPI.API.GetAllChunkGraph, body: {}, children: (chunks) => {
-      return /* @__PURE__ */ jsx(ModuleGraphListContext.Consumer, { children: ({ moduleJumpList, setModuleJumpList }) => {
-        return /* @__PURE__ */ jsxs(
-          Card,
+import { drawerWidth } from "../../constants";
+import {
+  LeftSquareOutlined,
+  QuestionCircleOutlined,
+  RightSquareTwoTone
+} from "@ant-design/icons";
+var TabList = /* @__PURE__ */ ((TabList2) => {
+  TabList2[TabList2["Reasons"] = 0] = "Reasons";
+  TabList2[TabList2["Dependencies"] = 1] = "Dependencies";
+  return TabList2;
+})(TabList || {});
+const tabslist = [
+  {
+    key: TabList[0 /* Reasons */],
+    label: TabList[0 /* Reasons */]
+  },
+  {
+    key: TabList[1 /* Dependencies */],
+    label: TabList[1 /* Dependencies */]
+  }
+];
+const ModuleAnalyzeComponent = ({ modules, cwd, moduleId, show, setShow }) => {
+  const [selectedChunk, _setSelectedChunk] = useState("");
+  const [activeTabKey, setActiveTabKey] = useState(TabList[0 /* Reasons */]);
+  return /* @__PURE__ */ jsx(
+    ServerAPIProvider,
+    {
+      api: SDK.ServerAPI.API.GetModuleDetails,
+      body: { moduleId: +moduleId },
+      children: ({ module, dependencies }) => {
+        return /* @__PURE__ */ jsx(
+          Drawer,
           {
-            title: /* @__PURE__ */ jsxs(Space, { children: [
+            title: /* @__PURE__ */ jsxs("div", { className: "module-analyze-box", children: [
+              /* @__PURE__ */ jsx(Typography.Text, { children: getShortPath(module.path) }),
               /* @__PURE__ */ jsx(
-                LeftSquareOutlined,
+                Typography.Text,
                 {
-                  onClick: () => {
-                    const _list = [...moduleJumpList.slice(0, -1)];
-                    setModuleJumpList(_list);
-                  }
+                  style: { fontSize: 12, color: "rgba(0, 0, 0, 0.45)" },
+                  children: `Current Module: ${module.path}`
                 }
-              ),
-              /* @__PURE__ */ jsx(Typography.Title, { code: true, level: 5, style: { marginBottom: "revert" }, children: `Current Module:  ${getShortPath(module.path)}` })
+              )
             ] }),
-            style: { height: "100%" },
-            children: [
-              /* @__PURE__ */ jsx(Row, { justify: "start", style: { marginBottom: 20 }, children: /* @__PURE__ */ jsx(Col, { children: /* @__PURE__ */ jsx(
-                Select,
-                {
-                  allowClear: true,
-                  placeholder: "Select Chunk To Filter Modules Links",
-                  showSearch: true,
-                  style: { width: 300 },
-                  options: values(chunks).map((e) => ({ label: e.name, value: e.id })),
-                  onChange: (e) => setSelectedChunk(e)
-                }
-              ) }) }),
-              /* @__PURE__ */ jsx(Row, { justify: "start", align: "middle", children: /* @__PURE__ */ jsx(Col, { span: 24, children: /* @__PURE__ */ jsx(
-                ModuleFilesTree,
-                {
-                  curModule: module,
-                  modules,
-                  dependencies,
-                  cwd,
-                  selectedChunk
+            open: show,
+            maskClosable: true,
+            width: drawerWidth * 0.8,
+            onClose: () => setShow(false),
+            children: /* @__PURE__ */ jsx(
+              ServerAPIProvider,
+              {
+                api: SDK.ServerAPI.API.GetAllChunkGraph,
+                body: {},
+                children: (_chunks) => {
+                  return /* @__PURE__ */ jsx(ModuleGraphListContext.Consumer, { children: ({ moduleJumpList, setModuleJumpList }) => {
+                    return /* @__PURE__ */ jsx(
+                      Card,
+                      {
+                        style: { minHeight: 400 },
+                        tabList: tabslist,
+                        activeTabKey,
+                        tabProps: {
+                          size: "small",
+                          style: {
+                            fontSize: 12
+                          }
+                        },
+                        onTabChange: (k) => setActiveTabKey(k),
+                        styles: {
+                          title: { paddingTop: 0 }
+                        },
+                        title: /* @__PURE__ */ jsxs(Space, { style: { padding: "10px 0px" }, children: [
+                          /* @__PURE__ */ jsx(
+                            LeftSquareOutlined,
+                            {
+                              onClick: () => {
+                                const _list = [
+                                  ...moduleJumpList.slice(0, -1)
+                                ];
+                                setModuleJumpList(_list);
+                              }
+                            }
+                          ),
+                          /* @__PURE__ */ jsx(Typography.Text, { children: "Current Module Imported Reasons Tree" }),
+                          /* @__PURE__ */ jsx(
+                            Popover,
+                            {
+                              content: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("div", { children: [
+                                /* @__PURE__ */ jsx(Badge, { status: "success", text: " " }),
+                                /* @__PURE__ */ jsx(RightSquareTwoTone, {}),
+                                /* @__PURE__ */ jsx(Typography.Text, { children: ": Jump button, click to jump to the Module dependency analysis page of this module." })
+                              ] }) }),
+                              title: "Usage",
+                              children: /* @__PURE__ */ jsx(QuestionCircleOutlined, {})
+                            }
+                          )
+                        ] }),
+                        children: /* @__PURE__ */ jsx(Row, { justify: "start", align: "middle", children: /* @__PURE__ */ jsx(Col, { span: 24, children: /* @__PURE__ */ jsx(
+                          ModuleFilesTree,
+                          {
+                            curModule: module,
+                            modules,
+                            dependencies,
+                            cwd,
+                            selectedChunk,
+                            activeTabKey
+                          }
+                        ) }) })
+                      }
+                    );
+                  } });
                 }
-              ) }) })
-            ]
+              }
+            )
           }
         );
-      } });
-    } });
-  } });
+      }
+    }
+  );
 };
 export {
-  ModuleAnalyzeComponent
+  ModuleAnalyzeComponent,
+  TabList
 };

package/dist/pages/Overall/index.js

@@ -1,17 +1,20 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { SDK } from "@rsdoctor/types";
-import { BundleAlerts, CompileAlerts } from "../../components/Alerts";
+import { Flex } from "antd";
+import { HelpCenter } from "../../components/Overall/help-center";
+import { BundleAlerts } from "../../components/Alerts";
 import { withServerAPI } from "../../components/Manifest";
 import {
   BundleOverall,
   CompileOverall,
   ProjectOverall
 } from "../../components/Overall";
-import { ResponsiveGridLayout } from "./responsiveGridList";
+import { ResponsiveLayout } from "./responsiveLayout";
+import style from "./index.module";
 const Component = ({ project }) => {
   const { summary, configs, root: cwd, envinfo, errors } = project;
-  return /* @__PURE__ */ jsxs("div", { children: [
-    /* @__PURE__ */ jsxs(ResponsiveGridLayout, { children: [
+  return /* @__PURE__ */ jsx("div", { className: style.overall, children: /* @__PURE__ */ jsxs(Flex, { style: { width: "100%" }, children: [
+    /* @__PURE__ */ jsx("div", { style: { flex: 3, marginRight: "16px" }, children: /* @__PURE__ */ jsxs(ResponsiveLayout, { children: [
       /* @__PURE__ */ jsx(
         ProjectOverall,
         {
@@ -21,12 +24,14 @@ const Component = ({ project }) => {
           alerts: errors
         }
       ),
+      /* @__PURE__ */ jsx(BundleAlerts, {})
+    ] }) }),
+    /* @__PURE__ */ jsx("div", { style: { flex: 1 }, children: /* @__PURE__ */ jsxs(ResponsiveLayout, { children: [
       /* @__PURE__ */ jsx(BundleOverall, { errors, cwd }),
-      /* @__PURE__ */ jsx(CompileOverall, { summary })
-    ] }),
-    /* @__PURE__ */ jsx(CompileAlerts, {}),
-    /* @__PURE__ */ jsx(BundleAlerts, {})
-  ] });
+      /* @__PURE__ */ jsx(CompileOverall, { summary }),
+      /* @__PURE__ */ jsx(HelpCenter, {})
+    ] }) })
+  ] }) });
 };
 const Page = withServerAPI({
   api: SDK.ServerAPI.API.GetProjectInfo,

package/dist/pages/Overall/index.module.js

@@ -0,0 +1,5 @@
+import "./index_module.css";
+var index_module_default = { "overall": "overall_43377", "layout": "layout_43377", "row": "row_43377" };
+export {
+  index_module_default as default
+};

package/dist/pages/Overall/index_module.css

@@ -0,0 +1,26 @@
+:root {
+  --font-family-code: Roboto, Roboto Mono, -apple-system, BlinkMacSystemFont,
+    "Segoe UI", Menlo, "Helvetica Neue", Arial, "Noto Sans", sans-serif,
+    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+}
+:root .ant-layout-content {
+  padding: 16px 32px !important;
+}
+:root .rc-tree .rc-tree-treenode .rc-tree-node-content-wrapper {
+  cursor: default;
+}
+:root .ant-tree-title {
+  flex: 1 1;
+}
+:root .ant-tree-node-content-wrapper-normal {
+  display: flex;
+}
+
+.overall_43377 {
+  display: flex;
+  justify-content: space-between;
+}
+
+.layout_43377 .row_43377 {
+  margin-bottom: 16px;
+}

package/dist/pages/Overall/responsiveLayout.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+interface Props {
+    children: React.ReactNode[];
+}
+export declare const ResponsiveLayout: ({ children }: Props) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/pages/Overall/responsiveLayout.js

@@ -0,0 +1,9 @@
+import { jsx } from "react/jsx-runtime";
+import { Flex } from "antd";
+import style from "./index.module";
+const ResponsiveLayout = ({ children }) => {
+  return /* @__PURE__ */ jsx(Flex, { vertical: true, className: style.layout, children: children.map((e) => /* @__PURE__ */ jsx("div", { className: style.row, children: e })) });
+};
+export {
+  ResponsiveLayout
+};

package/dist/pages/Resources/BundleDiff/DiffContainer/modules.js

@@ -272,15 +272,15 @@ const Modules = ({
                     file: r.path,
                     data: [
                       {
-                        baseline: current.moduleCodeMap[r.current?.id]?.source,
-                        current: current.moduleCodeMap[r.current?.id]?.transformed,
+                        baseline: current.moduleCodeMap[r.current.id]?.source,
+                        current: current.moduleCodeMap[r.current.id]?.transformed,
                         baselineTitle: "Current Source",
                         currentTitle: "Current Transformed Source",
                         group: "Transformed Source"
                       },
                       {
-                        baseline: current.moduleCodeMap[r.current?.id]?.source,
-                        current: current.moduleCodeMap[r.current?.id]?.parsedSource,
+                        baseline: current.moduleCodeMap[r.current.id]?.source,
+                        current: current.moduleCodeMap[r.current.id]?.parsedSource,
                         baselineTitle: "Current Source",
                         currentTitle: "Current Parsed Source",
                         group: "Parsed Source"

package/dist/pages/TreeShaking/editor.d.ts

@@ -1,10 +1,9 @@
-import type { Module, ModuleGraph, SourceRange } from '@rsdoctor/graph';
 import { SDK } from '@rsdoctor/types';
 import { SetEditorStatus } from './types';
 export interface CodeEditorProps {
-    module: Module;
-    moduleGraph: ModuleGraph;
-    ranges: SourceRange[];
+    module: SDK.ModuleInstance;
+    moduleGraph: SDK.ModuleGraphInstance;
+    ranges: SDK.SourceRange[];
     setEditorData: SetEditorStatus;
     source: SDK.ModuleSource;
     toLine?: number;

package/dist/pages/TreeShaking/table.d.ts

@@ -1,9 +1,9 @@
-import type { Module, ModuleGraph } from '@rsdoctor/graph';
+import { SDK } from '@rsdoctor/types';
 import React from 'react';
 import type { TableKind, SetEditorStatus } from './types';
 interface TableProps {
-    module: Module;
-    moduleGraph: ModuleGraph;
+    module: SDK.ModuleInstance;
+    moduleGraph: SDK.ModuleGraphInstance;
     setEditorData: SetEditorStatus;
     kind: TableKind;
 }

package/dist/pages/TreeShaking/types.d.ts

@@ -1,3 +1,3 @@
-import type { Module, SourceRange } from '@rsdoctor/graph';
+import { SDK } from '@rsdoctor/types';
 export type TableKind = 'side-effect' | 'export';
-export type SetEditorStatus = (module: Module, ranges: SourceRange[], line?: number) => void;
+export type SetEditorStatus = (module: SDK.ModuleInstance, ranges: SDK.SourceRange[], line?: number) => void;

package/dist/pages/TreeShaking/utils.d.ts

@@ -1,8 +1,7 @@
-import type { ModuleGraph, Statement } from '@rsdoctor/graph';
-import { Module } from '@rsdoctor/graph';
 import type { editor } from 'monaco-editor';
-export declare function useFileStructures(modules: Module[], moduleGraph: ModuleGraph, searchInput: string, selectedModule: Module, onItemClick: (file: string) => void, cwd: string): import("../../utils").DataNode[];
+import { SDK } from '@rsdoctor/types';
+export declare function useFileStructures(modules: SDK.ModuleInstance[], moduleGraph: SDK.ModuleGraphInstance, searchInput: string, selectedModule: SDK.ModuleInstance, onItemClick: (file: string) => void, cwd: string): import("../..").DataNode[];
 export declare function getTreeFilesDefaultExpandedKeys(files: any[]): (string | number)[];
 export declare function ellipsisPath(full: string): string;
-export declare function getModulePositionString(statement: Statement, module: Module): string;
-export declare function getHoverMessageInModule(module: Module, moduleGraph: ModuleGraph): editor.IModelDecoration[];
+export declare function getModulePositionString(statement: SDK.StatementInstance, module: SDK.ModuleInstance): string;
+export declare function getHoverMessageInModule(module: SDK.ModuleInstance, moduleGraph: SDK.ModuleGraphInstance): editor.IModelDecoration[];

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

@@ -2,13 +2,16 @@ import { jsx } from "react/jsx-runtime";
 import { LoaderAnalysis } from "../../../components/Loader/Analysis";
 import { WebpackConfigurationViewer } from "../../../components/Configuration";
 import { Card } from "../../../components/Card";
+import { theme } from "antd";
+const { useToken } = theme;
 const Page = () => {
+  const { token } = useToken();
   return /* @__PURE__ */ jsx(
     Card,
     {
       title: "Loader Analysis",
       extra: /* @__PURE__ */ jsx(WebpackConfigurationViewer, { defaultKeys: ["module", "resolve"] }),
-      bodyStyle: { paddingTop: 0, height: 800 },
+      bodyStyle: { paddingTop: token.padding, height: 800 },
       children: /* @__PURE__ */ jsx(LoaderAnalysis, {})
     }
   );

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

@@ -3,7 +3,14 @@ import { WebpackConfigurationViewer } from "../../../components/Configuration";
 import { Card } from "../../../components/Card";
 import { LoaderChart } from "../../../components/Charts";
 const Page = () => {
-  return /* @__PURE__ */ jsx(Card, { title: "Loader Timeline", extra: /* @__PURE__ */ jsx(WebpackConfigurationViewer, { defaultKeys: ["module"] }), collapsable: true, children: /* @__PURE__ */ jsx(LoaderChart, {}) });
+  return /* @__PURE__ */ jsx(
+    Card,
+    {
+      title: "Loader Timeline",
+      extra: /* @__PURE__ */ jsx(WebpackConfigurationViewer, { defaultKeys: ["module"] }),
+      children: /* @__PURE__ */ jsx(LoaderChart, {})
+    }
+  );
 };
 export * from "./constants";
 export {

package/dist/pages/WebpackPlugins/index.css

@@ -0,0 +1,3 @@
+.plugin-select .ant-select-selector {
+  width: 300px;
+}