Skip to content

relmify/typedoc-functional-theme

 
 

Repository files navigation

Functional theme for TypeDoc

npm

This plugin contains a flexible theme for TypeDoc that builds additional features on top of typedoc-neo-theme's improved navigation and readability. Specifically, typedoc-next-theme adds support for displaying and filtering by category, and displaying additional tags of your choice. It .

Additionally, it extends Typedoc with additional options for a richer user experience.

Screenshot of external module design

Visit the Actions on Google Node.js reference to view this theme.

Visit http://typedoc.org/ to learn more about TypeDoc.

Installation and Configuration

Install via npm:

npm install -D typedoc-functional-theme

Or yarn:

yarn install typedoc-functional-theme

Enable the theme when running from the command line:

typedoc --options typedoc.json --theme node_modules/typedoc-functional-theme/bin/default

Or you can specify the theme as a typedoc option in your tsconfig.json file:

"typedocOptions": {
    "inputFiles": [
        "./src"
    ],
    "theme": "node_modules/typedoc-functional-theme/bin/default",
    "mode": "modules",
    "out": "docs",
    // "out": "docs",
    "exclude": [
        "**/src/test/*",
        "**/*.test.ts",
        "**/__tests__/*",
        "**/__mocks__/*"
    ],
    "excludeNotExported": true
},

Theme features

Directory-based module navigation

Just like with typescript-neo-theme, the left navigation bar is automatically organized to group modules into directories. You can also customize what you do and don't display as a plugin feature.

Display tags that aren't displayed by the default themes

Typedoc has specific handling for only a narrow set of tags. Other tags are still collected and available for display, but are not displayed in the default themes. Even though @category is specifically supported, it is not displayed in the default theme. Other tags are collected but not displayed in the default theme.

Category display and filtering

Even though typedoc has specific support for the @category tag, it doesn't display categories as part of the default themes. With this theme, module-level categories will be displayed as badges in the left menu. It's also possible to filter the left menu by category to narrow down the modules to module types of particular interest.

The @category tag can be used for items within a module or file too, and will be displayed there too.

Plugin features

This plugin adds additional options that can be placed in your typedoc.json file.

Links

You may want to specify additional links to appear in your header that don't point to reference documentation but related documentation for your platform.

"links": [{
    "label": "Guides",
    "url": "https://developers.google.com/actions/extending-the-assistant"
  }, {
    "label": "Reference",
    "url": "https://developers.google.com/actions/reference/nodejsv2/overview"
  }]

Outline

The left-hand side is a global navigation. This can be auto-generated by the Typedoc engine and theme, or it can be manually specified by including an object in your options. You provide a custom navigation with links that point to modules/{object value}.html.

"outline": [{
    "Actions SDK": {
      "Overview": "actionssdk",
      "api/v2": "actionssdk_api_v2"
    },
    "Dialogflow": {
      "Overview": "dialogflow",
      "api/v1": "dialogflow_api_v1",
      "api/v2": "dialogflow_api_v2"
    }
  }]

Search

Not all of the files in the reference documentation may be useful for developers. You can select certain pages to be high priority. These will retain the icon, along with displaying a subtitle and a kind (like class or interface). Items not included will be deprioritized, with smaller text.

"search": [{
    "name": "dialogflow.DialogflowConversation.data",
    "subtitle": "Persistent data"
  }, {
    "name": "conversation/response.BasicCard",
    "subtitle": "Rich response"
  }, {
    "name": "conversation/response.BasicCardOptions",
    "subtitle": "Rich response"
  }]

Link to source

You can set up links to your source code under each property in the documentation.

"source": [{
  "path": "https://github.com/actions-on-google/actions-on-google-nodejs/blob/master/src/",
  "line": "L"
}]

For a particular file and line, this can take you to a valid GitHub source for the Actions on Google Node.js project.

License

This project is based on typedoc-neo-theme which is in turn based on typedoc-default-themes by Sebastian Lenz.

Licensed under the Apache License 2.0.

About

No description, website, or topics provided.

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • HTML 78.6%
  • Shell 8.5%
  • JavaScript 8.2%
  • TypeScript 4.7%