@docusaurus/plugin-debug 2.0.0-beta.1ec2c95e3 → 2.0.0-beta.21

package/lib/index.d.ts

@@ -4,5 +4,5 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import { LoadContext, Plugin } from '@docusaurus/types';
-export default function pluginDebug({ siteConfig: { baseUrl }, generatedFilesDir, }: LoadContext): Plugin<void>;
+import type { LoadContext, Plugin } from '@docusaurus/types';
+export default function pluginDebug({ siteConfig: { baseUrl }, generatedFilesDir, }: LoadContext): Plugin<undefined>;

package/lib/index.js

@@ -7,49 +7,52 @@
  */
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const utils_1 = require("@docusaurus/utils");
 const path_1 = tslib_1.__importDefault(require("path"));
+const utils_1 = require("@docusaurus/utils");
 function pluginDebug({ siteConfig: { baseUrl }, generatedFilesDir, }) {
     const pluginDataDirRoot = path_1.default.join(generatedFilesDir, 'docusaurus-plugin-debug');
-    const aliasedSource = (source) => `~debug/${utils_1.posixPath(path_1.default.relative(pluginDataDirRoot, source))}`;
+    const aliasedSource = (source) => `~debug/${(0, utils_1.posixPath)(path_1.default.relative(pluginDataDirRoot, source))}`;
     return {
         name: 'docusaurus-plugin-debug',
         getThemePath() {
-            return path_1.default.resolve(__dirname, '../src/theme');
+            return '../lib/theme';
+        },
+        getTypeScriptThemePath() {
+            return '../src/theme';
         },
         async contentLoaded({ actions: { createData, addRoute }, allContent }) {
             const allContentPath = await createData(
             // Note that this created data path must be in sync with
             // metadataPath provided to mdx-loader.
-            `${utils_1.docuHash('docusaurus-debug-allContent')}.json`, JSON.stringify(allContent, null, 2));
+            `${(0, utils_1.docuHash)('docusaurus-debug-allContent')}.json`, JSON.stringify(allContent, null, 2));
             // Home is config (duplicate for now)
             addRoute({
-                path: utils_1.normalizeUrl([baseUrl, '__docusaurus/debug']),
+                path: (0, utils_1.normalizeUrl)([baseUrl, '__docusaurus/debug']),
                 component: '@theme/DebugConfig',
                 exact: true,
             });
             addRoute({
-                path: utils_1.normalizeUrl([baseUrl, '__docusaurus/debug/config']),
+                path: (0, utils_1.normalizeUrl)([baseUrl, '__docusaurus/debug/config']),
                 component: '@theme/DebugConfig',
                 exact: true,
             });
             addRoute({
-                path: utils_1.normalizeUrl([baseUrl, '__docusaurus/debug/metadata']),
+                path: (0, utils_1.normalizeUrl)([baseUrl, '__docusaurus/debug/metadata']),
                 component: '@theme/DebugSiteMetadata',
                 exact: true,
             });
             addRoute({
-                path: utils_1.normalizeUrl([baseUrl, '__docusaurus/debug/registry']),
+                path: (0, utils_1.normalizeUrl)([baseUrl, '__docusaurus/debug/registry']),
                 component: '@theme/DebugRegistry',
                 exact: true,
             });
             addRoute({
-                path: utils_1.normalizeUrl([baseUrl, '__docusaurus/debug/routes']),
+                path: (0, utils_1.normalizeUrl)([baseUrl, '__docusaurus/debug/routes']),
                 component: '@theme/DebugRoutes',
                 exact: true,
             });
             addRoute({
-                path: utils_1.normalizeUrl([baseUrl, '__docusaurus/debug/content']),
+                path: (0, utils_1.normalizeUrl)([baseUrl, '__docusaurus/debug/content']),
                 component: '@theme/DebugContent',
                 exact: true,
                 modules: {
@@ -57,7 +60,7 @@ function pluginDebug({ siteConfig: { baseUrl }, generatedFilesDir, }) {
                 },
             });
             addRoute({
-                path: utils_1.normalizeUrl([baseUrl, '__docusaurus/debug/globalData']),
+                path: (0, utils_1.normalizeUrl)([baseUrl, '__docusaurus/debug/globalData']),
                 component: '@theme/DebugGlobalData',
                 exact: true,
             });

package/lib/theme/DebugConfig/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/// <reference types="react" />
+export default function DebugMetadata(): JSX.Element;

package/lib/theme/DebugConfig/index.js

@@ -0,0 +1,19 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import React from 'react';
+import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
+import DebugLayout from '@theme/DebugLayout';
+import DebugJsonView from '@theme/DebugJsonView';
+export default function DebugMetadata() {
+  const {siteConfig} = useDocusaurusContext();
+  return (
+    <DebugLayout>
+      <h2>Site config</h2>
+      <DebugJsonView src={siteConfig} collapseDepth={3} />
+    </DebugLayout>
+  );
+}

package/lib/theme/DebugContent/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/// <reference types="react" />
+import type { Props } from '@theme/DebugContent';
+export default function DebugContent({ allContent }: Props): JSX.Element;

package/lib/theme/DebugContent/index.js

@@ -0,0 +1,59 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import React from 'react';
+import DebugLayout from '@theme/DebugLayout';
+import DebugJsonView from '@theme/DebugJsonView';
+function PluginInstanceContent({pluginId, pluginInstanceContent}) {
+  return (
+    <section style={{marginBottom: 30}}>
+      <code>{pluginId}</code>
+      <DebugJsonView src={pluginInstanceContent} collapseDepth={2} />
+    </section>
+  );
+}
+function PluginContent({pluginName, pluginContent}) {
+  return (
+    <section style={{marginBottom: 60}}>
+      <h3>{pluginName}</h3>
+      <div>
+        {Object.entries(pluginContent)
+          // Filter plugin instances with no content
+          .filter(([, pluginInstanceContent]) => !!pluginInstanceContent)
+          .map(([pluginId, pluginInstanceContent]) => (
+            <PluginInstanceContent
+              key={pluginId}
+              pluginId={pluginId}
+              pluginInstanceContent={pluginInstanceContent}
+            />
+          ))}
+      </div>
+    </section>
+  );
+}
+export default function DebugContent({allContent}) {
+  return (
+    <DebugLayout>
+      <h2>Plugin content</h2>
+      <div>
+        {Object.entries(allContent)
+          // Filter plugins with no content
+          .filter(([, pluginContent]) =>
+            Object.values(pluginContent).some(
+              (instanceContent) => !!instanceContent,
+            ),
+          )
+          .map(([pluginName, pluginContent]) => (
+            <PluginContent
+              key={pluginName}
+              pluginName={pluginName}
+              pluginContent={pluginContent}
+            />
+          ))}
+      </div>
+    </DebugLayout>
+  );
+}

package/lib/theme/DebugGlobalData/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/// <reference types="react" />
+export default function DebugMetadata(): JSX.Element;

package/{src → lib}/theme/DebugGlobalData/index.js

@@ -4,21 +4,16 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-
 import React from 'react';
-
-import DebugLayout from '../DebugLayout';
-import DebugJsonView from '../DebugJsonView';
 import useGlobalData from '@docusaurus/useGlobalData';
-
-function DebugMetadata() {
+import DebugLayout from '@theme/DebugLayout';
+import DebugJsonView from '@theme/DebugJsonView';
+export default function DebugMetadata() {
   const globalData = useGlobalData();
   return (
     <DebugLayout>
       <h2>Global data</h2>
-      <DebugJsonView src={globalData} collapseDepth="3" />
+      <DebugJsonView src={globalData} collapseDepth={3} />
     </DebugLayout>
   );
 }
-
-export default DebugMetadata;

package/lib/theme/DebugJsonView/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/// <reference types="react" />
+import type { Props } from '@theme/DebugJsonView';
+export default function DebugJsonView({ src, collapseDepth, }: Props): JSX.Element;

package/{src → lib}/theme/DebugJsonView/index.js

@@ -4,29 +4,25 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-
 import React from 'react';
-
 import BrowserOnly from '@docusaurus/BrowserOnly';
-
-// avoids "react-json-view" to display  "root"
-const RootName = false;
-
+// Avoids "react-json-view" displaying "root"
+const RootName = null;
 // Seems ReactJson does not work with SSR
 // https://github.com/mac-s-g/react-json-view/issues/121
-const BrowserOnlyReactJson = (props) => {
+function BrowserOnlyReactJson(props) {
   return (
     <BrowserOnly>
       {() => {
-        // eslint-disable-next-line global-require
-        const ReactJson = require('react-json-view').default;
+        const {default: ReactJson} =
+          // eslint-disable-next-line global-require, @typescript-eslint/no-var-requires
+          require('react-json-view');
         return <ReactJson {...props} />;
       }}
     </BrowserOnly>
   );
-};
-
-function DebugJsonView({src, collapseDepth}) {
+}
+export default function DebugJsonView({src, collapseDepth}) {
   return (
     <BrowserOnlyReactJson
       src={src}
@@ -38,18 +34,16 @@ function DebugJsonView({src, collapseDepth}) {
       }}
       name={RootName}
       theme="paraiso"
-      shouldCollapse={(field) => {
+      shouldCollapse={(field) =>
         // By default, we collapse the json for performance reasons
         // See https://github.com/mac-s-g/react-json-view/issues/235
         // Non-root elements that are larger than 50 fields are collapsed
-        return field.name !== RootName && Object.keys(field.src).length > 50;
-      }}
+        field.name !== RootName && Object.keys(field.src).length > 50
+      }
       collapsed={collapseDepth}
-      groupArraysAfterLength="5"
+      groupArraysAfterLength={5}
       enableClipboard={false}
       displayDataTypes={false}
     />
   );
 }
-
-export default DebugJsonView;

package/lib/theme/DebugLayout/index.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { type ReactNode } from 'react';
+export default function DebugLayout({ children, }: {
+    children: ReactNode;
+}): JSX.Element;

package/{src → lib}/theme/DebugLayout/index.js

@@ -4,31 +4,31 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-
 import React from 'react';
 import Head from '@docusaurus/Head';
 import Link from '@docusaurus/Link';
 import styles from './styles.module.css';
-
-const DebugNavLink = ({to, children}) => (
-  <Link
-    className={styles.navlink}
-    isNavLink
-    to={to}
-    exact
-    activeStyle={{
-      backgroundColor: '#363739',
-    }}>
-    {children}
-  </Link>
-);
-
-function DebugLayout({children}) {
+function DebugNavLink({to, children}) {
+  return (
+    <Link
+      className={styles.navlink}
+      isNavLink
+      to={to}
+      exact
+      activeStyle={{
+        backgroundColor: '#363739',
+      }}>
+      {children}
+    </Link>
+  );
+}
+export default function DebugLayout({children}) {
   return (
     <>
       <Head>
         <html lang="en" />
         <title>Docusaurus debug panel</title>
+        <meta name="robots" content="noindex" />
       </Head>
 
       <div>
@@ -51,5 +51,3 @@ function DebugLayout({children}) {
     </>
   );
 }
-
-export default DebugLayout;

package/lib/theme/DebugLayout/styles.module.css

@@ -0,0 +1,75 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+.container {
+  padding: 20px;
+  padding-top: 80px;
+  overflow-x: hidden;
+  background-color: #18191a;
+  color: white;
+  min-height: 100vh;
+}
+
+.container code {
+  color: white;
+  background-color: #444950;
+}
+
+.nav {
+  position: fixed;
+  display: flex;
+  justify-content: space-evenly;
+  align-items: center;
+  height: 3.75rem;
+  background-color: #242526;
+  width: 100%;
+  z-index: 1;
+}
+
+.navlink {
+  color: white;
+  font-weight: 500;
+  font-size: clamp(12px, 4vw, 16px);
+  text-align: center;
+  border-radius: 4px;
+  padding: 6px;
+}
+
+.navlink:hover {
+  text-decoration: none;
+  background-color: #292a2b;
+}
+
+.active {
+  background-color: #363739;
+}
+
+@media screen and (min-width: 800px) {
+  .nav {
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: center;
+    height: 100vh;
+    width: 200px;
+    float: left;
+    background-color: #18191a;
+    border-right: 1px solid #606770;
+    padding-top: 20px;
+  }
+
+  .navlink {
+    width: 80%;
+    margin-top: 20px;
+    text-align: left;
+  }
+
+  .container {
+    padding-top: 40px;
+    float: right;
+    width: calc(100% - 200px);
+  }
+}

package/lib/theme/DebugRegistry/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/// <reference types="react" />
+export default function DebugRegistry(): JSX.Element;

package/lib/theme/DebugRegistry/index.js

@@ -0,0 +1,29 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import React from 'react';
+import registry from '@generated/registry';
+import DebugLayout from '@theme/DebugLayout';
+import styles from './styles.module.css';
+export default function DebugRegistry() {
+  return (
+    <DebugLayout>
+      <h2>Registry</h2>
+      <ul className="clean-list">
+        {Object.values(registry).map(([, aliasedPath, resolved]) => (
+          <li key={aliasedPath} className={styles.listItem}>
+            <div style={{marginBottom: '10px'}}>
+              Aliased Path: <code>{aliasedPath}</code>
+            </div>
+            <div>
+              Resolved Path: <code>{resolved}</code>
+            </div>
+          </li>
+        ))}
+      </ul>
+    </DebugLayout>
+  );
+}

package/lib/theme/DebugRegistry/styles.module.css

@@ -0,0 +1,13 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+.listItem {
+  background-color: #242526;
+  padding: 10px;
+  border-radius: 4px;
+  margin-bottom: 20px;
+}

package/lib/theme/DebugRoutes/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/// <reference types="react" />
+export default function DebugRoutes(): JSX.Element;

package/{src → lib}/theme/DebugRoutes/index.js

@@ -4,19 +4,16 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-
 import React from 'react';
-
-import DebugLayout from '../DebugLayout';
-import DebugJsonView from '../DebugJsonView';
 import routes from '@generated/routes';
+import DebugLayout from '@theme/DebugLayout';
+import DebugJsonView from '@theme/DebugJsonView';
 import styles from './styles.module.css';
-
-function DebugRoutes() {
+export default function DebugRoutes() {
   return (
     <DebugLayout>
       <h2>Routes</h2>
-      <ul className={styles.list}>
+      <ul className="clean-list">
         {routes.map(({path, exact, routes: childRoutes}) => (
           <li key={path} className={styles.listItem}>
             <div className={styles.route}>
@@ -37,5 +34,3 @@ function DebugRoutes() {
     </DebugLayout>
   );
 }
-
-export default DebugRoutes;

package/lib/theme/DebugRoutes/styles.module.css

@@ -0,0 +1,21 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+.listItem {
+  background-color: #242526;
+  padding: 10px;
+  border-radius: 4px;
+  margin-bottom: 20px;
+}
+
+.route {
+  margin-bottom: 10px;
+}
+
+.routeName {
+  color: #e06b6b;
+}

package/lib/theme/DebugSiteMetadata/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/// <reference types="react" />
+export default function DebugMetadata(): JSX.Element;

package/{src → lib}/theme/DebugSiteMetadata/index.js

@@ -4,14 +4,11 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-
 import React from 'react';
-
-import DebugLayout from '../DebugLayout';
 import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
+import DebugLayout from '@theme/DebugLayout';
 import styles from './styles.module.css';
-
-function DebugMetadata() {
+export default function DebugMetadata() {
   const {siteMetadata} = useDocusaurusContext();
   return (
     <DebugLayout>
@@ -21,18 +18,19 @@ function DebugMetadata() {
       </div>
       <div>
         Site Version:{' '}
-        <code>{siteMetadata.siteVersion || 'No version specified'}</code>
+        <code>{siteMetadata.siteVersion ?? 'No version specified'}</code>
       </div>
       <h3 className={styles.sectionTitle}>Plugins and themes</h3>
-      <ul className={styles.list}>
+      <ul className="clean-list">
         {Object.entries(siteMetadata.pluginVersions).map(
           ([name, versionInformation]) => (
             <li key={name} className={styles.listItem}>
-              {versionInformation.version && (
-                <div className={styles.version}>
-                  <code>{versionInformation.version}</code>
-                </div>
-              )}
+              {versionInformation.type === 'package' &&
+                versionInformation.version && (
+                  <div className={styles.version}>
+                    <code>{versionInformation.version}</code>
+                  </div>
+                )}
               <div className={styles.name}>{name}</div>
               <div>Type: {versionInformation.type}</div>
             </li>
@@ -42,5 +40,3 @@ function DebugMetadata() {
     </DebugLayout>
   );
 }
-
-export default DebugMetadata;

package/lib/theme/DebugSiteMetadata/styles.module.css

@@ -0,0 +1,26 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+.sectionTitle {
+  margin-top: 20px;
+}
+
+.listItem {
+  background-color: #242526;
+  padding: 10px;
+  border-radius: 4px;
+  margin-bottom: 20px;
+}
+
+.version {
+  float: right;
+}
+
+.name {
+  font-weight: 800;
+  color: #e06b6b;
+}