Sidebar

A generated sidebar items file is generated to the relevant output directory along with the generated markdown documentation.

This can be referenced either in the sidebars file (recommended) or injected into the autogenerated sidebar.

Consuming Generated File

Sidebars File

This file can be referenced in your Docusaurus sidebar file, using a sidebar slice and can be configured in following way:

CommonJs

By default a file named typedoc-sidebar.cjs is generated to be consumed with consumed with CommonJs setups as follows:

sidebars.js


// @ts-check
 
/** @type {import('@docusaurus/plugin-content-docs').SidebarsConfig} */
const sidebars = {
  typedocSidebar: [
    {
      type: 'category',
      label: 'TypeDoc API',
      link: {
        type: 'doc',
        id: 'api/index',
      },
      items: require('./docs/api/typedoc-sidebar.cjs'),
    },
  ],
};
module.exports = sidebars;

TypeScript

If using Typescript (by setting the “typescript” flag to true in sidebar options), a file named typedoc-sidebar.ts will be generated that can be consumed as follows:

sidebars.ts


import { SidebarsConfig } from '@docusaurus/plugin-content-docs';
import typedocSidebar from './docs/api/typedoc-sidebar';
 
const sidebars: SidebarsConfig = {
  typedocSidebar: [
    {
      type: 'category',
      label: 'Typedoc API',
      link: {
        type: 'doc',
        id: 'api/index',
      },
      items: typedocSidebar,
    },
  ],
};
 
export default sidebars;

Autogenerated Sidebar

If your sidebar is autogenerated and it is not possible to reference it in the sidebars file, you can inject the file into the autogenerated sidebar in the presets object in docusaurus.config.js using the sidebarItemsGenerator function:

docusaurus.config.js


 
function injectTypeDocSidebar(items) {
  return items.map((item) => {
    if (item.link?.id === 'api/index') {
      return {
        ...item,
        items: require('./docs/api/typedoc-sidebar.cjs'),
      };
    }
    return item;
  });
}
 
presets: [
    [
      'classic',
      /** @type {import('@docusaurus/preset-classic').Options} */
      ({
        docs: {
          async sidebarItemsGenerator({
            defaultSidebarItemsGenerator,
            ...args
          }) {
            return injectTypeDocSidebar(
              await defaultSidebarItemsGenerator(args),
            );
          },
        },
      }),
    ],
  ],

Deprecated sidebar items

Deprecated sidebar items have a configurable CSS class name attached to them (see sidebar options and can be styled using CSS https://docusaurus.io/docs/styling-layout#global-styles .


.typedoc-sidebar-item-deprecated {
  text-decoration: line-through;
}