@docusaurus/theme-classic 2.0.0-beta.16 → 2.0.0-beta.19

package/lib/getSwizzleConfig.js

@@ -11,91 +11,232 @@ exports.default = getSwizzleConfig;
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
+
+/* eslint sort-keys: "error" */
 function getSwizzleConfig() {
   return {
     components: {
       CodeBlock: {
         actions: {
-          wrap: 'safe',
-          eject: 'safe'
+          eject: 'safe',
+          wrap: 'safe'
         },
         description: 'The component used to render multi-line code blocks, generally used in Markdown files.'
       },
+      ColorModeToggle: {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe'
+        },
+        description: 'The color mode toggle to switch between light and dark mode.'
+      },
       DocSidebar: {
         actions: {
-          wrap: 'safe',
-          eject: 'unsafe' // too much technical code in sidebar, not very safe atm
-
+          eject: 'unsafe',
+          // Too much technical code in sidebar, not very safe atm
+          wrap: 'safe'
         },
         description: 'The sidebar component on docs pages'
       },
       Footer: {
         actions: {
-          wrap: 'safe',
-          eject: 'unsafe' // TODO split footer into smaller parts
-
+          eject: 'safe',
+          wrap: 'safe'
         },
         description: "The footer component of you site's layout"
       },
-      NotFound: {
+      'Footer/Copyright': {
         actions: {
-          wrap: 'safe',
-          eject: 'safe'
+          eject: 'safe',
+          wrap: 'safe'
         },
-        description: 'The global 404 page of your site, meant to be ejected and customized'
+        description: 'The footer copyright'
       },
-      SearchBar: {
+      'Footer/Layout': {
         actions: {
-          wrap: 'safe',
-          eject: 'safe'
+          eject: 'safe',
+          wrap: 'safe'
         },
-        // TODO how to describe this one properly?
-        // By default it's an empty placeholder for the user to fill
-        description: 'The search bar component of your site, appearing in the navbar.'
+        description: 'The footer main layout component'
+      },
+      'Footer/LinkItem': {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe'
+        },
+        description: 'The footer link item component'
+      },
+      'Footer/Links': {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe'
+        },
+        description: 'The footer component rendering the footer links'
+      },
+      'Footer/Links/MultiColumn': {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe'
+        },
+        description: 'The footer component rendering the footer links with a multi-column layout'
+      },
+      'Footer/Links/Simple': {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe'
+        },
+        description: 'The footer component rendering the footer links with a simple layout (single row)'
+      },
+      'Footer/Logo': {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe'
+        },
+        description: 'The footer logo'
       },
       IconArrow: {
         actions: {
-          wrap: 'safe',
-          eject: 'safe'
+          eject: 'safe',
+          wrap: 'safe'
         },
         description: 'The arrow icon component'
       },
+      IconDarkMode: {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe'
+        },
+        description: 'The dark mode icon component.'
+      },
       IconEdit: {
         actions: {
-          wrap: 'safe',
-          eject: 'safe'
+          eject: 'safe',
+          wrap: 'safe'
         },
         description: 'The edit icon component'
       },
-      IconMenu: {
+      IconLightMode: {
         actions: {
-          wrap: 'safe',
-          eject: 'safe'
+          eject: 'safe',
+          wrap: 'safe'
         },
-        description: 'The menu icon component'
+        description: 'The light mode icon component.'
       },
-      'prism-include-languages': {
+      IconMenu: {
         actions: {
-          wrap: 'forbidden',
-          // not a component!
-          eject: 'safe'
+          eject: 'safe',
+          wrap: 'safe'
         },
-        description: 'The Prism languages to include for code block syntax highlighting. Meant to be ejected.'
+        description: 'The menu icon component'
       },
       MDXComponents: {
         actions: {
-          wrap: 'forbidden',
-          /// TODO allow wrapping objects???
-          eject: 'safe'
+          eject: 'safe',
+          wrap: 'forbidden' /// TODO allow wrapping objects???
+
         },
         description: 'The MDX components to use for rendering MDX files. Meant to be ejected.'
       },
+      'MDXComponents/A': {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe'
+        },
+        description: 'The component used to render <a> tags and Markdown links in MDX'
+      },
+      'MDXComponents/Code': {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe'
+        },
+        description: 'The component used to render <code> tags and Markdown code blocks in MDX'
+      },
+      'MDXComponents/Details': {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe'
+        },
+        description: 'The component used to render <details> tags in MDX'
+      },
+      'MDXComponents/Head': {
+        actions: {
+          eject: 'forbidden',
+          wrap: 'forbidden'
+        },
+        description: 'Technical component used to assign metadata (generally for SEO purpose) to the current MDX document'
+      },
+      'MDXComponents/Heading': {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe'
+        },
+        description: 'The component used to render heading tags (<h1>, <h2>...) and Markdown headings in MDX'
+      },
+      'MDXComponents/Img': {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe'
+        },
+        description: 'The component used to render <img> tags and Markdown images in MDX'
+      },
+      'MDXComponents/Pre': {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe'
+        },
+        description: 'The component used to render <pre> tags in MDX'
+      },
+      'MDXComponents/Ul': {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe'
+        },
+        description: 'The component used to render <ul> tags and Markdown unordered lists in MDX'
+      },
+      MDXContent: {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe'
+        },
+        description: 'A component wrapping all MDX content and providing the MDXComponents to the MDX context'
+      },
+      'NavbarItem/ComponentTypes': {
+        actions: {
+          eject: 'safe',
+          wrap: 'forbidden'
+        },
+        description: 'The Navbar item components mapping. Can be ejected to add custom navbar item types. See https://github.com/facebook/docusaurus/issues/7227.'
+      },
       // TODO should probably not even appear here
       'NavbarItem/utils': {
         actions: {
-          wrap: 'forbidden',
-          eject: 'forbidden'
+          eject: 'forbidden',
+          wrap: 'forbidden'
         }
+      },
+      NotFound: {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe'
+        },
+        description: 'The global 404 page of your site, meant to be ejected and customized'
+      },
+      SearchBar: {
+        actions: {
+          eject: 'safe',
+          wrap: 'safe'
+        },
+        // TODO how to describe this one properly?
+        // By default it's an empty placeholder for the user to fill
+        description: 'The search bar component of your site, appearing in the navbar.'
+      },
+      'prism-include-languages': {
+        actions: {
+          eject: 'safe',
+          wrap: 'forbidden' // Not a component!
+
+        },
+        description: 'The Prism languages to include for code block syntax highlighting. Meant to be ejected.'
       }
     }
   };

package/lib/index.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.AnnouncementBarDismissStorageKey = void 0;
-exports.default = docusaurusThemeClassic;
+exports.default = themeClassic;
 Object.defineProperty(exports, "getSwizzleConfig", {
   enumerable: true,
   get: function () {
@@ -20,8 +20,6 @@ Object.defineProperty(exports, "validateThemeConfig", {
 
 var _translations = require("./translations");
 
-var _path = _interopRequireDefault(require("path"));
-
 var _module = require("module");
 
 var _rtlcss = _interopRequireDefault(require("rtlcss"));
@@ -110,27 +108,24 @@ function getInfimaCSSFile(direction) {
   return `infima/dist/css/default/default${direction === 'rtl' ? '-rtl' : ''}.css`;
 }
 
-function docusaurusThemeClassic(context, options) {
+function themeClassic(context, options) {
   const {
-    siteConfig: {
-      themeConfig: roughlyTypedThemeConfig
-    },
     i18n: {
       currentLocale,
       localeConfigs
     }
   } = context;
-  const themeConfig = roughlyTypedThemeConfig || {};
+  const themeConfig = context.siteConfig.themeConfig;
   const {
     announcementBar,
     colorMode,
     prism: {
-      additionalLanguages = []
-    } = {}
+      additionalLanguages
+    }
   } = themeConfig;
   const {
     customCss
-  } = options || {};
+  } = options ?? {};
   const {
     direction
   } = localeConfigs[currentLocale];
@@ -138,14 +133,14 @@ function docusaurusThemeClassic(context, options) {
     name: 'docusaurus-theme-classic',
 
     getThemePath() {
-      return _path.default.join(__dirname, '../lib-next/theme');
+      return '../lib-next/theme';
     },
 
     getTypeScriptThemePath() {
-      return _path.default.resolve(__dirname, '../src/theme');
+      return '../src/theme';
     },
 
-    getTranslationFiles: async () => (0, _translations.getTranslationFiles)({
+    getTranslationFiles: () => (0, _translations.getTranslationFiles)({
       themeConfig
     }),
     translateThemeConfig: params => (0, _translations.translateThemeConfig)({
@@ -161,7 +156,7 @@ function docusaurusThemeClassic(context, options) {
     },
 
     getClientModules() {
-      const modules = [require.resolve(getInfimaCSSFile(direction)), _path.default.resolve(__dirname, './prism-include-languages'), _path.default.resolve(__dirname, './admonitions.css')];
+      const modules = [require.resolve(getInfimaCSSFile(direction)), './prism-include-languages', './admonitions.css', './nprogress'];
 
       if (customCss) {
         if (Array.isArray(customCss)) {

package/lib/nprogress.css

@@ -0,0 +1,41 @@
+/**
+ * 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.
+ */
+
+/**
+ * Styles for NProgress
+ * Copied over to remove unused styles for the spinner.
+ * https://github.com/rstacruz/nprogress/blob/master/nprogress.css
+ */
+
+:root {
+  --docusaurus-progress-bar-color: var(--ifm-color-primary);
+}
+
+#nprogress {
+  pointer-events: none;
+}
+
+#nprogress .bar {
+  background: var(--docusaurus-progress-bar-color);
+  position: fixed;
+  z-index: 1031;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 2px;
+}
+
+#nprogress .peg {
+  position: absolute;
+  right: 0;
+  width: 100px;
+  height: 100%;
+  box-shadow: 0 0 10px var(--docusaurus-progress-bar-color),
+    0 0 5px var(--docusaurus-progress-bar-color);
+  opacity: 1;
+  transform: rotate(3deg) translate(0, -4px);
+}

package/lib/nprogress.js

@@ -0,0 +1,46 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _nprogress = _interopRequireDefault(require("nprogress"));
+
+require("./nprogress.css");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+/**
+ * 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.
+ */
+_nprogress.default.configure({
+  showSpinner: false
+});
+
+const delay = 200;
+const clientModule = {
+  onRouteUpdate({
+    location,
+    previousLocation
+  }) {
+    if (previousLocation && location.pathname !== previousLocation.pathname) {
+      const progressBarTimeout = window.setTimeout(() => {
+        _nprogress.default.start();
+      }, delay);
+      return () => window.clearTimeout(progressBarTimeout);
+    }
+
+    return undefined;
+  },
+
+  onRouteDidUpdate() {
+    _nprogress.default.done();
+  }
+
+};
+var _default = clientModule;
+exports.default = _default;