chore: Get docs building in docusaurus

docs/.gitignore

@@ -1,6 +1,20 @@
-.idea
-node_modules
-public
-static/*.js*
-static/*.css*
-resources/_gen
+# Dependencies
+/node_modules
+
+# Production
+/build
+
+# Generated files
+.docusaurus
+.cache-loader
+
+# Misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

docs/README.md

@@ -1,135 +1,41 @@
-# Vendure Docs
+# Website
 
-This is the source for the documentation part of the vendure.io website. Docs are written in markdown and the website is generated with [Hugo](https://gohugo.io).
+This website is built using [Docusaurus 2](https://docusaurus.io/), a modern static website generator.
 
-## Structure
+### Installation
 
 ```
-docs
-├── content/
-│   └── # The actual markdown files
-│       # which make up the docs, both manually-written
-│       # and auto-generated from source.
-├── data/
-│   └── # Data files used in generating the docs website
-└── diagrams/
-    └── # PlantUML diagrams used in the documentation
+$ yarn
 ```
 
-The `content` directory contains the actual documentation markdown files and images.
+### Local Development
 
-## Docs Generation
-
-All of the documentation for the TypeScript APIs and the GraphQL API is auto-generated.
-
-Run the `docs:build` script from the root of this repo.
-
-This task will:
-
-* Auto-generate the API markdown files based on the Vendure server source (see below)
-* Update the build data to match the current version and commit
-
-The generated markdown is then used by an external project which builds the Vendure website.
-
-### GraphQL Docs
-
-The GraphQL API docs are generated from the `schema.json` file which is created as part of the `codegen` script.
-
-### TypeScript Docs
-
-The TypeScript docs are generated from the TypeScript source files by running the `docs:generate-typescript-docs` script:
-
-```bash
-yarn docs:generate-typescript-docs [-w]
 ```
-
-This script uses the TypeScript compiler API to traverse the server source code and extract data about the types as well as other information such as descriptions and default values.
-
-Currently, any `interface`, `class` or `type` which includes the JSDoc `@docCategory` tag will be extracted into a markdown file in the [content/docs/api](./content/docs/api) directory. Hugo can then build the API documentation from these markdown files.
-
-#### Docs-specific JSDoc tags
-
-##### `@docsCategory`
-
-This is required as its presence determines whether the declaration is extracted into the docs. Its value should be a string corresponding to the API sub-section that this declaration belongs to, e.g. "payment", "shipping" etc.
-
-##### `@docsPage`
-
-This optional tag can be used to group declarations together onto a single page. This is useful e.g. in the case of utility functions or
-type aliases, which may be considered too trivial to get an entire page to themselves.
-
-##### `@docsWeight`
-
-This optional tag can be used to define the order of definitions on a single page. By default, multiple definitions on a page are sorted alphabetically,
-but this sometimes leaves the "main" definition near the bottom. In this case, the `@docsWeight` tag can promote it to the top (0 is first).
-
-##### `@description`
-
-This tag specifies the text description of the declaration. It supports markdown, but should not be used for code blocks, which should be tagged with `@example` (see below). Links to other declarations can be made with the `{@link SomeOtherDeclaration}` syntax. Also applies to class/interface members.
-
-##### `@example`
-
-This tag should be used to include any code blocks. Remember to specify the language after the opening delimiter for correct highlighting. Also applies to class/interface members. If the example code includes the `@` character, it must be escaped
-so that it is not interpreted as a JSDoc tag:
-
-```ts
-import { VendureConfig } from '\@vendure/core';
+$ yarn start
 ```
 
-##### `@default`
+This command starts a local development server and opens up a browser window. Most changes are reflected live without having to restart the server.
 
-This is used to specify the default value of a property, e.g. when documenting an optional configuration option.
+### Build
 
-##### `@internal`
-
-This is used to exclude members from appearing in the docs. For example, a class may need a particular
-public method for internal use, but this method is not intended to be used by external consumers of that
-class.
+```
+$ yarn build
+```
 
-##### `@since`
+This command generates static content into the `build` directory and can be served using any static contents hosting service.
 
-The @since tag indicates that a class, method, or other symbol was added in a specific version.
+### Deployment
 
-##### `@experimental`
+Using SSH:
 
-The @experimental tag indicates that a class, method, or other symbol is part of an experimental API and 
-may be subject to changes. This is used to allow the testing of new features to gather developer feedback before
-marking the API as stable
+```
+$ USE_SSH=true yarn deploy
+```
 
-##### Example
+Not using SSH:
 
-````ts
-/**
- * @description
- * Greets people with a friendly message. 
- * Used by the {@link AppInitializer} during the start-up process.
- *
- * @example
- * ```ts
- * const greeter = new Greeter();
- * console.log(greeter.greet('mike'));
- * // -> 'Hi, mike, good to see you!'
- * ```
- *
- * @docsCategory helpers
- * @since 1.2.3
- */
-export class Greeter {
+```
+$ GIT_USER=<Your GitHub username> yarn deploy
+```
 
-    /**
-     * @description
-     * Greets the person by name
-     */
-    greet(name: string): string {
-      return `Hi, ${name}, good to see you!`;
-    }
-    
-    /**
-     * Required as a work-around for issue #1234
-     * @internal
-     */
-    someMethodUsedOnlyByVendureCore() {
-        // ...
-    }
-}
-````
+If you are using GitHub pages for hosting, this command is a convenient way to build the website and push to the `gh-pages` branch.

docs/babel.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+  presets: [require.resolve('@docusaurus/core/lib/babel/preset')],
+};

docs/docs/guides/deployment/deploying-admin-ui.md

@@ -15,7 +15,7 @@ Usually, the Admin UI is served from the Vendure server via the AdminUiPlugin. H
 
 The AdminUiPlugin not only serves the Admin UI app, but also provides a `metricSummary` query which is used to display the order metrics on the dashboard. If you wish to deploy the Admin UI app stand-alone (not served by the AdminUiPlugin), but still want to display the metrics on the dashboard, you'll need to include the AdminUiPlugin in your server's plugins array, but do not call `init()`:
 
-```TypeScript
+```ts
 import { AdminUiPlugin } from '\@vendure/admin-ui-plugin';
 
 const config: VendureConfig = {
@@ -52,7 +52,7 @@ This example is for Vercel, and assumes:
     }
     ```
 
-```TypeScript
+```ts
 // compile.ts
 import { compileUiExtensions } from '@vendure/ui-devkit/compiler';
 import { DEFAULT_BASE_HREF } from '@vendure/ui-devkit/compiler/constants';

docs/docs/guides/deployment/getting-data-into-production.md

@@ -20,7 +20,7 @@ The main tasks will be:
 The first item - creation of the schema - can be automatically handled by TypeORM's `synchronize` feature. Switching it on for the initial
 run will automatically create the schema. This can be done by using an environment variable:
 
-```TypeScript {hl_lines=[5]}
+```ts {hl_lines=[5]}
 export const config: VendureConfig = {
   // ...
   dbConnectionOptions: {

docs/docs/guides/deployment/horizontal-scaling.md

@@ -24,7 +24,7 @@ In order to run Vendure in a multi-instance configuration, there are some import
 * The JobQueue should be stored externally using the [DefaultJobQueuePlugin]({{< relref "default-job-queue-plugin" >}}) (which stores jobs in the database) or the [BullMQJobQueuePlugin]({{< relref "bull-mqjob-queue-plugin" >}}) (which stores jobs in Redis), or some other custom JobQueueStrategy. **Note:** the BullMQJobQueuePlugin is much more efficient than the DefaultJobQueuePlugin, and is recommended for production applications.
 * A custom [SessionCacheStrategy]({{< relref "session-cache-strategy" >}}) must be used which stores the session cache externally (such as in the database or Redis), since the default strategy stores the cache in-memory and will cause inconsistencies in multi-instance setups. [Example Redis-based SessionCacheStrategy]({{< relref "session-cache-strategy" >}})
 * When using cookies to manage sessions, make sure all instances are using the _same_ cookie secret:
-    ```TypeScript
+    ```ts
     const config: VendureConfig = {
       authOptions: {
         cookieOptions: {

docs/docs/guides/deployment/production-configuration/index.md

@@ -14,7 +14,7 @@ Keep sensitive information or context-dependent settings in environment variable
 
 The default `@vendure/create` project scaffold makes use of environment variables already. For example:
 
-```TypeScript
+```ts
 const IS_DEV = process.env.APP_ENV === 'dev';
 ```
 
@@ -28,7 +28,7 @@ If you are using [Docker or Kubernetes]({{< relref "using-docker" >}}), they inc
 
 Ensure you set the superadmin credentials to something other than the default of `superadmin:superadmin`. Use your hosting platform's environment variables to set a **strong** password for the Superadmin account.
 
-```TypeScript
+```ts
 import { VendureConfig } from '@vendure/core';
 
 export const config: VendureConfig = {
@@ -59,7 +59,7 @@ yarn add @vendure/harden-plugin
 
 Then add it to your VendureConfig:
 
-```TypeScript
+```ts
 import { VendureConfig } from '@vendure/core';
 import { HardenPlugin } from '@vendure/harden-plugin';
 
@@ -87,7 +87,7 @@ By default, Vendure uses auto-increment integer IDs as entity primary keys. Whil
 
 For this reason you should consider using the UuidIdStrategy for production.
 
-```TypeScript
+```ts
 import { UuidIdStrategy, VendureConfig } from '@vendure/core';
   
 export const config: VendureConfig = {

docs/docs/guides/deployment/using-docker.md

@@ -172,7 +172,7 @@ Health checks are built on the [Nestjs Terminus module](https://docs.nestjs.com/
 
 Although the worker is not designed as an HTTP server, it contains a minimal HTTP server specifically to support HTTP health checks. To enable this, you need to call the `startHealthCheckServer()` method after bootstrapping the worker:
 
-```TypeScript
+```ts
 bootstrapWorker(config)
   .then(worker => worker.startJobQueue())
   .then(worker => worker.startHealthCheckServer({ port: 3020 }))

docs/docs/guides/developer-guide/authentication.md

@@ -17,7 +17,7 @@ See the [Managing Sessions guide]({{< relref "managing-sessions" >}}) for how to
 
 This is done via the [`VendureConfig.authOptions` object]({{< relref "auth-options" >}}#shopauthenticationstrategy):
 
-```TypeScript
+```ts
 export const config: VendureConfig = {
   authOptions: {
       shopAuthenticationStrategy: [
@@ -47,7 +47,7 @@ This example demonstrates how to implement a Google login flow.
 
 In your storefront, you need to integrate the Google sign-in button as described in ["Integrating Google Sign-In into your web app"](https://developers.google.com/identity/sign-in/web/sign-in). Successful authentication will result in a `onSignIn` function being called in your app. It will look something like this:
 
-```TypeScript
+```ts
 function onSignIn(googleUser) {
   graphQlQuery(
     `mutation Authenticate($token: String!) {
@@ -75,7 +75,7 @@ Google.
 
 To do this you'll need to install the `google-auth-library` npm package as described in the ["Authenticate with a backend server" guide](https://developers.google.com/identity/sign-in/web/backend-auth).
 
-```TypeScript
+```ts
 import {
  AuthenticationStrategy,
   ExternalAuthenticationService,
@@ -222,7 +222,7 @@ export const FBLoginButton = () => {
 };
 ```
 
-```TypeScript
+```ts
 import {
   AuthenticationStrategy,
   ExternalAuthenticationService,
@@ -356,7 +356,7 @@ vendureLoginButton.addEventListener('click', () => {
 
 We also need to tell the Admin UI application about the custom login URL, since we have no need for the default "username/password" login form. This can be done by setting the [`loginUrl` property]({{< relref "admin-ui-config" >}}#loginurl) in the AdminUiConfig:
 
-```TypeScript
+```ts
 // vendure-config.ts
 plugins: [
   AdminUiPlugin.init({
@@ -372,7 +372,7 @@ plugins: [
 
 The backend part is very similar to the Google authentication example (they both use the OpenID Connect standard), so we'll not duplicate the explanatory comments here:
 
-```TypeScript
+```ts
 import { HttpService } from '@nestjs/common';
 import {
     AuthenticationStrategy,

docs/docs/guides/developer-guide/configuration.md

@@ -17,7 +17,7 @@ Since the `VendureConfig` is just a JavaScript object, it can be managed and man
 
 Environment variables can be used when you don't want to hard-code certain values which may change, e.g. depending on whether running locally, in staging or in production:
 
-```TypeScript
+```ts
 export const config: VendureConfig = {
   apiOptions: {
     hostname: process.env.HOSTNAME,
@@ -29,7 +29,7 @@ export const config: VendureConfig = {
 
 They are also useful so that sensitive credentials do not need to be hard-coded and committed to source control:
 
-```TypeScript
+```ts
 export const config: VendureConfig = {
   dbConnectionOptions: {
     type: 'postgres',
@@ -45,7 +45,7 @@ export const config: VendureConfig = {
 
 If the config object grows too large, you can split it across several files. For example, the `plugins` array in a real-world project can easily grow quite big:
 
-```TypeScript
+```ts
 // vendure-config-plugins.ts
 
 export const plugins: VendureConfig['plugins'] = [
@@ -66,7 +66,7 @@ export const plugins: VendureConfig['plugins'] = [
 ];
 ```
 
-```TypeScript
+```ts
 // vendure-config.ts
 
 import { plugins } from 'vendure-config-plugins';
@@ -91,7 +91,7 @@ The [`VendureConfig.apiOptions`]({{< relref "api-options" >}}) object is used to
 
 Example:
 
-```TypeScript
+```ts
 export const config: VendureConfig = {
   apiOptions: {
     hostname: 'localhost',
@@ -114,7 +114,7 @@ The database connection is configured with the `VendureConfig.dbConnectionOption
 
 Example:
 
-```TypeScript
+```ts
 export const config: VendureConfig = {
   dbConnectionOptions: {
     type: 'postgres',
@@ -138,7 +138,7 @@ The username and default password of the superadmin user can also be specified h
 
 Example:
 
-```TypeScript
+```ts
 export const config: VendureConfig = {
   authOptions: {
     tokenMethod: 'cookie',

docs/docs/guides/developer-guide/customizing-models/index.md

@@ -9,7 +9,7 @@ Custom fields allow you to add your own custom data properties to many of the Ve
 
 They are specified in the VendureConfig:
 
-```TypeScript
+```ts
 const config = {
   // ...
   customFields: {
@@ -83,7 +83,7 @@ For instance, `string` fields will use a `<input type="text">` component, and `b
 
 These defaults can be overridden by using the `ui` property of the custom field config object. For example, if we want a number to be displayed as a currency input:
 
-```TypeScript {hl_lines=[8]}
+```ts {hl_lines=[8]}
 const config = {
   // ...
   customFields: {
@@ -104,7 +104,7 @@ If you want to use a completely custom form input component which is not provide
 
 Here's an example config demonstrating several ways to customize the UI controls for custom fields:
 
-```TypeScript
+```ts
 import { LanguageCode, VendureConfig } from '@vendure/core';
 
 const config: VendureConfig = {
@@ -161,7 +161,7 @@ and the resulting UI:
 
 With a large, complex project, it's common for lots of custom fields to be required. This can get visually noisy in the UI, so Vendure supports tabbed custom fields. Just specify the tab name in the `ui` object, and those fields with the same tab name will be grouped in the UI! The tab name can also be a translation token if you need to support multiple languages.
 
-```TypeScript
+```ts
 const config = {
   // ...
   customFields: {
@@ -181,7 +181,7 @@ const config = {
 
 One common use of custom fields is to support configurable products. Imagine we are selling pens which allow some text to be engraved. To do this we would add a **custom field on the OrderLine**:
 
-```TypeScript
+```ts
 OrderLine: [
   {
     name: 'engravingText',
@@ -223,7 +223,7 @@ mutation {
 
 Furthermore, the values of these OrderLine custom fields can even be used to modify the price. This is done by defining a custom [OrderItemPriceCalculationStrategy]({{< relref "order-item-price-calculation-strategy" >}}):
 
-```TypeScript
+```ts
 import { RequestContext, PriceCalculationResult,
   ProductVariant, OrderItemPriceCalculationStrategy } from '@vendure/core';
 
@@ -255,7 +255,7 @@ access the custom field values on a Product entity.
 
 Attempting to access the custom field will result in a TS compiler error:
 
-```TypeScript {hl_lines=[12,13]}
+```ts {hl_lines=[12,13]}
 import { RequestContext, TransactionalConnection, ID, Product } from '@vendure/core';
 
 export class MyService {
@@ -273,13 +273,13 @@ export class MyService {
 
 The "easy" way to solve this is to assert the `customFields` object as `any`:
 
-```TypeScript
+```ts
 return (product.customFields as any).infoUrl;
 ```
 
 However, this sacrifices type safety. To make our custom fields type-safe we can take advantage of a couple of more advanced TypeScript features - [declaration merging](https://www.typescriptlang.org/docs/handbook/declaration-merging.html#merging-interfaces) and [ambient modules](https://www.typescriptlang.org/docs/handbook/modules.html#ambient-modules). This allows us to extend the built-in `CustomProductFields` interface to add our custom fields to it:
 
-```TypeScript
+```ts
 // types.ts
 
 // Note: we are using deep a import here, rather than importing from `@vendure/core` due to
@@ -298,7 +298,7 @@ declare module '@vendure/core/dist/entity/custom-entity-fields' {
 
 When this file is then imported into our service file (either directly or indirectly), TypeScript will know about our custom fields, and we do not need to do any type assertions.
 
-```TypeScript
+```ts
 return product.customFields.infoUrl;
 // no error, plus TS autocomplete works.
 ```
@@ -319,7 +319,7 @@ For a working example of this setup, see the [real-world-vendure repo](https://g
 
 A default value for the custom field may be specified, and also whether the field may be nullable (or empty). Any fields set to `nullable: false` should have a default value specified.
 
-```TypeScript
+```ts
 Product: [
   {
     name: 'downloadable',
@@ -334,7 +334,7 @@ Product: [
 
 Labels and descriptions can be specified to supply more information about the purpose of the custom field, and also to allow translations to be set. In the Admin UI, the `label` will be used in any forms featuring the custom field, and will fall back to `name` if no label is specified.
 
-```TypeScript
+```ts
 Product: [
   {
     name: 'extendedDescription',
@@ -356,7 +356,7 @@ Product: [
 
 A custom field may hold an array of values by setting the `list` property to `true`:
 
-```TypeScript
+```ts
 Product: [
   {
     name: 'keywords',
@@ -370,7 +370,7 @@ Product: [
 
 Certain custom field types may be configured with validation parameters:
 
-```TypeScript
+```ts
 Product: [
   {
     name: 'partCode',
@@ -400,7 +400,7 @@ In the above examples, attempting to set a custom field value which does not con
 
 For even more control over validation, a `validate` function may be provided to any field type, which will run whenever the value is set via the GraphQL API. This function can even be asynchronous and may use the [Injector]({{< relref "injector" >}}) to access providers. Returning a string or LocalizedString means validation failed.
 
-```TypeScript
+```ts
 Product: [
   {
     name: 'partCode',
@@ -424,7 +424,7 @@ Some custom fields may be used internally in your business logic, or for integra
 -   `readonly: true` means it will be exposed, but cannot be updated via the Admin API. It can only be changed programmatically in plugin code.
 -   `internal: false` - means the field _will_ be exposed via the GraphQL APIs (in this case on the Admin API due to the `public: false` setting). If it was set to `internal: true`, then the field would not be exposed _at all_ in either of the GraphQL APIs, and will not be visible in the Admin UI. Internal custom fields are useful for purely internal implementation details.
 
-```TypeScript
+```ts
 Customer: [
   {
     name: 'externalId',
@@ -440,7 +440,7 @@ Customer: [
 
 It is possible to set up custom fields that hold references to other entities using the `'relation'` type:
 
-```TypeScript
+```ts
 Customer: [
   {
     name: 'avatar',

docs/docs/guides/developer-guide/customizing-the-order-process/index.md

@@ -15,7 +15,7 @@ Vendure ships with a [defaultOrderProcess]({{< relref "order-process" >}}#defaul
 
 This can be done by creating a custom version of the default process using the [configureDefaultOrderProcess]({{< relref "order-process" >}}#configuredefaultorderprocess) function, and then passing it to the [`OrderOptions.process`]({{< relref "order-options" >}}#process) config property.
 
-```TypeScript
+```ts
 import { configureDefaultOrderProcess, VendureConfig } from '\@vendure/core';
 
 const myCustomOrderProcess = configureDefaultOrderProcess({
@@ -56,7 +56,7 @@ AddingItems -> ValidatingCustomer -> ArrangingPayment
 
 Here's how we would define the new state:
 
-```TypeScript
+```ts
 // customer-validation-process.ts
 import { OrderProcess } from '@vendure/core';
 
@@ -80,7 +80,7 @@ This object means:
 
 And then add this configuration to our main VendureConfig:
 
-```TypeScript
+```ts
 // vendure-config.ts
 import { defaultOrderProcess, VendureConfig } from '@vendure/core';
 import { customerValidationProcess } from './customer-validation-process';
@@ -96,7 +96,7 @@ export const config: VendureConfig = {
 Note that we also include the `defaultOrderProcess` in the array, otherwise we will lose all the default states and transitions.
 
  To add multiple new States you need to extend the generic type like this:
- ```TypeScript
+ ```ts
 import { OrderProcess } from '@vendure/core';
 
 export const customerValidationProcess: OrderProcess<'ValidatingCustomer'|'AnotherState'> = {...}
@@ -109,7 +109,7 @@ Now we have defined our new `ValidatingCustomer` state, but there is as yet noth
 
 This allows us to perform our custom logic and potentially prevent the transition from occurring. We will also assume that we have a provider named `TaxIdService` available which contains the logic to validate a tax ID.
 
-```TypeScript
+```ts
 // customer-validation-process.ts
 
 // We declare this in the outer scope and can then use it 
@@ -152,7 +152,7 @@ const customerValidationProcess: OrderProcess<'ValidatingCustomer'> = {
 
 To make your custom states compatible with standard services you should declare your new states in the following way:
 
-```TypeScript
+```ts
 // types.ts
 import { CustomOrderStates } from '@vendure/core';
 

docs/docs/guides/developer-guide/error-handling.md

@@ -18,7 +18,7 @@ This type of error occurs when something goes unexpectedly wrong during the proc
 
 Internally, these situations are handled by throwing an Error:
 
-```TypeScript
+```ts
 const customer = await this.findOneByUserId(ctx, user.id);
 // in this case, the customer *should always* be found, and if
 // not then something unknown has gone wrong...

docs/docs/guides/developer-guide/importing-product-data.md

@@ -86,7 +86,7 @@ Use of language codes has to be consistent throughout the file. You don't have t
 
 As well as product data, other initialization data can be populated using the [`InitialData` object]({{< relref "initial-data" >}}). **This format is intentionally limited**; more advanced requirements (e.g. setting up ShippingMethods that use custom checkers & calculators) should be carried out via scripts which interact with the [Admin GraphQL API]({{< relref "/reference/graphql-api/admin" >}}).
 
-```TypeScript
+```ts
 import { InitialData, LanguageCode } from '@vendure/core';
 
 export const initialData: InitialData = {
@@ -181,7 +181,7 @@ export const initialData: InitialData = {
 ### The `populate()` function
 The `@vendure/core` package exposes a [`populate()` function]({{< relref "populate" >}}) which can be used along with the data formats described above to populate your Vendure server:
 
-```TypeScript
+```ts
 // populate-server.ts
 import { bootstrap, DefaultJobQueuePlugin } from '@vendure/core';
 import { populate } from '@vendure/core/cli';

docs/docs/guides/developer-guide/logging.md

@@ -28,7 +28,7 @@ Vendure uses 5 log levels, in order of increasing severity:
 
 Vendure ships with a [DefaultLogger]({{< relref "default-logger" >}}) which logs to the console (process.stdout). It can be configured with the desired log level:
 
-```TypeScript
+```ts
 import { DefaultLogger, VendureConfig } from '@vendure/core';
 
 const config: VendureConfig = {
@@ -41,7 +41,7 @@ const config: VendureConfig = {
 
 To log database queries, set the `logging` property of the `dbConnectionOptions` as well as setting the logger to `Debug` level.
 
-```TypeScript
+```ts
 import { DefaultLogger, LogLevel, VendureConfig } from '@vendure/core';
 
 const config: VendureConfig = {
@@ -63,7 +63,7 @@ More information about the `logging` option can be found in the [TypeORM logging
 
 When you extend Vendure by creating your own plugins, it's a good idea to log useful information about what your plugin is doing. To do this, you need to import the [Logger]({{< relref "logger" >}}) class from `@vendure/core` and use it in your plugin:
 
-```TypeScript
+```ts
 import { Logger } from '@vendure/core';
 
 // It is customary to define a logger context for your plugin

docs/docs/guides/developer-guide/migrations.md

@@ -22,7 +22,7 @@ Vendure exposes a some helper function which wrap around the underlying [TypeORM
 
 To run and revert migrations, ensure that the `dbConnectionOptions.migrations` option is set in your VendureConfig:
 
-```TypeScript
+```ts
 export const config: VendureConfig = {
   // ...
   dbConnectionOptions: {
@@ -54,7 +54,7 @@ The [`revertLastMigration` function]({{< relref "revert-last-migration" >}}) wil
 
 Here is an example script (which ships with projects generated with `@vendure/create`) which provides a command-line program for managing migrations:
 
-```TypeScript
+```ts
 // migrations.ts
 import { generateMigration, revertLastMigration, runMigrations } from '@vendure/core';
 import program from 'commander';
@@ -93,7 +93,7 @@ ts-node migration.ts generate my-migration
 
 This will generate a new migration in the directory specified by the `dbConnectionOptions.migrations` option:
 
-```TypeScript
+```ts
 dbConnectionOptions: {
   migrations: [path.join(__dirname, '../migrations/*.ts')],
 }

docs/docs/guides/developer-guide/multi-vendor-marketplaces/_index.md

@@ -66,7 +66,7 @@ In order to correctly split the Order later, we need to assign each added OrderL
 
 The following logic will run any time the `addItemToOrder` mutation is executed from our storefront:
 
-```TypeScript
+```ts
 export class MultivendorSellerStrategy implements OrderSellerStrategy {
   // other properties omitted for brevity   
     
@@ -96,7 +96,7 @@ When it comes time to choose a ShippingMethod for the Order, we need to ensure t
 
 Here's how we do it in the example plugin:
 
-```TypeScript
+```ts
 export const multivendorShippingEligibilityChecker = new ShippingEligibilityChecker({
   // other properties omitted for brevity   
     
@@ -140,7 +140,7 @@ Now we need a way to assign the correct method to each line in an Order. This is
 
 We will again be relying on the `sellerChannelId` property of the OrderLines to determine which ShippingMethod to assign to each line. Here's how we do it in the example plugin:
 
-```TypeScript
+```ts
 export class MultivendorShippingLineAssignmentStrategy implements ShippingLineAssignmentStrategy {
   // other properties omitted for brevity   
     

docs/docs/guides/developer-guide/payment-integrations/index.md

@@ -26,7 +26,7 @@ This two-step workflow can also be applied to other non-card forms of payment: e
 
 Payment integrations are created by defining a new [PaymentMethodHandler]({{< relref "payment-method-handler" >}}) and passing that handler into the [`paymentOptions.paymentMethodHandlers`]({{< relref "payment-options" >}}) array in the VendureConfig.
 
-```TypeScript
+```ts
 import {
   CancelPaymentResult,
   CancelPaymentErrorResult,
@@ -175,7 +175,7 @@ If you need to support an entirely different payment flow than the above, it is
 
 Here's an example which adds a new "Validating" state to the Payment state machine, and combines it with a [OrderProcess]({{< relref "order-process" >}}), [PaymentMethodHandler]({{< relref "payment-method-handler" >}}) and [OrderPlacedStrategy]({{< relref "order-placed-strategy" >}}).
 
-```TypeScript
+```ts
 // types.ts
 import {
   defaultPaymentProcess,

docs/docs/guides/developer-guide/promotions.md

@@ -37,7 +37,7 @@ Vendure comes with some built-in actions, but you can also create your own actio
 To create a custom condition, you need to define a new [`PromotionCondition` object]({{< relref "promotion-condition" >}}).
 Here is an annotated example of one of the built-in PromotionsConditions:
 
-```TypeScript
+```ts
 import { LanguageCode, PromotionCondition } from '@vendure/core';
 
 export const minimumOrderAmount = new PromotionCondition({
@@ -84,7 +84,7 @@ export const minimumOrderAmount = new PromotionCondition({
 
 Custom PromotionConditions are then passed into the VendureConfig [PromotionOptions]({{< relref "promotion-options" >}}) to make them available when setting up Promotions:
 
-```TypeScript
+```ts
 import { defaultPromotionConditions, VendureConfig } from '@vendure/core';
 import { minimumOrderAmount } from './minimum-order-amount';
 
@@ -111,7 +111,7 @@ Their implementations are similar, with the difference being the arguments passe
 
 Here's an example of a simple PromotionOrderAction.
 
-```TypeScript
+```ts
 import { LanguageCode, PromotionOrderAction } from '@vendure/core';
 
 export const orderPercentageDiscount = new PromotionOrderAction({
@@ -143,7 +143,7 @@ export const orderPercentageDiscount = new PromotionOrderAction({
 
 Custom PromotionActions are then passed into the VendureConfig [PromotionOptions]({{< relref "promotion-options" >}}) to make them available when setting up Promotions:
 
-```TypeScript
+```ts
 import { defaultPromotionActions, VendureConfig } from '@vendure/core';
 import { orderPercentageDiscount } from './order-percentage-discount';
 
@@ -164,7 +164,7 @@ Vendure v1.8 introduces a new **side effect API** to PromotionActions, which all
 
 A primary use-case of this API is to add a free gift to the Order. Here's an example of a plugin which implements a "free gift" action:
 
-```TypeScript
+```ts
 import {
   ID, idsAreEqual, isGraphQlErrorResult, LanguageCode,
   Logger, OrderLine, OrderService, PromotionItemAction, VendurePlugin,
@@ -265,7 +265,7 @@ In this scenario, we would have to repeat the logic for checking the Order conte
 
 Instead, we can say that the PromotionAction _depends_ on the PromotionCondition:
 
-```TypeScript {hl_lines=[8,10]}
+```ts {hl_lines=[8,10]}
 export const buy1Get1FreeAction = new PromotionItemAction({
   code: 'buy_1_get_1_free',
   description: [{
@@ -289,7 +289,7 @@ In the above code, we are stating that this PromotionAction _depends_ on the `bu
 
 In turn, the `buyXGetYFreeCondition` can return a _state object_ with the type `{ [key: string]: any; }` instead of just a `true` boolean value. This state object is then passed to the PromotionConditions which depend on it, as part of the last argument (`state`).
 
-```TypeScript {hl_lines=[15]}
+```ts {hl_lines=[15]}
 export const buyXGetYFreeCondition = new PromotionCondition({
   code: 'buy_x_get_y_free',
   description: [{

docs/docs/guides/developer-guide/shipping.md

@@ -14,7 +14,7 @@ Custom checkers can be created by defining a [`ShippingEligibilityChecker` objec
 
 For example, you could create a checker which works with a custom "weight" field to only apply to orders below a certain weight:
 
-```TypeScript
+```ts
 import { LanguageCode, ShippingEligibilityChecker } from '@vendure/core';
 
 export const maxWeightChecker = new ShippingEligibilityChecker({
@@ -54,7 +54,7 @@ export const maxWeightChecker = new ShippingEligibilityChecker({
 ```
 Custom checkers are then passed into the VendureConfig [ShippingOptions]({{< relref "shipping-options" >}}) to make them available when setting up new ShippingMethods:
 
-```TypeScript
+```ts
 import { defaultShippingEligibilityChecker, VendureConfig } from '@vendure/core';
 import { maxWeightChecker } from './max-weight-checker';
 
@@ -75,7 +75,7 @@ Custom calculators can be created by defining a [`ShippingCalculator` object]({{
 
 For example, you could create a calculator which consults an external data source (e.g. a spreadsheet, database or 3rd-party API) to find out the cost and estimated delivery time for the order.
 
-```TypeScript
+```ts
 import { LanguageCode, ShippingCalculator } from '@vendure/core';
 import { shippingDataSource } from './shipping-data-source';
 
@@ -111,7 +111,7 @@ export const externalShippingCalculator = new ShippingCalculator({
 
 Custom calculators are then passed into the VendureConfig [ShippingOptions]({{< relref "shipping-options" >}}) to make them available when setting up new ShippingMethods:
 
-```TypeScript
+```ts
 import { defaultShippingCalculator, VendureConfig } from '@vendure/core';
 import { externalShippingCalculator } from './external-shipping-calculator';
 
@@ -153,7 +153,7 @@ Like Orders, Fulfillments are governed by a [finite state machine]({{< relref "f
 
 These states cover the typical workflow for fulfilling orders. However, it is possible to customize the fulfillment workflow by defining a [FulfillmentProcess]({{< relref "fulfillment-process" >}}) and passing it to your VendureConfig:
 
-```TypeScript
+```ts
 export const config: VendureConfig = {
   // ...
   shippingOptions: {

docs/docs/guides/developer-guide/stand-alone-scripts.md

@@ -7,7 +7,7 @@ showtoc: true
 
 It is possible to create stand-alone scripts that can be run from the command-line by using the [bootstrapWorker function]({{< relref "bootstrap-worker" >}}). This can be useful for a variety of use-cases such as running cron jobs or importing data.
 
-```TypeScript
+```ts
 // run-sync.ts
 
 import { bootstrapWorker, Logger } from '@vendure/core';

docs/docs/guides/developer-guide/taxes.md

@@ -55,7 +55,7 @@ The taxes on shipping is calculated by the [ShippingCalculator]({{< relref "ship
 
 This example shows the configuration properties related to taxes:
 
-```TypeScript
+```ts
 export const config: VendureConfig = {
   taxOptions: {
     taxZoneStrategy: new DefaultTaxZoneStrategy(),

docs/docs/guides/developer-guide/testing.md

@@ -28,7 +28,7 @@ The `@vendure/testing` package gives you some simple but powerful tooling for cr
 
 Create a `vitest.config.js` file in the root of your project:
 
-```TypeScript
+```ts
 import path from 'path';
 import swc from 'unplugin-swc';
 import { defineConfig } from 'vitest/config';
@@ -81,7 +81,7 @@ and a `tsconfig.e2e.json` tsconfig file for the tests:
 
 The `@vendure/testing` package uses "initializers" to create the test databases and populate them with initial data. We ship with initializers for `sqljs`, `postgres` and `mysql`. Custom initializers can be created to support running e2e tests against other databases supported by TypeORM. See the [`TestDbInitializer` docs]({{< relref "test-db-initializer" >}}) for more details.
 
-```TypeScript
+```ts
 import {
   MysqlInitializer,
   PostgresInitializer,
@@ -104,7 +104,7 @@ Note re. the `sqliteDataDir`: The first time this test suite is run with the `Sq
 
 The `@vendure/testing` package exports a [`createTestEnvironment` function]({{< relref "create-test-environment" >}}) which is used to set up a Vendure server and GraphQL clients to interact with both the Shop and Admin APIs:
 
-```TypeScript
+```ts
 import { createTestEnvironment, testConfig } from '@vendure/testing';
 import { describe } from 'vitest';
 import { MyPlugin } from '../my-plugin.ts';
@@ -129,7 +129,7 @@ Notice that we pass a [`VendureConfig`]({{< relref "vendure-config" >}}) object
 
 The [`TestServer`]({{< relref "test-server" >}}) needs to be initialized before it can be used. The `TestServer.init()` method takes an options object which defines how to populate the server:
 
-```TypeScript
+```ts
 import { beforeAll, afterAll } from 'vitest';
 import { myInitialData } from './fixtures/my-initial-data.ts';
 
@@ -159,7 +159,7 @@ An explanation of the options:
 
 Now we are all set up to create a test. Let's test one of the GraphQL queries used by our fictional plugin:
 
-```TypeScript
+```ts
 import gql from 'graphql-tag';
 import { it, expect } from 'vitest';
 

docs/docs/guides/developer-guide/translations.md

@@ -10,7 +10,7 @@ While Vendure is only using `error`, `errorResult` and `message` resource keys y
 
 ## Translatable Error
 This example shows how to create a custom translatable error
-```typescript
+```ts
 /**
  * Custom error class
  */

docs/docs/guides/developer-guide/uploading-files.md

@@ -19,7 +19,7 @@ The [createAssets mutation]({{< relref "/reference/graphql-api/admin/mutations"
 
 Here's an example of how a file upload would look using the `apollo-upload-client` package:
 
-```TypeScript
+```ts
 import { gql, useMutation } from "@apollo/client";
 
 const MUTATION = gql`
@@ -63,7 +63,7 @@ How about if you want to implement a custom mutation for file uploads? Let's tak
 
 Let's define a custom field to associate the avatar Asset with the Customer:
 
-```TypeScript
+```ts
 import { Asset } from '@vendure/core';
 
 const config = {
@@ -87,7 +87,7 @@ In a later step, we will refactor this config to encapsulate it in a plugin.
 
 Next, we will define the schema for the mutation:
 
-```TypeScript
+```ts
 // api-extensions.ts
 import gql from 'graphql-tag';
 
@@ -101,7 +101,7 @@ extend type Mutation {
 
 The resolver will make use of the built-in [AssetService]({{< relref "asset-service" >}}) to handle the processing of the uploaded file into an Asset.
 
-```TypeScript
+```ts
 // customer-avatar.resolver.ts
 import { Args, Mutation, Resolver } from '@nestjs/graphql';
 import { Asset } from '@vendure/common/lib/generated-types';
@@ -156,7 +156,7 @@ export class CustomerAvatarResolver {
 
 We can group all of this together into a plugin:
 
-```TypeScript
+```ts
 import { Asset, PluginCommonModule, VendurePlugin } from '@vendure/core';
 
 import { shopApiExtensions } from './api-extensions';
@@ -185,7 +185,7 @@ export class CustomerAvatarPlugin {}
 
 In our storefront, we would then upload a Customer's avatar like this:
 
-```TypeScript
+```ts
 import { gql, useMutation } from "@apollo/client";
 
 const MUTATION = gql`

docs/docs/guides/developer-guide/vendure-worker.md

@@ -11,7 +11,7 @@ Put another way, the Worker executes jobs registered with the [JobQueueService](
 
 The worker is started by calling the [`bootstrapWorker()`]({{< relref "bootstrap-worker" >}}) function with the same configuration as is passed to the main server `bootstrap()`:
 
-```TypeScript
+```ts
 import { bootstrapWorker } from '@vendure/core';
 import { config } from './vendure-config';
 
@@ -34,7 +34,7 @@ The Worker is a [NestJS standalone application](https://docs.nestjs.com/standalo
 It is possible to run multiple workers in parallel to better handle heavy loads. Using the [JobQueueOptions.activeQueues]({{< relref "job-queue-options" >}}#activequeues) configuration, it is even possible to have particular workers dedicated to one or more specific types of jobs.
 For example, if your application does video transcoding, you might want to set up a dedicated worker just for that task:
 
-```TypeScript
+```ts
 import { bootstrapWorker, mergeConfig } from '@vendure/core';
 import { config } from './vendure-config';
 
@@ -56,7 +56,7 @@ bootstrapWorker(videoWorkerConfig)
 
 It is possible to run jobs from the Job Queue on the main server. This is mainly used for testing and automated tasks, and is not advised for production use, since it negates the benefits of running long tasks off of the main process. To do so, you need to manually start the JobQueueService:
 
-```TypeScript
+```ts
 import { bootstrap, JobQueueService } from '@vendure/core';
 import { config } from './vendure-config';
 
@@ -76,7 +76,7 @@ If you are authoring a [Vendure plugin]({{< relref "/guides/plugins" >}}) to imp
 
 Sometimes your code may need to be aware of whether it is being run as part of a server or worker process. In this case you can inject the [ProcessContext]({{< relref "process-context" >}}) provider and query it like this:
 
-```TypeScript
+```ts
 import { Injectable, OnApplicationBootstrap } from '@nestjs/common';
 import { ProcessContext } from '@vendure/core';
 

docs/docs/guides/plugins/extending-the-admin-ui/_index.md

@@ -36,7 +36,7 @@ As a rule, modules defining new routes should be lazily loaded (so that the code
 
 When you are developing your Admin UI extension, you can set the `devMode` option to `true` which will compile the Admin UI app in development mode, and recompile and auto-refresh the browser on any changes to your extension source files.
 
-```TypeScript
+```ts
 // vendure-config.ts
 plugins: [
   AdminUiPlugin.init({
@@ -56,7 +56,7 @@ plugins: [
 
 Although the examples so far all use the `compileUiExtensions` function in conjunction with the AdminUiPlugin, it is also possible to use it on its own:
 
-```TypeScript
+```ts
 // compile-admin-ui.ts
 import { compileUiExtensions } from '@vendure/ui-devkit/compiler';
 import * as path from 'path';
@@ -78,7 +78,7 @@ yarn ts-node compile-admin-ui.ts
 
 Once complete, the production-ready app bundle will be output to `admin-ui/dist`. This method is suitable for a production setup, so that the Admin UI can be compiled ahead-of-time as part of your deployment process. This ensures that your Vendure server starts up as quickly as possible. In this case, you can pass the path of the compiled app to the AdminUiPlugin:
 
-```TypeScript
+```ts
 // project/vendure-config.ts
 plugins: [
   AdminUiPlugin.init({

docs/docs/guides/plugins/extending-the-admin-ui/add-actions-to-pages/_index.md

@@ -12,7 +12,7 @@ It may not always make sense to navigate to your extension view from the main na
 
 ### ActionBar Example
 
-```TypeScript
+```ts
 import { NgModule } from '@angular/core';
 import { SharedModule, addActionBarItem } from '@vendure/admin-ui/core';
 
@@ -46,7 +46,7 @@ The context object provides access to the DataService, which allows you to perfo
 
 Here's an example of how to use the onClick property to perform a GraphQL mutation when the ActionBar button is clicked:
 
-```TypeScript
+```ts
 addActionBarItem({
     id: 'myButtonId',
     label: 'My Button Label',
@@ -93,7 +93,7 @@ Use cases for bulk actions include things like:
 
 A bulk action must be provided to a [ui-extension shared module]({{< relref "extending-the-admin-ui" >}}#lazy-vs-shared-modules) using the [`registerBulkAction` function]({{< relref "register-bulk-action" >}})
 
-```TypeScript
+```ts
 import { NgModule } from '@angular/core';
 import { ModalService, registerBulkAction, SharedModule } from '@vendure/admin-ui/core';
 
@@ -142,7 +142,7 @@ Sometimes a bulk action only makes sense in certain circumstances. For example,
 
 We can conditionally control the display of a bulk action with the `isVisible` function, which should return a Promise resolving to a boolean:
 
-```TypeScript
+```ts
 import { registerBulkAction, DataService } from '@vendure/admin-ui/core';
 
 registerBulkAction({

docs/docs/guides/plugins/extending-the-admin-ui/adding-ui-translations/_index.md

@@ -63,7 +63,7 @@ The Admin UI ships with language files only for English and Spanish as of versio
     
     And the config code to register the translation file:
     
-    ```TypeScript
+    ```ts
     // vendure-config.ts
     import path from 'path';
     import { VendureConfig } from '@vendure/core';
@@ -96,7 +96,7 @@ The Admin UI ships with language files only for English and Spanish as of versio
 
 You can also create translations for your own UI extensions, in much the same way as outlined above in "Adding a new language". Your translations can be split over several files, since the `translations` config object can take a glob, e.g.:
 
-```TypeScript
+```ts
 translations: {
   de: path.join(__dirname, 'ui-extensions/my-extension/**/*.de.json'),
 }

docs/docs/guides/plugins/extending-the-admin-ui/admin-ui-theming-branding/_index.md

@@ -10,7 +10,7 @@ The Vendure Admin UI can be themed to your company's style and branding.
 
 The `AdminUiPlugin` allows you to specify your "brand" name, and allows you to control whether to display the Vendure name and version in the UI. Specifying a brand name will also set it as the title of the Admin UI in the browser.
 
-```TypeScript
+```ts
 // vendure-config.ts
 import path from 'path';
 import { VendureConfig } from '@vendure/core';
@@ -36,7 +36,7 @@ You can replace the Vendure logos and favicon with your own brand logo:
 
 1. Install `@vendure/ui-devkit`
 2. Configure the AdminUiPlugin to compile a custom build featuring your logos:
-    ```TypeScript
+    ```ts
     import path from 'path';
     import { AdminUiPlugin } from '@vendure/admin-ui-plugin';
     import { VendureConfig } from '@vendure/core';
@@ -80,7 +80,7 @@ Much of the visual styling of the Admin UI can be customized by providing your o
     ```
    To get an idea of which custom properties are available for theming, take a look at the source of the [Default theme](https://github.com/vendure-ecommerce/vendure/tree/master/packages/admin-ui/src/lib/static/styles/theme/default.scss) and the [Dark theme](https://github.com/vendure-ecommerce/vendure/tree/master/packages/admin-ui/src/lib/static/styles/theme/dark.scss)
 3. Set this as a globalStyles extension:   
-    ```TypeScript
+    ```ts
     import path from 'path';
     import { AdminUiPlugin } from '@vendure/admin-ui-plugin';
     import { VendureConfig } from '@vendure/core';
@@ -110,7 +110,7 @@ Some customizable styles in [Clarity](https://clarity.design/), Admin UI's Desig
     $clr-header-height: 4rem;
     ```
 3. Set this as a sassVariableOverrides extension:
-    ```TypeScript
+    ```ts
     import path from 'path';
     import { AdminUiPlugin } from '@vendure/admin-ui-plugin';
     import { VendureConfig } from '@vendure/core';

docs/docs/guides/plugins/extending-the-admin-ui/creating-detail-views/index.md

@@ -17,7 +17,7 @@ Let's say you have a plugin which adds a new entity to the database called `Prod
 
 The detail component itself is an Angular component which extends the [BaseDetailComponent]({{< relref "base-detail-component" >}}) or [TypedBaseDetailComponent]({{< relref "typed-base-detail-component" >}}) class.
 
-```TypeScript
+```ts
 import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { FormBuilder } from '@angular/forms';
 import { TypedBaseDetailComponent, LanguageCode } from '@vendure/admin-ui/core';
@@ -155,7 +155,7 @@ Here is the standard layout for detail views:
 
 The `TypedBaseDetailComponent` expects that the entity detail data is resolved as part of loading the route. The data needs to be loaded in a very specific object shape:
 
-```TypeScript
+```ts
 interface DetailResolveData {
     detail: {
         entity: Observable<Entity>;
@@ -165,7 +165,7 @@ interface DetailResolveData {
 
 Here's how the routing would look for a typical list & detail view:
 
-```TypeScript
+```ts
 import { inject, NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
 import { DataService, SharedModule } from '@vendure/admin-ui/core';

docs/docs/guides/plugins/extending-the-admin-ui/creating-list-views/index.md

@@ -44,7 +44,7 @@ The list component itself is an Angular component which extends the [BaseListCom
 
 This example assumes you have set up your project to use [GraphQL Code Generator](https://the-guild.dev/graphql/codegen) with the [TypedDocumentNode plugin](https://the-guild.dev/graphql/codegen/plugins/typescript/typed-document-node).
 
-```TypeScript
+```ts
 import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { TypedBaseListComponent } from '@vendure/admin-ui/core';
 import { gql } from 'apollo-angular';

docs/docs/guides/plugins/extending-the-admin-ui/custom-detail-components/_index.md

@@ -11,7 +11,7 @@ Any components registered in this way will appear below the main detail form.
 
 Let's imagine that your project has an external content management system (CMS) which is used to store additional details about products. You might want to display some of this information in the product detail page.
 
-```TypeScript
+```ts
 import { NgModule, Component, OnInit } from '@angular/core';
 import { switchMap } from 'rxjs';
 import { FormGroup } from '@angular/forms';

docs/docs/guides/plugins/extending-the-admin-ui/custom-form-inputs/_index.md

@@ -11,7 +11,7 @@ Another way to extend the Admin UI app is to define custom form input components
 
 Let's say you define a custom "intensity" field on the Product entity:
 
-```TypeScript
+```ts
 // project/vendure-config.ts
 
 customFields: {
@@ -27,7 +27,7 @@ By default, the "intensity" field will be displayed as a number input:
 
 But let's say we want to display a range slider instead. Here's how we can do this using our shared extension module combined with the [registerFormInputComponent function]({{< relref "register-form-input-component" >}}):
 
-```TypeScript
+```ts
 // project/ui-extensions/shared.module.ts
 import { NgModule, Component } from '@angular/core';
 import { FormControl } from '@angular/forms';
@@ -60,7 +60,7 @@ export class SharedExtensionModule {}
 ```
 The `SharedExtensionModule` is then passed to the `compileUiExtensions()` function as described in the [UI Extensions With Angular guide]({{< relref "using-angular" >}}#4-pass-the-extension-to-the-compileuiextensions-function):
 
-```TypeScript
+```ts
 // project/vendure-config.ts
 AdminUiPlugin.init({
   port: 5001,
@@ -80,7 +80,7 @@ AdminUiPlugin.init({
 
 Once registered, this new slider input can be used in our custom field config:
 
-```TypeScript {hl_lines=[7]}
+```ts {hl_lines=[7]}
 // project/vendure-config.ts
 
 customFields: {
@@ -120,7 +120,7 @@ If you have a custom field of the `relation` type (which allows you to relate en
 
 Here is a simple example taken from the [real-world-vendure](https://github.com/vendure-ecommerce/real-world-vendure/blob/master/src/plugins/reviews/ui/components/featured-review-selector/featured-review-selector.component.ts) repo:
 
-```TypeScript
+```ts
 import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
 import { FormControl } from '@angular/forms';
 import { ActivatedRoute } from '@angular/router';
@@ -187,7 +187,7 @@ They are configured in a very similar way to custom fields, and likewise can use
 
 Here's an example:
 
-```TypeScript {hl_lines=[6,7,8]}
+```ts {hl_lines=[6,7,8]}
 export const orderFixedDiscount = new PromotionOrderAction({
   code: 'order_fixed_discount',
   args: {

docs/docs/guides/plugins/extending-the-admin-ui/custom-timeline-components/_index.md

@@ -14,7 +14,7 @@ You can also define a custom Angular component to render any timeline entry usin
 Following the example used in the HistoryService docs, we can define a component to render the tax ID verification
 entry in our Customer timeline:
 
-```TypeScript
+```ts
 import { Component, NgModule } from '@angular/core';
 import {
   CustomerFragment,

docs/docs/guides/plugins/extending-the-admin-ui/dashboard-widgets/index.md

@@ -20,7 +20,7 @@ To notify administrators about new reviews that need approval, we'll create a da
 
 A dashboard widget is an Angular component. This example features a simplified UI, just to illustrate the overall strucutre:
 
-```TypeScript
+```ts
 import { Component, NgModule, OnInit } from '@angular/core';
 import { DataService, SharedModule } from '@vendure/admin-ui/core';
 import { Observable } from 'rxjs';
@@ -80,7 +80,7 @@ Note that we also need to define an `NgModule` for this component. This is becau
 
 Our widget now needs to be registered as part of a [shared module]({{< relref "extending-the-admin-ui" >}}#lazy-vs-shared-modules):
 
-```TypeScript
+```ts
 import { NgModule } from '@angular/core';
 import { registerDashboardWidget } from '@vendure/admin-ui/core';
 import { reviewPermission } from '../constants';
@@ -114,7 +114,7 @@ Once registered, the reviews widget will be available to select by administrator
 
 While administrators can customize which widgets they want to display on the dashboard, and the layout of those widgets, you can also set a default layout:
 
-```TypeScript
+```ts
 import { NgModule } from '@angular/core';
 import { registerDashboardWidget, setDashboardWidgetLayout } from '@vendure/admin-ui/core';
 import { reviewPermission } from '../constants';
@@ -148,7 +148,7 @@ Sometimes you may wish to alter the permissions settings of the default widgets
 For example, the "order summary" widget has a default permission requirement of "ReadOrder". If you want to limit the availability to e.g. the SuperAdmin role, you can do so
 by overriding the definition like this:
 
-```TypeScript
+```ts
 import { NgModule } from '@angular/core';
 import { registerDashboardWidget } from '@vendure/admin-ui/core';
 import { OrderSummaryWidgetComponent } from '@vendure/admin-ui/dashboard';

docs/docs/guides/plugins/extending-the-admin-ui/modifying-navigation-items/_index.md

@@ -11,7 +11,7 @@ Once you have defined some custom routes in a lazy extension module, you need so
 
 Let's add a new section to the Admin UI main nav bar containing a link to the "greeter" module from the [Using Angular]({{< relref "../using-angular" >}}) example:
 
-```TypeScript
+```ts
 // project/ui-extensions/greeter-shared.module.ts
 import { NgModule } from '@angular/core';
 import { SharedModule, addNavMenuSection } from '@vendure/admin-ui/core';
@@ -39,7 +39,7 @@ export class GreeterSharedModule {}
 
 Now we must also register this new module with the compiler:
 
-```TypeScript
+```ts
 // project/vendure-config.ts
 
 ngModules: [
@@ -71,7 +71,7 @@ This is done by setting the `id` property to that of an existing nav menu sectio
 
 You can add your own tabs to any of the Admin UI's list or detail pages using the [registerPageTab]({{< relref "register-page-tab" >}}) function. For example, to add a new tab to the product detail page for displaying product reviews:
 
-```TypeScript
+```ts
 import { NgModule } from '@angular/core';
 import { SharedModule, registerPageTab } from '@vendure/admin-ui/core';
 

docs/docs/guides/plugins/extending-the-admin-ui/using-angular/_index.md

@@ -27,7 +27,7 @@ npm install @vendure/ui-devkit
 
 Here's a very simple Angular component which displays a greeting:
 
-```TypeScript
+```ts
 // project/ui-extensions/greeter.component.ts
 import { Component } from '@angular/core';
 
@@ -46,7 +46,7 @@ The `<vdr-page-block>` is just a wrapper that sets the layout and max width of y
 
 Next we need to declare an Angular module to house the component:
 
-```TypeScript
+```ts
 // project/ui-extensions/greeter.module.ts
 import { NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
@@ -77,7 +77,7 @@ directives and other common functionality that any extension would require.
 
 Now we need to tell the `compileUiExtensions` function where to find the extension, and which file contains the NgModule itself (since a non-trivial UI extension will likely contain multiple files).
 
-```TypeScript
+```ts
 // project/vendure-config.ts
 import path from 'path';
 import { AdminUiPlugin } from '@vendure/admin-ui-plugin';

docs/docs/guides/plugins/extending-the-admin-ui/using-other-frameworks/_index.md

@@ -42,7 +42,7 @@ In this example, we will work with the following folder structure, and use Creat
 
 Here's the Angular code needed to tell the compiler where to find your extension:
 
-```TypeScript
+```ts
 // ui-extension/modules/react-extension.module.ts
 
 import { NgModule } from '@angular/core';
@@ -83,7 +83,7 @@ Note: If you are using **Create React App**, you should additionally update your
 
 Next we will define an [AdminUiExtension]({{< relref "admin-ui-extension" >}}) object which is passed to the `compileUiExtensions()` function in your Vendure config:
 
-```TypeScript
+```ts
 // vendure-config.ts
 import path from 'path';
 import { VendureConfig } from '@vendure/core';
@@ -156,7 +156,7 @@ The `@vendure/admin-ui` package (which will be installed alongside the ui-devkit
 
 If you have a build step (as in our Create React App example), you can import it into your app like this:
 
-```TypeScript
+```ts
 // src/ui-extension/react-app/src/App.tsx
 import '@vendure/admin-ui/static/theme.min.css';
 ```
@@ -181,7 +181,7 @@ The `@vendure/ui-devkit` package provides a number of helper methods which allow
 
 The UiDevkitClient uses the browser's [postMessage API](https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage) to communicate between the Admin UI app and your extension. For security reasons this communication channel is restricted to a specific domain (where your extension app will be running from). To configure this, use the [setTargetOrigin]({{< relref "ui-devkit-client" >}}#settargetorigin) function:
 
-```TypeScript
+```ts
 import { setTargetOrigin } from '@vendure/ui-devkit';
 
 setTargetOrigin('http://my-domain.com');
@@ -192,7 +192,7 @@ If this is mis-configured you will see an error along the lines of "Failed to ex
 
 For apps with a build step, you can use these functions like this:
 
-```TypeScript
+```ts
 import { graphQlMutation, notify } from '@vendure/ui-devkit';
 
 // somewhere in your component

docs/docs/guides/plugins/plugin-examples/adding-rest-endpoint.md

@@ -6,7 +6,7 @@ showtoc: true
 # Adding a REST endpoint
 
 This plugin adds a single REST endpoint at `http://localhost:3000/products` which returns a list of all Products. Find out more about [Nestjs REST Controllers](https://docs.nestjs.com/controllers).
-```TypeScript
+```ts
 // products.controller.ts
 import { Controller, Get } from '@nestjs/common';
 import { Ctx, ProductService, RequestContext } from '@vendure/core'; 
@@ -21,7 +21,7 @@ export class ProductsController {
   }
 }
 ```
-```TypeScript
+```ts
 // rest.plugin.ts
 import { PluginCommonModule, VendurePlugin } from '@vendure/core';
 import { ProductsController } from './products.controller';
@@ -43,7 +43,7 @@ Side note: since this uses no Vendure-specific metadata, it could also be writte
 
 You can use the [Allow decorator]({{< relref "allow-decorator" >}}) to declare the permissions required to access a REST endpoint:
 
-```TypeScript {hl_lines=[8]}
+```ts {hl_lines=[8]}
 import { Controller, Get } from '@nestjs/common';
 import { Allow, Permission, Ctx, ProductService, RequestContext } from '@vendure/core'; 
 

docs/docs/guides/plugins/plugin-examples/defining-custom-permissions.md

@@ -9,7 +9,7 @@ Your plugin may be defining new queries & mutations which require new permission
 
 For example, let's imagine you are creating a plugin which exposes a new mutation that can be used by remote services to sync your inventory. First of all we will define the new permission:
 
-```TypeScript
+```ts
 // sync-permission.ts
 import { PermissionDefinition } from '@vendure/core';
 
@@ -21,7 +21,7 @@ export const sync = new PermissionDefinition({
 
 This permission can then be used in conjuction with the [@Allow() decorator]({{< relref "allow-decorator">}}) to limit access to the mutation:
 
-```TypeScript
+```ts
 // inventory-sync.resolver.ts
 import { Allow } from '@vendure/core';
 import { Mutation, Resolver } from '@nestjs/graphql';
@@ -40,7 +40,7 @@ export class InventorySyncResolver {
 
 Finally, the `sync` PermissionDefinition must be passed into the VendureConfig so that Vendure knows about this new custom permission:
 
-```TypeScript {hl_lines=[21]}
+```ts {hl_lines=[21]}
 // inventory-sync.plugin.ts
 import gql from 'graphql-tag';
 import { VendurePlugin } from '@vendure/core';

docs/docs/guides/plugins/plugin-examples/defining-db-entity.md

@@ -7,7 +7,7 @@ showtoc: true
 
 This example shows how new [TypeORM database entities](https://typeorm.io/entities) can be defined by plugins.
 
-```TypeScript
+```ts
 // product-review.entity.ts
 import { DeepPartial } from '@vendure/common/lib/shared-types';
 import { VendureEntity } from '@vendure/core';
@@ -33,7 +33,7 @@ class ProductReview extends VendureEntity {
 
 The new entity is then passed to the `entities` array of the VendurePlugin metadata:
 
-```TypeScript {hl_lines=[6]}
+```ts {hl_lines=[6]}
 // reviews-plugin.ts
 import { VendurePlugin } from '@vendure/core';
 import { ProductReview } from './product-review.entity';

docs/docs/guides/plugins/plugin-examples/defining-db-subscribers.md

@@ -13,7 +13,7 @@ If you need lower-level access to database changes that you get with the [Vendur
 
 The simplest way to register a subscriber is to pass it to the `dbConnectionOptions.subscribers` array:
 
-```TypeScript
+```ts
 import { Product, VendureConfig } from '@vendure/core';
 import { EntitySubscriberInterface, EventSubscriber, UpdateEvent } from 'typeorm';
 
@@ -44,7 +44,7 @@ If you need to make use of providers in your subscriber class, you'll need to us
 
 By defining the subscriber as an injectable provider, and passing it to a Vendure plugin, you can take advantage of Nest's dependency injection inside the subscriber methods.
 
-```TypeScript
+```ts
 import {
   PluginCommonModule,
   Product,

docs/docs/guides/plugins/plugin-examples/extending-graphql-api.md

@@ -12,7 +12,7 @@ Extension to the GraphQL API consists of two parts:
 
 The Shop API and Admin APIs can be extended independently:
 
-```TypeScript {hl_lines=["16-22"]}
+```ts {hl_lines=["16-22"]}
 import { PluginCommonModule, VendurePlugin } from '@vendure/core';
 import gql from 'graphql-tag';
 import { TopSellersResolver } from './top-products.resolver';
@@ -44,7 +44,7 @@ There are a number of ways the GraphQL APIs can be modified by a plugin.
 
 This example adds a new query to the GraphQL Admin API. It also demonstrates how [Nest's dependency injection](https://docs.nestjs.com/providers) can be used to encapsulate and inject services within the plugin module.
  
-```TypeScript
+```ts
 // top-sellers.resolver.ts
 import { Args, Query, Resolver } from '@nestjs/graphql';
 import { Ctx, RequestContext } from '@vendure/core'
@@ -65,7 +65,7 @@ class TopSellersResolver {
   **Note:** The `@Ctx` decorator gives you access to [the `RequestContext`]({{< relref "request-context" >}}), which is an object containing useful information about the current request - active user, current channel etc.
 {{< /alert >}}
 
-```TypeScript
+```ts
 // top-sellers.service.ts
 import { Injectable } from '@nestjs/common';
 import { RequestContext } from '@vendure/core';
@@ -80,7 +80,7 @@ class TopSellersService {
 
 The GraphQL schema is extended with the `topSellers` query (the query name should match the name of the corresponding resolver method):
 
-```TypeScript
+```ts
 // top-sellers.plugin.ts
 import gql from 'graphql-tag';
 import { PluginCommonModule, VendurePlugin } from '@vendure/core';
@@ -113,7 +113,7 @@ extend type Mutation {
 
 If you have [defined a new database entity]({{< relref "defining-db-entity" >}}), it is likely that you'll want to expose this entity in your GraphQL API. To do so, you'll need to define a corresponding GraphQL type:
 
-```TypeScript
+```ts
 import gql from 'graphql-tag';
 import { PluginCommonModule, VendurePlugin } from '@vendure/core';
 import { ReviewsResolver } from './reviews.resolver';
@@ -150,7 +150,7 @@ export class ReviewsPlugin {}
 
 Let's say you want to add a new field, "availability" to the ProductVariant type, to allow the storefront to display some indication of whether a variant is available to purchase. First you define a resolver function:
 
-```TypeScript
+```ts
 import { Parent, ResolveField, Resolver } from '@nestjs/graphql';
 import { Ctx, RequestContext, ProductVariant } from '@vendure/core';
 
@@ -172,7 +172,7 @@ export class ProductVariantEntityResolver {
 
 Then in the plugin metadata, we extend the ProductVariant type and pass the resolver:
 
-```TypeScript
+```ts
 import gql from 'graphql-tag';
 import { PluginCommonModule, VendurePlugin } from '@vendure/core';
 import { ProductVariantEntityResolver } from './product-variant-entity.resolver'
@@ -194,7 +194,7 @@ export class AvailabilityPlugin {}
 
 It is also possible to override an existing built-in resolver function with one of your own. To do so, you need to define a resolver with the same name as the query or mutation you wish to override. When that query or mutation is then executed, your code, rather than the default Vendure resolver, will handle it.
 
-```TypeScript
+```ts
 import { Args, Query, Mutation, Resolver } from '@nestjs/graphql';
 import { Ctx, RequestContext } from '@vendure/core'
 
@@ -219,7 +219,7 @@ class OverrideExampleResolver {
 
 The same can be done for resolving fields:
 
-```TypeScript
+```ts
 import { Parent, ResolveField, Resolver } from '@nestjs/graphql';
 import { Ctx, RequestContext, Product } from '@vendure/core';
 
@@ -267,7 +267,7 @@ In this example, the resolver which handles the `myCustomMutation` operation wil
 
 In order to implement a `__resolveType` function as part of your plugin, you need to create a dedicated Resolver class with a single field resolver method which will look like this:
 
-```TypeScript
+```ts
 import { Parent, ResolveField, Resolver } from '@nestjs/graphql';
 import { Ctx, RequestContext, ProductVariant } from '@vendure/core';
 
@@ -284,7 +284,7 @@ export class MyCustomMutationResultResolver {
 
 This resolver is then passed in to your plugin metadata like any other resolver:
 
-```TypeScript
+```ts
 @VendurePlugin({
   imports: [PluginCommonModule],
   shopApiExtensions: {
@@ -299,7 +299,7 @@ export class MyPlugin {}
 
 By default, Vendure bundles `DateTime` and a `JSON` custom scalars (from the [graphql-scalars library](https://github.com/Urigo/graphql-scalars)). From v1.7.0, you can also define your own custom scalars for use in your schema extensions:
 
-```TypeScript
+```ts
 import { GraphQLScalarType} from 'graphql';
 import { GraphQLEmailAddress } from 'graphql-scalars';
 

docs/docs/guides/plugins/plugin-examples/modifying-config.md

@@ -9,7 +9,7 @@ The VendureConfig object defines all aspects of how a Vendure server works. A pl
 
 This example shows how to modify the VendureConfig, in this case by adding a custom field to allow product ratings.
 
-```TypeScript
+```ts
 // my-plugin.ts
 import { VendurePlugin } from '@vendure/core';
 

docs/docs/guides/plugins/plugin-examples/using-job-queue-service.md

@@ -8,7 +8,7 @@ showtoc: true
 
 If your plugin involves long-running tasks, you can take advantage of the [job queue system]({{< relref "/guides/developer-guide/job-queue" >}}) that comes with Vendure. This example defines a mutation that can be used to transcode and link a video to a Product's customFields.
 
-```TypeScript
+```ts
 // product-video.resolver.ts
 import { Args, Mutation, Resolver } from '@nestjs/graphql';
 import { Ctx, RequestContext } from '@vendure/core'
@@ -30,7 +30,7 @@ class ProductVideoResolver {
 }
 ```
 The resolver just defines how to handle the new `addVideoToProduct` mutation, delegating the actual work to the `ProductVideoService`:
-```TypeScript
+```ts
 // product-video.service.ts
 import { Injectable, OnModuleInit } from '@nestjs/common';
 import { JobQueue, JobQueueService, ID, Product, TransactionalConnection } from '@vendure/core';
@@ -78,7 +78,7 @@ class ProductVideoService implements OnModuleInit {
 ```
 The `ProductVideoService` is in charge of setting up the JobQueue and adding jobs to that queue. Calling 
 
-```TypeScript
+```ts
 productVideoService.transcodeForProduct(id, url);
 ```
 
@@ -89,7 +89,7 @@ will add a transcoding job to the queue.
 what context you are in. This can be done with the [ProcessContext]({{< relref "process-context" >}}) provider.
 {{< /alert >}}
 
-```TypeScript
+```ts
 // product-video.plugin.ts
 import gql from 'graphql-tag';
 import { PluginCommonModule, VendurePlugin } from '@vendure/core';
@@ -125,7 +125,7 @@ When creating a new job via `JobQueue.add()`, it is possible to subscribe to upd
 
 In the video transcoding example above, we could modify the `transcodeForProduct()` call to look like this:
 
-```TypeScript
+```ts
 import { of } from 'rxjs';
 import { map, catchError } from 'rxjs/operators';
 
@@ -154,7 +154,7 @@ class ProductVideoService implements OnModuleInit {
 
 If you prefer to work with Promises rather than Rxjs Observables, you can also convert the updates to a promise:
 
-```TypeScript
+```ts
 const job = await this.jobQueue.add({ productId, videoUrl }, { retries: 2 });
     
 return job.updates().toPromise()

docs/docs/guides/plugins/plugin-lifecycle/index.md

@@ -21,7 +21,7 @@ Another hook that is not strictly a lifecycle hook, but which can be useful to k
 
 ## Example
 
-```TypeScript
+```ts
 import { MiddlewareConsumer, NestModule, OnApplicationBootstrap } from '@nestjs/common';
 import { EventBus, PluginCommonModule, VendurePlugin } from '@vendure/core';
 

docs/docs/guides/plugins/writing-a-vendure-plugin.md

@@ -23,7 +23,7 @@ This plugin will add a new mutation, `addRandomCat`, to the GraphQL API which al
 
 We need a place to store the url of the cat image, so we will add a custom field to the Product entity. This is done by modifying the VendureConfig object via the plugin's [`configuration` metadata property]({{< relref "vendure-plugin-metadata" >}}#configuration):
 
-```TypeScript
+```ts
 import { VendurePlugin } from '@vendure/core';
 
 @VendurePlugin({
@@ -44,7 +44,7 @@ Changing the database schema by `CustomFields` configuration requires a synchron
 
 Now we will create a service which is responsible for making the HTTP call to the random.cat API and returning the URL of a random cat image:
 
-```TypeScript
+```ts
 import http from 'http';
 import { Injectable } from '@nestjs/common';
 
@@ -76,7 +76,7 @@ To use decorators with TypeScript, you must set the "emitDecoratorMetadata" and
 
 Next, we will define how the GraphQL API should be extended:
 
-```TypeScript
+```ts
 import gql from 'graphql-tag';
 
 const schemaExtension = gql`
@@ -92,7 +92,7 @@ We will use this `schemaExtension` variable in a later step.
 
 Now that we've defined the new mutation, we'll need a resolver function to handle it. To do this, we'll create a new resolver class, following the [Nest GraphQL resolver architecture](https://docs.nestjs.com/graphql/resolvers-map). In short, this will be a class which has the `@Resolver()` decorator and features a method to handle our new mutation.
 
-```TypeScript
+```ts
 import { Args, Mutation, Resolver } from '@nestjs/graphql';
 import { Ctx, Allow, ProductService, RequestContext, Transaction } from '@vendure/core';
 import { Permission } from '@vendure/common/lib/generated-types';
@@ -129,7 +129,7 @@ Some explanations of this code are in order:
 
 In the RandomCatResolver we make use of the ProductService. This is one of the built-in services which Vendure uses internally to interact with the database. It can be injected into our resolver only if we first import the [PluginCommonModule]({{< relref "plugin-common-module" >}}), which is a module which exports a number of providers which are usually needed by plugins.
 
-```TypeScript
+```ts
 @VendurePlugin({
   imports: [PluginCommonModule],
   configuration: config => {
@@ -143,7 +143,7 @@ export class RandomCatPlugin {}
 
 In order that our resolver is able to use Nest's dependency injection to inject an instance of `CatFetcher`, we must add it to the `providers` array in our plugin:
 
-```TypeScript
+```ts
 @VendurePlugin({
   imports: [PluginCommonModule],
   providers: [CatFetcher],
@@ -158,7 +158,7 @@ export class RandomCatPlugin {}
 
 Now that we've defined the new mutation and we have a resolver capable of handling it, we just need to tell Vendure to extend the API. This is done with the [`adminApiExtensions` metadata property]({{< relref "vendure-plugin-metadata" >}}#adminapiextensions). If we wanted to extend the Shop API, we'd use the [`shopApiExtensions` metadata property]({{< relref "vendure-plugin-metadata" >}}#shopapiextensions) instead.
 
-```TypeScript
+```ts
 @VendurePlugin({
   imports: [PluginCommonModule],
   providers: [CatFetcher],
@@ -178,7 +178,7 @@ export class RandomCatPlugin {}
 Since Vendure v2.0.0, it is possible for a plugin to specify which versions of Vendure core it is compatible with. This is especially
 important if the plugin is intended to be made publicly available via npm or another package registry.
 
-```TypeScript
+```ts
 @VendurePlugin({
   // imports: [ etc. ]
   compatibility: '^2.0.0'  
@@ -190,7 +190,7 @@ export class RandomCatPlugin {}
 
 Finally, we need to add an instance of our plugin to the config object with which we bootstrap our Vendure server:
 
-```TypeScript
+```ts
 import { bootstrap } from '@vendure/core';
 
 bootstrap({
@@ -235,7 +235,7 @@ which should yield the following response:
 
 ### Full example plugin
 
-```TypeScript
+```ts
 import { Injectable } from '@nestjs/common';
 import { Args, Mutation, Resolver } from '@nestjs/graphql';
 import gql from 'graphql-tag';

docs/docs/guides/storefront/configuring-a-graphql-client.md

@@ -12,7 +12,7 @@ This guide provides examples of how to set up popular GraphQL clients to work wi
 
 Here's an example configuration for [Apollo Client](https://www.apollographql.com/docs/react/) with a React app.
 
-```TypeScript
+```ts
 import {
   ApolloClient,
   ApolloLink, 

docs/docs/guides/storefront/managing-sessions.md

@@ -18,7 +18,7 @@ Using cookies is the simpler approach for browser-based applications, since the
 
 2. When using cookie-based sessions, you should set the [`authOptions.cookieOptions.secret` property]({{< relref "cookie-options" >}}#secret) to some secret string which will be used to sign the cookies sent to clients to prevent tampering. This string could be hard-coded in your config file, or (better) reside in an environment variable:
 
-```TypeScript
+```ts
 const config = {
   // ...
   authOptions: {
@@ -45,7 +45,7 @@ The workflow would be as follows:
 
 Here's a simplified example of how that would look:
 
-```TypeScript
+```ts
 const config = {
     // ...
     authOptions: {
@@ -54,7 +54,7 @@ const config = {
 }
 ```
 
-```TypeScript
+```ts
 let token: string;
 
 export async function request(query: string, variables: any) {

docs/docs/reference/admin-ui-api/action-bar/action-bar-item.md

@@ -1,25 +1,23 @@
 ---
 title: "ActionBarItem"
 weight: 10
-date: 2023-07-14T16:57:51.118Z
+date: 2023-07-20T13:56:18.017Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# ActionBarItem
-<div class="symbol">
 
+## ActionBarItem
 
-# ActionBarItem
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder-types.ts" sourceLine="89" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder-types.ts" sourceLine="89" packageName="@vendure/admin-ui" />
 
 A button in the ActionBar area at the top of one of the list or detail views.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 interface ActionBarItem {
   id: string;
   label: string;
@@ -33,67 +31,54 @@ interface ActionBarItem {
   requiresPermission?: string | string[];
 }
 ```
-## Members
 
 ### id
 
-{{< member-info kind="property" type="string"  >}}
+<MemberInfo kind="property" type="string"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### label
 
-{{< member-info kind="property" type="string"  >}}
+<MemberInfo kind="property" type="string"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### locationId
 
-{{< member-info kind="property" type="<a href='/admin-ui-api/action-bar/action-bar-location-id#actionbarlocationid'>ActionBarLocationId</a>"  >}}
+<MemberInfo kind="property" type="<a href='/admin-ui-api/action-bar/action-bar-location-id#actionbarlocationid'>ActionBarLocationId</a>"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### disabled
 
-{{< member-info kind="property" type="Observable&#60;boolean&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;boolean&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onClick
 
-{{< member-info kind="property" type="(event: MouseEvent, context: <a href='/admin-ui-api/action-bar/on-click-context#onclickcontext'>OnClickContext</a>) =&#62; void"  >}}
+<MemberInfo kind="property" type="(event: MouseEvent, context: <a href='/admin-ui-api/action-bar/on-click-context#onclickcontext'>OnClickContext</a>) =&#62; void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### routerLink
 
-{{< member-info kind="property" type="RouterLinkDefinition"  >}}
+<MemberInfo kind="property" type="RouterLinkDefinition"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### buttonColor
 
-{{< member-info kind="property" type="'primary' | 'success' | 'warning'"  >}}
+<MemberInfo kind="property" type="'primary' | 'success' | 'warning'"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### buttonStyle
 
-{{< member-info kind="property" type="'solid' | 'outline' | 'link'"  >}}
+<MemberInfo kind="property" type="'solid' | 'outline' | 'link'"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### icon
 
-{{< member-info kind="property" type="string"  >}}
+<MemberInfo kind="property" type="string"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### requiresPermission
 
-{{< member-info kind="property" type="string | string[]"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="property" type="string | string[]"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/action-bar/action-bar-location-id.md

@@ -1,25 +1,22 @@
 ---
 title: "ActionBarLocationId"
 weight: 10
-date: 2023-07-14T16:57:51.071Z
+date: 2023-07-20T13:56:17.856Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# ActionBarLocationId
-<div class="symbol">
 
+## ActionBarLocationId
 
-# ActionBarLocationId
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/common/component-registry-types.ts" sourceLine="103" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/common/component-registry-types.ts" sourceLine="103" packageName="@vendure/admin-ui" />
 
 The valid locationIds for registering action bar items.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 type ActionBarLocationId = PageLocationId
 ```
-</div>

docs/docs/reference/admin-ui-api/action-bar/add-action-bar-item.md

@@ -1,22 +1,22 @@
 ---
 title: "AddActionBarItem"
 weight: 10
-date: 2023-07-14T16:57:51.125Z
+date: 2023-07-20T13:56:18.048Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# addActionBarItem
-<div class="symbol">
 
+## addActionBarItem
 
-# addActionBarItem
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder.service.ts" sourceLine="120" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder.service.ts" sourceLine="120" packageName="@vendure/admin-ui" />
 
 Adds a button to the ActionBar at the top right of each list or detail view. The locationId can
-be determined by inspecting the DOM and finding the <vdr-action-bar> element and its
+be determined by inspecting the DOM and finding the `<vdr-action-bar>` element and its
 `data-location-id` attribute.
 
 This should be used in the NgModule `providers` array of your ui extension module.
@@ -38,15 +38,12 @@ This should be used in the NgModule `providers` array of your ui extension modul
 export class MyUiExtensionModule {}
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 function addActionBarItem(config: ActionBarItem): Provider
 ```
-## Parameters
+Parameters
 
 ### config
 
-{{< member-info kind="parameter" type="<a href='/admin-ui-api/action-bar/action-bar-item#actionbaritem'>ActionBarItem</a>" >}}
+<MemberInfo kind="parameter" type="<a href='/admin-ui-api/action-bar/action-bar-item#actionbaritem'>ActionBarItem</a>" />
 
-</div>

docs/docs/reference/admin-ui-api/action-bar/on-click-context.md

@@ -1,50 +1,42 @@
 ---
 title: "OnClickContext"
 weight: 10
-date: 2023-07-14T16:57:51.116Z
+date: 2023-07-20T13:56:18.009Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# OnClickContext
-<div class="symbol">
 
+## OnClickContext
 
-# OnClickContext
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder-types.ts" sourceLine="77" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder-types.ts" sourceLine="77" packageName="@vendure/admin-ui" />
 
 Utilities available to the onClick handler of an ActionBarItem.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 interface OnClickContext {
   route: ActivatedRoute;
   dataService: DataService;
   notificationService: NotificationService;
 }
 ```
-## Members
 
 ### route
 
-{{< member-info kind="property" type="ActivatedRoute"  >}}
+<MemberInfo kind="property" type="ActivatedRoute"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### dataService
 
-{{< member-info kind="property" type="<a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>"  >}}
+<MemberInfo kind="property" type="<a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### notificationService
 
-{{< member-info kind="property" type="<a href='/admin-ui-api/providers/notification-service#notificationservice'>NotificationService</a>"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="property" type="<a href='/admin-ui-api/providers/notification-service#notificationservice'>NotificationService</a>"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/action-bar/page-location-id.md

@@ -1,25 +1,23 @@
 ---
 title: "PageLocationId"
 weight: 10
-date: 2023-07-14T16:57:51.071Z
+date: 2023-07-20T13:56:17.854Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# PageLocationId
-<div class="symbol">
 
+## PageLocationId
 
-# PageLocationId
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/common/component-registry-types.ts" sourceLine="51" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/common/component-registry-types.ts" sourceLine="51" packageName="@vendure/admin-ui" />
 
 The valid locationIds for registering action bar items or tabs.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 type PageLocationId = | 'administrator-detail'
     | 'administrator-list'
     | 'asset-detail'
@@ -65,4 +63,3 @@ type PageLocationId = | 'administrator-detail'
     | 'zone-detail'
     | 'zone-list'
 ```
-</div>

docs/docs/reference/admin-ui-api/bulk-actions/bulk-action.md

@@ -1,27 +1,25 @@
 ---
 title: "BulkAction"
 weight: 10
-date: 2023-07-14T16:57:51.079Z
+date: 2023-07-20T13:56:17.883Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# BulkAction
-<div class="symbol">
 
+## BulkAction
 
-# BulkAction
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/bulk-action-registry/bulk-action-types.ts" sourceLine="99" packageName="@vendure/admin-ui" since="1.8.0">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/bulk-action-registry/bulk-action-types.ts" sourceLine="99" packageName="@vendure/admin-ui" since="1.8.0" />
 
 Configures a bulk action which can be performed on all selected items in a list view.
 
 For a full example, see the <a href='/admin-ui-api/bulk-actions/register-bulk-action#registerbulkaction'>registerBulkAction</a> docs.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 interface BulkAction<ItemType = any, ComponentType = any> {
   location: BulkActionLocationId;
   label: string;
@@ -35,57 +33,50 @@ interface BulkAction<ItemType = any, ComponentType = any> {
   requiresPermission?: string | ((userPermissions: string[]) => boolean);
 }
 ```
-## Members
 
 ### location
 
-{{< member-info kind="property" type="<a href='/admin-ui-api/bulk-actions/bulk-action#bulkactionlocationid'>BulkActionLocationId</a>"  >}}
+<MemberInfo kind="property" type="<a href='/admin-ui-api/bulk-actions/bulk-action#bulkactionlocationid'>BulkActionLocationId</a>"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### label
 
-{{< member-info kind="property" type="string"  >}}
+<MemberInfo kind="property" type="string"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### getTranslationVars
 
-{{< member-info kind="property" type="(         context: <a href='/admin-ui-api/bulk-actions/bulk-action#bulkactionfunctioncontext'>BulkActionFunctionContext</a>&#60;ItemType, ComponentType&#62;,     ) =&#62; Record&#60;string, string | number&#62; | Promise&#60;Record&#60;string, string | number&#62;&#62;"  >}}
-
-{{< member-description >}}An optional function that should resolve to a map of translation variables which can be
-used when translating the `label` string.{{< /member-description >}}
+<MemberInfo kind="property" type="(         context: <a href='/admin-ui-api/bulk-actions/bulk-action#bulkactionfunctioncontext'>BulkActionFunctionContext</a>&#60;ItemType, ComponentType&#62;,     ) =&#62; Record&#60;string, string | number&#62; | Promise&#60;Record&#60;string, string | number&#62;&#62;"   />
 
+An optional function that should resolve to a map of translation variables which can be
+used when translating the `label` string.
 ### icon
 
-{{< member-info kind="property" type="string"  >}}
-
-{{< member-description >}}A valid [Clarity Icons](https://core.clarity.design/foundation/icons/shapes/) icon shape, e.g.
-"cog", "user", "info-standard".{{< /member-description >}}
+<MemberInfo kind="property" type="string"   />
 
+A valid [Clarity Icons](https://core.clarity.design/foundation/icons/shapes/) icon shape, e.g.
+"cog", "user", "info-standard".
 ### iconClass
 
-{{< member-info kind="property" type="string"  >}}
+<MemberInfo kind="property" type="string"   />
 
-{{< member-description >}}A class to be added to the icon element. Examples:
+A class to be added to the icon element. Examples:
 
 - is-success
 - is-danger
 - is-warning
 - is-info
-- is-highlight{{< /member-description >}}
-
+- is-highlight
 ### onClick
 
-{{< member-info kind="property" type="(context: <a href='/admin-ui-api/bulk-actions/bulk-action#bulkactionclickcontext'>BulkActionClickContext</a>&#60;ItemType, ComponentType&#62;) =&#62; void"  >}}
-
-{{< member-description >}}Defines the logic that executes when the bulk action button is clicked.{{< /member-description >}}
+<MemberInfo kind="property" type="(context: <a href='/admin-ui-api/bulk-actions/bulk-action#bulkactionclickcontext'>BulkActionClickContext</a>&#60;ItemType, ComponentType&#62;) =&#62; void"   />
 
+Defines the logic that executes when the bulk action button is clicked.
 ### isVisible
 
-{{< member-info kind="property" type="(context: <a href='/admin-ui-api/bulk-actions/bulk-action#bulkactionfunctioncontext'>BulkActionFunctionContext</a>&#60;ItemType, ComponentType&#62;) =&#62; boolean | Promise&#60;boolean&#62;"  >}}
+<MemberInfo kind="property" type="(context: <a href='/admin-ui-api/bulk-actions/bulk-action#bulkactionfunctioncontext'>BulkActionFunctionContext</a>&#60;ItemType, ComponentType&#62;) =&#62; boolean | Promise&#60;boolean&#62;"   />
 
-{{< member-description >}}A function that determines whether this bulk action item should be displayed in the menu.
+A function that determines whether this bulk action item should be displayed in the menu.
 If not defined, the item will always be displayed.
 
 This function will be invoked each time the selection is changed, so try to avoid expensive code
@@ -106,13 +97,12 @@ registerBulkAction({
     .toPromise(),
   // ...
 });
-```{{< /member-description >}}
-
+```
 ### requiresPermission
 
-{{< member-info kind="property" type="string | ((userPermissions: string[]) =&#62; boolean)"  >}}
+<MemberInfo kind="property" type="string | ((userPermissions: string[]) =&#62; boolean)"   />
 
-{{< member-description >}}Control the display of this item based on the user permissions.
+Control the display of this item based on the user permissions.
 
 *Example*
 
@@ -127,22 +117,16 @@ registerBulkAction({
     userPermissions.includes(Permission.UpdateProduct),
   // ...
 })
-```{{< /member-description >}}
-
-
-</div>
-<div class="symbol">
+```
 
 
-# BulkActionLocationId
+## BulkActionLocationId
 
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/bulk-action-registry/bulk-action-types.ts" sourceLine="12" packageName="@vendure/admin-ui" since="1.8.0">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/bulk-action-registry/bulk-action-types.ts" sourceLine="12" packageName="@vendure/admin-ui" since="1.8.0" />
 
 A valid location of a list view that supports the bulk actions API.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 type BulkActionLocationId = | 'product-list'
     | 'facet-list'
     | 'collection-list'
@@ -164,20 +148,16 @@ type BulkActionLocationId = | 'product-list'
     | 'zone-members-list'
     | string
 ```
-</div>
-<div class="symbol">
 
 
-# BulkActionFunctionContext
+## BulkActionFunctionContext
 
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/bulk-action-registry/bulk-action-types.ts" sourceLine="43" packageName="@vendure/admin-ui" since="1.8.0">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/bulk-action-registry/bulk-action-types.ts" sourceLine="43" packageName="@vendure/admin-ui" since="1.8.0" />
 
 This is the argument which gets passed to the `getTranslationVars` and `isVisible` functions
 of the BulkAction definition.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 interface BulkActionFunctionContext<ItemType, ComponentType> {
   selection: ItemType[];
   hostComponent: ComponentType;
@@ -185,73 +165,58 @@ interface BulkActionFunctionContext<ItemType, ComponentType> {
   route: ActivatedRoute;
 }
 ```
-## Members
 
 ### selection
 
-{{< member-info kind="property" type="ItemType[]"  >}}
-
-{{< member-description >}}An array of the selected items from the list.{{< /member-description >}}
+<MemberInfo kind="property" type="ItemType[]"   />
 
+An array of the selected items from the list.
 ### hostComponent
 
-{{< member-info kind="property" type="ComponentType"  >}}
+<MemberInfo kind="property" type="ComponentType"   />
 
-{{< member-description >}}The component instance that is hosting the list view. For instance,
+The component instance that is hosting the list view. For instance,
 `ProductListComponent`. This can be used to call methods on the instance,
 e.g. calling `hostComponent.refresh()` to force a list refresh after
-deleting the selected items.{{< /member-description >}}
-
+deleting the selected items.
 ### injector
 
-{{< member-info kind="property" type="<a href='/typescript-api/common/injector#injector'>Injector</a>"  >}}
-
-{{< member-description >}}The Angular [Injector](https://angular.io/api/core/Injector) which can be used
-to get service instances which might be needed in the click handler.{{< /member-description >}}
+<MemberInfo kind="property" type="<a href='/typescript-api/common/injector#injector'>Injector</a>"   />
 
+The Angular [Injector](https://angular.io/api/core/Injector) which can be used
+to get service instances which might be needed in the click handler.
 ### route
 
-{{< member-info kind="property" type="ActivatedRoute"  >}}
+<MemberInfo kind="property" type="ActivatedRoute"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 
-</div>
-<div class="symbol">
 
+## BulkActionClickContext
 
-# BulkActionClickContext
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/bulk-action-registry/bulk-action-types.ts" sourceLine="74" packageName="@vendure/admin-ui" since="1.8.0">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/bulk-action-registry/bulk-action-types.ts" sourceLine="74" packageName="@vendure/admin-ui" since="1.8.0" />
 
 This is the argument which gets passed to the `onClick` function of a BulkAction.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 interface BulkActionClickContext<ItemType, ComponentType> extends BulkActionFunctionContext<ItemType, ComponentType> {
   clearSelection: () => void;
   event: MouseEvent;
 }
 ```
-## Extends
+Extends
 
  * <a href='/admin-ui-api/bulk-actions/bulk-action#bulkactionfunctioncontext'>BulkActionFunctionContext</a>&#60;ItemType, ComponentType&#62;
 
 
-## Members
 
 ### clearSelection
 
-{{< member-info kind="property" type="() =&#62; void"  >}}
-
-{{< member-description >}}Clears the selection in the active list view.{{< /member-description >}}
+<MemberInfo kind="property" type="() =&#62; void"   />
 
+Clears the selection in the active list view.
 ### event
 
-{{< member-info kind="property" type="MouseEvent"  >}}
-
-{{< member-description >}}The click event itself.{{< /member-description >}}
-
+<MemberInfo kind="property" type="MouseEvent"   />
 
-</div>
+The click event itself.

docs/docs/reference/admin-ui-api/bulk-actions/register-bulk-action.md

@@ -1,19 +1,19 @@
 ---
 title: "RegisterBulkAction"
 weight: 10
-date: 2023-07-14T16:57:51.088Z
+date: 2023-07-20T13:56:17.913Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# registerBulkAction
-<div class="symbol">
 
+## registerBulkAction
 
-# registerBulkAction
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/bulk-action-registry/register-bulk-action.ts" sourceLine="56" packageName="@vendure/admin-ui" since="1.8.0">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/bulk-action-registry/register-bulk-action.ts" sourceLine="56" packageName="@vendure/admin-ui" since="1.8.0" />
 
 Registers a custom <a href='/admin-ui-api/bulk-actions/bulk-action#bulkaction'>BulkAction</a> which can be invoked from the bulk action menu
 of any supported list view.
@@ -62,15 +62,12 @@ import { ModalService, registerBulkAction, SharedModule } from '@vendure/admin-u
 export class MyUiExtensionModule {}
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 function registerBulkAction(bulkAction: BulkAction): FactoryProvider
 ```
-## Parameters
+Parameters
 
 ### bulkAction
 
-{{< member-info kind="parameter" type="<a href='/admin-ui-api/bulk-actions/bulk-action#bulkaction'>BulkAction</a>" >}}
+<MemberInfo kind="parameter" type="<a href='/admin-ui-api/bulk-actions/bulk-action#bulkaction'>BulkAction</a>" />
 
-</div>

docs/docs/reference/admin-ui-api/components/asset-picker-dialog-component.md

@@ -1,19 +1,19 @@
 ---
 title: "AssetPickerDialogComponent"
 weight: 10
-date: 2023-07-14T16:57:51.138Z
+date: 2023-07-20T13:56:18.100Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# AssetPickerDialogComponent
-<div class="symbol">
 
+## AssetPickerDialogComponent
 
-# AssetPickerDialogComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/components/asset-picker-dialog/asset-picker-dialog.component.ts" sourceLine="52" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/components/asset-picker-dialog/asset-picker-dialog.component.ts" sourceLine="52" packageName="@vendure/admin-ui" />
 
 A dialog which allows the creation and selection of assets.
 
@@ -33,9 +33,7 @@ selectAssets() {
 }
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class AssetPickerDialogComponent implements OnInit, AfterViewInit, OnDestroy, Dialog<Asset[]> {
   assets$: Observable<AssetLike[]>;
   allTags$: Observable<TagFragment[]>;
@@ -62,7 +60,7 @@ class AssetPickerDialogComponent implements OnInit, AfterViewInit, OnDestroy, Di
   createAssets(files: File[]) => ;
 }
 ```
-## Implements
+Implements
 
  * OnInit
  * AfterViewInit
@@ -70,121 +68,99 @@ class AssetPickerDialogComponent implements OnInit, AfterViewInit, OnDestroy, Di
  * <a href='/admin-ui-api/providers/modal-service#dialog'>Dialog</a>&#60;<a href='/typescript-api/entities/asset#asset'>Asset</a>[]&#62;
 
 
-## Members
 
 ### assets$
 
-{{< member-info kind="property" type="Observable&#60;AssetLike[]&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;AssetLike[]&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### allTags$
 
-{{< member-info kind="property" type="Observable&#60;TagFragment[]&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;TagFragment[]&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### paginationConfig
 
-{{< member-info kind="property" type="PaginationInstance"  >}}
+<MemberInfo kind="property" type="PaginationInstance"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### multiSelect
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### initialTags
 
-{{< member-info kind="property" type="string[]"  >}}
+<MemberInfo kind="property" type="string[]"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### resolveWith
 
-{{< member-info kind="property" type="(result?: <a href='/typescript-api/entities/asset#asset'>Asset</a>[]) =&#62; void"  >}}
+<MemberInfo kind="property" type="(result?: <a href='/typescript-api/entities/asset#asset'>Asset</a>[]) =&#62; void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### selection
 
-{{< member-info kind="property" type="<a href='/typescript-api/entities/asset#asset'>Asset</a>[]"  >}}
+<MemberInfo kind="property" type="<a href='/typescript-api/entities/asset#asset'>Asset</a>[]"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### searchTerm$
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### filterByTags$
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### uploading
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### constructor
 
-{{< member-info kind="method" type="(dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>, notificationService: <a href='/admin-ui-api/providers/notification-service#notificationservice'>NotificationService</a>) => AssetPickerDialogComponent"  >}}
+<MemberInfo kind="method" type="(dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>, notificationService: <a href='/admin-ui-api/providers/notification-service#notificationservice'>NotificationService</a>) => AssetPickerDialogComponent"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnInit
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngAfterViewInit
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnDestroy
 
-{{< member-info kind="method" type="() => void"  >}}
+<MemberInfo kind="method" type="() => void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### pageChange
 
-{{< member-info kind="method" type="(page: number) => "  >}}
+<MemberInfo kind="method" type="(page: number) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### itemsPerPageChange
 
-{{< member-info kind="method" type="(itemsPerPage: number) => "  >}}
+<MemberInfo kind="method" type="(itemsPerPage: number) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### cancel
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### select
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### createAssets
 
-{{< member-info kind="method" type="(files: File[]) => "  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(files: File[]) => "   />
 
 
-</div>

docs/docs/reference/admin-ui-api/components/chip-component.md

@@ -1,19 +1,19 @@
 ---
 title: "ChipComponent"
 weight: 10
-date: 2023-07-14T16:57:51.149Z
+date: 2023-07-20T13:56:18.125Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# ChipComponent
-<div class="symbol">
 
+## ChipComponent
 
-# ChipComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/components/chip/chip.component.ts" sourceLine="16" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/components/chip/chip.component.ts" sourceLine="16" packageName="@vendure/admin-ui" />
 
 A chip component for displaying a label with an optional action icon.
 
@@ -26,9 +26,7 @@ A chip component for displaying a label with an optional action icon.
 {{ item.value }}</vdr-chip>
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class ChipComponent {
   @Input() @Input() icon: string;
   @Input() @Input() invert = false;
@@ -37,38 +35,30 @@ class ChipComponent {
   @Output() @Output() iconClick = new EventEmitter<MouseEvent>();
 }
 ```
-## Members
 
 ### icon
 
-{{< member-info kind="property" type="string"  >}}
-
-{{< member-description >}}The icon should be the name of one of the available Clarity icons: https://clarity.design/foundation/icons/shapes/{{< /member-description >}}
+<MemberInfo kind="property" type="string"   />
 
+The icon should be the name of one of the available Clarity icons: https://clarity.design/foundation/icons/shapes/
 ### invert
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### colorFrom
 
-{{< member-info kind="property" type=""  >}}
-
-{{< member-description >}}If set, the chip will have an auto-generated background
-color based on the string value passed in.{{< /member-description >}}
+<MemberInfo kind="property" type=""   />
 
+If set, the chip will have an auto-generated background
+color based on the string value passed in.
 ### colorType
 
-{{< member-info kind="property" type="'error' | 'success' | 'warning'"  >}}
-
-{{< member-description >}}The color of the chip can also be one of the standard status colors.{{< /member-description >}}
+<MemberInfo kind="property" type="'error' | 'success' | 'warning'"   />
 
+The color of the chip can also be one of the standard status colors.
 ### iconClick
 
-{{< member-info kind="property" type=""  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="property" type=""   />
 
 
-</div>

docs/docs/reference/admin-ui-api/components/currency-input-component.md

@@ -1,19 +1,19 @@
 ---
 title: "CurrencyInputComponent"
 weight: 10
-date: 2023-07-14T16:57:51.152Z
+date: 2023-07-20T13:56:18.132Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# CurrencyInputComponent
-<div class="symbol">
 
+## CurrencyInputComponent
 
-# CurrencyInputComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/components/currency-input/currency-input.component.ts" sourceLine="33" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/components/currency-input/currency-input.component.ts" sourceLine="33" packageName="@vendure/admin-ui" />
 
 A form input control which displays currency in decimal format, whilst working
 with the integer cent value in the background.
@@ -27,9 +27,7 @@ with the integer cent value in the background.
 ></vdr-currency-input>
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class CurrencyInputComponent implements ControlValueAccessor, OnInit, OnChanges, OnDestroy {
   @Input() @Input() disabled = false;
   @Input() @Input() readonly = false;
@@ -54,7 +52,7 @@ class CurrencyInputComponent implements ControlValueAccessor, OnInit, OnChanges,
   writeValue(value: any) => void;
 }
 ```
-## Implements
+Implements
 
  * ControlValueAccessor
  * OnInit
@@ -62,133 +60,109 @@ class CurrencyInputComponent implements ControlValueAccessor, OnInit, OnChanges,
  * OnDestroy
 
 
-## Members
 
 ### disabled
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### readonly
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### value
 
-{{< member-info kind="property" type="number"  >}}
+<MemberInfo kind="property" type="number"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### currencyCode
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### valueChange
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### prefix$
 
-{{< member-info kind="property" type="Observable&#60;string&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;string&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### suffix$
 
-{{< member-info kind="property" type="Observable&#60;string&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;string&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### hasFractionPart
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onChange
 
-{{< member-info kind="property" type="(val: any) =&#62; void"  >}}
+<MemberInfo kind="property" type="(val: any) =&#62; void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onTouch
 
-{{< member-info kind="property" type="() =&#62; void"  >}}
+<MemberInfo kind="property" type="() =&#62; void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### _inputValue
 
-{{< member-info kind="property" type="string"  >}}
+<MemberInfo kind="property" type="string"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### constructor
 
-{{< member-info kind="method" type="(dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>, changeDetectorRef: ChangeDetectorRef) => CurrencyInputComponent"  >}}
+<MemberInfo kind="method" type="(dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>, changeDetectorRef: ChangeDetectorRef) => CurrencyInputComponent"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnInit
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnChanges
 
-{{< member-info kind="method" type="(changes: SimpleChanges) => "  >}}
+<MemberInfo kind="method" type="(changes: SimpleChanges) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnDestroy
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### registerOnChange
 
-{{< member-info kind="method" type="(fn: any) => "  >}}
+<MemberInfo kind="method" type="(fn: any) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### registerOnTouched
 
-{{< member-info kind="method" type="(fn: any) => "  >}}
+<MemberInfo kind="method" type="(fn: any) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setDisabledState
 
-{{< member-info kind="method" type="(isDisabled: boolean) => "  >}}
+<MemberInfo kind="method" type="(isDisabled: boolean) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onInput
 
-{{< member-info kind="method" type="(value: string) => "  >}}
+<MemberInfo kind="method" type="(value: string) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onFocus
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### writeValue
 
-{{< member-info kind="method" type="(value: any) => void"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(value: any) => void"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/components/data-table-component.md

@@ -1,19 +1,19 @@
 ---
 title: "DataTableComponent"
 weight: 10
-date: 2023-07-14T16:57:51.164Z
+date: 2023-07-20T13:56:18.169Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# DataTableComponent
-<div class="symbol">
 
+## DataTableComponent
 
-# DataTableComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/components/data-table/data-table.component.ts" sourceLine="86" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/components/data-table/data-table.component.ts" sourceLine="86" packageName="@vendure/admin-ui" />
 
 A table for displaying PaginatedList results. It is designed to be used inside components which
 extend the <a href='/admin-ui-api/list-detail-views/base-list-component#baselistcomponent'>BaseListComponent</a> class.
@@ -73,9 +73,7 @@ extend the <a href='/admin-ui-api/list-detail-views/base-list-component#baselist
 </vdr-data-table>
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class DataTableComponent<T> implements AfterContentInit, OnChanges, OnInit, OnDestroy {
   @Input() @Input() items: T[];
   @Input() @Input() itemsPerPage: number;
@@ -105,7 +103,7 @@ class DataTableComponent<T> implements AfterContentInit, OnChanges, OnInit, OnDe
   onRowClick(item: T, event: MouseEvent) => ;
 }
 ```
-## Implements
+Implements
 
  * AfterContentInit
  * OnChanges
@@ -113,163 +111,134 @@ class DataTableComponent<T> implements AfterContentInit, OnChanges, OnInit, OnDe
  * OnDestroy
 
 
-## Members
 
 ### items
 
-{{< member-info kind="property" type="T[]"  >}}
+<MemberInfo kind="property" type="T[]"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### itemsPerPage
 
-{{< member-info kind="property" type="number"  >}}
+<MemberInfo kind="property" type="number"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### currentPage
 
-{{< member-info kind="property" type="number"  >}}
+<MemberInfo kind="property" type="number"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### totalItems
 
-{{< member-info kind="property" type="number"  >}}
+<MemberInfo kind="property" type="number"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### emptyStateLabel
 
-{{< member-info kind="property" type="string"  >}}
+<MemberInfo kind="property" type="string"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### selectionManager
 
-{{< member-info kind="property" type="SelectionManager&#60;T&#62;"  >}}
+<MemberInfo kind="property" type="SelectionManager&#60;T&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### pageChange
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### itemsPerPageChange
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### allSelected
 
-{{< member-info kind="property" type="boolean"  >}}
+<MemberInfo kind="property" type="boolean"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### isRowSelectedFn
 
-{{< member-info kind="property" type="(item: T) =&#62; boolean"  >}}
+<MemberInfo kind="property" type="(item: T) =&#62; boolean"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### allSelectChange
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### rowSelectChange
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### columns
 
-{{< member-info kind="property" type="QueryList&#60;DataTableColumnComponent&#62;"  >}}
+<MemberInfo kind="property" type="QueryList&#60;DataTableColumnComponent&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### templateRefs
 
-{{< member-info kind="property" type="QueryList&#60;TemplateRef&#60;any&#62;&#62;"  >}}
+<MemberInfo kind="property" type="QueryList&#60;TemplateRef&#60;any&#62;&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### rowTemplate
 
-{{< member-info kind="property" type="TemplateRef&#60;any&#62;"  >}}
+<MemberInfo kind="property" type="TemplateRef&#60;any&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### currentStart
 
-{{< member-info kind="property" type="number"  >}}
+<MemberInfo kind="property" type="number"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### currentEnd
 
-{{< member-info kind="property" type="number"  >}}
+<MemberInfo kind="property" type="number"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### disableSelect
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### constructor
 
-{{< member-info kind="method" type="(changeDetectorRef: ChangeDetectorRef) => DataTableComponent"  >}}
+<MemberInfo kind="method" type="(changeDetectorRef: ChangeDetectorRef) => DataTableComponent"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnInit
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnChanges
 
-{{< member-info kind="method" type="(changes: SimpleChanges) => "  >}}
+<MemberInfo kind="method" type="(changes: SimpleChanges) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnDestroy
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngAfterContentInit
 
-{{< member-info kind="method" type="() => void"  >}}
+<MemberInfo kind="method" type="() => void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### trackByFn
 
-{{< member-info kind="method" type="(index: number, item: any) => "  >}}
+<MemberInfo kind="method" type="(index: number, item: any) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onToggleAllClick
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onRowClick
 
-{{< member-info kind="method" type="(item: T, event: MouseEvent) => "  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(item: T, event: MouseEvent) => "   />
 
 
-</div>

docs/docs/reference/admin-ui-api/components/data-table2component.md

@@ -1,19 +1,19 @@
 ---
 title: "DataTable2Component"
 weight: 10
-date: 2023-07-14T16:57:51.179Z
+date: 2023-07-20T13:56:18.222Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# DataTable2Component
-<div class="symbol">
 
+## DataTable2Component
 
-# DataTable2Component
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/components/data-table-2/data-table2.component.ts" sourceLine="92" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/components/data-table-2/data-table2.component.ts" sourceLine="92" packageName="@vendure/admin-ui" />
 
 A table for displaying PaginatedList results. It is designed to be used inside components which
 extend the <a href='/admin-ui-api/list-detail-views/base-list-component#baselistcomponent'>BaseListComponent</a> or <a href='/admin-ui-api/list-detail-views/typed-base-list-component#typedbaselistcomponent'>TypedBaseListComponent</a> class.
@@ -74,9 +74,7 @@ extend the <a href='/admin-ui-api/list-detail-views/base-list-component#baselist
 </vdr-data-table-2>
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class DataTable2Component<T> implements AfterContentInit, OnChanges, OnDestroy {
   @Input() @Input() id: string;
   @Input() @Input() items: T[];
@@ -118,236 +116,196 @@ class DataTable2Component<T> implements AfterContentInit, OnChanges, OnDestroy {
   protected getDataTableConfig() => DataTableConfig;
 }
 ```
-## Implements
+Implements
 
  * AfterContentInit
  * OnChanges
  * OnDestroy
 
 
-## Members
 
 ### id
 
-{{< member-info kind="property" type="string"  >}}
+<MemberInfo kind="property" type="string"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### items
 
-{{< member-info kind="property" type="T[]"  >}}
+<MemberInfo kind="property" type="T[]"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### itemsPerPage
 
-{{< member-info kind="property" type="number"  >}}
+<MemberInfo kind="property" type="number"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### currentPage
 
-{{< member-info kind="property" type="number"  >}}
+<MemberInfo kind="property" type="number"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### totalItems
 
-{{< member-info kind="property" type="number"  >}}
+<MemberInfo kind="property" type="number"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### emptyStateLabel
 
-{{< member-info kind="property" type="string"  >}}
+<MemberInfo kind="property" type="string"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### filters
 
-{{< member-info kind="property" type="DataTableFilterCollection"  >}}
+<MemberInfo kind="property" type="DataTableFilterCollection"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### activeIndex
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### pageChange
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### itemsPerPageChange
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### columns
 
-{{< member-info kind="property" type="QueryList&#60;DataTable2ColumnComponent&#60;T&#62;&#62;"  >}}
+<MemberInfo kind="property" type="QueryList&#60;DataTable2ColumnComponent&#60;T&#62;&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### customFieldColumns
 
-{{< member-info kind="property" type="QueryList&#60;DataTableCustomFieldColumnComponent&#60;T&#62;&#62;"  >}}
+<MemberInfo kind="property" type="QueryList&#60;DataTableCustomFieldColumnComponent&#60;T&#62;&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### searchComponent
 
-{{< member-info kind="property" type="DataTable2SearchComponent"  >}}
+<MemberInfo kind="property" type="DataTable2SearchComponent"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### bulkActionMenuComponent
 
-{{< member-info kind="property" type="BulkActionMenuComponent"  >}}
+<MemberInfo kind="property" type="BulkActionMenuComponent"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### customSearchTemplate
 
-{{< member-info kind="property" type="TemplateRef&#60;any&#62;"  >}}
+<MemberInfo kind="property" type="TemplateRef&#60;any&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### templateRefs
 
-{{< member-info kind="property" type="QueryList&#60;TemplateRef&#60;any&#62;&#62;"  >}}
+<MemberInfo kind="property" type="QueryList&#60;TemplateRef&#60;any&#62;&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### rowTemplate
 
-{{< member-info kind="property" type="TemplateRef&#60;any&#62;"  >}}
+<MemberInfo kind="property" type="TemplateRef&#60;any&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### currentStart
 
-{{< member-info kind="property" type="number"  >}}
+<MemberInfo kind="property" type="number"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### currentEnd
 
-{{< member-info kind="property" type="number"  >}}
+<MemberInfo kind="property" type="number"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### disableSelect
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### showSearchFilterRow
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### uiLanguage$
 
-{{< member-info kind="property" type="Observable&#60;<a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;<a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### constructor
 
-{{< member-info kind="method" type="(changeDetectorRef: ChangeDetectorRef, localStorageService: LocalStorageService, dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>) => DataTable2Component"  >}}
+<MemberInfo kind="method" type="(changeDetectorRef: ChangeDetectorRef, localStorageService: LocalStorageService, dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>) => DataTable2Component"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### selectionManager
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### allColumns
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### visibleSortedColumns
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### sortedColumns
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnChanges
 
-{{< member-info kind="method" type="(changes: SimpleChanges) => "  >}}
+<MemberInfo kind="method" type="(changes: SimpleChanges) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnDestroy
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngAfterContentInit
 
-{{< member-info kind="method" type="() => void"  >}}
+<MemberInfo kind="method" type="() => void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onColumnReorder
 
-{{< member-info kind="method" type="(event: { column: DataTable2ColumnComponent&#60;any&#62;; newIndex: number }) => "  >}}
+<MemberInfo kind="method" type="(event: { column: DataTable2ColumnComponent&#60;any&#62;; newIndex: number }) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onColumnsReset
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### toggleSearchFilterRow
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### trackByFn
 
-{{< member-info kind="method" type="(index: number, item: any) => "  >}}
+<MemberInfo kind="method" type="(index: number, item: any) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onToggleAllClick
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onRowClick
 
-{{< member-info kind="method" type="(item: T, event: MouseEvent) => "  >}}
+<MemberInfo kind="method" type="(item: T, event: MouseEvent) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### getDataTableConfig
 
-{{< member-info kind="method" type="() => DataTableConfig"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="() => DataTableConfig"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/components/datetime-picker-component.md

@@ -1,19 +1,19 @@
 ---
 title: "DatetimePickerComponent"
 weight: 10
-date: 2023-07-14T16:57:51.199Z
+date: 2023-07-20T13:56:18.286Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# DatetimePickerComponent
-<div class="symbol">
 
+## DatetimePickerComponent
 
-# DatetimePickerComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/components/datetime-picker/datetime-picker.component.ts" sourceLine="39" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/components/datetime-picker/datetime-picker.component.ts" sourceLine="39" packageName="@vendure/admin-ui" />
 
 A form input for selecting datetime values.
 
@@ -23,9 +23,7 @@ A form input for selecting datetime values.
 <vdr-datetime-picker [(ngModel)]="startDate"></vdr-datetime-picker>
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class DatetimePickerComponent implements ControlValueAccessor, AfterViewInit, OnInit, OnDestroy {
   @Input() @Input() yearRange;
   @Input() @Input() weekStartDay: DayOfWeek = 'mon';
@@ -67,7 +65,7 @@ class DatetimePickerComponent implements ControlValueAccessor, AfterViewInit, On
   closeDatepicker() => ;
 }
 ```
-## Implements
+Implements
 
  * ControlValueAccessor
  * AfterViewInit
@@ -75,237 +73,196 @@ class DatetimePickerComponent implements ControlValueAccessor, AfterViewInit, On
  * OnDestroy
 
 
-## Members
 
 ### yearRange
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}The range above and below the current year which is selectable from
+The range above and below the current year which is selectable from
 the year select control. If a min or max value is set, these will
-override the yearRange.{{< /member-description >}}
-
+override the yearRange.
 ### weekStartDay
 
-{{< member-info kind="property" type="DayOfWeek"  >}}
-
-{{< member-description >}}The day that the week should start with in the calendar view.{{< /member-description >}}
+<MemberInfo kind="property" type="DayOfWeek"   />
 
+The day that the week should start with in the calendar view.
 ### timeGranularityInterval
 
-{{< member-info kind="property" type=""  >}}
-
-{{< member-description >}}The granularity of the minutes time picker{{< /member-description >}}
+<MemberInfo kind="property" type=""   />
 
+The granularity of the minutes time picker
 ### min
 
-{{< member-info kind="property" type="string | null"  >}}
-
-{{< member-description >}}The minimum date as an ISO string{{< /member-description >}}
+<MemberInfo kind="property" type="string | null"   />
 
+The minimum date as an ISO string
 ### max
 
-{{< member-info kind="property" type="string | null"  >}}
-
-{{< member-description >}}The maximum date as an ISO string{{< /member-description >}}
+<MemberInfo kind="property" type="string | null"   />
 
+The maximum date as an ISO string
 ### readonly
 
-{{< member-info kind="property" type=""  >}}
-
-{{< member-description >}}Sets the readonly state{{< /member-description >}}
+<MemberInfo kind="property" type=""   />
 
+Sets the readonly state
 ### dropdownComponent
 
-{{< member-info kind="property" type="<a href='/admin-ui-api/components/dropdown-component#dropdowncomponent'>DropdownComponent</a>"  >}}
+<MemberInfo kind="property" type="<a href='/admin-ui-api/components/dropdown-component#dropdowncomponent'>DropdownComponent</a>"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### datetimeInput
 
-{{< member-info kind="property" type="ElementRef&#60;HTMLInputElement&#62;"  >}}
+<MemberInfo kind="property" type="ElementRef&#60;HTMLInputElement&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### calendarTable
 
-{{< member-info kind="property" type="ElementRef&#60;HTMLTableElement&#62;"  >}}
+<MemberInfo kind="property" type="ElementRef&#60;HTMLTableElement&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### disabled
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### calendarView$
 
-{{< member-info kind="property" type="Observable&#60;CalendarView&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;CalendarView&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### current$
 
-{{< member-info kind="property" type="Observable&#60;CurrentView&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;CurrentView&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### selected$
 
-{{< member-info kind="property" type="Observable&#60;Date | null&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;Date | null&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### selectedHours$
 
-{{< member-info kind="property" type="Observable&#60;number | null&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;number | null&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### selectedMinutes$
 
-{{< member-info kind="property" type="Observable&#60;number | null&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;number | null&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### years
 
-{{< member-info kind="property" type="number[]"  >}}
+<MemberInfo kind="property" type="number[]"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### weekdays
 
-{{< member-info kind="property" type="string[]"  >}}
+<MemberInfo kind="property" type="string[]"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### hours
 
-{{< member-info kind="property" type="number[]"  >}}
+<MemberInfo kind="property" type="number[]"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### minutes
 
-{{< member-info kind="property" type="number[]"  >}}
+<MemberInfo kind="property" type="number[]"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### constructor
 
-{{< member-info kind="method" type="(changeDetectorRef: ChangeDetectorRef, datetimePickerService: DatetimePickerService) => DatetimePickerComponent"  >}}
+<MemberInfo kind="method" type="(changeDetectorRef: ChangeDetectorRef, datetimePickerService: DatetimePickerService) => DatetimePickerComponent"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnInit
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngAfterViewInit
 
-{{< member-info kind="method" type="() => void"  >}}
+<MemberInfo kind="method" type="() => void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnDestroy
 
-{{< member-info kind="method" type="() => void"  >}}
+<MemberInfo kind="method" type="() => void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### registerOnChange
 
-{{< member-info kind="method" type="(fn: any) => "  >}}
+<MemberInfo kind="method" type="(fn: any) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### registerOnTouched
 
-{{< member-info kind="method" type="(fn: any) => "  >}}
+<MemberInfo kind="method" type="(fn: any) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setDisabledState
 
-{{< member-info kind="method" type="(isDisabled: boolean) => "  >}}
+<MemberInfo kind="method" type="(isDisabled: boolean) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### writeValue
 
-{{< member-info kind="method" type="(value: string | null) => "  >}}
+<MemberInfo kind="method" type="(value: string | null) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### prevMonth
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### nextMonth
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### selectToday
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setYear
 
-{{< member-info kind="method" type="(event: Event) => "  >}}
+<MemberInfo kind="method" type="(event: Event) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setMonth
 
-{{< member-info kind="method" type="(event: Event) => "  >}}
+<MemberInfo kind="method" type="(event: Event) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### selectDay
 
-{{< member-info kind="method" type="(day: DayCell) => "  >}}
+<MemberInfo kind="method" type="(day: DayCell) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### clearValue
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### handleCalendarKeydown
 
-{{< member-info kind="method" type="(event: KeyboardEvent) => "  >}}
+<MemberInfo kind="method" type="(event: KeyboardEvent) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setHour
 
-{{< member-info kind="method" type="(event: Event) => "  >}}
+<MemberInfo kind="method" type="(event: Event) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setMinute
 
-{{< member-info kind="method" type="(event: Event) => "  >}}
+<MemberInfo kind="method" type="(event: Event) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### closeDatepicker
 
-{{< member-info kind="method" type="() => "  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="() => "   />
 
 
-</div>

docs/docs/reference/admin-ui-api/components/dropdown-component.md

@@ -1,19 +1,19 @@
 ---
 title: "DropdownComponent"
 weight: 10
-date: 2023-07-14T16:57:51.220Z
+date: 2023-07-20T13:56:18.353Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# DropdownComponent
-<div class="symbol">
 
+## DropdownComponent
 
-# DropdownComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/components/dropdown/dropdown.component.ts" sourceLine="28" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/components/dropdown/dropdown.component.ts" sourceLine="28" packageName="@vendure/admin-ui" />
 
 Used for building dropdown menus.
 
@@ -38,9 +38,7 @@ Used for building dropdown menus.
 </vdr-dropdown>
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class DropdownComponent {
   isOpen = false;
   public public trigger: ElementRef;
@@ -51,49 +49,39 @@ class DropdownComponent {
   setTriggerElement(elementRef: ElementRef) => ;
 }
 ```
-## Members
 
 ### isOpen
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### trigger
 
-{{< member-info kind="property" type="ElementRef"  >}}
+<MemberInfo kind="property" type="ElementRef"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### manualToggle
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onClick
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### toggleOpen
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onOpenChange
 
-{{< member-info kind="method" type="(callback: (isOpen: boolean) =&#62; void) => "  >}}
+<MemberInfo kind="method" type="(callback: (isOpen: boolean) =&#62; void) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setTriggerElement
 
-{{< member-info kind="method" type="(elementRef: ElementRef) => "  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(elementRef: ElementRef) => "   />
 
 
-</div>

docs/docs/reference/admin-ui-api/components/facet-value-selector-component.md

@@ -1,19 +1,19 @@
 ---
 title: "FacetValueSelectorComponent"
 weight: 10
-date: 2023-07-14T16:57:51.224Z
+date: 2023-07-20T13:56:18.369Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# FacetValueSelectorComponent
-<div class="symbol">
 
+## FacetValueSelectorComponent
 
-# FacetValueSelectorComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/components/facet-value-selector/facet-value-selector.component.ts" sourceLine="42" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/components/facet-value-selector/facet-value-selector.component.ts" sourceLine="42" packageName="@vendure/admin-ui" />
 
 A form control for selecting facet values.
 
@@ -36,9 +36,7 @@ this.facets = this.dataService
   .mapSingle(data => data.facets.items);
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class FacetValueSelectorComponent implements OnInit, OnDestroy, ControlValueAccessor {
   @Output() @Output() selectedValuesChange = new EventEmitter<FacetValueFragment[]>();
   @Input() @Input() readonly = false;
@@ -62,134 +60,111 @@ class FacetValueSelectorComponent implements OnInit, OnDestroy, ControlValueAcce
   writeValue(obj: string | FacetValueFragment[] | Array<string | number> | null) => void;
 }
 ```
-## Implements
+Implements
 
  * OnInit
  * OnDestroy
  * ControlValueAccessor
 
 
-## Members
 
 ### selectedValuesChange
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### readonly
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### transformControlValueAccessorValue
 
-{{< member-info kind="property" type="(value: FacetValueFragment[]) =&#62; any[]"  >}}
+<MemberInfo kind="property" type="(value: FacetValueFragment[]) =&#62; any[]"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### searchInput$
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### searchLoading
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### searchResults$
 
-{{< member-info kind="property" type="Observable&#60;FacetValueFragment[]&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;FacetValueFragment[]&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### selectedIds$
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onChangeFn
 
-{{< member-info kind="property" type="(val: any) =&#62; void"  >}}
+<MemberInfo kind="property" type="(val: any) =&#62; void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onTouchFn
 
-{{< member-info kind="property" type="() =&#62; void"  >}}
+<MemberInfo kind="property" type="() =&#62; void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### disabled
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### value
 
-{{< member-info kind="property" type="Array&#60;string | FacetValueFragment&#62;"  >}}
+<MemberInfo kind="property" type="Array&#60;string | FacetValueFragment&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### constructor
 
-{{< member-info kind="method" type="(dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>, changeDetectorRef: ChangeDetectorRef) => FacetValueSelectorComponent"  >}}
+<MemberInfo kind="method" type="(dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>, changeDetectorRef: ChangeDetectorRef) => FacetValueSelectorComponent"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnInit
 
-{{< member-info kind="method" type="() => void"  >}}
+<MemberInfo kind="method" type="() => void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnDestroy
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onChange
 
-{{< member-info kind="method" type="(selected: FacetValueFragment[]) => "  >}}
+<MemberInfo kind="method" type="(selected: FacetValueFragment[]) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### registerOnChange
 
-{{< member-info kind="method" type="(fn: any) => "  >}}
+<MemberInfo kind="method" type="(fn: any) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### registerOnTouched
 
-{{< member-info kind="method" type="(fn: any) => "  >}}
+<MemberInfo kind="method" type="(fn: any) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setDisabledState
 
-{{< member-info kind="method" type="(isDisabled: boolean) => void"  >}}
+<MemberInfo kind="method" type="(isDisabled: boolean) => void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### focus
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### writeValue
 
-{{< member-info kind="method" type="(obj: string | FacetValueFragment[] | Array&#60;string | number&#62; | null) => void"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(obj: string | FacetValueFragment[] | Array&#60;string | number&#62; | null) => void"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/components/object-tree-component.md

@@ -1,19 +1,19 @@
 ---
 title: "ObjectTreeComponent"
 weight: 10
-date: 2023-07-14T16:57:51.235Z
+date: 2023-07-20T13:56:18.409Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# ObjectTreeComponent
-<div class="symbol">
 
+## ObjectTreeComponent
 
-# ObjectTreeComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/components/object-tree/object-tree.component.ts" sourceLine="22" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/components/object-tree/object-tree.component.ts" sourceLine="22" packageName="@vendure/admin-ui" />
 
 This component displays a plain JavaScript object as an expandable tree.
 
@@ -23,9 +23,7 @@ This component displays a plain JavaScript object as an expandable tree.
 <vdr-object-tree [value]="payment.metadata"></vdr-object-tree>
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class ObjectTreeComponent implements OnChanges {
   @Input() @Input() value: { [key: string]: any } | string;
   @Input() @Input() isArrayItem = false;
@@ -38,66 +36,54 @@ class ObjectTreeComponent implements OnChanges {
   isObject(value: any) => boolean;
 }
 ```
-## Implements
+Implements
 
  * OnChanges
 
 
-## Members
 
 ### value
 
-{{< member-info kind="property" type="{ [key: string]: any } | string"  >}}
+<MemberInfo kind="property" type="{ [key: string]: any } | string"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### isArrayItem
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### depth
 
-{{< member-info kind="property" type="number"  >}}
+<MemberInfo kind="property" type="number"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### expanded
 
-{{< member-info kind="property" type="boolean"  >}}
+<MemberInfo kind="property" type="boolean"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### valueIsArray
 
-{{< member-info kind="property" type="boolean"  >}}
+<MemberInfo kind="property" type="boolean"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### entries
 
-{{< member-info kind="property" type="Array&#60;{ key: string; value: any }&#62;"  >}}
+<MemberInfo kind="property" type="Array&#60;{ key: string; value: any }&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### constructor
 
-{{< member-info kind="method" type="(parent: <a href='/admin-ui-api/components/object-tree-component#objecttreecomponent'>ObjectTreeComponent</a>) => ObjectTreeComponent"  >}}
+<MemberInfo kind="method" type="(parent: <a href='/admin-ui-api/components/object-tree-component#objecttreecomponent'>ObjectTreeComponent</a>) => ObjectTreeComponent"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnChanges
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### isObject
 
-{{< member-info kind="method" type="(value: any) => boolean"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(value: any) => boolean"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/components/order-state-label-component.md

@@ -1,19 +1,19 @@
 ---
 title: "OrderStateLabelComponent"
 weight: 10
-date: 2023-07-14T16:57:51.241Z
+date: 2023-07-20T13:56:18.426Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# OrderStateLabelComponent
-<div class="symbol">
 
+## OrderStateLabelComponent
 
-# OrderStateLabelComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/components/order-state-label/order-state-label.component.ts" sourceLine="13" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/components/order-state-label/order-state-label.component.ts" sourceLine="13" packageName="@vendure/admin-ui" />
 
 Displays the state of an order in a colored chip.
 
@@ -23,27 +23,20 @@ Displays the state of an order in a colored chip.
 <vdr-order-state-label [state]="order.state"></vdr-order-state-label>
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class OrderStateLabelComponent {
   @Input() @Input() state: string;
   chipColorType: void
 }
 ```
-## Members
 
 ### state
 
-{{< member-info kind="property" type="string"  >}}
+<MemberInfo kind="property" type="string"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### chipColorType
 
-{{< member-info kind="property" type=""  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="property" type=""   />
 
 
-</div>

docs/docs/reference/admin-ui-api/components/product-variant-selector-component.md

@@ -1,19 +1,19 @@
 ---
 title: "ProductVariantSelectorComponent"
 weight: 10
-date: 2023-07-14T16:57:51.242Z
+date: 2023-07-20T13:56:18.431Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# ProductVariantSelectorComponent
-<div class="symbol">
 
+## ProductVariantSelectorComponent
 
-# ProductVariantSelectorComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/components/product-variant-selector/product-variant-selector.component.ts" sourceLine="21" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/components/product-variant-selector/product-variant-selector.component.ts" sourceLine="21" packageName="@vendure/admin-ui" />
 
 A component for selecting product variants via an autocomplete-style select input.
 
@@ -24,9 +24,7 @@ A component for selecting product variants via an autocomplete-style select inpu
   (productSelected)="selectResult($event)"></vdr-product-selector>
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class ProductVariantSelectorComponent implements OnInit {
   searchInput$ = new Subject<string>();
   searchLoading = false;
@@ -37,54 +35,44 @@ class ProductVariantSelectorComponent implements OnInit {
   selectResult(product?: ProductSelectorSearchQuery['search']['items'][number]) => ;
 }
 ```
-## Implements
+Implements
 
  * OnInit
 
 
-## Members
 
 ### searchInput$
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### searchLoading
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### searchResults$
 
-{{< member-info kind="property" type="Observable&#60;ProductSelectorSearchQuery['search']['items']&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;ProductSelectorSearchQuery['search']['items']&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### productSelected
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### constructor
 
-{{< member-info kind="method" type="(dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>) => ProductVariantSelectorComponent"  >}}
+<MemberInfo kind="method" type="(dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>) => ProductVariantSelectorComponent"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnInit
 
-{{< member-info kind="method" type="() => void"  >}}
+<MemberInfo kind="method" type="() => void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### selectResult
 
-{{< member-info kind="method" type="(product?: ProductSelectorSearchQuery['search']['items'][number]) => "  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(product?: ProductSelectorSearchQuery['search']['items'][number]) => "   />
 
 
-</div>

docs/docs/reference/admin-ui-api/components/rich-text-editor-component.md

@@ -1,19 +1,19 @@
 ---
 title: "RichTextEditorComponent"
 weight: 10
-date: 2023-07-14T16:57:51.246Z
+date: 2023-07-20T13:56:18.444Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# RichTextEditorComponent
-<div class="symbol">
 
+## RichTextEditorComponent
 
-# RichTextEditorComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/components/rich-text-editor/rich-text-editor.component.ts" sourceLine="32" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/components/rich-text-editor/rich-text-editor.component.ts" sourceLine="32" packageName="@vendure/admin-ui" />
 
 A rich text (HTML) editor based on Prosemirror (https://prosemirror.net/)
 
@@ -26,9 +26,7 @@ A rich text (HTML) editor based on Prosemirror (https://prosemirror.net/)
 ></vdr-rich-text-editor>
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class RichTextEditorComponent implements ControlValueAccessor, AfterViewInit, OnDestroy {
   @Input() @Input() label: string;
   @HostBinding('class.readonly') @HostBinding('class.readonly')
@@ -45,86 +43,71 @@ class RichTextEditorComponent implements ControlValueAccessor, AfterViewInit, On
   writeValue(value: any) => ;
 }
 ```
-## Implements
+Implements
 
  * ControlValueAccessor
  * AfterViewInit
  * OnDestroy
 
 
-## Members
 
 ### label
 
-{{< member-info kind="property" type="string"  >}}
+<MemberInfo kind="property" type="string"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### _readonly
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onChange
 
-{{< member-info kind="property" type="(val: any) =&#62; void"  >}}
+<MemberInfo kind="property" type="(val: any) =&#62; void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onTouch
 
-{{< member-info kind="property" type="() =&#62; void"  >}}
+<MemberInfo kind="property" type="() =&#62; void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### constructor
 
-{{< member-info kind="method" type="(changeDetector: ChangeDetectorRef, prosemirrorService: ProsemirrorService, viewContainerRef: ViewContainerRef, contextMenuService: ContextMenuService) => RichTextEditorComponent"  >}}
+<MemberInfo kind="method" type="(changeDetector: ChangeDetectorRef, prosemirrorService: ProsemirrorService, viewContainerRef: ViewContainerRef, contextMenuService: ContextMenuService) => RichTextEditorComponent"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### menuElement
 
-{{< member-info kind="property" type="HTMLDivElement | null"  >}}
+<MemberInfo kind="property" type="HTMLDivElement | null"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngAfterViewInit
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnDestroy
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### registerOnChange
 
-{{< member-info kind="method" type="(fn: any) => "  >}}
+<MemberInfo kind="method" type="(fn: any) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### registerOnTouched
 
-{{< member-info kind="method" type="(fn: any) => "  >}}
+<MemberInfo kind="method" type="(fn: any) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setDisabledState
 
-{{< member-info kind="method" type="(isDisabled: boolean) => "  >}}
+<MemberInfo kind="method" type="(isDisabled: boolean) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### writeValue
 
-{{< member-info kind="method" type="(value: any) => "  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(value: any) => "   />
 
 
-</div>

docs/docs/reference/admin-ui-api/components/zone-selector-component.md

@@ -1,25 +1,23 @@
 ---
 title: "ZoneSelectorComponent"
 weight: 10
-date: 2023-07-14T16:57:51.254Z
+date: 2023-07-20T13:56:18.473Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# ZoneSelectorComponent
-<div class="symbol">
 
+## ZoneSelectorComponent
 
-# ZoneSelectorComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/components/zone-selector/zone-selector.component.ts" sourceLine="40" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/components/zone-selector/zone-selector.component.ts" sourceLine="40" packageName="@vendure/admin-ui" />
 
 A form control for selecting zones.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class ZoneSelectorComponent implements ControlValueAccessor {
   @Output() @Output() selectedValuesChange = new EventEmitter<Zone>();
   @Input() @Input() readonly = false;
@@ -41,108 +39,89 @@ class ZoneSelectorComponent implements ControlValueAccessor {
   writeValue(obj: string | Zone | null) => void;
 }
 ```
-## Implements
+Implements
 
  * ControlValueAccessor
 
 
-## Members
 
 ### selectedValuesChange
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### readonly
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### transformControlValueAccessorValue
 
-{{< member-info kind="property" type="(value: <a href='/typescript-api/entities/zone#zone'>Zone</a> | undefined) =&#62; any"  >}}
+<MemberInfo kind="property" type="(value: <a href='/typescript-api/entities/zone#zone'>Zone</a> | undefined) =&#62; any"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### selectedId$
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onChangeFn
 
-{{< member-info kind="property" type="(val: any) =&#62; void"  >}}
+<MemberInfo kind="property" type="(val: any) =&#62; void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onTouchFn
 
-{{< member-info kind="property" type="() =&#62; void"  >}}
+<MemberInfo kind="property" type="() =&#62; void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### disabled
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### value
 
-{{< member-info kind="property" type="string | <a href='/typescript-api/entities/zone#zone'>Zone</a>"  >}}
+<MemberInfo kind="property" type="string | <a href='/typescript-api/entities/zone#zone'>Zone</a>"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### zones$
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### constructor
 
-{{< member-info kind="method" type="(dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>, changeDetectorRef: ChangeDetectorRef) => ZoneSelectorComponent"  >}}
+<MemberInfo kind="method" type="(dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>, changeDetectorRef: ChangeDetectorRef) => ZoneSelectorComponent"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onChange
 
-{{< member-info kind="method" type="(selected: <a href='/typescript-api/entities/zone#zone'>Zone</a>) => "  >}}
+<MemberInfo kind="method" type="(selected: <a href='/typescript-api/entities/zone#zone'>Zone</a>) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### registerOnChange
 
-{{< member-info kind="method" type="(fn: any) => "  >}}
+<MemberInfo kind="method" type="(fn: any) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### registerOnTouched
 
-{{< member-info kind="method" type="(fn: any) => "  >}}
+<MemberInfo kind="method" type="(fn: any) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setDisabledState
 
-{{< member-info kind="method" type="(isDisabled: boolean) => void"  >}}
+<MemberInfo kind="method" type="(isDisabled: boolean) => void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### focus
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### writeValue
 
-{{< member-info kind="method" type="(obj: string | <a href='/typescript-api/entities/zone#zone'>Zone</a> | null) => void"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(obj: string | <a href='/typescript-api/entities/zone#zone'>Zone</a> | null) => void"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/custom-detail-components/custom-detail-component-config.md

@@ -1,43 +1,36 @@
 ---
 title: "CustomDetailComponentConfig"
 weight: 10
-date: 2023-07-14T16:57:51.090Z
+date: 2023-07-20T13:56:17.922Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# CustomDetailComponentConfig
-<div class="symbol">
 
+## CustomDetailComponentConfig
 
-# CustomDetailComponentConfig
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/custom-detail-component/custom-detail-component-types.ts" sourceLine="25" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/custom-detail-component/custom-detail-component-types.ts" sourceLine="25" packageName="@vendure/admin-ui" />
 
 Configures a <a href='/admin-ui-api/custom-detail-components/custom-detail-component#customdetailcomponent'>CustomDetailComponent</a> to be placed in the given location.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 interface CustomDetailComponentConfig {
   locationId: CustomDetailComponentLocationId;
   component: Type<CustomDetailComponent>;
 }
 ```
-## Members
 
 ### locationId
 
-{{< member-info kind="property" type="<a href='/admin-ui-api/custom-detail-components/custom-detail-component-location-id#customdetailcomponentlocationid'>CustomDetailComponentLocationId</a>"  >}}
+<MemberInfo kind="property" type="<a href='/admin-ui-api/custom-detail-components/custom-detail-component-location-id#customdetailcomponentlocationid'>CustomDetailComponentLocationId</a>"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### component
 
-{{< member-info kind="property" type="Type&#60;<a href='/admin-ui-api/custom-detail-components/custom-detail-component#customdetailcomponent'>CustomDetailComponent</a>&#62;"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="property" type="Type&#60;<a href='/admin-ui-api/custom-detail-components/custom-detail-component#customdetailcomponent'>CustomDetailComponent</a>&#62;"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/custom-detail-components/custom-detail-component-location-id.md

@@ -1,25 +1,23 @@
 ---
 title: "CustomDetailComponentLocationId"
 weight: 10
-date: 2023-07-14T16:57:51.071Z
+date: 2023-07-20T13:56:17.857Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# CustomDetailComponentLocationId
-<div class="symbol">
 
+## CustomDetailComponentLocationId
 
-# CustomDetailComponentLocationId
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/common/component-registry-types.ts" sourceLine="111" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/common/component-registry-types.ts" sourceLine="111" packageName="@vendure/admin-ui" />
 
 The valid locations for embedding a <a href='/admin-ui-api/custom-detail-components/custom-detail-component#customdetailcomponent'>CustomDetailComponent</a>.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 type CustomDetailComponentLocationId = | 'administrator-profile'
     | 'administrator-detail'
     | 'channel-detail'
@@ -27,7 +25,6 @@ type CustomDetailComponentLocationId = | 'administrator-profile'
     | 'country-detail'
     | 'customer-detail'
     | 'customer-group-detail'
-    | 'draft-order-detail'
     | 'facet-detail'
     | 'global-settings-detail'
     | 'order-detail'
@@ -42,4 +39,3 @@ type CustomDetailComponentLocationId = | 'administrator-profile'
     | 'tax-rate-detail'
     | 'zone-detail'
 ```
-</div>

docs/docs/reference/admin-ui-api/custom-detail-components/custom-detail-component.md

@@ -1,44 +1,37 @@
 ---
 title: "CustomDetailComponent"
 weight: 10
-date: 2023-07-14T16:57:51.089Z
+date: 2023-07-20T13:56:17.917Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# CustomDetailComponent
-<div class="symbol">
 
+## CustomDetailComponent
 
-# CustomDetailComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/custom-detail-component/custom-detail-component-types.ts" sourceLine="14" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/custom-detail-component/custom-detail-component-types.ts" sourceLine="14" packageName="@vendure/admin-ui" />
 
 CustomDetailComponents allow any arbitrary Angular components to be embedded in entity detail
 pages of the Admin UI.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 interface CustomDetailComponent {
   entity$: Observable<any>;
   detailForm: UntypedFormGroup;
 }
 ```
-## Members
 
 ### entity$
 
-{{< member-info kind="property" type="Observable&#60;any&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;any&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### detailForm
 
-{{< member-info kind="property" type="UntypedFormGroup"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="property" type="UntypedFormGroup"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/custom-detail-components/register-custom-detail-component.md

@@ -1,32 +1,29 @@
 ---
 title: "RegisterCustomDetailComponent"
 weight: 10
-date: 2023-07-14T16:57:51.092Z
+date: 2023-07-20T13:56:17.928Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# registerCustomDetailComponent
-<div class="symbol">
 
+## registerCustomDetailComponent
 
-# registerCustomDetailComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/custom-detail-component/custom-detail-component.service.ts" sourceLine="12" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/custom-detail-component/custom-detail-component.service.ts" sourceLine="12" packageName="@vendure/admin-ui" />
 
 Registers a <a href='/admin-ui-api/custom-detail-components/custom-detail-component#customdetailcomponent'>CustomDetailComponent</a> to be placed in a given location. This allows you
 to embed any type of custom Angular component in the entity detail pages of the Admin UI.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 function registerCustomDetailComponent(config: CustomDetailComponentConfig): Provider
 ```
-## Parameters
+Parameters
 
 ### config
 
-{{< member-info kind="parameter" type="<a href='/admin-ui-api/custom-detail-components/custom-detail-component-config#customdetailcomponentconfig'>CustomDetailComponentConfig</a>" >}}
+<MemberInfo kind="parameter" type="<a href='/admin-ui-api/custom-detail-components/custom-detail-component-config#customdetailcomponentconfig'>CustomDetailComponentConfig</a>" />
 
-</div>

docs/docs/reference/admin-ui-api/custom-history-entry-components/customer-history-entry-component.md

@@ -1,41 +1,35 @@
 ---
 title: "CustomerHistoryEntryComponent"
 weight: 10
-date: 2023-07-14T16:57:51.097Z
+date: 2023-07-20T13:56:17.948Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# CustomerHistoryEntryComponent
-<div class="symbol">
 
+## CustomerHistoryEntryComponent
 
-# CustomerHistoryEntryComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/custom-history-entry-component/history-entry-component-types.ts" sourceLine="64" packageName="@vendure/admin-ui" since="1.9.0">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/custom-history-entry-component/history-entry-component-types.ts" sourceLine="64" packageName="@vendure/admin-ui" since="1.9.0" />
 
 Used to implement a <a href='/admin-ui-api/custom-history-entry-components/history-entry-component#historyentrycomponent'>HistoryEntryComponent</a> which requires access to the Customer object.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 interface CustomerHistoryEntryComponent extends HistoryEntryComponent {
   customer: CustomerFragment;
 }
 ```
-## Extends
+Extends
 
  * <a href='/admin-ui-api/custom-history-entry-components/history-entry-component#historyentrycomponent'>HistoryEntryComponent</a>
 
 
-## Members
 
 ### customer
 
-{{< member-info kind="property" type="CustomerFragment"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="property" type="CustomerFragment"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/custom-history-entry-components/history-entry-component.md

@@ -1,27 +1,25 @@
 ---
 title: "HistoryEntryComponent"
 weight: 10
-date: 2023-07-14T16:57:51.092Z
+date: 2023-07-20T13:56:17.931Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# HistoryEntryComponent
-<div class="symbol">
 
+## HistoryEntryComponent
 
-# HistoryEntryComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/custom-history-entry-component/history-entry-component-types.ts" sourceLine="16" packageName="@vendure/admin-ui" since="1.9.0">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/custom-history-entry-component/history-entry-component-types.ts" sourceLine="16" packageName="@vendure/admin-ui" since="1.9.0" />
 
 This interface should be implemented by components intended to display a history entry in the
 Order or Customer history timeline. If the component needs access to the Order or Customer object itself,
 you should implement <a href='/admin-ui-api/custom-history-entry-components/order-history-entry-component#orderhistoryentrycomponent'>OrderHistoryEntryComponent</a> or <a href='/admin-ui-api/custom-history-entry-components/customer-history-entry-component#customerhistoryentrycomponent'>CustomerHistoryEntryComponent</a> respectively.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 interface HistoryEntryComponent {
   entry: TimelineHistoryEntry;
   getDisplayType: (entry: TimelineHistoryEntry) => TimelineDisplayType;
@@ -30,39 +28,31 @@ interface HistoryEntryComponent {
   getIconShape?: (entry: TimelineHistoryEntry) => string | string[] | undefined;
 }
 ```
-## Members
 
 ### entry
 
-{{< member-info kind="property" type="TimelineHistoryEntry"  >}}
-
-{{< member-description >}}The HistoryEntry data.{{< /member-description >}}
+<MemberInfo kind="property" type="TimelineHistoryEntry"   />
 
+The HistoryEntry data.
 ### getDisplayType
 
-{{< member-info kind="property" type="(entry: TimelineHistoryEntry) =&#62; TimelineDisplayType"  >}}
-
-{{< member-description >}}Defines whether this entry is highlighted with a "success", "error" etc. color.{{< /member-description >}}
+<MemberInfo kind="property" type="(entry: TimelineHistoryEntry) =&#62; TimelineDisplayType"   />
 
+Defines whether this entry is highlighted with a "success", "error" etc. color.
 ### isFeatured
 
-{{< member-info kind="property" type="(entry: TimelineHistoryEntry) =&#62; boolean"  >}}
-
-{{< member-description >}}Featured entries are always expanded. Non-featured entries start of collapsed and can be clicked
-to expand.{{< /member-description >}}
+<MemberInfo kind="property" type="(entry: TimelineHistoryEntry) =&#62; boolean"   />
 
+Featured entries are always expanded. Non-featured entries start of collapsed and can be clicked
+to expand.
 ### getName
 
-{{< member-info kind="property" type="(entry: TimelineHistoryEntry) =&#62; string | undefined"  >}}
-
-{{< member-description >}}Returns the name of the person who did this action. For example, it could be the Customer's name
-or "Administrator".{{< /member-description >}}
+<MemberInfo kind="property" type="(entry: TimelineHistoryEntry) =&#62; string | undefined"   />
 
+Returns the name of the person who did this action. For example, it could be the Customer's name
+or "Administrator".
 ### getIconShape
 
-{{< member-info kind="property" type="(entry: TimelineHistoryEntry) =&#62; string | string[] | undefined"  >}}
-
-{{< member-description >}}Optional Clarity icon shape to display with the entry. Examples: `'note'`, `['success-standard', 'is-solid']`{{< /member-description >}}
-
+<MemberInfo kind="property" type="(entry: TimelineHistoryEntry) =&#62; string | string[] | undefined"   />
 
-</div>
+Optional Clarity icon shape to display with the entry. Examples: `'note'`, `['success-standard', 'is-solid']`

docs/docs/reference/admin-ui-api/custom-history-entry-components/history-entry-config.md

@@ -1,43 +1,36 @@
 ---
 title: "HistoryEntryConfig"
 weight: 10
-date: 2023-07-14T16:57:51.098Z
+date: 2023-07-20T13:56:17.953Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# HistoryEntryConfig
-<div class="symbol">
 
+## HistoryEntryConfig
 
-# HistoryEntryConfig
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/custom-history-entry-component/history-entry-component-types.ts" sourceLine="75" packageName="@vendure/admin-ui" since="1.9.0">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/custom-history-entry-component/history-entry-component-types.ts" sourceLine="75" packageName="@vendure/admin-ui" since="1.9.0" />
 
 Configuration for registering a custom <a href='/admin-ui-api/custom-history-entry-components/history-entry-component#historyentrycomponent'>HistoryEntryComponent</a>.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 interface HistoryEntryConfig {
   type: string;
   component: Type<HistoryEntryComponent>;
 }
 ```
-## Members
 
 ### type
 
-{{< member-info kind="property" type="string"  >}}
-
-{{< member-description >}}The type should correspond to the custom HistoryEntryType string.{{< /member-description >}}
+<MemberInfo kind="property" type="string"   />
 
+The type should correspond to the custom HistoryEntryType string.
 ### component
 
-{{< member-info kind="property" type="Type&#60;<a href='/admin-ui-api/custom-history-entry-components/history-entry-component#historyentrycomponent'>HistoryEntryComponent</a>&#62;"  >}}
-
-{{< member-description >}}The component to be rendered for this history entry type.{{< /member-description >}}
-
+<MemberInfo kind="property" type="Type&#60;<a href='/admin-ui-api/custom-history-entry-components/history-entry-component#historyentrycomponent'>HistoryEntryComponent</a>&#62;"   />
 
-</div>
+The component to be rendered for this history entry type.

docs/docs/reference/admin-ui-api/custom-history-entry-components/order-history-entry-component.md

@@ -1,41 +1,35 @@
 ---
 title: "OrderHistoryEntryComponent"
 weight: 10
-date: 2023-07-14T16:57:51.096Z
+date: 2023-07-20T13:56:17.943Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# OrderHistoryEntryComponent
-<div class="symbol">
 
+## OrderHistoryEntryComponent
 
-# OrderHistoryEntryComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/custom-history-entry-component/history-entry-component-types.ts" sourceLine="53" packageName="@vendure/admin-ui" since="1.9.0">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/custom-history-entry-component/history-entry-component-types.ts" sourceLine="53" packageName="@vendure/admin-ui" since="1.9.0" />
 
 Used to implement a <a href='/admin-ui-api/custom-history-entry-components/history-entry-component#historyentrycomponent'>HistoryEntryComponent</a> which requires access to the Order object.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 interface OrderHistoryEntryComponent extends HistoryEntryComponent {
   order: OrderDetailFragment;
 }
 ```
-## Extends
+Extends
 
  * <a href='/admin-ui-api/custom-history-entry-components/history-entry-component#historyentrycomponent'>HistoryEntryComponent</a>
 
 
-## Members
 
 ### order
 
-{{< member-info kind="property" type="OrderDetailFragment"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="property" type="OrderDetailFragment"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/custom-history-entry-components/register-history-entry-component.md

@@ -1,32 +1,29 @@
 ---
 title: "RegisterHistoryEntryComponent"
 weight: 10
-date: 2023-07-14T16:57:51.099Z
+date: 2023-07-20T13:56:17.959Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# registerHistoryEntryComponent
-<div class="symbol">
 
+## registerHistoryEntryComponent
 
-# registerHistoryEntryComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/custom-history-entry-component/history-entry-component.service.ts" sourceLine="13" packageName="@vendure/admin-ui" since="1.9.0">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/custom-history-entry-component/history-entry-component.service.ts" sourceLine="13" packageName="@vendure/admin-ui" since="1.9.0" />
 
 Registers a <a href='/admin-ui-api/custom-history-entry-components/history-entry-component#historyentrycomponent'>HistoryEntryComponent</a> for displaying history entries in the Order/Customer
 history timeline.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 function registerHistoryEntryComponent(config: HistoryEntryConfig): Provider
 ```
-## Parameters
+Parameters
 
 ### config
 
-{{< member-info kind="parameter" type="<a href='/admin-ui-api/custom-history-entry-components/history-entry-config#historyentryconfig'>HistoryEntryConfig</a>" >}}
+<MemberInfo kind="parameter" type="<a href='/admin-ui-api/custom-history-entry-components/history-entry-config#historyentryconfig'>HistoryEntryConfig</a>" />
 
-</div>

docs/docs/reference/admin-ui-api/custom-input-components/form-input-component.md

@@ -1,26 +1,24 @@
 ---
 title: "FormInputComponent"
 weight: 10
-date: 2023-07-14T16:57:51.068Z
+date: 2023-07-20T13:56:17.847Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# FormInputComponent
-<div class="symbol">
 
+## FormInputComponent
 
-# FormInputComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/common/component-registry-types.ts" sourceLine="10" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/common/component-registry-types.ts" sourceLine="10" packageName="@vendure/admin-ui" />
 
 This interface should be implemented by any component being used as a custom input. For example,
 inputs for custom fields, or for configurable arguments.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 interface FormInputComponent<C = InputComponentConfig> {
   isListInput?: boolean;
   readonly: boolean;
@@ -28,39 +26,32 @@ interface FormInputComponent<C = InputComponentConfig> {
   config: C;
 }
 ```
-## Members
 
 ### isListInput
 
-{{< member-info kind="property" type="boolean"  >}}
+<MemberInfo kind="property" type="boolean"   />
 
-{{< member-description >}}Should be set to `true` if this component is designed to handle lists.
+Should be set to `true` if this component is designed to handle lists.
 If `true` then the formControl value will be an array of all the
-values in the list.{{< /member-description >}}
-
+values in the list.
 ### readonly
 
-{{< member-info kind="property" type="boolean"  >}}
-
-{{< member-description >}}This is set by the Admin UI when consuming this component, indicating that the
-component should be rendered in a read-only state.{{< /member-description >}}
+<MemberInfo kind="property" type="boolean"   />
 
+This is set by the Admin UI when consuming this component, indicating that the
+component should be rendered in a read-only state.
 ### formControl
 
-{{< member-info kind="property" type="FormControl"  >}}
+<MemberInfo kind="property" type="FormControl"   />
 
-{{< member-description >}}This controls the actual value of the form item. The current value is available
+This controls the actual value of the form item. The current value is available
 as `this.formControl.value`, and an Observable stream of value changes is available
 as `this.formControl.valueChanges`. To update the value, use `.setValue(val)` and then
 `.markAsDirty()`.
 
-Full documentation can be found in the [Angular docs](https://angular.io/api/forms/FormControl).{{< /member-description >}}
-
+Full documentation can be found in the [Angular docs](https://angular.io/api/forms/FormControl).
 ### config
 
-{{< member-info kind="property" type="C"  >}}
-
-{{< member-description >}}The `config` property contains the full configuration object of the custom field or configurable argument.{{< /member-description >}}
-
+<MemberInfo kind="property" type="C"   />
 
-</div>
+The `config` property contains the full configuration object of the custom field or configurable argument.

docs/docs/reference/admin-ui-api/custom-input-components/register-form-input-component.md

@@ -1,19 +1,19 @@
 ---
 title: "RegisterFormInputComponent"
 weight: 10
-date: 2023-07-14T16:57:51.323Z
+date: 2023-07-20T13:56:18.675Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# registerFormInputComponent
-<div class="symbol">
 
+## registerFormInputComponent
 
-# registerFormInputComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/dynamic-form-inputs/register-dynamic-input-components.ts" sourceLine="96" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/dynamic-form-inputs/register-dynamic-input-components.ts" sourceLine="96" packageName="@vendure/admin-ui" />
 
 Registers a custom FormInputComponent which can be used to control the argument inputs
 of a <a href='/typescript-api/configurable-operation-def/#configurableoperationdef'>ConfigurableOperationDef</a> (e.g. CollectionFilter, ShippingMethod etc) or for
@@ -61,19 +61,16 @@ args: {
 }
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 function registerFormInputComponent(id: string, component: Type<FormInputComponent>): FactoryProvider
 ```
-## Parameters
+Parameters
 
 ### id
 
-{{< member-info kind="parameter" type="string" >}}
+<MemberInfo kind="parameter" type="string" />
 
 ### component
 
-{{< member-info kind="parameter" type="Type&#60;<a href='/admin-ui-api/custom-input-components/form-input-component#forminputcomponent'>FormInputComponent</a>&#62;" >}}
+<MemberInfo kind="parameter" type="Type&#60;<a href='/admin-ui-api/custom-input-components/form-input-component#forminputcomponent'>FormInputComponent</a>&#62;" />
 
-</div>

docs/docs/reference/admin-ui-api/directives/if-multichannel-directive.md

@@ -1,19 +1,19 @@
 ---
 title: "IfMultichannelDirective"
 weight: 10
-date: 2023-07-14T16:57:51.263Z
+date: 2023-07-20T13:56:18.495Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# IfMultichannelDirective
-<div class="symbol">
 
+## IfMultichannelDirective
 
-# IfMultichannelDirective
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/directives/if-multichannel.directive.ts" sourceLine="21" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/directives/if-multichannel.directive.ts" sourceLine="21" packageName="@vendure/admin-ui" />
 
 Structural directive that displays the given element if the Vendure instance has multiple channels
 configured.
@@ -26,25 +26,19 @@ configured.
 </ng-container>
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class IfMultichannelDirective extends IfDirectiveBase<[]> {
   constructor(_viewContainer: ViewContainerRef, templateRef: TemplateRef<any>, dataService: DataService)
 }
 ```
-## Extends
+Extends
 
  * IfDirectiveBase&#60;[]&#62;
 
 
-## Members
 
 ### constructor
 
-{{< member-info kind="method" type="(_viewContainer: ViewContainerRef, templateRef: TemplateRef&#60;any&#62;, dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>) => IfMultichannelDirective"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(_viewContainer: ViewContainerRef, templateRef: TemplateRef&#60;any&#62;, dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>) => IfMultichannelDirective"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/directives/if-permissions-directive.md

@@ -1,19 +1,19 @@
 ---
 title: "IfPermissionsDirective"
 weight: 10
-date: 2023-07-14T16:57:51.265Z
+date: 2023-07-20T13:56:18.499Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# IfPermissionsDirective
-<div class="symbol">
 
+## IfPermissionsDirective
 
-# IfPermissionsDirective
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/directives/if-permissions.directive.ts" sourceLine="33" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/directives/if-permissions.directive.ts" sourceLine="33" packageName="@vendure/admin-ui" />
 
 Conditionally shows/hides templates based on the current active user having the specified permission.
 Based on the ngIf source. Also support "else" templates:
@@ -28,25 +28,19 @@ Based on the ngIf source. Also support "else" templates:
 The permission can be a single string, or an array. If an array is passed, then _all_ of the permissions
 must match (logical AND)
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class IfPermissionsDirective extends IfDirectiveBase<Array<Permission[] | null>> {
   constructor(_viewContainer: ViewContainerRef, templateRef: TemplateRef<any>, dataService: DataService, changeDetectorRef: ChangeDetectorRef)
 }
 ```
-## Extends
+Extends
 
  * IfDirectiveBase&#60;Array&#60;<a href='/typescript-api/common/permission#permission'>Permission</a>[] | null&#62;&#62;
 
 
-## Members
 
 ### constructor
 
-{{< member-info kind="method" type="(_viewContainer: ViewContainerRef, templateRef: TemplateRef&#60;any&#62;, dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>, changeDetectorRef: ChangeDetectorRef) => IfPermissionsDirective"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(_viewContainer: ViewContainerRef, templateRef: TemplateRef&#60;any&#62;, dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>, changeDetectorRef: ChangeDetectorRef) => IfPermissionsDirective"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/list-detail-views/base-detail-component.md

@@ -1,19 +1,19 @@
 ---
 title: "BaseDetailComponent"
 weight: 10
-date: 2023-07-14T16:57:51.024Z
+date: 2023-07-20T13:56:17.714Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# BaseDetailComponent
-<div class="symbol">
 
+## BaseDetailComponent
 
-# BaseDetailComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/common/base-detail.component.ts" sourceLine="56" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/common/base-detail.component.ts" sourceLine="56" packageName="@vendure/admin-ui" />
 
 A base class for entity detail views. It should be used in conjunction with the
 <a href='/admin-ui-api/list-detail-views/base-entity-resolver#baseentityresolver'>BaseEntityResolver</a>.
@@ -51,9 +51,7 @@ export class GlobalSettingsComponent extends BaseDetailComponent<MyEntityFragmen
 }
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class BaseDetailComponent<Entity extends { id: string; updatedAt?: string }> implements DeactivateAware {
   entity$: Observable<Entity>;
   availableLanguages$: Observable<LanguageCode[]>;
@@ -75,120 +73,99 @@ class BaseDetailComponent<Entity extends { id: string; updatedAt?: string }> imp
   protected setQueryParam(key: string, value: any) => ;
 }
 ```
-## Implements
+Implements
 
  * DeactivateAware
 
 
-## Members
 
 ### entity$
 
-{{< member-info kind="property" type="Observable&#60;Entity&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;Entity&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### availableLanguages$
 
-{{< member-info kind="property" type="Observable&#60;<a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>[]&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;<a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>[]&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### languageCode$
 
-{{< member-info kind="property" type="Observable&#60;<a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;<a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### languageCode
 
-{{< member-info kind="property" type="<a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>"  >}}
+<MemberInfo kind="property" type="<a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### isNew$
 
-{{< member-info kind="property" type="Observable&#60;boolean&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;boolean&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### id
 
-{{< member-info kind="property" type="string"  >}}
+<MemberInfo kind="property" type="string"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### detailForm
 
-{{< member-info kind="property" type="UntypedFormGroup"  >}}
+<MemberInfo kind="property" type="UntypedFormGroup"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### destroy$
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### constructor
 
-{{< member-info kind="method" type="(route: ActivatedRoute, router: Router, serverConfigService: ServerConfigService, dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>) => BaseDetailComponent"  >}}
+<MemberInfo kind="method" type="(route: ActivatedRoute, router: Router, serverConfigService: ServerConfigService, dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>) => BaseDetailComponent"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### init
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setUpStreams
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### destroy
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setLanguage
 
-{{< member-info kind="method" type="(code: <a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>) => "  >}}
+<MemberInfo kind="method" type="(code: <a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### canDeactivate
 
-{{< member-info kind="method" type="() => boolean"  >}}
+<MemberInfo kind="method" type="() => boolean"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setFormValues
 
-{{< member-info kind="method" type="(entity: Entity, languageCode: <a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>) => void"  >}}
+<MemberInfo kind="method" type="(entity: Entity, languageCode: <a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>) => void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setCustomFieldFormValues
 
-{{< member-info kind="method" type="(customFields: <a href='/typescript-api/custom-fields/custom-field-config#customfieldconfig'>CustomFieldConfig</a>[], formGroup: AbstractControl | null, entity: T, currentTranslation?: TranslationOf&#60;T&#62;) => "  >}}
+<MemberInfo kind="method" type="(customFields: <a href='/typescript-api/custom-fields/custom-field-config#customfieldconfig'>CustomFieldConfig</a>[], formGroup: AbstractControl | null, entity: T, currentTranslation?: TranslationOf&#60;T&#62;) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### getCustomFieldConfig
 
-{{< member-info kind="method" type="(key: Exclude&#60;keyof <a href='/typescript-api/custom-fields/#customfields'>CustomFields</a>, '__typename'&#62;) => <a href='/typescript-api/custom-fields/custom-field-config#customfieldconfig'>CustomFieldConfig</a>[]"  >}}
+<MemberInfo kind="method" type="(key: Exclude&#60;keyof <a href='/typescript-api/custom-fields/#customfields'>CustomFields</a>, '__typename'&#62;) => <a href='/typescript-api/custom-fields/custom-field-config#customfieldconfig'>CustomFieldConfig</a>[]"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setQueryParam
 
-{{< member-info kind="method" type="(key: string, value: any) => "  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(key: string, value: any) => "   />
 
 
-</div>

docs/docs/reference/admin-ui-api/list-detail-views/base-entity-resolver.md

@@ -1,19 +1,19 @@
 ---
 title: "BaseEntityResolver"
 weight: 10
-date: 2023-07-14T16:57:51.047Z
+date: 2023-07-20T13:56:17.779Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# BaseEntityResolver
-<div class="symbol">
 
+## BaseEntityResolver
 
-# BaseEntityResolver
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/common/base-entity-resolver.ts" sourceLine="49" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/common/base-entity-resolver.ts" sourceLine="49" packageName="@vendure/admin-ui" />
 
 A base resolver for an entity detail route. Resolves to an observable of the given entity, or a "blank"
 version if the route id equals "create". Should be used together with details views which extend the
@@ -42,20 +42,14 @@ export class MyEntityResolver extends BaseEntityResolver<MyEntityFragment> {
 }
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class BaseEntityResolver<T> {
   constructor(router: Router, emptyEntity: T, entityStream: (id: string) => Observable<T | null | undefined>)
 }
 ```
-## Members
 
 ### constructor
 
-{{< member-info kind="method" type="(router: Router, emptyEntity: T, entityStream: (id: string) =&#62; Observable&#60;T | null | undefined&#62;) => BaseEntityResolver"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(router: Router, emptyEntity: T, entityStream: (id: string) =&#62; Observable&#60;T | null | undefined&#62;) => BaseEntityResolver"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/list-detail-views/base-list-component.md

@@ -1,28 +1,26 @@
 ---
 title: "BaseListComponent"
 weight: 10
-date: 2023-07-14T16:57:51.048Z
+date: 2023-07-20T13:56:17.784Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# BaseListComponent
-<div class="symbol">
 
+## BaseListComponent
 
-# BaseListComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/common/base-list.component.ts" sourceLine="39" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/common/base-list.component.ts" sourceLine="39" packageName="@vendure/admin-ui" />
 
 This is a base class which implements the logic required to fetch and manipulate
 a list of data from a query which returns a PaginatedList type.
 
 It is normally used in combination with the <a href='/admin-ui-api/components/data-table2component#datatable2component'>DataTable2Component</a>.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class BaseListComponent<ResultType, ItemType, VariableType extends Record<string, any> = any> implements OnInit, OnDestroy {
   searchTermControl = new FormControl('');
   selectionManager = new SelectionManager<any>({
@@ -48,121 +46,100 @@ class BaseListComponent<ResultType, ItemType, VariableType extends Record<string
   protected setQueryParam(keyOrHash: string | { [key: string]: any }, valueOrOptions?: any, maybeOptions?: { replaceUrl?: boolean; queryParamsHandling?: QueryParamsHandling }) => ;
 }
 ```
-## Implements
+Implements
 
  * OnInit
  * OnDestroy
 
 
-## Members
 
 ### searchTermControl
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### selectionManager
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### result$
 
-{{< member-info kind="property" type="Observable&#60;ResultType&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;ResultType&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### items$
 
-{{< member-info kind="property" type="Observable&#60;ItemType[]&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;ItemType[]&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### totalItems$
 
-{{< member-info kind="property" type="Observable&#60;number&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;number&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### itemsPerPage$
 
-{{< member-info kind="property" type="Observable&#60;number&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;number&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### currentPage$
 
-{{< member-info kind="property" type="Observable&#60;number&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;number&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### destroy$
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### refresh$
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### constructor
 
-{{< member-info kind="method" type="(router: Router, route: ActivatedRoute) => BaseListComponent"  >}}
+<MemberInfo kind="method" type="(router: Router, route: ActivatedRoute) => BaseListComponent"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setQueryFn
 
-{{< member-info kind="method" type="(listQueryFn: ListQueryFn&#60;ResultType&#62;, mappingFn: MappingFn&#60;ItemType, ResultType&#62;, onPageChangeFn?: OnPageChangeFn&#60;VariableType&#62;, defaults?: { take: number; skip: number }) => "  >}}
-
-{{< member-description >}}Sets the fetch function for the list being implemented.{{< /member-description >}}
+<MemberInfo kind="method" type="(listQueryFn: ListQueryFn&#60;ResultType&#62;, mappingFn: MappingFn&#60;ItemType, ResultType&#62;, onPageChangeFn?: OnPageChangeFn&#60;VariableType&#62;, defaults?: { take: number; skip: number }) => "   />
 
+Sets the fetch function for the list being implemented.
 ### refreshListOnChanges
 
-{{< member-info kind="method" type="(streams: Array&#60;Observable&#60;any&#62;&#62;) => "  >}}
-
-{{< member-description >}}Accepts a list of Observables which will trigger a refresh of the list when any of them emit.{{< /member-description >}}
+<MemberInfo kind="method" type="(streams: Array&#60;Observable&#60;any&#62;&#62;) => "   />
 
+Accepts a list of Observables which will trigger a refresh of the list when any of them emit.
 ### setPageNumber
 
-{{< member-info kind="method" type="(page: number) => "  >}}
-
-{{< member-description >}}Sets the current page number in the url.{{< /member-description >}}
+<MemberInfo kind="method" type="(page: number) => "   />
 
+Sets the current page number in the url.
 ### setItemsPerPage
 
-{{< member-info kind="method" type="(perPage: number) => "  >}}
-
-{{< member-description >}}Sets the number of items per page in the url.{{< /member-description >}}
+<MemberInfo kind="method" type="(perPage: number) => "   />
 
+Sets the number of items per page in the url.
 ### refresh
 
-{{< member-info kind="method" type="() => "  >}}
-
-{{< member-description >}}Re-fetch the current page of results.{{< /member-description >}}
+<MemberInfo kind="method" type="() => "   />
 
+Re-fetch the current page of results.
 ### setQueryParam
 
-{{< member-info kind="method" type="(hash: { [key: string]: any }, options?: { replaceUrl?: boolean; queryParamsHandling?: QueryParamsHandling }) => "  >}}
+<MemberInfo kind="method" type="(hash: { [key: string]: any }, options?: { replaceUrl?: boolean; queryParamsHandling?: QueryParamsHandling }) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setQueryParam
 
-{{< member-info kind="method" type="(key: string, value: any, options?: { replaceUrl?: boolean; queryParamsHandling?: QueryParamsHandling }) => "  >}}
+<MemberInfo kind="method" type="(key: string, value: any, options?: { replaceUrl?: boolean; queryParamsHandling?: QueryParamsHandling }) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setQueryParam
 
-{{< member-info kind="method" type="(keyOrHash: string | { [key: string]: any }, valueOrOptions?: any, maybeOptions?: { replaceUrl?: boolean; queryParamsHandling?: QueryParamsHandling }) => "  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(keyOrHash: string | { [key: string]: any }, valueOrOptions?: any, maybeOptions?: { replaceUrl?: boolean; queryParamsHandling?: QueryParamsHandling }) => "   />
 
 
-</div>

docs/docs/reference/admin-ui-api/list-detail-views/detail-component-with-resolver.md

@@ -1,22 +1,22 @@
 ---
 title: "DetailComponentWithResolver"
 weight: 10
-date: 2023-07-14T16:57:51.046Z
+date: 2023-07-20T13:56:17.775Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# detailComponentWithResolver
-<div class="symbol">
 
+## detailComponentWithResolver
 
-# detailComponentWithResolver
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/common/base-detail.component.ts" sourceLine="243" packageName="@vendure/admin-ui" />
 
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/common/base-detail.component.ts" sourceLine="243" packageName="@vendure/admin-ui">}}
-
-A helper function for creating tabs that point to a <a href='/admin-ui-api/list-detail-views/typed-base-detail-component#typedbasedetailcomponent'>TypedBaseDetailComponent</a>. This takes
-care of the route resolver parts so that the detail component automatically has access to the
+A helper function for creating tabs that point to a <a href='/admin-ui-api/list-detail-views/typed-base-detail-component#typedbasedetailcomponent'>TypedBaseDetailComponent</a>. This takes
+care of the route resolver parts so that the detail component automatically has access to the
 correct resolved detail data.
 
 *Example*
@@ -41,21 +41,18 @@ correct resolved detail data.
 export class ProductSpecsUiExtensionModule {}
 ```
 
-## Signature
-
-```TypeScript
-function detailComponentWithResolver<T extends TypedDocumentNode<any, { id: string }>, Field extends keyof ResultOf<T>, R extends Field>(config: {
-    component: Type<TypedBaseDetailComponent<T, Field>>;
-    query: T;
-    entityKey: R;
-    getBreadcrumbs?: (entity: ResultOf<T>[R]) => BreadcrumbValue;
-    variables?: T extends TypedDocumentNode<any, infer V> ? Omit<V, 'id'> : never;
+```ts title="Signature"
+function detailComponentWithResolver<T extends TypedDocumentNode<any, { id: string }>, Field extends keyof ResultOf<T>, R extends Field>(config: {
+    component: Type<TypedBaseDetailComponent<T, Field>>;
+    query: T;
+    entityKey: R;
+    getBreadcrumbs?: (entity: ResultOf<T>[R]) => BreadcrumbValue;
+    variables?: T extends TypedDocumentNode<any, infer V> ? Omit<V, 'id'> : never;
 }): void
 ```
-## Parameters
+Parameters
 
 ### config
 
-{{< member-info kind="parameter" type="{     component: Type&#60;<a href='/admin-ui-api/list-detail-views/typed-base-detail-component#typedbasedetailcomponent'>TypedBaseDetailComponent</a>&#60;T, Field&#62;&#62;;     query: T;     entityKey: R;     getBreadcrumbs?: (entity: ResultOf&#60;T&#62;[R]) =&#62; BreadcrumbValue;     variables?: T extends TypedDocumentNode&#60;any, infer V&#62; ? Omit&#60;V, 'id'&#62; : never; }" >}}
+<MemberInfo kind="parameter" type="{
     component: Type&#60;<a href='/admin-ui-api/list-detail-views/typed-base-detail-component#typedbasedetailcomponent'>TypedBaseDetailComponent</a>&#60;T, Field&#62;&#62;;
     query: T;
     entityKey: R;
     getBreadcrumbs?: (entity: ResultOf&#60;T&#62;[R]) =&#62; BreadcrumbValue;
     variables?: T extends TypedDocumentNode&#60;any, infer V&#62; ? Omit&#60;V, 'id'&#62; : never;
 }" />
 
-</div>

docs/docs/reference/admin-ui-api/list-detail-views/typed-base-detail-component.md

@@ -1,26 +1,24 @@
 ---
 title: "TypedBaseDetailComponent"
 weight: 10
-date: 2023-07-14T16:57:51.043Z
+date: 2023-07-20T13:56:17.765Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# TypedBaseDetailComponent
-<div class="symbol">
 
+## TypedBaseDetailComponent
 
-# TypedBaseDetailComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/common/base-detail.component.ts" sourceLine="179" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/common/base-detail.component.ts" sourceLine="179" packageName="@vendure/admin-ui" />
 
 A version of the <a href='/admin-ui-api/list-detail-views/base-detail-component#basedetailcomponent'>BaseDetailComponent</a> which is designed to be used with a
 [TypedDocumentNode](https://the-guild.dev/graphql/codegen/plugins/typescript/typed-document-node).
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class TypedBaseDetailComponent<T extends TypedDocumentNode<any, any>, Field extends keyof ResultOf<T>> extends BaseDetailComponent<NonNullable<ResultOf<T>[Field]>> {
   protected protected result$: Observable<ResultOf<T>>;
   protected protected entity: ResultOf<T>[Field];
@@ -28,36 +26,29 @@ class TypedBaseDetailComponent<T extends TypedDocumentNode<any, any>, Field exte
   override init() => ;
 }
 ```
-## Extends
+Extends
 
  * <a href='/admin-ui-api/list-detail-views/base-detail-component#basedetailcomponent'>BaseDetailComponent</a>&#60;NonNullable&#60;ResultOf&#60;T&#62;[Field]&#62;&#62;
 
 
-## Members
 
 ### result$
 
-{{< member-info kind="property" type="Observable&#60;ResultOf&#60;T&#62;&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;ResultOf&#60;T&#62;&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### entity
 
-{{< member-info kind="property" type="ResultOf&#60;T&#62;[Field]"  >}}
+<MemberInfo kind="property" type="ResultOf&#60;T&#62;[Field]"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### constructor
 
-{{< member-info kind="method" type="() => TypedBaseDetailComponent"  >}}
+<MemberInfo kind="method" type="() => TypedBaseDetailComponent"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### init
 
-{{< member-info kind="method" type="() => "  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="() => "   />
 
 
-</div>

docs/docs/reference/admin-ui-api/list-detail-views/typed-base-list-component.md

@@ -1,26 +1,24 @@
 ---
 title: "TypedBaseListComponent"
 weight: 10
-date: 2023-07-14T16:57:51.061Z
+date: 2023-07-20T13:56:17.829Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# TypedBaseListComponent
-<div class="symbol">
 
+## TypedBaseListComponent
 
-# TypedBaseListComponent
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/common/base-list.component.ts" sourceLine="199" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/common/base-list.component.ts" sourceLine="199" packageName="@vendure/admin-ui" />
 
 A version of the <a href='/admin-ui-api/list-detail-views/base-list-component#baselistcomponent'>BaseListComponent</a> which is designed to be used with a
 [TypedDocumentNode](https://the-guild.dev/graphql/codegen/plugins/typescript/typed-document-node).
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class TypedBaseListComponent<T extends TypedDocumentNode<any, Vars>, Field extends keyof ResultOf<T>, Vars extends { options: { filter: any; sort: any } } = VariablesOf<T>> extends BaseListComponent<ResultOf<T>, ItemOf<ResultOf<T>, Field>, VariablesOf<T>> implements OnInit {
   availableLanguages$: Observable<LanguageCode[]>;
   contentLanguage$: Observable<LanguageCode>;
@@ -41,89 +39,74 @@ class TypedBaseListComponent<T extends TypedDocumentNode<any, Vars>, Field exten
   getCustomFieldConfig(key: Exclude<keyof CustomFields, '__typename'>) => CustomFieldConfig[];
 }
 ```
-## Extends
+Extends
 
  * <a href='/admin-ui-api/list-detail-views/base-list-component#baselistcomponent'>BaseListComponent</a>&#60;ResultOf&#60;T&#62;, ItemOf&#60;ResultOf&#60;T&#62;, Field&#62;, VariablesOf&#60;T&#62;&#62;
 
 
-## Implements
+Implements
 
  * OnInit
 
 
-## Members
 
 ### availableLanguages$
 
-{{< member-info kind="property" type="Observable&#60;<a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>[]&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;<a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>[]&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### contentLanguage$
 
-{{< member-info kind="property" type="Observable&#60;<a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>&#62;"  >}}
+<MemberInfo kind="property" type="Observable&#60;<a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### dataService
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### router
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### serverConfigService
 
-{{< member-info kind="property" type=""  >}}
+<MemberInfo kind="property" type=""   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### constructor
 
-{{< member-info kind="method" type="() => TypedBaseListComponent"  >}}
+<MemberInfo kind="method" type="() => TypedBaseListComponent"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### configure
 
-{{< member-info kind="method" type="(config: {         document: T;         getItems: (data: ResultOf&#60;T&#62;) =&#62; { items: Array&#60;ItemOf&#60;ResultOf&#60;T&#62;, Field&#62;&#62;; totalItems: number };         setVariables?: (skip: number, take: number) =&#62; VariablesOf&#60;T&#62;;         refreshListOnChanges?: Array&#60;Observable&#60;any&#62;&#62;;     }) => "  >}}
+<MemberInfo kind="method" type="(config: {         document: T;         getItems: (data: ResultOf&#60;T&#62;) =&#62; { items: Array&#60;ItemOf&#60;ResultOf&#60;T&#62;, Field&#62;&#62;; totalItems: number };         setVariables?: (skip: number, take: number) =&#62; VariablesOf&#60;T&#62;;         refreshListOnChanges?: Array&#60;Observable&#60;any&#62;&#62;;     }) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnInit
 
-{{< member-info kind="method" type="() => "  >}}
+<MemberInfo kind="method" type="() => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### createFilterCollection
 
-{{< member-info kind="method" type="() => DataTableFilterCollection&#60;NonNullable&#60;NonNullable&#60;Vars['options']&#62;['filter']&#62;&#62;"  >}}
+<MemberInfo kind="method" type="() => DataTableFilterCollection&#60;NonNullable&#60;NonNullable&#60;Vars['options']&#62;['filter']&#62;&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### createSortCollection
 
-{{< member-info kind="method" type="() => DataTableSortCollection&#60;NonNullable&#60;NonNullable&#60;Vars['options']&#62;['sort']&#62;&#62;"  >}}
+<MemberInfo kind="method" type="() => DataTableSortCollection&#60;NonNullable&#60;NonNullable&#60;Vars['options']&#62;['sort']&#62;&#62;"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### setLanguage
 
-{{< member-info kind="method" type="(code: <a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>) => "  >}}
+<MemberInfo kind="method" type="(code: <a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>) => "   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### getCustomFieldConfig
 
-{{< member-info kind="method" type="(key: Exclude&#60;keyof <a href='/typescript-api/custom-fields/#customfields'>CustomFields</a>, '__typename'&#62;) => <a href='/typescript-api/custom-fields/custom-field-config#customfieldconfig'>CustomFieldConfig</a>[]"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(key: Exclude&#60;keyof <a href='/typescript-api/custom-fields/#customfields'>CustomFields</a>, '__typename'&#62;) => <a href='/typescript-api/custom-fields/custom-field-config#customfieldconfig'>CustomFieldConfig</a>[]"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/nav-menu/add-nav-menu-item.md

@@ -1,19 +1,19 @@
 ---
 title: "AddNavMenuItem"
 weight: 10
-date: 2023-07-14T16:57:51.124Z
+date: 2023-07-20T13:56:18.043Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# addNavMenuItem
-<div class="symbol">
 
+## addNavMenuItem
 
-# addNavMenuItem
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder.service.ts" sourceLine="84" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder.service.ts" sourceLine="84" packageName="@vendure/admin-ui" />
 
 Add a menu item to an existing section specified by `sectionId`. The id of the section
 can be found by inspecting the DOM and finding the `data-section-id` attribute.
@@ -41,23 +41,20 @@ This should be used in the NgModule `providers` array of your ui extension modul
 export class MyUiExtensionModule {}
 ``
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 function addNavMenuItem(config: NavMenuItem, sectionId: string, before?: string): Provider
 ```
-## Parameters
+Parameters
 
 ### config
 
-{{< member-info kind="parameter" type="<a href='/admin-ui-api/nav-menu/nav-menu-item#navmenuitem'>NavMenuItem</a>" >}}
+<MemberInfo kind="parameter" type="<a href='/admin-ui-api/nav-menu/nav-menu-item#navmenuitem'>NavMenuItem</a>" />
 
 ### sectionId
 
-{{< member-info kind="parameter" type="string" >}}
+<MemberInfo kind="parameter" type="string" />
 
 ### before
 
-{{< member-info kind="parameter" type="string" >}}
+<MemberInfo kind="parameter" type="string" />
 
-</div>

docs/docs/reference/admin-ui-api/nav-menu/add-nav-menu-section.md

@@ -1,19 +1,19 @@
 ---
 title: "AddNavMenuSection"
 weight: 10
-date: 2023-07-14T16:57:51.123Z
+date: 2023-07-20T13:56:18.037Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# addNavMenuSection
-<div class="symbol">
 
+## addNavMenuSection
 
-# addNavMenuSection
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder.service.ts" sourceLine="44" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder.service.ts" sourceLine="44" packageName="@vendure/admin-ui" />
 
 Add a section to the main nav menu. Providing the `before` argument will
 move the section before any existing section with the specified id. If
@@ -40,19 +40,16 @@ This should be used in the NgModule `providers` array of your ui extension modul
 export class MyUiExtensionModule {}
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 function addNavMenuSection(config: NavMenuSection, before?: string): Provider
 ```
-## Parameters
+Parameters
 
 ### config
 
-{{< member-info kind="parameter" type="<a href='/admin-ui-api/nav-menu/nav-menu-section#navmenusection'>NavMenuSection</a>" >}}
+<MemberInfo kind="parameter" type="<a href='/admin-ui-api/nav-menu/nav-menu-section#navmenusection'>NavMenuSection</a>" />
 
 ### before
 
-{{< member-info kind="parameter" type="string" >}}
+<MemberInfo kind="parameter" type="string" />
 
-</div>

docs/docs/reference/admin-ui-api/nav-menu/nav-menu-item.md

@@ -1,26 +1,24 @@
 ---
 title: "NavMenuItem"
 weight: 10
-date: 2023-07-14T16:57:51.109Z
+date: 2023-07-20T13:56:17.988Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# NavMenuItem
-<div class="symbol">
 
+## NavMenuItem
 
-# NavMenuItem
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder-types.ts" sourceLine="36" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder-types.ts" sourceLine="36" packageName="@vendure/admin-ui" />
 
 A NavMenuItem is a menu item in the main (left-hand side) nav
 bar.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 interface NavMenuItem {
   id: string;
   label: string;
@@ -31,49 +29,39 @@ interface NavMenuItem {
   statusBadge?: Observable<NavMenuBadge>;
 }
 ```
-## Members
 
 ### id
 
-{{< member-info kind="property" type="string"  >}}
+<MemberInfo kind="property" type="string"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### label
 
-{{< member-info kind="property" type="string"  >}}
+<MemberInfo kind="property" type="string"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### routerLink
 
-{{< member-info kind="property" type="RouterLinkDefinition"  >}}
+<MemberInfo kind="property" type="RouterLinkDefinition"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### onClick
 
-{{< member-info kind="property" type="(event: MouseEvent) =&#62; void"  >}}
+<MemberInfo kind="property" type="(event: MouseEvent) =&#62; void"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### icon
 
-{{< member-info kind="property" type="string"  >}}
+<MemberInfo kind="property" type="string"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### requiresPermission
 
-{{< member-info kind="property" type="string | ((userPermissions: string[]) =&#62; boolean)"  >}}
+<MemberInfo kind="property" type="string | ((userPermissions: string[]) =&#62; boolean)"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### statusBadge
 
-{{< member-info kind="property" type="Observable&#60;<a href='/admin-ui-api/nav-menu/navigation-types#navmenubadge'>NavMenuBadge</a>&#62;"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="property" type="Observable&#60;<a href='/admin-ui-api/nav-menu/navigation-types#navmenubadge'>NavMenuBadge</a>&#62;"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/nav-menu/nav-menu-section.md

@@ -1,26 +1,24 @@
 ---
 title: "NavMenuSection"
 weight: 10
-date: 2023-07-14T16:57:51.113Z
+date: 2023-07-20T13:56:17.997Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# NavMenuSection
-<div class="symbol">
 
+## NavMenuSection
 
-# NavMenuSection
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder-types.ts" sourceLine="56" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder-types.ts" sourceLine="56" packageName="@vendure/admin-ui" />
 
 A NavMenuSection is a grouping of links in the main
 (left-hand side) nav bar.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 interface NavMenuSection {
   id: string;
   label: string;
@@ -32,55 +30,44 @@ interface NavMenuSection {
   collapsedByDefault?: boolean;
 }
 ```
-## Members
 
 ### id
 
-{{< member-info kind="property" type="string"  >}}
+<MemberInfo kind="property" type="string"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### label
 
-{{< member-info kind="property" type="string"  >}}
+<MemberInfo kind="property" type="string"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### items
 
-{{< member-info kind="property" type="<a href='/admin-ui-api/nav-menu/nav-menu-item#navmenuitem'>NavMenuItem</a>[]"  >}}
+<MemberInfo kind="property" type="<a href='/admin-ui-api/nav-menu/nav-menu-item#navmenuitem'>NavMenuItem</a>[]"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### icon
 
-{{< member-info kind="property" type="string"  >}}
+<MemberInfo kind="property" type="string"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### displayMode
 
-{{< member-info kind="property" type="'regular' | 'settings'"  >}}
+<MemberInfo kind="property" type="'regular' | 'settings'"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### requiresPermission
 
-{{< member-info kind="property" type="string | ((userPermissions: string[]) =&#62; boolean)"  >}}
-
-{{< member-description >}}Control the display of this item based on the user permissions.{{< /member-description >}}
+<MemberInfo kind="property" type="string | ((userPermissions: string[]) =&#62; boolean)"   />
 
+Control the display of this item based on the user permissions.
 ### collapsible
 
-{{< member-info kind="property" type="boolean"  >}}
+<MemberInfo kind="property" type="boolean"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### collapsedByDefault
 
-{{< member-info kind="property" type="boolean"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="property" type="boolean"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/nav-menu/navigation-types.md

@@ -1,46 +1,39 @@
 ---
 title: "Navigation Types"
 weight: 10
-date: 2023-07-14T16:57:51.108Z
+date: 2023-07-20T13:56:17.982Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# navigation-types
-<div class="symbol">
 
+## NavMenuBadge
 
-# NavMenuBadge
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder-types.ts" sourceLine="18" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder-types.ts" sourceLine="18" packageName="@vendure/admin-ui" />
 
 A color-coded notification badge which will be displayed by the
 NavMenuItem's icon.
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 interface NavMenuBadge {
   type: NavMenuBadgeType;
   propagateToSection?: boolean;
 }
 ```
-## Members
 
 ### type
 
-{{< member-info kind="property" type="NavMenuBadgeType"  >}}
+<MemberInfo kind="property" type="NavMenuBadgeType"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### propagateToSection
 
-{{< member-info kind="property" type="boolean"  >}}
+<MemberInfo kind="property" type="boolean"   />
 
-{{< member-description >}}If true, the badge will propagate to the NavMenuItem's
+If true, the badge will propagate to the NavMenuItem's
 parent section, displaying a notification badge next
-to the section name.{{< /member-description >}}
-
-
-</div>
+to the section name.

docs/docs/reference/admin-ui-api/pipes/asset-preview-pipe.md

@@ -1,19 +1,19 @@
 ---
 title: "AssetPreviewPipe"
 weight: 10
-date: 2023-07-14T16:57:51.324Z
+date: 2023-07-20T13:56:18.679Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# AssetPreviewPipe
-<div class="symbol">
 
+## AssetPreviewPipe
 
-# AssetPreviewPipe
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/pipes/asset-preview.pipe.ts" sourceLine="19" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/pipes/asset-preview.pipe.ts" sourceLine="19" packageName="@vendure/admin-ui" />
 
 Given an Asset object (an object with `preview` and optionally `focalPoint` properties), this pipe
 returns a string with query parameters designed to work with the image resize capabilities of the
@@ -26,25 +26,19 @@ AssetServerPlugin.
 <img [src]="asset | assetPreview:150" />
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class AssetPreviewPipe implements PipeTransform {
   transform(asset?: AssetFragment, preset: string | number = 'thumb') => string;
 }
 ```
-## Implements
+Implements
 
  * PipeTransform
 
 
-## Members
 
 ### transform
 
-{{< member-info kind="method" type="(asset?: AssetFragment, preset: string | number = 'thumb') => string"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(asset?: AssetFragment, preset: string | number = 'thumb') => string"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/pipes/duration-pipe.md

@@ -1,19 +1,19 @@
 ---
 title: "DurationPipe"
 weight: 10
-date: 2023-07-14T16:57:51.325Z
+date: 2023-07-20T13:56:18.685Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# DurationPipe
-<div class="symbol">
 
+## DurationPipe
 
-# DurationPipe
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/pipes/duration.pipe.ts" sourceLine="18" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/pipes/duration.pipe.ts" sourceLine="18" packageName="@vendure/admin-ui" />
 
 Displays a number of milliseconds in a more human-readable format,
 e.g. "12ms", "33s", "2:03m"
@@ -24,32 +24,25 @@ e.g. "12ms", "33s", "2:03m"
 {{ timeInMs | duration }}
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class DurationPipe implements PipeTransform {
   constructor(i18nService: I18nService)
   transform(value: number) => string;
 }
 ```
-## Implements
+Implements
 
  * PipeTransform
 
 
-## Members
 
 ### constructor
 
-{{< member-info kind="method" type="(i18nService: <a href='/typescript-api/common/i18n-service#i18nservice'>I18nService</a>) => DurationPipe"  >}}
+<MemberInfo kind="method" type="(i18nService: <a href='/typescript-api/common/i18n-service#i18nservice'>I18nService</a>) => DurationPipe"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### transform
 
-{{< member-info kind="method" type="(value: number) => string"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(value: number) => string"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/pipes/file-size-pipe.md

@@ -1,19 +1,19 @@
 ---
 title: "FileSizePipe"
 weight: 10
-date: 2023-07-14T16:57:51.328Z
+date: 2023-07-20T13:56:18.691Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# FileSizePipe
-<div class="symbol">
 
+## FileSizePipe
 
-# FileSizePipe
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/pipes/file-size.pipe.ts" sourceLine="14" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/pipes/file-size.pipe.ts" sourceLine="14" packageName="@vendure/admin-ui" />
 
 Formats a number into a human-readable file size string.
 
@@ -23,25 +23,19 @@ Formats a number into a human-readable file size string.
 {{ fileSizeInBytes | filesize }}
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class FileSizePipe implements PipeTransform {
   transform(value: number, useSiUnits:  = true) => any;
 }
 ```
-## Implements
+Implements
 
  * PipeTransform
 
 
-## Members
 
 ### transform
 
-{{< member-info kind="method" type="(value: number, useSiUnits:  = true) => any"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(value: number, useSiUnits:  = true) => any"   />
 
 
-</div>

docs/docs/reference/admin-ui-api/pipes/has-permission-pipe.md

@@ -1,19 +1,19 @@
 ---
 title: "HasPermissionPipe"
 weight: 10
-date: 2023-07-14T16:57:51.329Z
+date: 2023-07-20T13:56:18.697Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# HasPermissionPipe
-<div class="symbol">
 
+## HasPermissionPipe
 
-# HasPermissionPipe
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/pipes/has-permission.pipe.ts" sourceLine="17" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/pipes/has-permission.pipe.ts" sourceLine="17" packageName="@vendure/admin-ui" />
 
 A pipe which checks the provided permission against all the permissions of the current user.
 Returns `true` if the current user has that permission.
@@ -24,40 +24,32 @@ Returns `true` if the current user has that permission.
 <button [disabled]="!('UpdateCatalog' | hasPermission)">Save Changes</button>
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class HasPermissionPipe implements PipeTransform, OnDestroy {
   constructor(dataService: DataService, changeDetectorRef: ChangeDetectorRef)
   transform(input: string | string[]) => any;
   ngOnDestroy() => ;
 }
 ```
-## Implements
+Implements
 
  * PipeTransform
  * OnDestroy
 
 
-## Members
 
 ### constructor
 
-{{< member-info kind="method" type="(dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>, changeDetectorRef: ChangeDetectorRef) => HasPermissionPipe"  >}}
+<MemberInfo kind="method" type="(dataService: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>, changeDetectorRef: ChangeDetectorRef) => HasPermissionPipe"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### transform
 
-{{< member-info kind="method" type="(input: string | string[]) => any"  >}}
+<MemberInfo kind="method" type="(input: string | string[]) => any"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### ngOnDestroy
 
-{{< member-info kind="method" type="() => "  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="() => "   />
 
 
-</div>

docs/docs/reference/admin-ui-api/pipes/locale-currency-name-pipe.md

@@ -1,19 +1,19 @@
 ---
 title: "LocaleCurrencyNamePipe"
 weight: 10
-date: 2023-07-14T16:57:51.331Z
+date: 2023-07-20T13:56:18.705Z
 showtoc: true
 generated: true
 ---
 <!-- This file was generated from the Vendure source. Do not modify. Instead, re-run the "docs:build" script -->
+import MemberInfo from '@site/src/components/MemberInfo';
+import GenerationInfo from '@site/src/components/GenerationInfo';
+import MemberDescription from '@site/src/components/MemberDescription';
 
-# LocaleCurrencyNamePipe
-<div class="symbol">
 
+## LocaleCurrencyNamePipe
 
-# LocaleCurrencyNamePipe
-
-{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/pipes/locale-currency-name.pipe.ts" sourceLine="18" packageName="@vendure/admin-ui">}}
+<GenerationInfo sourceFile="packages/admin-ui/src/lib/core/src/shared/pipes/locale-currency-name.pipe.ts" sourceLine="18" packageName="@vendure/admin-ui" />
 
 Displays a human-readable name for a given ISO 4217 currency code.
 
@@ -23,37 +23,30 @@ Displays a human-readable name for a given ISO 4217 currency code.
 {{ order.currencyCode | localeCurrencyName }}
 ```
 
-## Signature
-
-```TypeScript
+```ts title="Signature"
 class LocaleCurrencyNamePipe extends LocaleBasePipe implements PipeTransform {
   constructor(dataService?: DataService, changeDetectorRef?: ChangeDetectorRef)
   transform(value: any, display: 'full' | 'symbol' | 'name' = 'full', locale?: unknown) => any;
 }
 ```
-## Extends
+Extends
 
  * LocaleBasePipe
 
 
-## Implements
+Implements
 
  * PipeTransform
 
 
-## Members
 
 ### constructor
 
-{{< member-info kind="method" type="(dataService?: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>, changeDetectorRef?: ChangeDetectorRef) => LocaleCurrencyNamePipe"  >}}
+<MemberInfo kind="method" type="(dataService?: <a href='/admin-ui-api/providers/data-service#dataservice'>DataService</a>, changeDetectorRef?: ChangeDetectorRef) => LocaleCurrencyNamePipe"   />
 
-{{< member-description >}}{{< /member-description >}}
 
 ### transform
 
-{{< member-info kind="method" type="(value: any, display: 'full' | 'symbol' | 'name' = 'full', locale?: unknown) => any"  >}}
-
-{{< member-description >}}{{< /member-description >}}
+<MemberInfo kind="method" type="(value: any, display: 'full' | 'symbol' | 'name' = 'full', locale?: unknown) => any"   />
 
 
-</div>