@rsdoctor/components 0.0.2-beta.0 → 0.0.2-beta.2

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

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { ColumnHeightOutlined, InfoCircleOutlined, VerticalAlignMiddleOutlined } from "@ant-design/icons";
+import { CodepenCircleOutlined, ColumnHeightOutlined, DeploymentUnitOutlined, InfoCircleOutlined, VerticalAlignMiddleOutlined } from "@ant-design/icons";
 import { SDK } from "@rsdoctor/types";
 import {
   Button,
@@ -51,7 +51,6 @@ const WebpackModulesOverallBase = ({
   const [graphType, setGraphType] = useState("tree");
   const { t } = useI18n();
   const assets = summary.all.total.files;
-  const avgAssetSize = summary.all.total.size / assets.length;
   const handleChange = useCallback(
     (type) => (value) => {
       if (type === "module") {
@@ -116,8 +115,8 @@ const WebpackModulesOverallBase = ({
             },
             children: [
               /* @__PURE__ */ jsx(Keyword, { text: basename, keyword: inputAssetName }),
-              /* @__PURE__ */ jsx(Bdg, { label: "size", value: formatSize(size), type: size >= avgAssetSize ? "error" : "default" }),
-              initial ? /* @__PURE__ */ jsx(Tag, { color: "cyan", style: { marginRight: 0 }, children: "initial" }) : null,
+              /* @__PURE__ */ jsx(Tag, { color: "success", style: { margin: 0 }, children: formatSize(size) }),
+              initial ? /* @__PURE__ */ jsx(Tag, { color: "cyan", style: { margin: 0 }, children: "initial" }) : null,
               /* @__PURE__ */ jsx(
                 CodeViewerWithDrawer,
                 {
@@ -170,7 +169,60 @@ const WebpackModulesOverallBase = ({
       Card,
       {
         hidden: graphType === "tile",
-        title: /* @__PURE__ */ jsx(Space, { children: /* @__PURE__ */ jsx(Title, { text: "Bundle Analysis" }) }),
+        title: /* @__PURE__ */ jsxs(Space, { children: [
+          /* @__PURE__ */ jsx(Title, { text: "Bundle Analysis" }),
+          /* @__PURE__ */ jsx(
+            Tooltip,
+            {
+              color: "white",
+              title: /* @__PURE__ */ jsxs(Space, { direction: "vertical", color: "white", children: [
+                /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsxs(Col, { children: [
+                  /* @__PURE__ */ jsx(Tag, { color: "cyan", style: { margin: 0 }, children: "initial" }),
+                  /* @__PURE__ */ jsx(Typography.Text, { children: ": Indignify whether the chunk is the initial chunk." })
+                ] }) }),
+                /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsxs(Col, { children: [
+                  /* @__PURE__ */ jsx(Tag, { color: "green", children: "concatenated" }),
+                  /* @__PURE__ */ jsx(Typography.Text, { children: ": Indignify whether the module is the concatenated module.  " }),
+                  /* @__PURE__ */ jsx("br", {}),
+                  /* @__PURE__ */ jsx(Typography.Text, { strong: true, children: "Concatenated Module:" }),
+                  /* @__PURE__ */ jsx(Typography.Text, { children: "A series module is to lift or series multiple modules into a closure when packaging. " })
+                ] }) }),
+                /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsxs(Col, { children: [
+                  /* @__PURE__ */ jsx(
+                    Button,
+                    {
+                      size: "small",
+                      icon: /* @__PURE__ */ jsx(CodepenCircleOutlined, {})
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(Typography.Text, { children: ": Open the code." })
+                ] }) }),
+                /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsxs(Col, { children: [
+                  /* @__PURE__ */ jsx(
+                    Button,
+                    {
+                      size: "small",
+                      icon: /* @__PURE__ */ jsx(DeploymentUnitOutlined, {})
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(Typography.Text, { children: ": View the module dependency, that is, module reasons in stats.json." })
+                ] }) }),
+                /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsxs(Col, { children: [
+                  /* @__PURE__ */ jsx(Tag, { color: "purple", children: "Parsed: 15.77 KB" }),
+                  /* @__PURE__ */ jsx(Typography.Text, { strong: true, children: "Parsed Size" }),
+                  /* @__PURE__ */ jsx(Typography.Text, { children: "The size of the code which bundled. That is, after bundle and tree-shaking." })
+                ] }) }),
+                /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsxs(Col, { children: [
+                  /* @__PURE__ */ jsx(Tag, { color: "orange", children: "Source: 15.77 KB" }),
+                  /* @__PURE__ */ jsx(Typography.Text, { strong: true, children: "Source Size" }),
+                  /* @__PURE__ */ jsx(Typography.Text, { children: "The size of the code which before bundle and transform." })
+                ] }) })
+              ] }),
+              style: { marginLeft: 3 },
+              children: /* @__PURE__ */ jsx(InfoCircleOutlined, { style: { color: "rgba(0,0,0,.45)" } })
+            }
+          )
+        ] }),
         extra: fold ? /* @__PURE__ */ jsx(Button, { onClick: () => setFold(false), children: /* @__PURE__ */ jsxs(Typography.Text, { children: [
           "Expand ",
           /* @__PURE__ */ jsx(ColumnHeightOutlined, {})

package/dist/pages/BundleSize/constants.d.ts

@@ -1,5 +1,5 @@
 import { Client } from '@rsdoctor/types';
 export declare const maxModuleSize = 5000;
 export declare const name = "BundleSize";
-export declare const route = Client.DoctorClientRoutes.BundleSize;
+export declare const route = Client.RsdoctorClientRoutes.BundleSize;
 export type GraphType = 'tile' | 'tree';

package/dist/pages/BundleSize/constants.js

@@ -1,7 +1,7 @@
 import { Client } from "@rsdoctor/types";
 const maxModuleSize = 5e3;
 const name = "BundleSize";
-const route = Client.DoctorClientRoutes.BundleSize;
+const route = Client.RsdoctorClientRoutes.BundleSize;
 export {
   maxModuleSize,
   name,

package/dist/pages/ModuleAnalyze/chunks.js

@@ -41,7 +41,7 @@ const ChunksTable = ({ chunks }) => {
     });
     return orderBy(compact(_chunksData), ["size"], ["desc"]);
   }, [chunks]);
-  return /* @__PURE__ */ jsx(Fragment, { children: (chunksData == null ? void 0 : chunksData.length) ? /* @__PURE__ */ jsx(Table, { bordered: true, pagination: false, dataSource: chunksData, columns }) : /* @__PURE__ */ jsx(Empty, {}) });
+  return /* @__PURE__ */ jsx(Fragment, { children: chunksData?.length ? /* @__PURE__ */ jsx(Table, { bordered: true, pagination: false, dataSource: chunksData, columns }) : /* @__PURE__ */ jsx(Empty, {}) });
 };
 export {
   ChunksTable

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

@@ -62,27 +62,36 @@
 .rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) {
   border-left: 1px solid #eee;
 }
-.file-tree-com-titles-box .file-tree-com-titles {
+.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) .file-tree-com-titles {
   display: flex;
   flex-direction: column;
 }
-.file-tree-com-titles-box .file-tree-com-titles .file-tree-com-node-title {
+.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;
 }
-.file-tree-com-titles-box .file-tree-com-titles .file-tree-com-node-title img {
+.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) .file-tree-com-titles .file-tree-com-node-title img {
   cursor: pointer;
 }
-.file-tree-com-titles-box .file-tree-com-titles .file-tree-com-node-title img-tag {
+.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;
 }
-.file-tree-com-titles-box .file-tree-com-titles .file-tree-com-node-title-selected {
+.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) .file-tree-com-node-title-selected {
   background-color: yellow;
 }
-.file-tree-com-titles-box .file-tree-com-titles .file-tree-com-node-title-tag {
+.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) .file-tree-com-node-title-tag {
   margin-inline-end: 0;
 }
-.file-tree-com-node-title-code .file-tree-com-titles-box .file-tree-com-titles-tag {
+.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;
+}

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

@@ -1,22 +1,3 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { InfoCircleOutlined, MinusCircleOutlined, PlusCircleOutlined, RightSquareTwoTone } from "@ant-design/icons";
 import { SDK } from "@rsdoctor/types";
@@ -38,11 +19,10 @@ const FileTree = (props) => {
     refreshAsyncNodes: true
   });
   const renderNode = useCallback(({ node, onToggle }) => {
-    var _a, _b;
     defaultOpenFather && node.data.level < defaultOpenFather && node.setOpened(true);
     return /* @__PURE__ */ jsx("div", { className: `${prefix}-titles-box`, children: /* @__PURE__ */ jsx("div", { className: `${prefix}-titles`, children: /* @__PURE__ */ jsx(Space, { direction: "vertical", children: /* @__PURE__ */ jsx("div", { className: `${prefix}-node-title`, children: /* @__PURE__ */ jsxs(Space, { children: [
       /* @__PURE__ */ jsxs("div", { onClick: onToggle, children: [
-        !node.options.opened && ((_a = node.data.children) == null ? void 0 : _a.length) ? /* @__PURE__ */ jsx(PlusCircleOutlined, { style: { color: "lightblue" } }) : /* @__PURE__ */ jsx(MinusCircleOutlined, { style: { color: "lightblue" } }),
+        !node.options.opened && node.data.children?.length ? /* @__PURE__ */ jsx(PlusCircleOutlined, { style: { color: "lightblue" } }) : /* @__PURE__ */ jsx(MinusCircleOutlined, { style: { color: "lightblue" } }),
         /* @__PURE__ */ jsxs(Typography.Text, { code: true, children: [
           node.data.name,
           /* @__PURE__ */ jsx(
@@ -58,7 +38,7 @@ const FileTree = (props) => {
         ] })
       ] }),
       /* @__PURE__ */ jsxs(Space, { children: [
-        ((_b = node.data.concatModules) == null ? void 0 : _b.length) ? /* @__PURE__ */ jsx(
+        node.data.concatModules?.length ? /* @__PURE__ */ jsx(
           Popover,
           {
             content: /* @__PURE__ */ jsx(
@@ -109,7 +89,9 @@ const FileTree = (props) => {
   }, []);
   return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
     Tree,
-    __spreadProps(__spreadValues(__spreadValues({}, required), handlers), {
+    {
+      ...required,
+      ...handlers,
       horizontalLineStyles: {
         stroke: "#c4c4c4",
         strokeWidth: 2,
@@ -130,7 +112,7 @@ const FileTree = (props) => {
       verticalLineTopOffset: 0,
       verticalLineOffset: 5,
       renderNode
-    })
+    }
   ) });
 };
 export {

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

@@ -1,6 +1,6 @@
 import { Client } from '@rsdoctor/types';
 export declare const name = "Module Analyze";
-export declare const route = Client.DoctorClientRoutes.ModuleAnalyze;
+export declare const route = Client.RsdoctorClientRoutes.ModuleAnalyze;
 export declare enum DevtoolsRuleClientConstant {
   UrlQueryForModuleAnalyze = "curModuleId",
 }

package/dist/pages/ModuleAnalyze/constants.js

@@ -1,6 +1,6 @@
 import { Client } from "@rsdoctor/types";
 const name = "Module Analyze";
-const route = Client.DoctorClientRoutes.ModuleAnalyze;
+const route = Client.RsdoctorClientRoutes.ModuleAnalyze;
 var DevtoolsRuleClientConstant = /* @__PURE__ */ ((DevtoolsRuleClientConstant2) => {
   DevtoolsRuleClientConstant2["UrlQueryForModuleAnalyze"] = "curModuleId";
   return DevtoolsRuleClientConstant2;

package/dist/pages/ModuleAnalyze/utils/hooks.js

@@ -4,11 +4,11 @@ import { formatSize, getShortPath } from "../../../utils";
 import { getImporteds } from ".";
 function useCreatFileTreeData(modules, importedModules, curModule) {
   return useMemo(() => {
-    if (!importedModules || !(importedModules == null ? void 0 : importedModules.length)) {
+    if (!importedModules || !importedModules?.length) {
       return { filterData: [], data: [] };
     }
     const root = compact(
-      importedModules == null ? void 0 : importedModules.map((imported, index) => {
+      importedModules?.map((imported, index) => {
         return {
           key: `0-${index}`,
           name: getShortPath(imported.path),
@@ -33,7 +33,7 @@ function useCreatFileTreeData(modules, importedModules, curModule) {
 }
 function getLeafs(imported, modules, fatherModule) {
   const leafModules = getImporteds(imported, modules);
-  const leafs = leafModules == null ? void 0 : leafModules.map((_imported, index) => {
+  const leafs = leafModules?.map((_imported, index) => {
     return {
       key: `0-${index}`,
       name: getShortPath(_imported.path),
@@ -53,11 +53,8 @@ function getLeafs(imported, modules, fatherModule) {
   return leafs;
 }
 function getContactMainModulePath(concatModules, modules) {
-  const concatModulesPath = concatModules == null ? void 0 : concatModules.map((cm) => {
-    var _a;
-    return (_a = modules.filter((m) => m.id === cm)) == null ? void 0 : _a[0];
-  });
-  return concatModulesPath == null ? void 0 : concatModulesPath.map((m) => m.path);
+  const concatModulesPath = concatModules?.map((cm) => modules.filter((m) => m.id === cm)?.[0]);
+  return concatModulesPath?.map((m) => m.path);
 }
 export {
   getContactMainModulePath,

package/dist/pages/ModuleAnalyze/utils/index.js

@@ -1,7 +1,6 @@
 import { compact, find } from "lodash-es";
 const getImporteds = (curModule, modules) => {
-  var _a;
-  if ((_a = curModule == null ? void 0 : curModule.imported) == null ? void 0 : _a.length) {
+  if (curModule?.imported?.length) {
     const _importeds = curModule.imported.map(
       (_importedModule) => find(modules, (m) => m.id === Number(_importedModule))
     );
@@ -21,8 +20,7 @@ const getModuleReasonsTree = (curModule, modules, reasonsTree, visited) => {
     return;
   }
   importeds.forEach((_curModule) => {
-    var _a;
-    (_a = _curModule == null ? void 0 : _curModule.chunks) == null ? void 0 : _a.forEach((_chunk) => {
+    _curModule?.chunks?.forEach((_chunk) => {
       if (reasonsTree.indexOf(_chunk) < 0) {
         reasonsTree.push(_chunk);
       }

package/dist/pages/ModuleResolve/constants.d.ts

@@ -1,3 +1,3 @@
 import { Client } from '@rsdoctor/types';
 export declare const name = "ModuleResolve";
-export declare const route = Client.DoctorClientRoutes.ModuleResolve;
+export declare const route = Client.RsdoctorClientRoutes.ModuleResolve;

package/dist/pages/ModuleResolve/constants.js

@@ -1,6 +1,6 @@
 import { Client } from "@rsdoctor/types";
 const name = "ModuleResolve";
-const route = Client.DoctorClientRoutes.ModuleResolve;
+const route = Client.RsdoctorClientRoutes.ModuleResolve;
 export {
   name,
   route

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

@@ -1,3 +1,3 @@
 import { Client } from '@rsdoctor/types';
 export declare const name = "Overall";
-export declare const route = Client.DoctorClientRoutes.Overall;
+export declare const route = Client.RsdoctorClientRoutes.Overall;

package/dist/pages/Overall/constants.js

@@ -1,6 +1,6 @@
 import { Client } from "@rsdoctor/types";
 const name = "Overall";
-const route = Client.DoctorClientRoutes.Overall;
+const route = Client.RsdoctorClientRoutes.Overall;
 export {
   name,
   route

package/dist/pages/Resources/RuleIndex/constants.d.ts

@@ -0,0 +1,3 @@
+import { Client } from '@rsdoctor/types';
+export declare const name = "Rule Index";
+export declare const route = Client.RsdoctorClientRoutes.RuleIndex;

package/dist/pages/Resources/RuleIndex/constants.js

@@ -0,0 +1,7 @@
+import { Client } from "@rsdoctor/types";
+const name = "Rule Index";
+const route = Client.RsdoctorClientRoutes.RuleIndex;
+export {
+  name,
+  route
+};

package/dist/pages/Resources/RuleIndex/index.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const Page: React.FC;
+export * from './constants';

package/dist/pages/Resources/RuleIndex/index.js

@@ -0,0 +1,53 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { Rule } from "@rsdoctor/types";
+import { Badge, Card, Space, Typography, Col, Row, Tag } from "antd";
+import ReactMarkdown from "react-markdown";
+import { values } from "lodash-es";
+import { Title } from "../../../components/Title";
+import { Size } from "../../../constants";
+import { useUrlQuery } from "../../../utils";
+const Page = () => {
+  const query = useUrlQuery();
+  const defaultErrorCode = query[Rule.RsdoctorRuleClientConstant.UrlQueryForErrorCode] || "";
+  const [ruleMessage, setRuleMessage] = useState(Rule.RuleErrorMap[defaultErrorCode]);
+  const dataSource = values(Rule.RuleErrorMap);
+  useEffect(() => {
+    window.scrollTo({ top: 0 });
+  }, []);
+  return /* @__PURE__ */ jsxs(Row, { gutter: Size.BasePadding / 2, children: [
+    /* @__PURE__ */ jsx(Col, { span: 8, children: /* @__PURE__ */ jsx(Card, { title: /* @__PURE__ */ jsx(Title, { text: "list of the error codes." }), bordered: true, children: /* @__PURE__ */ jsx(Space, { direction: "vertical", children: dataSource.map((e, i) => /* @__PURE__ */ jsxs(
+      Space,
+      {
+        style: { marginTop: i === 0 ? 0 : Size.BasePadding / 2, cursor: "pointer" },
+        onClick: () => setRuleMessage(e),
+        align: "center",
+        children: [
+          /* @__PURE__ */ jsx(Badge, { status: "default" }),
+          /* @__PURE__ */ jsx(Typography.Text, { code: true, children: /* @__PURE__ */ jsx("a", { children: e.code }) }),
+          /* @__PURE__ */ jsx(Typography.Text, { style: { color: ruleMessage && ruleMessage.code === e.code ? "#1890ff" : void 0 }, children: e.title })
+        ]
+      },
+      e.code
+    )) }) }) }),
+    /* @__PURE__ */ jsx(Col, { span: 16, children: ruleMessage ? /* @__PURE__ */ jsx(
+      Card,
+      {
+        title: /* @__PURE__ */ jsxs(Row, { justify: "space-between", children: [
+          /* @__PURE__ */ jsxs(Space, { children: [
+            /* @__PURE__ */ jsx(Typography.Text, { code: true, children: ruleMessage.code }),
+            /* @__PURE__ */ jsx(Typography.Text, { children: ruleMessage.title })
+          ] }),
+          /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Tag, { children: ruleMessage.category }) })
+        ] }),
+        bodyStyle: { paddingTop: 0 },
+        bordered: true,
+        children: /* @__PURE__ */ jsx(Typography.Paragraph, { children: ruleMessage.type === "markdown" ? /* @__PURE__ */ jsx(ReactMarkdown, { children: ruleMessage.description }) : /* @__PURE__ */ jsx(Typography.Text, { children: ruleMessage.description }) })
+      }
+    ) : /* @__PURE__ */ jsx(Card, { title: "This page lists all the error codes emitted by the Rsdoctor.", bordered: true, children: /* @__PURE__ */ jsx(Typography.Text, { children: "click the error code in left bar to show more details." }) }) })
+  ] });
+};
+export * from "./constants";
+export {
+  Page
+};

package/dist/pages/WebpackLoaders/Analysis/constants.d.ts

@@ -1,3 +1,3 @@
 import { Client } from '@rsdoctor/types';
 export declare const name = "Loaders Analysis";
-export declare const route = Client.DoctorClientRoutes.WebpackLoaderAnalysis;
+export declare const route = Client.RsdoctorClientRoutes.WebpackLoaderAnalysis;

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

@@ -1,6 +1,6 @@
 import { Client } from "@rsdoctor/types";
 const name = "Loaders Analysis";
-const route = Client.DoctorClientRoutes.WebpackLoaderAnalysis;
+const route = Client.RsdoctorClientRoutes.WebpackLoaderAnalysis;
 export {
   name,
   route

package/dist/pages/WebpackLoaders/Overall/constants.d.ts

@@ -1,3 +1,3 @@
 import { Client } from '@rsdoctor/types';
-export declare const name = "Loaders Overall";
-export declare const route = Client.DoctorClientRoutes.WebpackLoaderOverall;
+export declare const name = "Loaders Timeline";
+export declare const route = Client.RsdoctorClientRoutes.WebpackLoaderOverall;

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

@@ -1,6 +1,6 @@
 import { Client } from "@rsdoctor/types";
-const name = "Loaders Overall";
-const route = Client.DoctorClientRoutes.WebpackLoaderOverall;
+const name = "Loaders Timeline";
+const route = Client.RsdoctorClientRoutes.WebpackLoaderOverall;
 export {
   name,
   route

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

@@ -3,7 +3,7 @@ import { WebpackConfigurationViewer } from "../../../components/Configuration";
 import { Card } from "../../../components/Card";
 import { LoaderChart } from "../../../components/Charts";
 const Page = () => {
-  return /* @__PURE__ */ jsx(Card, { title: "Loader Overall", 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"] }), collapsable: true, children: /* @__PURE__ */ jsx(LoaderChart, {}) });
 };
 export * from "./constants";
 export {

package/dist/pages/WebpackPlugins/constants.d.ts

@@ -1,3 +1,3 @@
 import { Client } from '@rsdoctor/types';
-export declare const name = "WebpackPlugins";
-export declare const route = Client.DoctorClientRoutes.WebpackPlugins;
+export declare const name = "Plugins Analysis";
+export declare const route = Client.RsdoctorClientRoutes.WebpackPlugins;

package/dist/pages/WebpackPlugins/constants.js

@@ -1,6 +1,6 @@
 import { Client } from "@rsdoctor/types";
-const name = "WebpackPlugins";
-const route = Client.DoctorClientRoutes.WebpackPlugins;
+const name = "Plugins Analysis";
+const route = Client.RsdoctorClientRoutes.WebpackPlugins;
 export {
   name,
   route

package/dist/pages/index.d.ts

@@ -4,4 +4,5 @@ export * as ModuleAnalyze from './ModuleAnalyze';
 export * as LoaderTimeline from './WebpackLoaders/Overall';
 export * as LoaderFiles from './WebpackLoaders/Analysis';
 export * as PluginsAnalyze from './WebpackPlugins';
-export * as ModuleResolve from './ModuleResolve';
+export * as ModuleResolve from './ModuleResolve';
+export * as RuleIndex from './Resources/RuleIndex';

package/dist/pages/index.js

@@ -5,6 +5,7 @@ import * as LoaderTimeline from "./WebpackLoaders/Overall";
 import * as LoaderFiles from "./WebpackLoaders/Analysis";
 import * as PluginsAnalyze from "./WebpackPlugins";
 import * as ModuleResolve from "./ModuleResolve";
+import * as RuleIndex from "./Resources/RuleIndex";
 export {
   BundleSize,
   LoaderFiles,
@@ -12,5 +13,6 @@ export {
   ModuleAnalyze,
   ModuleResolve,
   Overall,
-  PluginsAnalyze
+  PluginsAnalyze,
+  RuleIndex
 };

package/dist/utils/data/base.d.ts

@@ -1,22 +1,22 @@
 import { Common, Manifest, SDK } from '@rsdoctor/types';
 import { Data } from '@rsdoctor/utils/common';
 export declare abstract class BaseDataLoader implements Manifest.ManifestDataLoader {
-  protected manifest: Manifest.DoctorManifestWithShardingFiles;
+  protected manifest: Manifest.RsdoctorManifestWithShardingFiles;
   protected pool: Map<string, Promise<unknown>>;
   protected loader: Data.APIDataLoader;
   protected disposed: boolean;
-  protected shardingDataMap: Map<keyof Manifest.DoctorManifestData, Promise<any>>;
-  constructor(manifest: Manifest.DoctorManifestWithShardingFiles);
-  protected get<T extends keyof Manifest.DoctorManifestWithShardingFiles>(key: T): void | Manifest.DoctorManifestWithShardingFiles[T];
-  protected getData<T extends keyof Manifest.DoctorManifestData>(key: T, scope?: 'data'): void | Manifest.DoctorManifestWithShardingFiles['data'][T];
+  protected shardingDataMap: Map<keyof Manifest.RsdoctorManifestData, Promise<any>>;
+  constructor(manifest: Manifest.RsdoctorManifestWithShardingFiles);
+  protected get<T extends keyof Manifest.RsdoctorManifestWithShardingFiles>(key: T): void | Manifest.RsdoctorManifestWithShardingFiles[T];
+  protected getData<T extends keyof Manifest.RsdoctorManifestData>(key: T, scope?: 'data'): void | Manifest.RsdoctorManifestWithShardingFiles['data'][T];
   protected getKeys(key: string): string[];
   protected joinKeys(keys: string[]): string;
   dispose(): void;
   limit<T>(key: string, fn: Common.Function<unknown[], Promise<T>>): Promise<T>;
   log(...args: unknown[]): void;
-  loadManifest(): Promise<Manifest.DoctorManifestWithShardingFiles>;
+  loadManifest(): Promise<Manifest.RsdoctorManifestWithShardingFiles>;
   abstract loadData<T extends string, P>(key: T): Promise<void | P>;
-  abstract loadData<T extends Manifest.DoctorManifestMappingKeys>(key: T): Promise<void | Manifest.InferManifestDataValue<T>>;
+  abstract loadData<T extends Manifest.RsdoctorManifestMappingKeys>(key: T): Promise<void | Manifest.InferManifestDataValue<T>>;
   abstract isLocal(): boolean;
   abstract loadAPI<T extends SDK.ServerAPI.API, B extends SDK.ServerAPI.InferRequestBodyType<T> = SDK.ServerAPI.InferRequestBodyType<T>, R extends SDK.ServerAPI.InferResponseType<T> = SDK.ServerAPI.InferResponseType<T>>(...args: B extends void ? [api: T] : [api: T, body: B]): Promise<R>;
   abstract onDataUpdate<T extends SDK.ServerAPI.API | SDK.ServerAPI.APIExtends>(api: T, fn: (response: SDK.ServerAPI.SocketResponseType<T>) => void): void;

package/dist/utils/data/base.js

@@ -1,23 +1,3 @@
-var __async = (__this, __arguments, generator) => {
-  return new Promise((resolve, reject) => {
-    var fulfilled = (value) => {
-      try {
-        step(generator.next(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var rejected = (value) => {
-      try {
-        step(generator.throw(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
-    step((generator = generator.apply(__this, __arguments)).next());
-  });
-};
 import { Data } from "@rsdoctor/utils/common";
 class BaseDataLoader {
   constructor(manifest) {
@@ -59,10 +39,8 @@ class BaseDataLoader {
   log(...args) {
     console.log(`[${this.constructor.name}]`, ...args);
   }
-  loadManifest() {
-    return __async(this, null, function* () {
-      return this.manifest;
-    });
+  async loadManifest() {
+    return this.manifest;
   }
 }
 export {

package/dist/utils/data/index.d.ts

@@ -1,5 +1,5 @@
 import { Manifest } from '@rsdoctor/types';
 import { BaseDataLoader } from './base';
-export declare function useDataLoader(manifest: Manifest.DoctorManifestWithShardingFiles | void): {
+export declare function useDataLoader(manifest: Manifest.RsdoctorManifestWithShardingFiles | void): {
   loader: void | BaseDataLoader;
 };

package/dist/utils/data/index.js

@@ -1,47 +1,25 @@
-var __async = (__this, __arguments, generator) => {
-  return new Promise((resolve, reject) => {
-    var fulfilled = (value) => {
-      try {
-        step(generator.next(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var rejected = (value) => {
-      try {
-        step(generator.throw(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
-    step((generator = generator.apply(__this, __arguments)).next());
-  });
-};
 import { useEffect, useState } from "react";
 import { LocalServerDataLoader } from "./local";
 import { RemoteDataLoader } from "./remote";
 import { getAPILoaderModeFromStorage } from "../storage";
 import { APILoaderMode4Dev } from "../../constants";
 const loaderTask = /* @__PURE__ */ new WeakMap();
-function createDataLoader(manifest) {
-  return __async(this, null, function* () {
-    try {
-      if (process.env.NODE_ENV === "development") {
-        const mode = getAPILoaderModeFromStorage();
-        if (mode === APILoaderMode4Dev.Local)
-          return new LocalServerDataLoader(manifest);
-        if (mode === APILoaderMode4Dev.Remote)
-          return new RemoteDataLoader(manifest);
-      }
-      if (manifest.__LOCAL__SERVER__) {
+async function createDataLoader(manifest) {
+  try {
+    if (process.env.NODE_ENV === "development") {
+      const mode = getAPILoaderModeFromStorage();
+      if (mode === APILoaderMode4Dev.Local)
         return new LocalServerDataLoader(manifest);
-      }
-    } catch (error) {
-      console.log("[DataLoader] fallback to RemoteDataLoader");
+      if (mode === APILoaderMode4Dev.Remote)
+        return new RemoteDataLoader(manifest);
+    }
+    if (manifest.__LOCAL__SERVER__) {
+      return new LocalServerDataLoader(manifest);
     }
-    return new RemoteDataLoader(manifest);
-  });
+  } catch (error) {
+    console.log("[DataLoader] fallback to RemoteDataLoader");
+  }
+  return new RemoteDataLoader(manifest);
 }
 function useDataLoader(manifest) {
   const [loader, setLoader] = useState(void 0);