@rsdoctor/components 0.4.7 → 0.4.9

package/dist/components/Charts/index.js

@@ -13,12 +13,27 @@ var ChartDimension = /* @__PURE__ */ ((ChartDimension2) => {
 })(ChartDimension || {});
 const LoaderChartBase = ({ project }) => {
   const { root: cwd } = project;
-  const [store, setStore] = useState({ filename: "", loaders: [] });
-  const [dimension, setDimension] = useState(0 /* Loader */);
+  const [store, setStore] = useState({
+    filename: "",
+    loaders: [],
+    layer: ""
+  });
+  const [dimension, setDimension] = useState(
+    0 /* Loader */
+  );
   return /* @__PURE__ */ jsxs(Space, { direction: "vertical", style: { width: "100%" }, children: [
     /* @__PURE__ */ jsx(ServerAPIProvider, { api: SDK.ServerAPI.API.GetLoaderNames, children: (loaderNames) => /* @__PURE__ */ jsx(LoaderCommonSelect, { onChange: setStore, loaderNames }) }),
     /* @__PURE__ */ jsx(ServerAPIProvider, { api: SDK.ServerAPI.API.GetLoaderChartData, children: (res) => {
-      const loaders = res.filter((el) => filterLoader(el.resource, el.loader, store.filename, store.loaders));
+      const loaders = res.filter(
+        (el) => filterLoader(
+          el.resource,
+          el.loader,
+          store.filename,
+          store.loaders,
+          el.layer,
+          store?.layer
+        )
+      );
       return dimension === 0 /* Loader */ ? /* @__PURE__ */ jsx(LoaderExecutionsChart, { loaders, cwd }) : (
         // <ProcessExecutionsChart loaders={loaders} cwd={cwd} pid={pid} />
         /* @__PURE__ */ jsx(Fragment, {})

package/dist/components/Charts/utils.js

@@ -13,6 +13,10 @@ function getTooltipHtmlForLoader(loader) {
       <span>isPitch</span>
       <span>${loader.isPitch}</span>
     </li>
+    ${loader.layer && `<li class="loader-tooltip-item">
+        <span>layer</span>
+        <span>${loader.layer}</span>
+      </li>`}
     <li class="loader-tooltip-item">
       <span>duration</span>
       <span class="loader-tooltip-text-bold">${formatCosts(loader.costs)}</span>

package/dist/components/Layout/header.js

@@ -67,7 +67,7 @@ const Header = () => {
                         {
                           style: { height: 30 },
                           src: "https://assets.rspack.dev/rsdoctor/rsdoctor-logo-960x960.png",
-                          className: "web-doctor-logo",
+                          className: "rsdoctor-logo",
                           alt: "logo"
                         }
                       ),

package/dist/components/Layout/index.js

@@ -1,9 +1,15 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useContext, useEffect } from "react";
 import { FloatButton, Layout as L } from "antd";
-import { MAIN_BG, Size } from "../../constants";
+import { Language, MAIN_BG, Size } from "../../constants";
 import { Header } from "./header";
-import { useLocale, useI18n } from "../../utils";
+import {
+  useLocale,
+  useI18n,
+  getFirstVisitFromStorage,
+  setFirstVisitToStorage,
+  getLanguage
+} from "../../utils";
 import { Progress } from "./progress";
 import { ConfigContext } from "../../config";
 const Layout = (props) => {
@@ -11,8 +17,18 @@ const Layout = (props) => {
   const { i18n } = useI18n();
   const { children } = props;
   useEffect(() => {
-    if (i18n.language !== locale) {
-      i18n.changeLanguage(locale);
+    let currentLocale = locale;
+    const visited = getFirstVisitFromStorage();
+    if (!visited) {
+      setFirstVisitToStorage("1");
+      const targetLang = window.navigator.language.split("-")[0];
+      const userLang = getLanguage(targetLang);
+      if (Object.values(Language).includes(userLang)) {
+        currentLocale = userLang;
+      }
+    }
+    if (i18n.language !== currentLocale) {
+      i18n.changeLanguage(currentLocale);
     }
   }, [locale]);
   const ctx = useContext(ConfigContext);

package/dist/components/Loader/Analysis/files.d.ts

@@ -5,4 +5,5 @@ export declare const LoaderFiles: React.FC<{
     cwd: string;
     loaders: string[];
     filename: string;
+    layer?: string;
 }>;

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

@@ -1,7 +1,8 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import React, { useCallback, useMemo, useRef, useState } from "react";
-import { endsWith, get, sumBy } from "lodash-es";
+import { get, sumBy } from "lodash-es";
 import {
+  Tag,
   Card,
   Col,
   Descriptions,
@@ -14,7 +15,7 @@ import {
   Typography
 } from "antd";
 import { CloseCircleOutlined } from "@ant-design/icons";
-import { Constants, SDK } from "@rsdoctor/types";
+import { SDK } from "@rsdoctor/types";
 import { ServerAPIProvider } from "../../Manifest";
 import { drawerWidth, Size } from "../../../constants";
 import {
@@ -27,7 +28,6 @@ import {
 import { LoaderExecutions } from "../executions";
 import { FileTree } from "../../FileTree";
 import { Keyword } from "../../Keyword";
-import { ECMAVersionDetectTag } from "../../worker/ecmaversion/client";
 const LoaderFiles = (props) => {
   const { cwd, filetree } = props;
   const [drawerVisible, setDrawerVisible] = useState(false);
@@ -43,10 +43,17 @@ const LoaderFiles = (props) => {
   const filteredFiles = useMemo(
     () => filetree.filter(
       (e) => e.loaders.some(
-        (l) => filterLoader(e.path, l.loader, props.filename, props.loaders)
+        (l) => filterLoader(
+          e.path,
+          l.loader,
+          props.filename,
+          props.loaders,
+          e.layer,
+          props?.layer
+        )
       )
     ),
-    [props.filename, props.loaders]
+    [props.filename, props.loaders, props.layer]
   );
   const inlinedResourcePathKey = "__RESOURCEPATH__";
   const files = useMemo(() => {
@@ -54,7 +61,7 @@ const LoaderFiles = (props) => {
       files: filteredFiles.map((e) => e.path),
       cwd,
       fileTitle(file, basename) {
-        const { loaders } = filetree.find((e) => e.path === file);
+        const { loaders, layer } = filetree.find((e) => e.path === file);
         return /* @__PURE__ */ jsxs(
           Space,
           {
@@ -65,16 +72,14 @@ const LoaderFiles = (props) => {
               setDrawerVisible(true);
             },
             children: [
-              /* @__PURE__ */ jsx(Keyword, { text: basename, keyword: props.filename }),
-              endsWith(file, Constants.JSExtension) ? /* @__PURE__ */ jsx(
-                ServerAPIProvider,
+              /* @__PURE__ */ jsx(
+                Keyword,
                 {
-                  api: SDK.ServerAPI.API.GetLoaderFileFirstInput,
-                  body: { file },
-                  fallbackComponent: () => null,
-                  children: (res) => /* @__PURE__ */ jsx(ECMAVersionDetectTag, { code: res })
+                  text: basename.replace(/\[.*?\]/g, ""),
+                  keyword: props.filename
                 }
-              ) : null,
+              ),
+              layer ? /* @__PURE__ */ jsx(Tag, { color: "cyan", bordered: false, children: layer }) : /* @__PURE__ */ jsx(Fragment, {}),
               loaders.map((e, i) => {
                 const isError = e.errors && e.errors.length;
                 const key = `${file}_${e.loader}_${i}`;

package/dist/components/Loader/Analysis/index.js

@@ -5,7 +5,11 @@ import { ServerAPIProvider, withServerAPI } from "../../Manifest";
 import { LoaderFiles } from "./files";
 import { LoaderCommonSelect } from "../../Select";
 const LoaderAnalysisBase = ({ cwd }) => {
-  const [store, setStore] = useState({ filename: "", loaders: [] });
+  const [store, setStore] = useState({
+    filename: "",
+    loaders: [],
+    layer: ""
+  });
   return /* @__PURE__ */ jsxs("div", { children: [
     /* @__PURE__ */ jsx(ServerAPIProvider, { api: SDK.ServerAPI.API.GetLoaderNames, children: (loaderNames) => /* @__PURE__ */ jsx(
       LoaderCommonSelect,
@@ -20,6 +24,7 @@ const LoaderAnalysisBase = ({ cwd }) => {
         filename: store.filename,
         filetree,
         loaders: store.loaders,
+        layer: store.layer,
         cwd
       }
     ) })

package/dist/components/Loader/executions.js

@@ -1,7 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { ClockCircleOutlined } from "@ant-design/icons";
 import Editor from "@monaco-editor/react";
-import { Constants } from "@rsdoctor/types";
 import {
   Badge,
   Button,
@@ -17,7 +16,6 @@ import {
   Tabs
 } from "antd";
 import dayjs from "dayjs";
-import { endsWith } from "lodash-es";
 import { useCallback, useState } from "react";
 import { Size } from "../../constants";
 import {
@@ -30,7 +28,6 @@ import { Card } from "../Card";
 import { DiffViewer } from "../CodeViewer";
 import { CodeOpener } from "../Opener";
 import { Title } from "../Title";
-import { JSIsEqualTag } from "../worker/jsequal/client";
 const LoaderInfoItem = ({
   label,
   value,
@@ -48,9 +45,7 @@ const LoaderInfoItem = ({
 };
 const LoaderPropsItem = ({
   loader,
-  hasError,
   resource,
-  before,
   cwd
 }) => {
   return /* @__PURE__ */ jsxs(
@@ -61,7 +56,6 @@ const LoaderPropsItem = ({
       extra: /* @__PURE__ */ jsx(Tag, { icon: /* @__PURE__ */ jsx(ClockCircleOutlined, {}), color: "default", children: dayjs(loader.startAt).format("YYYY-MM-DD HH:mm:ss") }),
       children: [
         loader.isPitch ? /* @__PURE__ */ jsx(Typography.Text, { code: true, children: "pitch" }) : null,
-        loader.isPitch || hasError || !endsWith(resource.path, Constants.JSExtension) ? null : /* @__PURE__ */ jsx(JSIsEqualTag, { input: before, output: loader.result || "" }),
         /* @__PURE__ */ jsxs(
           Space,
           {
@@ -216,9 +210,7 @@ const LoaderExecutions = ({
               LoaderPropsItem,
               {
                 loader,
-                hasError,
                 resource,
-                before,
                 cwd
               }
             )

package/dist/components/Select/index.d.ts

@@ -4,12 +4,14 @@ interface LoaderNamesSelectProps {
     onChange: (loaders: string[]) => void;
     loaderNames: string[];
 }
+export type ISelectLoaderProps = {
+    loaders: string[];
+    filename: string;
+    layer?: string;
+};
 export declare const LoaderNamesSelect: React.FC<LoaderNamesSelectProps>;
 export declare const LoaderCommonSelect: React.FC<{
-    onChange(value: {
-        loaders: string[];
-        filename: string;
-    }): void;
+    onChange(value: ISelectLoaderProps): void;
     loaderNames: string[];
 }>;
 export {};

package/dist/components/Select/index.js

@@ -1,10 +1,16 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
-import { Button, Input, Select, Space, Typography } from "antd";
+import { Button, Col, Input, Row, Select, Typography } from "antd";
 import { FileSearchOutlined, SelectOutlined } from "@ant-design/icons";
 import { KeywordInput } from "../Form/keyword";
 import { Size } from "../../constants";
-const LoaderNamesSelect = ({ style, onChange, loaderNames }) => {
+import { ServerAPIProvider } from "../Manifest";
+import { SDK } from "@rsdoctor/types";
+const LoaderNamesSelect = ({
+  style,
+  onChange,
+  loaderNames
+}) => {
   const [selectLoaders, setSelectLoaders] = useState([]);
   const labelStyle = { width: 120 };
   return /* @__PURE__ */ jsxs(Input.Group, { compact: true, style, children: [
@@ -18,7 +24,7 @@ const LoaderNamesSelect = ({ style, onChange, loaderNames }) => {
         mode: "multiple",
         allowClear: true,
         defaultValue: selectLoaders,
-        style: { width: 350 },
+        style: { width: 300 },
         dropdownMatchSelectWidth: true,
         placeholder: "select loaders",
         onChange: (e) => {
@@ -32,34 +38,71 @@ const LoaderNamesSelect = ({ style, onChange, loaderNames }) => {
     )
   ] });
 };
+const LoaderLayerSelect = ({ onChange, layers }) => {
+  const [layer, setLayer] = useState("");
+  const labelStyle = { width: 120 };
+  return /* @__PURE__ */ jsxs(Input.Group, { compact: true, children: [
+    /* @__PURE__ */ jsxs(Button, { style: labelStyle, children: [
+      /* @__PURE__ */ jsx(SelectOutlined, {}),
+      /* @__PURE__ */ jsx(Typography.Text, { children: "Layers" })
+    ] }),
+    /* @__PURE__ */ jsx(
+      Select,
+      {
+        allowClear: true,
+        style: { width: 150 },
+        defaultValue: layer,
+        placeholder: "select layer",
+        onChange: (e) => {
+          setLayer(e);
+          onChange(e);
+        },
+        children: layers?.length ? layers?.map((e) => {
+          return /* @__PURE__ */ jsx(Select.Option, { label: e, value: e, children: e }, e);
+        }) : /* @__PURE__ */ jsx(Fragment, {})
+      }
+    )
+  ] });
+};
 const LoaderCommonSelect = ({ onChange, loaderNames }) => {
   const [selectLoaders, setSelectLoaders] = useState([]);
   const [filename, setFilename] = useState("");
+  const [layer, setLayer] = useState("");
   useEffect(() => {
-    onChange({ loaders: selectLoaders, filename });
-  }, [selectLoaders, filename]);
-  return /* @__PURE__ */ jsxs(Space, { style: { marginBottom: Size.BasePadding }, children: [
-    /* @__PURE__ */ jsx(
+    onChange({ loaders: selectLoaders, filename, layer });
+  }, [selectLoaders, filename, layer]);
+  return /* @__PURE__ */ jsxs(Row, { style: { marginBottom: Size.BasePadding }, children: [
+    /* @__PURE__ */ jsx(Col, { children: /* @__PURE__ */ jsx(
       LoaderNamesSelect,
       {
         loaderNames,
-        style: { marginRight: Size.BasePadding - 8 },
+        style: { marginRight: Size.BasePadding / 2 },
         onChange: (e) => {
           setSelectLoaders(e);
         }
       }
-    ),
-    /* @__PURE__ */ jsx(
+    ) }),
+    /* @__PURE__ */ jsx(Col, { children: /* @__PURE__ */ jsx(
       KeywordInput,
       {
         icon: /* @__PURE__ */ jsx(FileSearchOutlined, {}),
+        style: { marginRight: Size.BasePadding / 2 },
         label: "Filename",
         placeholder: "search filename by keyword",
         onChange: (e) => {
           setFilename(e);
         }
       }
-    )
+    ) }),
+    /* @__PURE__ */ jsx(Col, { children: /* @__PURE__ */ jsx(ServerAPIProvider, { api: SDK.ServerAPI.API.GetLayers, children: (layers) => layers.length ? /* @__PURE__ */ jsx(
+      LoaderLayerSelect,
+      {
+        layers,
+        onChange: (e) => {
+          setLayer(e);
+        }
+      }
+    ) : /* @__PURE__ */ jsx(Fragment, {}) }) })
   ] });
 };
 export {

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

@@ -177,8 +177,9 @@ const WebpackModulesOverallBase = ({ errors, cwd, summary, entryPoints }) => {
             Empty,
             {
               description: /* @__PURE__ */ jsxs("div", { children: [
-                "Generate Tile Graph is Closed.",
-                /* @__PURE__ */ jsx("a", { href: "https://rsdoctor.dev/zh/config/options/options#generatetilegraph", children: "Please check the document." })
+                "Tile graph is disabled,",
+                " ",
+                /* @__PURE__ */ jsx("a", { href: "https://rsdoctor.dev/config/options/options#generatetilegraph", children: "see the documentation to learn how to enable." })
               ] })
             }
           );

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

@@ -6,7 +6,7 @@ const Page = () => {
   return /* @__PURE__ */ jsx(
     Card,
     {
-      title: "Webpack Loader Analysis",
+      title: "Loader Analysis",
       extra: /* @__PURE__ */ jsx(WebpackConfigurationViewer, { defaultKeys: ["module", "resolve"] }),
       bodyStyle: { paddingTop: 0, height: 800 },
       children: /* @__PURE__ */ jsx(LoaderAnalysis, {})

package/dist/utils/data/local.js

@@ -41,10 +41,10 @@ class LocalServerDataLoader extends BaseDataLoader {
   async loadAPI(...args) {
     const [api, body] = args;
     const key = body ? `${api}_${JSON.stringify(body)}` : `${api}`;
-    const socketUrl = this.get("__SOCKET__URL__") ?? "";
+    const socketPort = this.get("__SOCKET__PORT__") ?? "";
     return this.limit(key, async () => {
       return new Promise((resolve) => {
-        getSocket(socketUrl).emit(
+        getSocket(socketPort).emit(
           api,
           body,
           (res) => {

package/dist/utils/loader.d.ts

@@ -3,5 +3,5 @@ import { SDK } from '@rsdoctor/types';
 declare const findLoaderTotalTiming: typeof Loader.findLoaderTotalTiming, getLoaderCosts: typeof Loader.getLoaderCosts;
 export { findLoaderTotalTiming, getLoaderCosts };
 export declare function flattenLoaderData(loaderData: SDK.LoaderData): SDK.LoaderTransformData[];
-export declare function filterLoaders(loaderData: SDK.ResourceLoaderData, keyword: string, loaderNames: string[]): SDK.LoaderTransformData[];
-export declare function filterLoader(resourcePath: string, loader: string, keyword: string, loaderNames: string[]): boolean;
+export declare function filterLoaders(loaderData: SDK.ResourceLoaderData, keyword: string, loaderNames: string[], layer?: string): SDK.LoaderTransformData[];
+export declare function filterLoader(resourcePath: string, loader: string, keyword: string, loaderNames: string[], resorceLayer?: string, layer?: string): boolean;

package/dist/utils/loader.js

@@ -4,21 +4,26 @@ const { findLoaderTotalTiming, getLoaderCosts } = Loader;
 function flattenLoaderData(loaderData) {
   return flatten(loaderData.map((e) => e.loaders));
 }
-function filterLoaders(loaderData, keyword, loaderNames) {
+function filterLoaders(loaderData, keyword, loaderNames, layer) {
   return loaderData.loaders.filter((item) => {
     return filterLoader(
       loaderData.resource.path,
       item.loader,
       keyword,
-      loaderNames
+      loaderNames,
+      loaderData.resource.layer,
+      layer
     );
   });
 }
-function filterLoader(resourcePath, loader, keyword, loaderNames) {
+function filterLoader(resourcePath, loader, keyword, loaderNames, resorceLayer, layer) {
   if (keyword) {
     if (resourcePath.indexOf(keyword) === -1)
       return false;
   }
+  if (resorceLayer && layer && resorceLayer !== layer) {
+    return false;
+  }
   if (loaderNames?.length) {
     if (!includes(loaderNames, loader))
       return false;

package/dist/utils/locale.d.ts

@@ -1,2 +1,4 @@
 import type { Locale } from 'antd/es/locale';
+import { Language } from '../constants';
 export declare function getLocale(locale: string): Locale;
+export declare function getLanguage(locale: string): Language;

package/dist/utils/locale.js

@@ -1,9 +1,15 @@
 import cn from "antd/es/locale/zh_CN";
 import en from "antd/es/locale/en_GB";
+import { Language } from "../constants";
 function getLocale(locale) {
   const res = locale === "cn" || locale === "zh-CN" ? cn : en;
   return res;
 }
+function getLanguage(locale) {
+  const res = locale === "cn" || locale === "zh" ? Language.Cn : Language.En;
+  return res;
+}
 export {
+  getLanguage,
   getLocale
 };

package/dist/utils/request.d.ts

@@ -4,6 +4,7 @@ export declare function loadManifestByUrl(url: string): Promise<{
     data: Manifest.RsdoctorManifestData;
     cloudData?: Record<keyof Manifest.RsdoctorManifestData, string[] | string>;
     __LOCAL__SERVER__?: boolean;
+    __SOCKET__PORT__?: string;
     __SOCKET__URL__?: string;
     client: Manifest.RsdoctorManifestClient;
     cloudManifestUrl?: string | undefined;
@@ -16,6 +17,7 @@ export declare function parseManifest(json: Manifest.RsdoctorManifestWithShardin
     data: Manifest.RsdoctorManifestData;
     cloudData?: Record<keyof Manifest.RsdoctorManifestData, string[] | string>;
     __LOCAL__SERVER__?: boolean;
+    __SOCKET__PORT__?: string;
     __SOCKET__URL__?: string;
     client: Manifest.RsdoctorManifestClient;
     cloudManifestUrl?: string | undefined;

package/dist/utils/socket.d.ts

@@ -1,2 +1,7 @@
 import { Socket } from 'socket.io-client';
-export declare function getSocket(socketUrl?: string): Socket;
+export declare function getSocket(socketPort?: string): Socket;
+export declare function formatURL({ port, protocol, hostname, }: {
+    port?: string;
+    protocol: string;
+    hostname: string;
+}): string;

package/dist/utils/socket.js

@@ -12,10 +12,31 @@ function ensureSocket(socketUrl = defaultSocketUrl) {
   }
   return map.get(socketUrl);
 }
-function getSocket(socketUrl) {
-  const socket = ensureSocket(socketUrl || defaultSocketUrl);
+function getSocket(socketPort) {
+  const socketUrl = formatURL({
+    port: socketPort,
+    hostname: location.hostname,
+    protocol: location.protocol
+  });
+  const socket = ensureSocket(socketPort ? socketUrl : defaultSocketUrl);
   return socket;
 }
+function formatURL({
+  port,
+  protocol,
+  hostname
+}) {
+  if (typeof URL !== "undefined") {
+    const url = new URL("http://localhost");
+    url.port = String(port);
+    url.hostname = hostname;
+    url.protocol = location.protocol.includes("https") ? "wss" : "ws";
+    return url.toString();
+  }
+  const colon = protocol.indexOf(":") === -1 ? ":" : "";
+  return `${protocol}${colon}//${hostname}:${port}`;
+}
 export {
+  formatURL,
   getSocket
 };

package/dist/utils/storage.d.ts

@@ -11,3 +11,5 @@ export declare function setViewModeToStorage(viewMode: Config['viewMode']): void
 export declare function hasViewModeFromStorage(): boolean;
 export declare function setAPILoaderModeToStorage(mode: APILoaderMode4Dev): void;
 export declare function getAPILoaderModeFromStorage(): string;
+export declare function getFirstVisitFromStorage(): string | null;
+export declare function setFirstVisitToStorage(value: '1'): void;

package/dist/utils/storage.js

@@ -5,6 +5,7 @@ var Keys = /* @__PURE__ */ ((Keys2) => {
   Keys2["Locale"] = "LOCALE";
   Keys2["ViewMode"] = "VIEWMODE";
   Keys2["APILoaderMode4Dev"] = "APILOADERMODE_DEV";
+  Keys2["FirstVisit"] = "FIRST_VISIT";
   return Keys2;
 })(Keys || {});
 function getStorage(key) {
@@ -55,14 +56,22 @@ function setAPILoaderModeToStorage(mode) {
 function getAPILoaderModeFromStorage() {
   return getStorage("APILOADERMODE_DEV" /* APILoaderMode4Dev */) || APILoaderMode4Dev.Default;
 }
+function getFirstVisitFromStorage() {
+  return getStorage("FIRST_VISIT" /* FirstVisit */);
+}
+function setFirstVisitToStorage(value) {
+  setStorage("FIRST_VISIT" /* FirstVisit */, value);
+}
 export {
   getAPILoaderModeFromStorage,
+  getFirstVisitFromStorage,
   getLocaleFromStorage,
   getStorage,
   getThemeFromStorage,
   getViewModeFromStorage,
   hasViewModeFromStorage,
   setAPILoaderModeToStorage,
+  setFirstVisitToStorage,
   setLocaleToStorage,
   setStorage,
   setThemeToStorage,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rsdoctor/components",
-  "version": "0.4.7",
+  "version": "0.4.9",
   "main": "./dist/index.js",
   "license": "MIT",
   "module": "dist/index.js",
@@ -49,7 +49,7 @@
     "@types/lodash-es": "4.17.12",
     "@types/node": "^16",
     "@types/path-browserify": "1.0.3",
-    "@types/react": "^18.3.11",
+    "@types/react": "^18.3.12",
     "@types/react-highlight-words": "^0.20.0",
     "@types/url-parse": "1.4.11",
     "ansi-to-react": "6.1.6",
@@ -72,12 +72,11 @@
     "react-markdown": "^9.0.1",
     "react-router-dom": "6.4.3",
     "socket.io-client": "4.6.1",
-    "terser": "^5.34.1",
     "typescript": "^5.2.2",
     "url-parse": "1.5.10",
-    "@rsdoctor/graph": "0.4.7",
-    "@rsdoctor/types": "0.4.7",
-    "@rsdoctor/utils": "0.4.7"
+    "@rsdoctor/graph": "0.4.9",
+    "@rsdoctor/types": "0.4.9",
+    "@rsdoctor/utils": "0.4.9"
   },
   "publishConfig": {
     "access": "public",

package/dist/components/worker/ecmaversion/client.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-import { ECMAVersion } from '@rsdoctor/utils/ruleUtils';
-export declare function useECMAVersionDetectWorker(props: {
-    code: string;
-}): {
-    version: ECMAVersion | undefined;
-};
-export declare const ECMAVersionDetectTag: React.FC<{
-    code: string;
-}>;

package/dist/components/worker/ecmaversion/client.js

@@ -1,60 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { useEffect, useState } from "react";
-import { BadgeColorMap, BadgeType } from "../../Badge";
-import { ECMAVersion } from "@rsdoctor/utils/ruleUtils";
-import { master } from "../../../utils/worker";
-const getECMAVersionDetectWorker = () => new Worker(new URL("./worker.js", import.meta.url));
-function useECMAVersionDetectWorker(props) {
-  const { code } = props;
-  const [version, setVersion] = useState();
-  useEffect(() => {
-    if (!code)
-      return;
-    const worker = master.detectWorker(getECMAVersionDetectWorker);
-    const { abort } = worker.emit(code, (data) => {
-      setVersion(data);
-    });
-    return () => {
-      abort();
-    };
-  }, [code]);
-  return {
-    version
-  };
-}
-const TagColor = {
-  [ECMAVersion.ES5]: BadgeColorMap[BadgeType.Success],
-  [ECMAVersion.ES6]: BadgeColorMap[BadgeType.Error],
-  [ECMAVersion.ES7P]: BadgeColorMap[BadgeType.Error]
-};
-const ECMAVersionDetectTag = ({ code }) => {
-  if (!code)
-    return null;
-  const height = 19.5;
-  const { version } = useECMAVersionDetectWorker({ code });
-  if (!version) {
-    return null;
-  }
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      style: {
-        display: "inline-block",
-        height,
-        padding: `0px 4px`,
-        width: 40,
-        fontSize: 10,
-        lineHeight: `${height}px`,
-        textAlign: "center",
-        color: "#fff",
-        background: TagColor[version] || BadgeColorMap[BadgeType.Default],
-        borderRadius: 4
-      },
-      children: version
-    }
-  );
-};
-export {
-  ECMAVersionDetectTag,
-  useECMAVersionDetectWorker
-};

package/dist/components/worker/ecmaversion/worker.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/components/worker/ecmaversion/worker.js

@@ -1,13 +0,0 @@
-const { parser, ECMAVersion } = require("@rsdoctor/utils/ruleUtils");
-const { handleMessageInWorker } = require("../../../utils/worker");
-const cache = /* @__PURE__ */ new Map();
-handleMessageInWorker({
-  workerName: "ecmaversion",
-  handler: (code) => {
-    if (cache.has(code))
-      return cache.get(code) || "";
-    const version = parser.utils.detectECMAVersion(code);
-    cache.set(code, version);
-    return version;
-  }
-});

package/dist/components/worker/jsequal/client.d.ts

@@ -1,11 +0,0 @@
-import React from 'react';
-export declare function useJSEqualWorker(props: {
-    input: string;
-    output: string;
-}): {
-    isEqual: boolean;
-};
-export declare const JSIsEqualTag: React.FC<{
-    input: string;
-    output: string;
-}>;

package/dist/components/worker/jsequal/client.js

@@ -1,38 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { useEffect, useState } from "react";
-import { Tag } from "antd";
-import { master } from "../../../utils/worker";
-import { useI18n } from "../../../utils";
-const getJSEqualWorker = () => new Worker(new URL("./worker.js", import.meta.url));
-function useJSEqualWorker(props) {
-  const { input, output } = props;
-  const [isEqual, setIsEqual] = useState(false);
-  useEffect(() => {
-    if (!input || !output)
-      return;
-    const worker = master.detectWorker(getJSEqualWorker);
-    const { abort } = worker.emit({ input, output }, (data) => {
-      setIsEqual(data);
-    });
-    return () => {
-      abort();
-    };
-  }, [input, output]);
-  return {
-    isEqual
-  };
-}
-const JSIsEqualTag = ({ input, output }) => {
-  if (!input || !output)
-    return null;
-  const { isEqual } = useJSEqualWorker({ input, output });
-  const { t } = useI18n();
-  if (!isEqual) {
-    return null;
-  }
-  return /* @__PURE__ */ jsx(Tag, { color: "warning", children: t("the file content not changed after transpiled by this loader") });
-};
-export {
-  JSIsEqualTag,
-  useJSEqualWorker
-};

package/dist/components/worker/jsequal/worker.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/components/worker/jsequal/worker.js

@@ -1,23 +0,0 @@
-const { minify: terserMinify } = require("terser");
-const { handleMessageInWorker } = require("../../../utils/worker");
-const cache = /* @__PURE__ */ new Map();
-function minify(code) {
-  return terserMinify(code, {
-    module: true,
-    compress: false,
-    mangle: false,
-    sourceMap: false
-  }).then((res) => res.code);
-}
-handleMessageInWorker({
-  workerName: "jsequal",
-  handler: async ({ input = "", output = "" }) => {
-    const key = input + output;
-    if (cache.has(key))
-      return cache.get(key) || "";
-    const [inputMinified, outputMinified] = await Promise.all([minify(input), minify(output)]);
-    const isEqual = inputMinified === outputMinified;
-    cache.set(key, isEqual);
-    return isEqual;
-  }
-});