@rsdoctor/components 0.0.2-beta.0

package/dist/components/Layout/constants.js

@@ -0,0 +1,4 @@
+const CompileName = "Compile Analysis";
+export {
+  CompileName
+};

package/dist/components/Layout/header.css

@@ -0,0 +1,12 @@
+.header-switch .ant-switch-handle {
+  top: 1px !important;
+}
+.header-icon {
+  user-select: none;
+}
+.header-icon:hover {
+  color: #1668dc;
+}
+.header-icon:active {
+  color: #40a9ff;
+}

package/dist/components/Layout/header.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import './header.sass';
+export declare const Header: React.FC;

package/dist/components/Layout/header.js

@@ -0,0 +1,87 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { TranslationOutlined } from "@ant-design/icons";
+import { Col, Dropdown, Layout, Row, Typography } from "antd";
+import { Language, Size } from "../../constants";
+import {
+  useI18n,
+  useTheme
+} from "../../utils";
+import { OverlayAlertsWithButton } from "../Alerts";
+import { BuilderSelect } from "./builder-select";
+import { Menus } from "./menus";
+import icon from "../../assets/icon.7509d763.svg";
+import "./header.css";
+const Header = () => {
+  const { i18n } = useI18n();
+  const { isLight } = useTheme();
+  const iconStyle = {
+    display: "inline-block",
+    fontSize: 20,
+    textAlign: "center",
+    verticalAlign: "middle",
+    cursor: "pointer",
+    width: 30,
+    transition: "all 0.3s ease"
+  };
+  const languages = [
+    { value: Language.Cn, label: "中文" },
+    { value: Language.En, label: "English" }
+  ];
+  return /* @__PURE__ */ jsx(
+    Layout.Header,
+    {
+      style: {
+        height: Size.NavBarHeight,
+        padding: 0,
+        paddingLeft: Size.BasePadding,
+        paddingRight: Size.BasePadding,
+        position: "fixed",
+        zIndex: 999,
+        width: "100%",
+        backgroundColor: isLight ? "#fff" : "#141414",
+        transition: "none"
+      },
+      children: /* @__PURE__ */ jsxs(Row, { justify: "space-between", align: "middle", style: { height: Size.NavBarHeight }, wrap: false, children: [
+        /* @__PURE__ */ jsx(Col, { style: { height: Size.NavBarHeight, lineHeight: `${Size.NavBarHeight + 2}px` }, children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", height: "100%" }, children: [
+          /* @__PURE__ */ jsx("img", { style: { height: 30 }, src: icon, className: "web-doctor-logo", alt: "logo" }),
+          /* @__PURE__ */ jsx(Typography.Text, { style: { color: "inherit", fontSize: 18, marginLeft: 4 }, children: "Rsdoctor" }),
+          /* @__PURE__ */ jsx(BuilderSelect, {})
+        ] }) }),
+        /* @__PURE__ */ jsx(Col, { flex: 1, children: /* @__PURE__ */ jsxs(
+          Row,
+          {
+            align: "middle",
+            justify: "end",
+            style: { height: Size.NavBarHeight },
+            wrap: false,
+            gutter: [Size.BasePadding / 3, 0],
+            children: [
+              /* @__PURE__ */ jsx(Col, { children: /* @__PURE__ */ jsx(OverlayAlertsWithButton, {}) }),
+              /* @__PURE__ */ jsx(Menus, { style: { transition: "none" } }),
+              /* @__PURE__ */ jsx(Col, { children: /* @__PURE__ */ jsx(
+                Dropdown,
+                {
+                  overlayStyle: { zIndex: 1e3 },
+                  menu: {
+                    items: languages.map((e) => ({
+                      label: e.label,
+                      key: e.value,
+                      onClick() {
+                        i18n.changeLanguage(e.value);
+                      }
+                    })),
+                    selectedKeys: [i18n.language]
+                  },
+                  children: /* @__PURE__ */ jsx(TranslationOutlined, { className: "header-icon", style: iconStyle })
+                }
+              ) })
+            ]
+          }
+        ) })
+      ] })
+    }
+  );
+};
+export {
+  Header
+};

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

@@ -0,0 +1,5 @@
+import { PropsWithChildren } from 'react';
+export interface LayoutProps {
+  children: JSX.Element;
+}
+export declare const Layout: (props: PropsWithChildren<LayoutProps>) => JSX.Element;

package/dist/components/Layout/index.js

@@ -0,0 +1,34 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect } from "react";
+import { FloatButton, Layout as L } from "antd";
+import { Size } from "../../constants";
+import { Header } from "./header";
+import { useLocale, useI18n } from "../../utils";
+import { Progress } from "./progress";
+const Layout = (props) => {
+  const locale = useLocale();
+  const { i18n } = useI18n();
+  const { children } = props;
+  useEffect(() => {
+    if (i18n.language !== locale) {
+      i18n.changeLanguage(locale);
+    }
+  }, [locale]);
+  return /* @__PURE__ */ jsxs(L, { children: [
+    /* @__PURE__ */ jsx(Header, {}),
+    /* @__PURE__ */ jsx(Progress, {}),
+    /* @__PURE__ */ jsxs(
+      L.Content,
+      {
+        style: { height: "100%", minHeight: "100vh", padding: Size.BasePadding, marginTop: Size.NavBarHeight },
+        children: [
+          children,
+          /* @__PURE__ */ jsx(FloatButton.BackTop, {})
+        ]
+      }
+    )
+  ] });
+};
+export {
+  Layout
+};

package/dist/components/Layout/menus.d.ts

@@ -0,0 +1,8 @@
+import { Manifest } from '@rsdoctor/types';
+import React from 'react';
+export declare const Menus: React.FC<Omit<{
+  style?: React.CSSProperties | undefined;
+  routes: Manifest.DoctorManifestClientRoutes[];
+}, "routes"> & Partial<{
+  body?: any;
+}>>;

package/dist/components/Layout/menus.js

@@ -0,0 +1,155 @@
+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 { jsx } from "react/jsx-runtime";
+import {
+  ApiOutlined,
+  BarChartOutlined,
+  FolderViewOutlined,
+  MenuOutlined,
+  MonitorOutlined,
+  NodeIndexOutlined,
+  ToolOutlined
+} from "@ant-design/icons";
+import { Manifest, SDK } from "@rsdoctor/types";
+import { Col, Grid, Menu, Typography } from "antd";
+import { includes } from "lodash-es";
+import { useLocation, useNavigate } from "react-router-dom";
+import WebpackIcon from "../../assets/webpack.98604d64.svg";
+import { Size } from "../../constants";
+import * as OverallConstants from "../../pages/Overall/constants";
+import { useI18n, hasBundle, hasCompile } from "../../utils";
+import { withServerAPI } from "../Manifest";
+import { BundleSize, LoaderFiles, PluginsAnalyze, ModuleResolve, LoaderTimeline } from "../../pages";
+import { CompileName } from "./constants";
+const BuilderSwitchName = "builder-switcher";
+const MenusBase = (props) => {
+  const { t } = useI18n();
+  const { pathname } = useLocation();
+  const navigate = useNavigate();
+  const { routes: enableRoutes } = props;
+  const iconStyle = {
+    fontSize: 16
+  };
+  const customIconStyle = __spreadProps(__spreadValues({}, iconStyle), {
+    transform: "translateY(-2px)"
+  });
+  const items = [];
+  const { xxl } = Grid.useBreakpoint();
+  console.log("enableRoutes: ", enableRoutes);
+  if (includes(enableRoutes, Manifest.DoctorManifestClientRoutes.Overall)) {
+    items.push({
+      label: t(OverallConstants.name),
+      key: OverallConstants.route,
+      icon: /* @__PURE__ */ jsx(BarChartOutlined, { style: iconStyle }),
+      children: [],
+      onTitleClick(e) {
+        navigate(e.key);
+      }
+    });
+  }
+  if (hasCompile(enableRoutes)) {
+    items.push({
+      label: t(CompileName),
+      key: CompileName,
+      icon: /* @__PURE__ */ jsx(ToolOutlined, { style: iconStyle }),
+      children: [
+        includes(enableRoutes, Manifest.DoctorManifestClientRoutes.WebpackLoaders) && {
+          label: /* @__PURE__ */ jsx(Typography.Text, { style: { marginRight: 8 }, children: t(LoaderFiles.name) }),
+          key: LoaderFiles.route,
+          icon: /* @__PURE__ */ jsx("img", { src: WebpackIcon, alt: "", style: __spreadProps(__spreadValues({}, iconStyle), { width: 16 }) }),
+          children: [
+            {
+              label: t(LoaderTimeline.name),
+              key: LoaderTimeline.route,
+              icon: /* @__PURE__ */ jsx(BarChartOutlined, { style: iconStyle })
+            },
+            {
+              label: t(LoaderFiles.name),
+              key: LoaderFiles.route,
+              icon: /* @__PURE__ */ jsx(MonitorOutlined, { style: iconStyle })
+            }
+          ]
+        },
+        includes(enableRoutes, Manifest.DoctorManifestClientRoutes.ModuleResolve) && {
+          label: t(ModuleResolve.name),
+          key: ModuleResolve.route,
+          icon: /* @__PURE__ */ jsx(NodeIndexOutlined, { style: iconStyle })
+        },
+        includes(enableRoutes, Manifest.DoctorManifestClientRoutes.WebpackPlugins) && {
+          label: t(PluginsAnalyze.name),
+          key: PluginsAnalyze.route,
+          icon: /* @__PURE__ */ jsx(ApiOutlined, { style: iconStyle })
+        }
+      ].filter((e) => Boolean(e))
+    });
+  }
+  if (hasBundle(enableRoutes)) {
+    items.push({
+      label: t(BundleSize.name),
+      key: BundleSize.name,
+      icon: /* @__PURE__ */ jsx("span", { style: customIconStyle, children: "📦" }),
+      children: [
+        includes(enableRoutes, Manifest.DoctorManifestClientRoutes.BundleSize) && {
+          label: t(BundleSize.name),
+          key: BundleSize.route,
+          icon: /* @__PURE__ */ jsx(FolderViewOutlined, { style: iconStyle })
+        }
+        // TODO: Tree shaking menu
+        // includes(enableRoutes, Manifest.DoctorManifestClientRoutes.TreeShaking) && {
+        //   label: t(TreeShakingConstants.name),
+        //   key: TreeShakingConstants.route,
+        //   icon: <ShakeOutlined style={iconStyle} />,
+        // },
+      ].filter((e) => Boolean(e))
+    });
+  }
+  const MenuComponent = /* @__PURE__ */ jsx(
+    Menu,
+    {
+      items,
+      mode: "horizontal",
+      onClick: (e) => {
+        if (!e.keyPath.includes(BuilderSwitchName)) {
+          navigate(e.key);
+        }
+      },
+      overflowedIndicator: /* @__PURE__ */ jsx(MenuOutlined, {}),
+      style: __spreadValues({ height: Size.NavBarHeight, lineHeight: `${Size.NavBarHeight}px` }, props.style),
+      selectedKeys: [pathname === "/" ? OverallConstants.route : pathname]
+    },
+    enableRoutes.join("")
+  );
+  if (items.length <= 2) {
+    return /* @__PURE__ */ jsx(Col, { children: MenuComponent });
+  }
+  if (xxl) {
+    return /* @__PURE__ */ jsx(Col, { children: MenuComponent });
+  }
+  return /* @__PURE__ */ jsx(Col, { xs: { span: 3 }, md: { span: 6 }, lg: { span: 10 }, xl: { span: 11 }, children: MenuComponent });
+};
+const Menus = withServerAPI({
+  api: SDK.ServerAPI.API.GetClientRoutes,
+  responsePropName: "routes",
+  Component: MenusBase,
+  fallbackComponent: () => null
+});
+export {
+  Menus
+};

package/dist/components/Layout/progress.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { SDK } from '@rsdoctor/types';
+export interface ProgressProps {
+  progress: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.APIExtends.GetCompileProgess>;
+}
+export declare const Progress: React.FC<Omit<ProgressProps, "progress"> & Partial<{
+  body?: any;
+}>>;

package/dist/components/Layout/progress.js

@@ -0,0 +1,44 @@
+import { jsx } from "react/jsx-runtime";
+import { Col, Progress as P, Row, Typography } from "antd";
+import { SDK } from "@rsdoctor/types";
+import { Size } from "../../constants";
+import { withServerAPI } from "../Manifest";
+const ProgressBase = ({ progress }) => {
+  if (!progress)
+    return null;
+  const { percentage = 1, message } = progress;
+  if (percentage >= 1)
+    return null;
+  const per = +(percentage * 100).toFixed(1);
+  return /* @__PURE__ */ jsx(
+    Row,
+    {
+      wrap: true,
+      style: {
+        width: "100%",
+        position: "fixed",
+        top: Size.NavBarHeight,
+        left: 1,
+        zIndex: 99
+      },
+      children: /* @__PURE__ */ jsx(Col, { span: Math.min(Math.floor(percentage * 24), 24), children: /* @__PURE__ */ jsx(
+        P,
+        {
+          percent: 100,
+          status: "active",
+          size: "small",
+          format: () => /* @__PURE__ */ jsx(Typography.Text, { style: { fontSize: 12 }, type: "secondary", children: `${per}% ${message}` })
+        }
+      ) })
+    }
+  );
+};
+const Progress = withServerAPI({
+  api: SDK.ServerAPI.APIExtends.GetCompileProgess,
+  responsePropName: "progress",
+  Component: ProgressBase,
+  fallbackComponent: () => null
+});
+export {
+  Progress
+};

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

@@ -0,0 +1,8 @@
+import React from 'react';
+import { SDK } from '@rsdoctor/types';
+export declare const LoaderFiles: React.FC<{
+  filetree: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetLoaderFileTree>;
+  cwd: string;
+  loaders: string[];
+  filename: string;
+}>;

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

@@ -0,0 +1,187 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import React, { useMemo, useState } from "react";
+import { endsWith, get, sumBy } from "lodash-es";
+import { Card, Col, Descriptions, Divider, Drawer, Row, Space, Table, Tooltip, Typography } from "antd";
+import { CloseCircleOutlined } from "@ant-design/icons";
+import { Constants, SDK } from "@rsdoctor/types";
+import { ServerAPIProvider } from "../../Manifest";
+import { drawerWidth, Size } from "../../../constants";
+import { createFileStructures, formatCosts, mapFileKey, filterLoader } from "../../../utils";
+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);
+  const [resourcePath, setResourcePath] = useState("");
+  const [loaderIndex, setLoaderIndex] = useState(0);
+  const [selectedNode, setSelectedNode] = useState(null);
+  const maxHeight = 700;
+  const filteredFiles = useMemo(
+    () => filetree.filter((e) => e.loaders.some((l) => filterLoader(e.path, l.loader, props.filename, props.loaders))),
+    [props.filename, props.loaders]
+  );
+  const inlinedResourcePathKey = "__RESOURCEPATH__";
+  const files = useMemo(() => {
+    return createFileStructures({
+      files: filteredFiles.map((e) => e.path),
+      cwd,
+      fileTitle(file, basename) {
+        const { loaders } = filetree.find((e) => e.path === file);
+        return /* @__PURE__ */ jsxs(
+          Space,
+          {
+            style: { wordBreak: "break-all" },
+            onClick: () => {
+              setLoaderIndex(0);
+              setResourcePath(file);
+              setDrawerVisible(true);
+            },
+            children: [
+              /* @__PURE__ */ jsx(Keyword, { text: basename, keyword: props.filename }),
+              endsWith(file, Constants.JSExtension) ? /* @__PURE__ */ jsx(
+                ServerAPIProvider,
+                {
+                  api: SDK.ServerAPI.API.GetLoaderFileFirstInput,
+                  body: { file },
+                  fallbackComponent: () => null,
+                  children: (res) => /* @__PURE__ */ jsx(ECMAVersionDetectTag, { code: res })
+                }
+              ) : null,
+              loaders.map((e, i) => {
+                const isError = e.errors && e.errors.length;
+                const key = `${file}_${e.loader}_${i}`;
+                return /* @__PURE__ */ jsx(Tooltip, { title: e.path, children: /* @__PURE__ */ jsxs(
+                  Typography.Text,
+                  {
+                    code: true,
+                    style: { color: isError ? "#f50" : "inherit" },
+                    onClick: (ev) => {
+                      ev.stopPropagation();
+                      setResourcePath(file);
+                      setLoaderIndex(i);
+                      setDrawerVisible(true);
+                    },
+                    children: [
+                      /* @__PURE__ */ jsx(Typography.Text, { style: { maxWidth: 135, color: "inherit" }, ellipsis: true, children: e.loader }),
+                      /* @__PURE__ */ jsx(Divider, { type: "vertical" }),
+                      isError ? /* @__PURE__ */ jsx(CloseCircleOutlined, {}) : /* @__PURE__ */ jsx(Typography.Text, { strong: true, children: formatCosts(e.costs) })
+                    ]
+                  }
+                ) }, key);
+              })
+            ]
+          }
+        );
+      },
+      dirTitle(_dir, defaultTitle) {
+        return /* @__PURE__ */ jsx(Keyword, { text: defaultTitle, keyword: props.filename });
+      }
+    });
+  }, [filteredFiles]);
+  return /* @__PURE__ */ jsxs(Row, { style: { width: "100%" }, gutter: Size.BasePadding, children: [
+    /* @__PURE__ */ jsx(Col, { span: 14, children: /* @__PURE__ */ jsxs(
+      Card,
+      {
+        title: /* @__PURE__ */ jsxs(Typography.Text, { strong: true, children: [
+          "Total Files: ",
+          filteredFiles.length
+        ] }),
+        bodyStyle: { overflow: "scroll", maxHeight },
+        children: [
+          /* @__PURE__ */ jsx(
+            FileTree,
+            {
+              defaultExpandedKeys: mapFileKey(files, filteredFiles.length >= 100 ? 3 : 4, (node) => {
+                const resourcePath2 = get(node, inlinedResourcePathKey);
+                const isNodeModules = resourcePath2.indexOf("/node_modules/") > -1;
+                return !isNodeModules;
+              }),
+              treeData: files,
+              onSelect: (_e, info) => {
+                if (!info.node.isLeaf) {
+                  setSelectedNode(info.node);
+                }
+              },
+              selectedKeys: selectedNode ? [selectedNode.key] : void 0,
+              expandAction: "click"
+            },
+            `${props.loaders.join("|")}_${props.filename}`
+          ),
+          /* @__PURE__ */ jsx(
+            Drawer,
+            {
+              open: drawerVisible,
+              onClose: () => setDrawerVisible(false),
+              maskClosable: true,
+              width: drawerWidth,
+              zIndex: 999,
+              bodyStyle: { padding: 0 },
+              children: drawerVisible ? /* @__PURE__ */ jsx(ServerAPIProvider, { api: SDK.ServerAPI.API.GetLoaderFileDetails, body: { path: resourcePath }, children: (data) => /* @__PURE__ */ jsx(LoaderExecutions, { data, cwd, index: loaderIndex }) }) : null
+            }
+          )
+        ]
+      }
+    ) }),
+    selectedNode ? /* @__PURE__ */ jsx(Col, { span: 10, children: /* @__PURE__ */ jsx(
+      Card,
+      {
+        title: /* @__PURE__ */ jsx(
+          Tooltip,
+          {
+            title: React.cloneElement(selectedNode.title, { style: { color: "#fff" } }),
+            children: /* @__PURE__ */ jsxs(Typography.Text, { children: [
+              'Statistics of "',
+              selectedNode.title,
+              '"'
+            ] })
+          }
+        ),
+        children: /* @__PURE__ */ jsx(
+          ServerAPIProvider,
+          {
+            api: SDK.ServerAPI.API.GetLoaderFolderStatistics,
+            body: { folder: selectedNode[inlinedResourcePathKey] },
+            children: (tableData) => /* @__PURE__ */ jsx(
+              Table,
+              {
+                style: { width: "100%", maxHeight, overflowY: "scroll", wordBreak: "break-all" },
+                pagination: false,
+                bordered: true,
+                rowKey: (e) => e.loader,
+                columns: [
+                  {
+                    title: "Loader Name",
+                    dataIndex: "loader"
+                  },
+                  {
+                    title: "Files",
+                    dataIndex: "files"
+                  },
+                  {
+                    title: "Total Duration",
+                    dataIndex: "costs",
+                    render: (v) => /* @__PURE__ */ jsx(Typography.Text, { strong: true, children: formatCosts(v) }),
+                    sorter: (a, b) => a.costs - b.costs,
+                    defaultSortOrder: "descend",
+                    sortDirections: ["descend", "ascend"]
+                  }
+                ],
+                dataSource: tableData,
+                footer: () => /* @__PURE__ */ jsxs(Descriptions, { title: "Total", bordered: true, layout: "vertical", size: "small", children: [
+                  /* @__PURE__ */ jsx(Descriptions.Item, { label: "loaders", children: tableData.length }),
+                  /* @__PURE__ */ jsx(Descriptions.Item, { label: "files", children: sumBy(tableData, (e) => e.files) }),
+                  /* @__PURE__ */ jsx(Descriptions.Item, { label: "duration", children: /* @__PURE__ */ jsx(Typography.Text, { strong: true, children: formatCosts(sumBy(tableData, (e) => e.costs)) }) })
+                ] })
+              }
+            )
+          }
+        )
+      }
+    ) }) : null
+  ] });
+};
+export {
+  LoaderFiles
+};

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

@@ -0,0 +1,11 @@
+import React from 'react';
+export declare const LoaderAnalysisBase: React.FC<{
+  cwd: string;
+}>;
+export declare const LoaderAnalysis: React.FC<Omit<{
+  cwd: string;
+}, "cwd"> & Partial<{
+  body: {
+    key: import("@rsdoctor/types/dist/manifest").DoctorManifestMappingKeys;
+  };
+}>>;

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

@@ -0,0 +1,23 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { SDK } from "@rsdoctor/types";
+import { ServerAPIProvider, withServerAPI } from "../../Manifest";
+import { LoaderFiles } from "./files";
+import { LoaderCommonSelect } from "../../Select";
+const LoaderAnalysisBase = ({ cwd }) => {
+  const [store, setStore] = useState({ filename: "", loaders: [] });
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx(ServerAPIProvider, { api: SDK.ServerAPI.API.GetLoaderNames, children: (loaderNames) => /* @__PURE__ */ jsx(LoaderCommonSelect, { onChange: (e) => setStore(e), loaderNames }) }),
+    /* @__PURE__ */ jsx(ServerAPIProvider, { api: SDK.ServerAPI.API.GetLoaderFileTree, children: (filetree) => /* @__PURE__ */ jsx(LoaderFiles, { filename: store.filename, filetree, loaders: store.loaders, cwd }) })
+  ] });
+};
+const LoaderAnalysis = withServerAPI({
+  api: SDK.ServerAPI.API.LoadDataByKey,
+  body: { key: "root" },
+  responsePropName: "cwd",
+  Component: LoaderAnalysisBase
+});
+export {
+  LoaderAnalysis,
+  LoaderAnalysisBase
+};

package/dist/components/Loader/executions.d.ts

@@ -0,0 +1,13 @@
+import { PropsWithChildren } from 'react';
+import { SDK } from '@rsdoctor/types';
+interface LoaderExecutionsProps {
+  cwd: string;
+  data: SDK.ServerAPI.InferResponseType<SDK.ServerAPI.API.GetLoaderFileDetails>;
+  index?: number;
+}
+export declare const LoaderExecutions: ({
+  data,
+  cwd,
+  index
+}: PropsWithChildren<LoaderExecutionsProps>) => JSX.Element;
+export {};